Merge branch 'dev-anang' of https://gitlab.com/hanifsalafi/mediahub_redesign
This commit is contained in:
commit
0e0fe47392
|
|
@ -564,7 +564,8 @@ export default function FormImageAI() {
|
|||
JIka Anda tidak Memberikan kata kunci, kami akan secara
|
||||
otomatis membuat kata kunci yang relevan dari kata kunci utama
|
||||
untuk setiap bagian dan menggunakannya untuk membuat artikel.
|
||||
Untuk menambahkan kata kunci baru, ketik ', + kata kunci'.
|
||||
Untuk menambahkan kata kunci baru, ketik ', + kata
|
||||
kunci'.
|
||||
</p>
|
||||
<div className="mt-3">
|
||||
<Textarea
|
||||
|
|
|
|||
|
|
@ -321,9 +321,10 @@ export default function FormImage() {
|
|||
};
|
||||
|
||||
const save = async (data: ImageSchema) => {
|
||||
const finalTitle = isSwitchOn ? title : data.title;
|
||||
const requestData = {
|
||||
...data,
|
||||
title: data.title,
|
||||
title: finalTitle,
|
||||
description: data.description,
|
||||
htmlDescription: data.description,
|
||||
fileTypeId,
|
||||
|
|
@ -585,8 +586,8 @@ export default function FormImage() {
|
|||
JIka Anda tidak Memberikan kata kunci, kami akan secara
|
||||
otomatis membuat kata kunci yang relevan dari kata kunci
|
||||
utama untuk setiap bagian dan menggunakannya untuk membuat
|
||||
artikel. Untuk menambahkan kata kunci baru, ketik ', +
|
||||
kata kunci'.
|
||||
artikel. Untuk menambahkan kata kunci baru, ketik ',
|
||||
+ kata kunci'.
|
||||
</p>
|
||||
<div className="mt-3">
|
||||
<Textarea
|
||||
|
|
@ -618,27 +619,26 @@ export default function FormImage() {
|
|||
// variant={"outline"}
|
||||
color="primary"
|
||||
onClick={handleGenerateArtikel}
|
||||
size="sm"
|
||||
>
|
||||
Generate Article
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
{isGeneratedArticle && (
|
||||
<div className="mt-3 pb-0">
|
||||
<div className="mt-3 pb-0 flex flex-row ">
|
||||
{articleIds.map((id: string, index: number) => (
|
||||
<Button
|
||||
<p
|
||||
key={index}
|
||||
className={`btn m-1 ${
|
||||
className={`btn mr-3 ${
|
||||
selectedArticleId === id
|
||||
? "btn-warning"
|
||||
: "btn-success"
|
||||
? "bg-green-500 text-white px-3 py-2 rounded-md"
|
||||
: "border-2 border-green-500 text-green-500 px-3 py-2 rounded-md"
|
||||
}`}
|
||||
onClick={() => handleArticleIdClick(id)}
|
||||
variant={"outline"}
|
||||
color="success"
|
||||
>
|
||||
{id}
|
||||
</Button>
|
||||
</p>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -45,6 +45,8 @@ import "swiper/css";
|
|||
import "swiper/css/navigation";
|
||||
import { FreeMode, Navigation, Pagination, Thumbs } from "swiper/modules";
|
||||
import { request } from "http";
|
||||
import { generateDataArticle, getDetailArticle } from "@/service/content/ai";
|
||||
import { getCookiesDecrypt } from "@/lib/utils";
|
||||
|
||||
const imageSchema = z.object({
|
||||
contentTitle: z.string().min(1, { message: "Judul diperlukan" }),
|
||||
|
|
@ -53,6 +55,9 @@ const imageSchema = z.object({
|
|||
.min(2, { message: "Narasi Penugasan harus lebih dari 2 karakter." }),
|
||||
contentCreator: z.string().min(1, { message: "Creator diperlukan" }),
|
||||
// tags: z.string().min(1, { message: "Judul diperlukan" }),
|
||||
contentRewriteDescription: z
|
||||
.string()
|
||||
.min(2, { message: "Narasi Penugasan harus lebih dari 2 karakter." }),
|
||||
});
|
||||
|
||||
type Category = {
|
||||
|
|
@ -99,6 +104,17 @@ export default function FormConvertSPIT() {
|
|||
const [selectedPublishers, setSelectedPublishers] = useState<number[]>([]);
|
||||
const [detailThumb, setDetailThumb] = useState<any>([]);
|
||||
const [thumbsSwiper, setThumbsSwiper] = useState<any>(null);
|
||||
const [selectedAdvConfig, setSelectedAdvConfig] = useState<string>("");
|
||||
const [title, setTitle] = useState<string>("");
|
||||
const roleId = getCookiesDecrypt("urie");
|
||||
const [articleIds, setArticleIds] = useState<string[]>([]);
|
||||
const [isGeneratedArticle, setIsGeneratedArticle] = useState(false);
|
||||
const [articleBody, setArticleBody] = useState<string>("");
|
||||
const [selectedArticleId, setSelectedArticleId] = useState<string | null>(
|
||||
null
|
||||
);
|
||||
const [detailData, setDetailData] = useState<any>(null);
|
||||
const [selectedFileType, setSelectedFileType] = useState("original");
|
||||
|
||||
const [selectedTarget, setSelectedTarget] = useState("");
|
||||
const [unitSelection, setUnitSelection] = useState({
|
||||
|
|
@ -232,11 +248,15 @@ export default function FormConvertSPIT() {
|
|||
};
|
||||
|
||||
const save = async (data: any) => {
|
||||
const description =
|
||||
selectedFileType === "original"
|
||||
? data.contentDescription
|
||||
: data.contentRewriteDescription;
|
||||
const requestData = {
|
||||
spitId: id,
|
||||
title: data.contentTitle,
|
||||
description: data.contentDescription,
|
||||
htmlDescription: data.contentDescription,
|
||||
description,
|
||||
htmlDescription: description,
|
||||
tags: "siap",
|
||||
categoryId: selectedCategoryId,
|
||||
publishedFor: "6",
|
||||
|
|
@ -274,6 +294,72 @@ export default function FormConvertSPIT() {
|
|||
});
|
||||
};
|
||||
|
||||
const [showRewriteEditor, setShowRewriteEditor] = useState(false);
|
||||
|
||||
// const handleRewriteClick = () => {
|
||||
// setShowRewriteEditor(true);
|
||||
// };
|
||||
|
||||
const handleRewriteClick = async () => {
|
||||
const request = {
|
||||
advConfig: selectedAdvConfig,
|
||||
style: "friendly",
|
||||
website: "None",
|
||||
connectToWeb: true,
|
||||
lang: "id",
|
||||
pointOfView: "None",
|
||||
title: detail?.contentTitle,
|
||||
imageSource: "Web",
|
||||
mainKeyword: detail?.contentTitle,
|
||||
additionalKeywords: detail?.contentTitle,
|
||||
targetCountry: null,
|
||||
articleSize: "news",
|
||||
projectId: 2,
|
||||
createdBy: roleId,
|
||||
clientId: "ngDLPPiorplznw2jTqVe3YFCz5xqKfUJ",
|
||||
};
|
||||
|
||||
const res = await generateDataArticle(request);
|
||||
close();
|
||||
|
||||
if (res.error) {
|
||||
console.error(res.message);
|
||||
return false;
|
||||
}
|
||||
|
||||
const newArticleId = res?.data?.data?.id;
|
||||
setIsGeneratedArticle(true);
|
||||
|
||||
setArticleIds((prevIds: string[]) => {
|
||||
if (prevIds.length < 5) {
|
||||
return [...prevIds, newArticleId];
|
||||
} else {
|
||||
const updatedIds = [...prevIds];
|
||||
updatedIds[4] = newArticleId;
|
||||
return updatedIds;
|
||||
}
|
||||
});
|
||||
|
||||
Cookies.set("nulisAIArticleIdTemp", JSON.stringify(articleIds));
|
||||
setShowRewriteEditor(true);
|
||||
};
|
||||
|
||||
const handleArticleIdClick = async (id: string) => {
|
||||
const res = await getDetailArticle(id);
|
||||
const articleData = res?.data?.data;
|
||||
|
||||
const cleanArticleBody = articleData?.articleBody?.replace(
|
||||
/<img[^>]*>/g,
|
||||
""
|
||||
);
|
||||
const articleImagesData = articleData?.imagesUrl?.split(",");
|
||||
|
||||
setArticleBody(cleanArticleBody || "");
|
||||
setDetailData(articleData);
|
||||
setSelectedArticleId(id);
|
||||
// setArticleImages(articleImagesData || []);
|
||||
};
|
||||
|
||||
return (
|
||||
<form onSubmit={handleSubmit(onSubmit)}>
|
||||
{detail !== undefined ? (
|
||||
|
|
@ -330,34 +416,110 @@ export default function FormConvertSPIT() {
|
|||
</Select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="py-3">
|
||||
<Label>Deskripsi</Label>
|
||||
<Controller
|
||||
control={control}
|
||||
name="contentDescription"
|
||||
render={({ field: { onChange, value } }) => (
|
||||
<JoditEditor
|
||||
ref={editor}
|
||||
value={detail?.contentDescription}
|
||||
onChange={onChange}
|
||||
className="dark:text-black"
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
{errors.contentDescription?.message && (
|
||||
<p className="text-red-400 text-sm">
|
||||
{errors.contentDescription.message}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
<div className="my-5">
|
||||
<Button
|
||||
// variant={"outline"}
|
||||
color="primary"
|
||||
<div>
|
||||
<RadioGroup
|
||||
onValueChange={(value) => setSelectedFileType(value)}
|
||||
value={selectedFileType}
|
||||
>
|
||||
Content Rewrite
|
||||
</Button>
|
||||
<div className="flex items-center space-x-2">
|
||||
<RadioGroupItem value="original" id="original-file" />
|
||||
<Label htmlFor="original-file">
|
||||
Select Original File
|
||||
</Label>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div className="py-3">
|
||||
<Label>Deskripsi</Label>
|
||||
<Controller
|
||||
control={control}
|
||||
name="contentDescription"
|
||||
render={({ field: { onChange, value } }) => (
|
||||
<JoditEditor
|
||||
ref={editor}
|
||||
value={detail?.contentDescription}
|
||||
onChange={onChange}
|
||||
className="dark:text-black"
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
{errors.contentDescription?.message && (
|
||||
<p className="text-red-400 text-sm">
|
||||
{errors.contentDescription.message}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
<div className="my-2">
|
||||
<Button
|
||||
size="sm"
|
||||
onClick={handleRewriteClick}
|
||||
className="bg-blue-500 text-white py-2 px-4 rounded"
|
||||
>
|
||||
Content Rewrite
|
||||
</Button>
|
||||
</div>
|
||||
{showRewriteEditor && (
|
||||
<div>
|
||||
{isGeneratedArticle && (
|
||||
<div className="mt-3 pb-0 flex flex-row ">
|
||||
{articleIds.map((id: string, index: number) => (
|
||||
// <Button
|
||||
// key={index}
|
||||
// className={`btn mr-2 ${
|
||||
// selectedArticleId === id
|
||||
// ? "btn-warning"
|
||||
// : "btn-success"
|
||||
// }`}
|
||||
// onClick={() => handleArticleIdClick(id)}
|
||||
// variant={"outline"}
|
||||
// color="success"
|
||||
// >
|
||||
// {id}
|
||||
// </Button>
|
||||
<p
|
||||
key={index}
|
||||
className={`btn mr-3 ${
|
||||
selectedArticleId === id
|
||||
? "bg-green-500 text-white px-3 py-2 rounded-md"
|
||||
: "border-2 border-green-500 text-green-500 px-3 py-2 rounded-md"
|
||||
}`}
|
||||
onClick={() => handleArticleIdClick(id)}
|
||||
>
|
||||
{id}
|
||||
</p>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
<div className="flex items-center space-x-2 mt-3">
|
||||
<RadioGroupItem value="rewrite" id="rewrite-file" />
|
||||
<Label htmlFor="rewrite-file">
|
||||
Select File Hasil Rewrite
|
||||
</Label>
|
||||
</div>
|
||||
<div className="py-3">
|
||||
<Label>File hasil Rewrite</Label>
|
||||
<Controller
|
||||
control={control}
|
||||
name="contentRewriteDescription"
|
||||
render={({ field: { onChange, value } }) => (
|
||||
<JoditEditor
|
||||
ref={editor}
|
||||
value={articleBody || value}
|
||||
onChange={onChange}
|
||||
className="dark:text-black"
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
{errors.contentRewriteDescription?.message && (
|
||||
<p className="text-red-400 text-sm">
|
||||
{errors.contentRewriteDescription.message}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</RadioGroup>
|
||||
</div>
|
||||
<div>
|
||||
<Label className="text-xl text-black">File Media</Label>
|
||||
|
|
|
|||
|
|
@ -6,8 +6,23 @@ import { FiFile, FiImage, FiMusic, FiYoutube } from "react-icons/fi";
|
|||
import { useParams, usePathname, useRouter } from "next/navigation";
|
||||
import { generateLocalizedPath } from "@/utils/globals";
|
||||
import { Link } from "@/i18n/routing";
|
||||
import { NavigationMenu, NavigationMenuContent, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, navigationMenuTriggerStyle } from "@/components/ui/navigation-menu";
|
||||
import { DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger } from "../ui/dropdown-menu";
|
||||
import {
|
||||
NavigationMenu,
|
||||
NavigationMenuContent,
|
||||
NavigationMenuItem,
|
||||
NavigationMenuLink,
|
||||
NavigationMenuList,
|
||||
NavigationMenuTrigger,
|
||||
navigationMenuTriggerStyle,
|
||||
} from "@/components/ui/navigation-menu";
|
||||
import {
|
||||
DropdownMenu,
|
||||
DropdownMenuContent,
|
||||
DropdownMenuGroup,
|
||||
DropdownMenuItem,
|
||||
DropdownMenuSeparator,
|
||||
DropdownMenuTrigger,
|
||||
} from "../ui/dropdown-menu";
|
||||
import Image from "next/image";
|
||||
import { Icon } from "../ui/icon";
|
||||
import { getCookiesDecrypt } from "@/lib/utils";
|
||||
|
|
@ -74,18 +89,41 @@ const Navbar = () => {
|
|||
<div className="flex items-center justify-between px-4 lg:px-20 py-4 gap-3">
|
||||
{/* Logo */}
|
||||
<Link href="/" className="flex items-center">
|
||||
<img src="/assets/mediahub-logo.gif" alt="Media Hub Logo" className="w-fit h-20 md:h-24" />
|
||||
<img
|
||||
src="/assets/mediahub-logo.gif"
|
||||
alt="Media Hub Logo"
|
||||
className="w-fit h-20 md:h-24"
|
||||
/>
|
||||
</Link>
|
||||
|
||||
{/* Mobile Menu Toggle */}
|
||||
<button className="text-black dark:text-white right-0 size-20 h-10 w-10 lg:hidden" onClick={() => setMenuOpen(!menuOpen)}>
|
||||
<button
|
||||
className="text-black dark:text-white right-0 size-20 h-10 w-10 lg:hidden"
|
||||
onClick={() => setMenuOpen(!menuOpen)}
|
||||
>
|
||||
{menuOpen ? (
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
|
||||
<path fill="#000" d="m13.41 12l4.3-4.29a1 1 0 1 0-1.42-1.42L12 10.59l-4.29-4.3a1 1 0 0 0-1.42 1.42l4.3 4.29l-4.3 4.29a1 1 0 0 0 0 1.42a1 1 0 0 0 1.42 0l4.29-4.3l4.29 4.3a1 1 0 0 0 1.42 0a1 1 0 0 0 0-1.42Z" />
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
fill="#000"
|
||||
d="m13.41 12l4.3-4.29a1 1 0 1 0-1.42-1.42L12 10.59l-4.29-4.3a1 1 0 0 0-1.42 1.42l4.3 4.29l-4.3 4.29a1 1 0 0 0 0 1.42a1 1 0 0 0 1.42 0l4.29-4.3l4.29 4.3a1 1 0 0 0 1.42 0a1 1 0 0 0 0-1.42Z"
|
||||
/>
|
||||
</svg>
|
||||
) : (
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
|
||||
<path fill="#000" d="M4 6a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H5a1 1 0 0 1-1-1m0 6a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H5a1 1 0 0 1-1-1m1 5a1 1 0 1 0 0 2h14a1 1 0 1 0 0-2z" />
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
fill="#000"
|
||||
d="M4 6a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H5a1 1 0 0 1-1-1m0 6a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H5a1 1 0 0 1-1-1m1 5a1 1 0 1 0 0 2h14a1 1 0 1 0 0-2z"
|
||||
/>
|
||||
</svg>
|
||||
)}
|
||||
</button>
|
||||
|
|
@ -98,7 +136,14 @@ const Navbar = () => {
|
|||
<NavigationMenuItem>
|
||||
<NavigationMenuTrigger>
|
||||
<a className="dark:text-white text-black flex flex-row justify-center items-center cursor-pointer">
|
||||
<svg className="mx-2 dark:" width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<svg
|
||||
className="mx-2 dark:"
|
||||
width="25"
|
||||
height="24"
|
||||
viewBox="0 0 25 24"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M20 7.5H5C4.6023 7.5004 4.221 7.65856 3.93978 7.93978C3.65856 8.221 3.5004 8.6023 3.5 9V19.5C3.5004 19.8977 3.65856 20.279 3.93978 20.5602C4.221 20.8414 4.6023 20.9996 5 21H20C20.3977 20.9996 20.779 20.8414 21.0602 20.5602C21.3414 20.279 21.4996 19.8977 21.5 19.5V9C21.4996 8.6023 21.3414 8.221 21.0602 7.93978C20.779 7.65856 20.3977 7.5004 20 7.5ZM10.25 17.25V11.25L15.5 14.25L10.25 17.25ZM5 4.5H20V6H5V4.5ZM6.5 1.5H18.5V3H6.5V1.5Z"
|
||||
fill="currentColor"
|
||||
|
|
@ -108,25 +153,56 @@ const Navbar = () => {
|
|||
</a>
|
||||
</NavigationMenuTrigger>
|
||||
<NavigationMenuContent className="p-0 rounded-md overflow-hidden w-full">
|
||||
<NavigationMenuLink onClick={() => router.push(generateLocalizedPath("/video/filter", String(locale)))} className="flex items-start gap-1.5 p-2 ">
|
||||
<NavigationMenuLink
|
||||
onClick={() =>
|
||||
router.push(
|
||||
generateLocalizedPath("/video/filter", String(locale))
|
||||
)
|
||||
}
|
||||
className="flex items-start gap-1.5 p-2 "
|
||||
>
|
||||
<p className="text-slate-600 dark:text-white hover:text-[#bb3523] flex flex-row justify-center items-center px-5 py-2 cursor-pointer">
|
||||
<FiYoutube className="mr-2" />
|
||||
Video
|
||||
</p>
|
||||
</NavigationMenuLink>
|
||||
<NavigationMenuLink onClick={() => router.push(generateLocalizedPath("/audio/filter", String(locale)))} className="flex place-items-start gap-1.5 p-2 ">
|
||||
<NavigationMenuLink
|
||||
onClick={() =>
|
||||
router.push(
|
||||
generateLocalizedPath("/audio/filter", String(locale))
|
||||
)
|
||||
}
|
||||
className="flex place-items-start gap-1.5 p-2 "
|
||||
>
|
||||
<p className="text-slate-600 dark:text-white hover:text-[#bb3523] flex flex-row justify-center items-center px-5 py-2 cursor-pointer">
|
||||
<FiMusic className="mr-2" />
|
||||
Audio
|
||||
</p>
|
||||
</NavigationMenuLink>
|
||||
<NavigationMenuLink onClick={() => router.push(generateLocalizedPath("/image/filter", String(locale)))} className="flex place-items-start gap-1.5 p-2">
|
||||
<NavigationMenuLink
|
||||
onClick={() =>
|
||||
router.push(
|
||||
generateLocalizedPath("/image/filter", String(locale))
|
||||
)
|
||||
}
|
||||
className="flex place-items-start gap-1.5 p-2"
|
||||
>
|
||||
<p className="text-slate-600 dark:text-white hover:text-[#bb3523] flex flex-row justify-center items-center px-5 py-2 cursor-pointer">
|
||||
<FiImage className="mr-2" />
|
||||
Foto
|
||||
</p>
|
||||
</NavigationMenuLink>
|
||||
<NavigationMenuLink onClick={() => router.push(generateLocalizedPath("/document/filter", String(locale)))} className="flex place-items-start gap-1.5 p-2">
|
||||
<NavigationMenuLink
|
||||
onClick={() =>
|
||||
router.push(
|
||||
generateLocalizedPath(
|
||||
"/document/filter",
|
||||
String(locale)
|
||||
)
|
||||
)
|
||||
}
|
||||
className="flex place-items-start gap-1.5 p-2"
|
||||
>
|
||||
<p className="text-slate-600 dark:text-white hover:text-[#bb3523] flex flex-row justify-center items-center px-5 py-2 cursor-pointer">
|
||||
<FiFile className="mr-2" />
|
||||
Teks
|
||||
|
|
@ -138,7 +214,14 @@ const Navbar = () => {
|
|||
<Link href="/schedule" legacyBehavior passHref>
|
||||
<NavigationMenuLink className={navigationMenuTriggerStyle()}>
|
||||
<span>
|
||||
<svg className="mr-2" width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<svg
|
||||
className="mr-2"
|
||||
width="25"
|
||||
height="24"
|
||||
viewBox="0 0 25 24"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M19.5 4H18.5V3C18.5 2.4 18.1 2 17.5 2C16.9 2 16.5 2.4 16.5 3V4H8.5V3C8.5 2.4 8.1 2 7.5 2C6.9 2 6.5 2.4 6.5 3V4H5.5C3.8 4 2.5 5.3 2.5 7V8H22.5V7C22.5 5.3 21.2 4 19.5 4ZM2.5 19C2.5 20.7 3.8 22 5.5 22H19.5C21.2 22 22.5 20.7 22.5 19V10H2.5V19ZM17.5 12C18.1 12 18.5 12.4 18.5 13C18.5 13.6 18.1 14 17.5 14C16.9 14 16.5 13.6 16.5 13C16.5 12.4 16.9 12 17.5 12ZM17.5 16C18.1 16 18.5 16.4 18.5 17C18.5 17.6 18.1 18 17.5 18C16.9 18 16.5 17.6 16.5 17C16.5 16.4 16.9 16 17.5 16ZM12.5 12C13.1 12 13.5 12.4 13.5 13C13.5 13.6 13.1 14 12.5 14C11.9 14 11.5 13.6 11.5 13C11.5 12.4 11.9 12 12.5 12ZM12.5 16C13.1 16 13.5 16.4 13.5 17C13.5 17.6 13.1 18 12.5 18C11.9 18 11.5 17.6 11.5 17C11.5 16.4 11.9 16 12.5 16ZM7.5 12C8.1 12 8.5 12.4 8.5 13C8.5 13.6 8.1 14 7.5 14C6.9 14 6.5 13.6 6.5 13C6.5 12.4 6.9 12 7.5 12ZM7.5 16C8.1 16 8.5 16.4 8.5 17C8.5 17.6 8.1 18 7.5 18C6.9 18 6.5 17.6 6.5 17C6.5 16.4 6.9 16 7.5 16Z"
|
||||
fill="currentColor"
|
||||
|
|
@ -153,7 +236,14 @@ const Navbar = () => {
|
|||
<Link href="/indeks" legacyBehavior passHref>
|
||||
<NavigationMenuLink className={navigationMenuTriggerStyle()}>
|
||||
<span>
|
||||
<svg className="mr-2" width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<svg
|
||||
className="mr-2"
|
||||
width="25"
|
||||
height="24"
|
||||
viewBox="0 0 25 24"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
|
|
@ -175,22 +265,40 @@ const Navbar = () => {
|
|||
</Link>
|
||||
<div className="flex items-center space-x-1 ">
|
||||
<a href="https://tvradio.polri.go.id/">
|
||||
<img src="/assets/polriTv.png" className="w-auto lg:max-w-screen-lg h-10 flex-auto " />
|
||||
<img
|
||||
src="/assets/polriTv.png"
|
||||
className="w-auto lg:max-w-screen-lg h-10 flex-auto "
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div className="relative inline-block text-left">
|
||||
{/* Tombol Utama */}
|
||||
<button onClick={() => setIsOpen(!isOpen)} className="flex items-center space-x-2 p-2 text-gray-700 bg-slate-200 rounded-lg">
|
||||
<button
|
||||
onClick={() => setIsOpen(!isOpen)}
|
||||
className="flex items-center space-x-2 p-2 text-gray-700 bg-slate-200 rounded-lg"
|
||||
>
|
||||
<img
|
||||
src={language === "id" ? "https://upload.wikimedia.org/wikipedia/commons/9/9f/Flag_of_Indonesia.svg" : "https://upload.wikimedia.org/wikipedia/en/a/a4/Flag_of_the_United_States.svg"}
|
||||
src={
|
||||
language === "id"
|
||||
? "https://upload.wikimedia.org/wikipedia/commons/9/9f/Flag_of_Indonesia.svg"
|
||||
: "https://upload.wikimedia.org/wikipedia/en/a/a4/Flag_of_the_United_States.svg"
|
||||
}
|
||||
alt={language === "id" ? "Ind" : "Eng"}
|
||||
className="w-3 h-3"
|
||||
/>
|
||||
<span>{language === "id" ? "Ind" : "Eng"}</span>
|
||||
<span className="text-gray-500">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 32 32">
|
||||
<path fill="currentColor" d="M8.037 11.166L14.5 22.36c.825 1.43 2.175 1.43 3 0l6.463-11.195c.826-1.43.15-2.598-1.5-2.598H9.537c-1.65 0-2.326 1.17-1.5 2.6z" />
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="15"
|
||||
height="15"
|
||||
viewBox="0 0 32 32"
|
||||
>
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="M8.037 11.166L14.5 22.36c.825 1.43 2.175 1.43 3 0l6.463-11.195c.826-1.43.15-2.598-1.5-2.598H9.537c-1.65 0-2.326 1.17-1.5 2.6z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</button>
|
||||
|
|
@ -198,12 +306,30 @@ const Navbar = () => {
|
|||
{/* Dropdown Menu */}
|
||||
{isOpen && (
|
||||
<div className="absolute right-0 mt-2 w-auto bg-slate-200 border rounded-md shadow-lg z-10">
|
||||
<button onClick={() => handleLanguageChange("id")} className={`flex items-center space-x-2 w-full px-4 py-2 ${language === "id" ? "font-medium" : ""}`}>
|
||||
<img src="https://upload.wikimedia.org/wikipedia/commons/9/9f/Flag_of_Indonesia.svg" alt="Indonesia" className="w-5 h-5" />
|
||||
<button
|
||||
onClick={() => handleLanguageChange("id")}
|
||||
className={`flex items-center space-x-2 w-full px-4 py-2 ${
|
||||
language === "id" ? "font-medium" : ""
|
||||
}`}
|
||||
>
|
||||
<img
|
||||
src="https://upload.wikimedia.org/wikipedia/commons/9/9f/Flag_of_Indonesia.svg"
|
||||
alt="Indonesia"
|
||||
className="w-5 h-5"
|
||||
/>
|
||||
<span>Ind</span>
|
||||
</button>
|
||||
<button onClick={() => handleLanguageChange("en")} className={`flex items-center space-x-2 w-full px-4 py-2 ${language === "en" ? "font-medium" : ""}`}>
|
||||
<img src="https://upload.wikimedia.org/wikipedia/en/a/a4/Flag_of_the_United_States.svg" alt="English" className="w-5 h-5" />
|
||||
<button
|
||||
onClick={() => handleLanguageChange("en")}
|
||||
className={`flex items-center space-x-2 w-full px-4 py-2 ${
|
||||
language === "en" ? "font-medium" : ""
|
||||
}`}
|
||||
>
|
||||
<img
|
||||
src="https://upload.wikimedia.org/wikipedia/en/a/a4/Flag_of_the_United_States.svg"
|
||||
alt="English"
|
||||
className="w-5 h-5"
|
||||
/>
|
||||
<span>Eng</span>
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -211,9 +337,18 @@ const Navbar = () => {
|
|||
</div>
|
||||
<ThemeSwitcher />
|
||||
<div className="relative text-gray-600 dark:text-white">
|
||||
<input type="text" placeholder="Pencarian" className="pl-8 pr-4 py-1 w-28 text-[13px] border rounded-full focus:outline-none dark:text-white" />
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Pencarian"
|
||||
className="pl-8 pr-4 py-1 w-28 text-[13px] border rounded-full focus:outline-none dark:text-white"
|
||||
/>
|
||||
<span className="absolute left-4 top-1/2 transform -translate-y-1/2">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="13"
|
||||
height="13"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
fill="currentColor"
|
||||
fill-rule="evenodd"
|
||||
|
|
@ -223,7 +358,7 @@ const Navbar = () => {
|
|||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex items-center space-x-2">
|
||||
{/* <div className="flex items-center space-x-2">
|
||||
{fullName ? (
|
||||
<>
|
||||
<DropdownMenu>
|
||||
|
|
@ -266,16 +401,27 @@ const Navbar = () => {
|
|||
</Link>{" "}
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
{/* {roleId === "5" || roleId === "6" || roleId === "7" || roleId === "8" ? (
|
||||
{roleId === "5" ||
|
||||
roleId === "6" ||
|
||||
roleId === "7" ||
|
||||
roleId === "8" ? (
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild className="cursor-pointer">
|
||||
{detail !== undefined ? (
|
||||
<div className="flex items-center gap-3 text-default-800">
|
||||
<Image src={"https://netidhub.com/assets/img/user-avatar.png"} alt={"Image"} width={36} height={36} className="rounded-full" />
|
||||
<Image
|
||||
src={"/assets/avatar-profile.png"}
|
||||
alt={"Image"}
|
||||
width={36}
|
||||
height={36}
|
||||
className="rounded-full"
|
||||
/>
|
||||
<div>
|
||||
<div className="text-sm font-medium capitalize lg:block hidden">{detail?.fullname}</div>
|
||||
<div className="text-sm font-medium capitalize lg:block hidden">
|
||||
{detail?.fullname}
|
||||
</div>
|
||||
<p className="text-xs">({detail?.fullname})</p>
|
||||
</div>
|
||||
<span className="text-base me-2.5 lg:inline-block hidden">
|
||||
|
|
@ -296,11 +442,15 @@ const Navbar = () => {
|
|||
},
|
||||
{
|
||||
name: "Kelola Konten",
|
||||
icon: "heroicons:megaphone",
|
||||
href: "/dashboard",
|
||||
icon: "stash:save-ribbon-duotone",
|
||||
href: "/content-management",
|
||||
},
|
||||
].map((item, index) => (
|
||||
<Link href={item.href} key={`info-menu-${index}`} className="cursor-pointer">
|
||||
<Link
|
||||
href={item.href}
|
||||
key={`info-menu-${index}`}
|
||||
className="cursor-pointer"
|
||||
>
|
||||
<DropdownMenuItem className="flex items-center gap-2 text-sm font-medium text-default-600 capitalize px-3 py-1.5 cursor-pointer">
|
||||
<Icon icon={item.icon} className="w-4 h-4" />
|
||||
{item.name}
|
||||
|
|
@ -312,7 +462,11 @@ const Navbar = () => {
|
|||
<DropdownMenuItem className="flex items-center gap-2 text-sm font-medium text-default-600 capitalize my-1 px-3 cursor-pointer">
|
||||
<div>
|
||||
<Link href={"/"}>
|
||||
<button type="submit" className="w-full flex items-center gap-2" onClick={onLogout}>
|
||||
<button
|
||||
type="submit"
|
||||
className="w-full flex items-center gap-2"
|
||||
onClick={onLogout}
|
||||
>
|
||||
<Icon icon="heroicons:power" className="w-4 h-4" />
|
||||
Log out
|
||||
</button>
|
||||
|
|
@ -321,15 +475,30 @@ const Navbar = () => {
|
|||
</DropdownMenuItem>
|
||||
</DropdownMenuContent>
|
||||
</DropdownMenu>
|
||||
) : roleId === "2" || roleId === "3" || roleId === "4" || roleId === "9" || roleId === "10" || roleId === "11" || roleId === "12" || roleId === "13" ? (
|
||||
) : roleId === "2" ||
|
||||
roleId === "3" ||
|
||||
roleId === "4" ||
|
||||
roleId === "9" ||
|
||||
roleId === "10" ||
|
||||
roleId === "11" ||
|
||||
roleId === "12" ||
|
||||
roleId === "13" ? (
|
||||
// Dropdown menu for roleId === 3
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild className="cursor-pointer">
|
||||
{detail !== undefined ? (
|
||||
<div className="flex items-center gap-3 text-default-800">
|
||||
<Image src={"https://netidhub.com/assets/img/user-avatar.png"} alt={"Image"} width={36} height={36} className="rounded-full" />
|
||||
<Image
|
||||
src={"/assets/avatar-profile.png"}
|
||||
alt={"Image"}
|
||||
width={36}
|
||||
height={36}
|
||||
className="rounded-full"
|
||||
/>
|
||||
<div>
|
||||
<div className="text-sm font-medium capitalize lg:block hidden">{detail?.fullname}</div>
|
||||
<div className="text-sm font-medium capitalize lg:block hidden">
|
||||
{detail?.fullname}
|
||||
</div>
|
||||
<p className="text-xs">({detail?.fullname})</p>
|
||||
</div>
|
||||
<span className="text-base me-2.5 lg:inline-block hidden">
|
||||
|
|
@ -350,11 +519,15 @@ const Navbar = () => {
|
|||
},
|
||||
{
|
||||
name: "Dashboard",
|
||||
icon: "heroicons:megaphone",
|
||||
icon: "material-symbols:dashboard",
|
||||
href: "/dashboard",
|
||||
},
|
||||
].map((item, index) => (
|
||||
<Link href={item.href} key={`info-menu-${index}`} className="cursor-pointer">
|
||||
<Link
|
||||
href={item.href}
|
||||
key={`info-menu-${index}`}
|
||||
className="cursor-pointer"
|
||||
>
|
||||
<DropdownMenuItem className="flex items-center gap-2 text-sm font-medium text-default-600 capitalize px-3 py-1.5 cursor-pointer">
|
||||
<Icon icon={item.icon} className="w-4 h-4" />
|
||||
{item.name}
|
||||
|
|
@ -366,7 +539,11 @@ const Navbar = () => {
|
|||
<DropdownMenuItem className="flex items-center gap-2 text-sm font-medium text-default-600 capitalize my-1 px-3 cursor-pointer">
|
||||
<div>
|
||||
<Link href={"/"}>
|
||||
<button type="submit" className="w-full flex items-center gap-2" onClick={onLogout}>
|
||||
<button
|
||||
type="submit"
|
||||
className="w-full flex items-center gap-2"
|
||||
onClick={onLogout}
|
||||
>
|
||||
<Icon icon="heroicons:power" className="w-4 h-4" />
|
||||
Log out
|
||||
</button>
|
||||
|
|
@ -378,14 +555,20 @@ const Navbar = () => {
|
|||
) : (
|
||||
// Masuk and Daftar buttons for roleId === null
|
||||
<div className="flex justify-center items-center mx-3 gap-5">
|
||||
<Link href="/auth" className="w-full lg:w-fit px-4 py-1 bg-[#bb3523] text-white font-semibold rounded-md hover:bg-red-700 text-center">
|
||||
<Link
|
||||
href="/auth"
|
||||
className="w-full lg:w-fit px-4 py-1 bg-[#bb3523] text-white font-semibold rounded-md hover:bg-red-700 text-center"
|
||||
>
|
||||
Masuk
|
||||
</Link>
|
||||
<Link href="#" className="w-full lg:w-fit px-4 py-1 border border-[#bb3523] text-[#bb3523] font-semibold rounded-md hover:bg-[#bb3523] text-center hover:text-white">
|
||||
<Link
|
||||
href="#"
|
||||
className="w-full lg:w-fit px-4 py-1 border border-[#bb3523] text-[#bb3523] font-semibold rounded-md hover:bg-[#bb3523] text-center hover:text-white"
|
||||
>
|
||||
Daftar
|
||||
</Link>
|
||||
</div>
|
||||
)} */}
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -397,7 +580,14 @@ const Navbar = () => {
|
|||
<NavigationMenuItem>
|
||||
<NavigationMenuTrigger>
|
||||
<a className="dark:text-white text-black flex flex-row justify-center items-center cursor-pointer">
|
||||
<svg className="mx-2" width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<svg
|
||||
className="mx-2"
|
||||
width="25"
|
||||
height="24"
|
||||
viewBox="0 0 25 24"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M20 7.5H5C4.6023 7.5004 4.221 7.65856 3.93978 7.93978C3.65856 8.221 3.5004 8.6023 3.5 9V19.5C3.5004 19.8977 3.65856 20.279 3.93978 20.5602C4.221 20.8414 4.6023 20.9996 5 21H20C20.3977 20.9996 20.779 20.8414 21.0602 20.5602C21.3414 20.279 21.4996 19.8977 21.5 19.5V9C21.4996 8.6023 21.3414 8.221 21.0602 7.93978C20.779 7.65856 20.3977 7.5004 20 7.5ZM10.25 17.25V11.25L15.5 14.25L10.25 17.25ZM5 4.5H20V6H5V4.5ZM6.5 1.5H18.5V3H6.5V1.5Z"
|
||||
fill="currentColor"
|
||||
|
|
@ -407,25 +597,56 @@ const Navbar = () => {
|
|||
</a>
|
||||
</NavigationMenuTrigger>
|
||||
<NavigationMenuContent className="p-0 rounded-md overflow-hidden w-full">
|
||||
<NavigationMenuLink onClick={() => router.push(generateLocalizedPath("/video/filter", String(locale)))} className="flex items-start gap-1.5 p-2 hover:bg-white">
|
||||
<NavigationMenuLink
|
||||
onClick={() =>
|
||||
router.push(
|
||||
generateLocalizedPath("/video/filter", String(locale))
|
||||
)
|
||||
}
|
||||
className="flex items-start gap-1.5 p-2 hover:bg-white"
|
||||
>
|
||||
<p className="text-slate-600 hover:text-[#bb3523] flex flex-row justify-center items-center px-5 py-2 cursor-pointer">
|
||||
<FiYoutube className="mr-2" />
|
||||
Video
|
||||
</p>
|
||||
</NavigationMenuLink>
|
||||
<NavigationMenuLink onClick={() => router.push(generateLocalizedPath("/audio/filter", String(locale)))} className="flex place-items-start gap-1.5 p-2 hover:bg-white">
|
||||
<NavigationMenuLink
|
||||
onClick={() =>
|
||||
router.push(
|
||||
generateLocalizedPath("/audio/filter", String(locale))
|
||||
)
|
||||
}
|
||||
className="flex place-items-start gap-1.5 p-2 hover:bg-white"
|
||||
>
|
||||
<p className="text-slate-600 hover:text-[#bb3523] flex flex-row justify-center items-center px-5 py-2 cursor-pointer">
|
||||
<FiMusic className="mr-2" />
|
||||
Audio
|
||||
</p>
|
||||
</NavigationMenuLink>
|
||||
<NavigationMenuLink onClick={() => router.push(generateLocalizedPath("/image/filter", String(locale)))} className="flex place-items-start gap-1.5 p-2 hover:bg-white">
|
||||
<NavigationMenuLink
|
||||
onClick={() =>
|
||||
router.push(
|
||||
generateLocalizedPath("/image/filter", String(locale))
|
||||
)
|
||||
}
|
||||
className="flex place-items-start gap-1.5 p-2 hover:bg-white"
|
||||
>
|
||||
<p className="text-slate-600 hover:text-[#bb3523] flex flex-row justify-center items-center px-5 py-2 cursor-pointer">
|
||||
<FiImage className="mr-2" />
|
||||
Foto
|
||||
</p>
|
||||
</NavigationMenuLink>
|
||||
<NavigationMenuLink onClick={() => router.push(generateLocalizedPath("/document/filter", String(locale)))} className="flex place-items-start gap-1.5 p-2 hover:bg-white">
|
||||
<NavigationMenuLink
|
||||
onClick={() =>
|
||||
router.push(
|
||||
generateLocalizedPath(
|
||||
"/document/filter",
|
||||
String(locale)
|
||||
)
|
||||
)
|
||||
}
|
||||
className="flex place-items-start gap-1.5 p-2 hover:bg-white"
|
||||
>
|
||||
<p className="text-slate-600 hover:text-[#bb3523] flex flex-row justify-center items-center px-5 py-2 cursor-pointer">
|
||||
<FiFile className="mr-2" />
|
||||
Teks
|
||||
|
|
@ -437,7 +658,14 @@ const Navbar = () => {
|
|||
<Link href="/schedule" legacyBehavior passHref>
|
||||
<NavigationMenuLink className={navigationMenuTriggerStyle()}>
|
||||
<span>
|
||||
<svg className="mr-2" width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<svg
|
||||
className="mr-2"
|
||||
width="25"
|
||||
height="24"
|
||||
viewBox="0 0 25 24"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M19.5 4H18.5V3C18.5 2.4 18.1 2 17.5 2C16.9 2 16.5 2.4 16.5 3V4H8.5V3C8.5 2.4 8.1 2 7.5 2C6.9 2 6.5 2.4 6.5 3V4H5.5C3.8 4 2.5 5.3 2.5 7V8H22.5V7C22.5 5.3 21.2 4 19.5 4ZM2.5 19C2.5 20.7 3.8 22 5.5 22H19.5C21.2 22 22.5 20.7 22.5 19V10H2.5V19ZM17.5 12C18.1 12 18.5 12.4 18.5 13C18.5 13.6 18.1 14 17.5 14C16.9 14 16.5 13.6 16.5 13C16.5 12.4 16.9 12 17.5 12ZM17.5 16C18.1 16 18.5 16.4 18.5 17C18.5 17.6 18.1 18 17.5 18C16.9 18 16.5 17.6 16.5 17C16.5 16.4 16.9 16 17.5 16ZM12.5 12C13.1 12 13.5 12.4 13.5 13C13.5 13.6 13.1 14 12.5 14C11.9 14 11.5 13.6 11.5 13C11.5 12.4 11.9 12 12.5 12ZM12.5 16C13.1 16 13.5 16.4 13.5 17C13.5 17.6 13.1 18 12.5 18C11.9 18 11.5 17.6 11.5 17C11.5 16.4 11.9 16 12.5 16ZM7.5 12C8.1 12 8.5 12.4 8.5 13C8.5 13.6 8.1 14 7.5 14C6.9 14 6.5 13.6 6.5 13C6.5 12.4 6.9 12 7.5 12ZM7.5 16C8.1 16 8.5 16.4 8.5 17C8.5 17.6 8.1 18 7.5 18C6.9 18 6.5 17.6 6.5 17C6.5 16.4 6.9 16 7.5 16Z"
|
||||
fill="currentColor"
|
||||
|
|
@ -452,7 +680,14 @@ const Navbar = () => {
|
|||
<Link href="/indeks" legacyBehavior passHref>
|
||||
<NavigationMenuLink className={navigationMenuTriggerStyle()}>
|
||||
<span>
|
||||
<svg className="mr-2" width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<svg
|
||||
className="mr-2"
|
||||
width="25"
|
||||
height="24"
|
||||
viewBox="0 0 25 24"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
|
|
@ -474,21 +709,39 @@ const Navbar = () => {
|
|||
</div>
|
||||
<div className="flex items-center space-x-1 mx-3 text-yellow-600 font-medium">
|
||||
<a href="https://tvradio.polri.go.id/">
|
||||
<img src="/assets/polriTv.png" className="w-21 h-11 flex items-center" />
|
||||
<img
|
||||
src="/assets/polriTv.png"
|
||||
className="w-21 h-11 flex items-center"
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
<div className="relative inline-block mx-3 text-left">
|
||||
{/* Tombol Utama Bahasa */}
|
||||
<button onClick={() => setIsOpen(!isOpen)} className="flex items-center space-x-2 p-2 text-gray-700 bg-slate-200 rounded-lg">
|
||||
<button
|
||||
onClick={() => setIsOpen(!isOpen)}
|
||||
className="flex items-center space-x-2 p-2 text-gray-700 bg-slate-200 rounded-lg"
|
||||
>
|
||||
<img
|
||||
src={language === "id" ? "https://upload.wikimedia.org/wikipedia/commons/9/9f/Flag_of_Indonesia.svg" : "https://upload.wikimedia.org/wikipedia/en/a/a4/Flag_of_the_United_States.svg"}
|
||||
src={
|
||||
language === "id"
|
||||
? "https://upload.wikimedia.org/wikipedia/commons/9/9f/Flag_of_Indonesia.svg"
|
||||
: "https://upload.wikimedia.org/wikipedia/en/a/a4/Flag_of_the_United_States.svg"
|
||||
}
|
||||
alt={language === "id" ? "Ind" : "Eng"}
|
||||
className="w-3 h-3"
|
||||
/>
|
||||
<span>{language === "id" ? "Ind" : "Eng"}</span>
|
||||
<span className="text-gray-500">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 32 32">
|
||||
<path fill="currentColor" d="M8.037 11.166L14.5 22.36c.825 1.43 2.175 1.43 3 0l6.463-11.195c.826-1.43.15-2.598-1.5-2.598H9.537c-1.65 0-2.326 1.17-1.5 2.6z" />
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="15"
|
||||
height="15"
|
||||
viewBox="0 0 32 32"
|
||||
>
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="M8.037 11.166L14.5 22.36c.825 1.43 2.175 1.43 3 0l6.463-11.195c.826-1.43.15-2.598-1.5-2.598H9.537c-1.65 0-2.326 1.17-1.5 2.6z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</button>
|
||||
|
|
@ -496,12 +749,30 @@ const Navbar = () => {
|
|||
{/* Dropdown Menu */}
|
||||
{isOpen && (
|
||||
<div className="absolute right-0 mt-2 w-auto bg-slate-200 border rounded-md shadow-lg z-10">
|
||||
<button onClick={() => handleLanguageChange("id")} className={`flex items-center space-x-2 w-full px-4 py-2 ${language === "id" ? "font-medium" : ""}`}>
|
||||
<img src="https://upload.wikimedia.org/wikipedia/commons/9/9f/Flag_of_Indonesia.svg" alt="Indonesia" className="w-5 h-5" />
|
||||
<button
|
||||
onClick={() => handleLanguageChange("id")}
|
||||
className={`flex items-center space-x-2 w-full px-4 py-2 ${
|
||||
language === "id" ? "font-medium" : ""
|
||||
}`}
|
||||
>
|
||||
<img
|
||||
src="https://upload.wikimedia.org/wikipedia/commons/9/9f/Flag_of_Indonesia.svg"
|
||||
alt="Indonesia"
|
||||
className="w-5 h-5"
|
||||
/>
|
||||
<span>Ind</span>
|
||||
</button>
|
||||
<button onClick={() => handleLanguageChange("en")} className={`flex items-center space-x-2 w-full px-4 py-2 ${language === "en" ? "font-medium" : ""}`}>
|
||||
<img src="https://upload.wikimedia.org/wikipedia/en/a/a4/Flag_of_the_United_States.svg" alt="English" className="w-5 h-5" />
|
||||
<button
|
||||
onClick={() => handleLanguageChange("en")}
|
||||
className={`flex items-center space-x-2 w-full px-4 py-2 ${
|
||||
language === "en" ? "font-medium" : ""
|
||||
}`}
|
||||
>
|
||||
<img
|
||||
src="https://upload.wikimedia.org/wikipedia/en/a/a4/Flag_of_the_United_States.svg"
|
||||
alt="English"
|
||||
className="w-5 h-5"
|
||||
/>
|
||||
<span>Eng</span>
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -510,14 +781,22 @@ const Navbar = () => {
|
|||
</div>
|
||||
|
||||
<div className=" py-1 flex items-center mx-3">
|
||||
<input type="text" placeholder="Pencarian" className="border rounded-full w-full text-sm text-center text-gray-600" />
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Pencarian"
|
||||
className="border rounded-full w-full text-sm text-center text-gray-600"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex justify-center items-center mx-3 gap-5">
|
||||
{fullName ? (
|
||||
<>
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger className="flex items-center gap-1">
|
||||
<img className="h-12 w-12" src="/assets/avatar-profile.png" alt="avatar-profile" />
|
||||
<img
|
||||
className="h-12 w-12"
|
||||
src="/assets/avatar-profile.png"
|
||||
alt="avatar-profile"
|
||||
/>
|
||||
<a className="gap-2">
|
||||
<p className="text-xs font-semibold">{fullName}</p>
|
||||
<p className="text-xs">{`(${roleName})`}</p>
|
||||
|
|
@ -525,19 +804,28 @@ const Navbar = () => {
|
|||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent>
|
||||
<DropdownMenuItem>
|
||||
<Link href="/profile" className="flex items-center gap-1 hover:bg-slate-600 w-full rounded-lg">
|
||||
<Link
|
||||
href="/profile"
|
||||
className="flex items-center gap-1 hover:bg-slate-600 w-full rounded-lg"
|
||||
>
|
||||
<Icon icon="iconamoon:profile-circle-fill" />
|
||||
Profile
|
||||
</Link>
|
||||
</DropdownMenuItem>
|
||||
<DropdownMenuItem>
|
||||
<Link href="/content-management" className="flex items-center gap-1 hover:bg-slate-600 w-full rounded-lg">
|
||||
<Link
|
||||
href="/content-management"
|
||||
className="flex items-center gap-1 hover:bg-slate-600 w-full rounded-lg"
|
||||
>
|
||||
<Icon icon="stash:save-ribbon-light" />
|
||||
Kelola Konten
|
||||
</Link>
|
||||
</DropdownMenuItem>
|
||||
<DropdownMenuItem>
|
||||
<Link href="#" className="flex items-center gap-1 hover:bg-slate-600 w-full rounded-lg">
|
||||
<Link
|
||||
href="#"
|
||||
className="flex items-center gap-1 hover:bg-slate-600 w-full rounded-lg"
|
||||
>
|
||||
<Icon icon="iconamoon:exit-bold" />
|
||||
Keluar
|
||||
</Link>
|
||||
|
|
@ -547,10 +835,16 @@ const Navbar = () => {
|
|||
</>
|
||||
) : (
|
||||
<>
|
||||
<Link href="/auth" className="px-4 py-1 bg-[#bb3523] text-white font-semibold rounded-md hover:bg-[#bb3523]">
|
||||
<Link
|
||||
href="/auth"
|
||||
className="px-4 py-1 bg-[#bb3523] text-white font-semibold rounded-md hover:bg-[#bb3523]"
|
||||
>
|
||||
Masuk
|
||||
</Link>
|
||||
<Link href="#" className="px-4 py-1 border border-[#bb3523] text-[#bb3523] font-semibold rounded-md hover:bg-[#bb3523] hover:text-white">
|
||||
<Link
|
||||
href="#"
|
||||
className="px-4 py-1 border border-[#bb3523] text-[#bb3523] font-semibold rounded-md hover:bg-[#bb3523] hover:text-white"
|
||||
>
|
||||
Daftar
|
||||
</Link>{" "}
|
||||
</>
|
||||
|
|
|
|||
|
|
@ -71,7 +71,7 @@ const ProfileInfo = () => {
|
|||
{detail !== undefined ? (
|
||||
<div className="flex items-center gap-3 text-default-800">
|
||||
<Image
|
||||
src={"https://netidhub.com/assets/img/user-avatar.png"}
|
||||
src={"/assets/avatar-profile.png"}
|
||||
alt={"Image"}
|
||||
width={36}
|
||||
height={36}
|
||||
|
|
@ -120,21 +120,6 @@ const ProfileInfo = () => {
|
|||
icon: "heroicons:user",
|
||||
href: "/profile",
|
||||
},
|
||||
// {
|
||||
// name: "Billing",
|
||||
// icon: "heroicons:megaphone",
|
||||
// href: "/dashboard",
|
||||
// },
|
||||
// {
|
||||
// name: "Settings",
|
||||
// icon: "heroicons:paper-airplane",
|
||||
// href: "/dashboard",
|
||||
// },
|
||||
// {
|
||||
// name: "Keyboard shortcuts",
|
||||
// icon: "heroicons:language",
|
||||
// href: "/dashboard",
|
||||
// },
|
||||
].map((item, index) => (
|
||||
<Link
|
||||
href={item.href}
|
||||
|
|
@ -149,79 +134,7 @@ const ProfileInfo = () => {
|
|||
))}
|
||||
</DropdownMenuGroup>
|
||||
<DropdownMenuSeparator />
|
||||
<DropdownMenuGroup>
|
||||
{/* <Link href="/dashboard" className="cursor-pointer">
|
||||
<DropdownMenuItem className="flex items-center gap-2 text-sm font-medium text-default-600 capitalize px-3 py-1.5 cursor-pointer">
|
||||
<Icon icon="heroicons:user-group" className="w-4 h-4" />
|
||||
team
|
||||
</DropdownMenuItem>
|
||||
</Link>
|
||||
<DropdownMenuSub>
|
||||
<DropdownMenuSubTrigger className="flex items-center gap-2 text-sm font-medium text-default-600 capitalize px-3 py-1.5 ">
|
||||
<Icon icon="heroicons:user-plus" className="w-4 h-4" />
|
||||
Invite user
|
||||
</DropdownMenuSubTrigger>
|
||||
<DropdownMenuPortal>
|
||||
<DropdownMenuSubContent>
|
||||
{[
|
||||
{
|
||||
name: "email",
|
||||
},
|
||||
{
|
||||
name: "message",
|
||||
},
|
||||
{
|
||||
name: "facebook",
|
||||
},
|
||||
].map((item, index) => (
|
||||
<Link
|
||||
href="/dashboard"
|
||||
key={`message-sub-${index}`}
|
||||
className="cursor-pointer"
|
||||
>
|
||||
<DropdownMenuItem className="text-sm font-medium text-default-600 capitalize px-3 py-1.5 cursor-pointer">
|
||||
{item.name}
|
||||
</DropdownMenuItem>
|
||||
</Link>
|
||||
))}
|
||||
</DropdownMenuSubContent>
|
||||
</DropdownMenuPortal>
|
||||
</DropdownMenuSub>
|
||||
<Link href="/dashboard">
|
||||
<DropdownMenuItem className="flex items-center gap-2 text-sm font-medium text-default-600 capitalize px-3 py-1.5 cursor-pointer">
|
||||
<Icon icon="heroicons:variable" className="w-4 h-4" />
|
||||
Github
|
||||
</DropdownMenuItem>
|
||||
</Link>
|
||||
|
||||
<DropdownMenuSub>
|
||||
<DropdownMenuSubTrigger className="flex items-center gap-2 text-sm font-medium text-default-600 capitalize px-3 py-1.5 cursor-pointer">
|
||||
<Icon icon="heroicons:phone" className="w-4 h-4" />
|
||||
Support
|
||||
</DropdownMenuSubTrigger>
|
||||
<DropdownMenuPortal>
|
||||
<DropdownMenuSubContent>
|
||||
{[
|
||||
{
|
||||
name: "portal",
|
||||
},
|
||||
{
|
||||
name: "slack",
|
||||
},
|
||||
{
|
||||
name: "whatsapp",
|
||||
},
|
||||
].map((item, index) => (
|
||||
<Link href="/dashboard" key={`message-sub-${index}`}>
|
||||
<DropdownMenuItem className="text-sm font-medium text-default-600 capitalize px-3 py-1.5 cursor-pointer">
|
||||
{item.name}
|
||||
</DropdownMenuItem>
|
||||
</Link>
|
||||
))}
|
||||
</DropdownMenuSubContent>
|
||||
</DropdownMenuPortal>
|
||||
</DropdownMenuSub> */}
|
||||
</DropdownMenuGroup>
|
||||
<DropdownMenuGroup></DropdownMenuGroup>
|
||||
<DropdownMenuItem className="flex items-center gap-2 text-sm font-medium text-default-600 capitalize my-1 px-3 cursor-pointer">
|
||||
<div>
|
||||
<Link href={"/auth"}>
|
||||
|
|
|
|||
Loading…
Reference in New Issue