update

components/form/article/create-article-form.tsx

@@ -524,13 +524,21 @@ export default function CreateArticleForm() {
               </SelectTrigger>
               <SelectContent>
                 <SelectItem value="single">Single Article</SelectItem>
-                <SelectItem value="rewrite">Content Rewrite</SelectItem>
+                {/* <SelectItem value="rewrite">Content Rewrite</SelectItem> */}
               </SelectContent>
             </Select>
             {selectedWritingType === "single" ? (
               <GenerateSingleArticleForm
                 content={(data) => {
                   setDiseData(data);
+                  // setValue("title", data?.title ?? "", {
+                  //   shouldValidate: true,
+                  //   shouldDirty: true,
+                  // });
+                  // setValue("slug", generateSlug(data?.title ?? ""), {
+                  //   shouldValidate: true,
+                  //   shouldDirty: true,
+                  // });
                   setValue(
                     "description",
                     data?.articleBody ? data?.articleBody : ""

components/form/article/edit-article-form.tsx

@@ -681,6 +681,7 @@ export default function EditArticleForm(props: { isDetail: boolean }) {
                 </div>
 
                 <Button
+                  type="button"
                   className=" border-none rounded-full"
                   variant="outline"
                   color="danger"

components/form/article/generate-ai-content-rewrite-form.tsx

@@ -1,11 +1,20 @@
 "use client";
 
-import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from "@/components/ui/select";
+import {
+  Select,
+  SelectTrigger,
+  SelectValue,
+  SelectContent,
+  SelectItem,
+} from "@/components/ui/select";
 import { useEffect, useState } from "react";
 import { close, error, loading } from "@/config/swal";
 import { delay } from "@/utils/global";
 import dynamic from "next/dynamic";
-import { getDetailArticle, getGenerateRewriter } from "@/service/generate-article";
+import {
+  getDetailArticle,
+  getGenerateRewriter,
+} from "@/service/generate-article";
 import { Button } from "@/components/ui/button";
 import { Loader2 } from "lucide-react";
 import GetSeoScore from "./get-seo-score-form";
@@ -69,8 +78,11 @@ interface DiseData {
   additionalKeywords: string;
 }
 
-export default function GenerateContentRewriteForm(props: { content: (data: DiseData) => void }) {
+export default function GenerateContentRewriteForm(props: {
-  const [selectedWritingSyle, setSelectedWritingStyle] = useState("Informational");
+  content: (data: DiseData) => void;
+}) {
+  const [selectedWritingSyle, setSelectedWritingStyle] =
+    useState("Informational");
   const [selectedArticleSize, setSelectedArticleSize] = useState("News");
   const [selectedLanguage, setSelectedLanguage] = useState("id");
   const [mainKeyword, setMainKeyword] = useState("");
@@ -166,7 +178,10 @@ export default function GenerateContentRewriteForm(props: { content: (data: Dise
               ))}
             </SelectSection>
           </Select> */}
-          <Select value={selectedWritingSyle} onValueChange={(value) => setSelectedWritingStyle(value)}>
+          <Select
+            value={selectedWritingSyle}
+            onValueChange={(value) => setSelectedWritingStyle(value)}
+          >
             <SelectTrigger className="w-full border rounded-lg text-black dark:border-gray-400">
               <SelectValue placeholder="Writing Style" />
             </SelectTrigger>
@@ -198,7 +213,10 @@ export default function GenerateContentRewriteForm(props: { content: (data: Dise
               ))}
             </SelectSection>
           </Select> */}
-          <Select value={selectedArticleSize} onValueChange={(value) => setSelectedArticleSize(value)}>
+          <Select
+            value={selectedArticleSize}
+            onValueChange={(value) => setSelectedArticleSize(value)}
+          >
             <SelectTrigger className="w-full border rounded-lg text-black dark:border-gray-400">
               <SelectValue placeholder="Writing Style" />
             </SelectTrigger>
@@ -229,7 +247,10 @@ export default function GenerateContentRewriteForm(props: { content: (data: Dise
               <SelectItem key="en">English</SelectItem>
             </SelectSection>
           </Select> */}
-          <Select value={selectedLanguage} onValueChange={(value) => setSelectedLanguage(value)}>
+          <Select
+            value={selectedLanguage}
+            onValueChange={(value) => setSelectedLanguage(value)}
+          >
             <SelectTrigger className="w-full border rounded-lg text-black dark:border-gray-400">
               <SelectValue placeholder="Writing Style" />
             </SelectTrigger>
@@ -239,6 +260,7 @@ export default function GenerateContentRewriteForm(props: { content: (data: Dise
             </SelectContent>
           </Select>
         </div>
+
         <div className="flex flex-col mt-3">
           <div className="flex flex-row gap-2 items-center">
             <p className="text-sm">Text</p>
@@ -246,9 +268,16 @@ export default function GenerateContentRewriteForm(props: { content: (data: Dise
           <div className="w-[78vw] lg:w-full">
             <CustomEditor onChange={setMainKeyword} initialData={mainKeyword} />
           </div>
-          {mainKeyword == "" && <p className="text-red-400 text-sm">Required</p>}
+          {mainKeyword == "" && (
+            <p className="text-red-400 text-sm">Required</p>
+          )}
           {articleIds.length < 3 && (
-            <Button onClick={onSubmit} type="button" disabled={mainKeyword === "" || isLoading} className="my-5 w-full py-5 text-xs md:text-base">
+            <Button
+              onClick={onSubmit}
+              type="button"
+              disabled={mainKeyword === "" || isLoading}
+              className="my-5 w-full py-5 text-xs md:text-base"
+            >
               {isLoading ? (
                 <>
                   <Loader2 className="mr-2 h-4 w-4 animate-spin" />
@@ -263,7 +292,14 @@ export default function GenerateContentRewriteForm(props: { content: (data: Dise
         {articleIds.length > 0 && (
           <div className="flex flex-row gap-1 mt-2">
             {articleIds?.map((id, index) => (
-              <Button key={id} onClick={() => setSelectedId(id)} disabled={isLoading && selectedId === id} variant={selectedId === id ? "default" : "outline"} className="flex items-center gap-2">
+              <Button
+                type="button"
+                key={id}
+                onClick={() => setSelectedId(id)}
+                disabled={isLoading && selectedId === id}
+                variant={selectedId === id ? "default" : "outline"}
+                className="flex items-center gap-2"
+              >
                 {isLoading && selectedId === id ? (
                   <>
                     <Loader2 className="w-4 h-4 animate-spin" />

components/form/article/generate-ai-single-form.tsx

@@ -85,7 +85,7 @@ export default function GenerateSingleArticleForm(props: {
   const [additionalKeyword, setAdditionalKeyword] = useState("");
   const [articleIds, setArticleIds] = useState<number[]>([]);
   const [selectedId, setSelectedId] = useState<number>();
-  const [isLoading, setIsLoading] = useState(true);
+  const [isLoading, setIsLoading] = useState(false);
 
   const generateAll = async (keyword: string | undefined) => {
     if (keyword) {
@@ -319,6 +319,7 @@ export default function GenerateSingleArticleForm(props: {
           <div className="flex flex-row gap-2 items-center">
             <p className="text-sm">Main Keyword</p>
             <Button
+              type="button"
               variant="default"
               size="sm"
               onClick={() => generateAll(mainKeyword)}
@@ -350,6 +351,7 @@ export default function GenerateSingleArticleForm(props: {
           <div className="flex flex-row gap-2 items-center mt-3">
             <p className="text-sm">Title</p>
             <Button
+              type="button"
               variant="default"
               size="sm"
               onClick={() => generateTitle(mainKeyword)}
@@ -373,6 +375,7 @@ export default function GenerateSingleArticleForm(props: {
           <div className="flex flex-row gap-2 items-center mt-2">
             <p className="text-sm">Additional Keyword</p>
             <Button
+              type="button"
               className="text-sm"
               size="sm"
               onClick={() => generateKeywords(mainKeyword)}
@@ -417,6 +420,7 @@ export default function GenerateSingleArticleForm(props: {
           <div className="flex flex-row gap-1 mt-2">
             {articleIds.map((id, index) => (
               <Button
+                type="button"
                 key={id}
                 onClick={() => setSelectedId(id)}
                 disabled={isLoading && selectedId === id}

components/landing-page/navbar.tsx

@@ -3,10 +3,23 @@ import { Facebook, Instagram, Search, Twitter, Youtube } from "lucide-react";
 import Image from "next/image";
 import Link from "next/link";
 import { Button } from "../ui/button";
+import { usePathname } from "next/navigation";
+import { cn } from "@/lib/utils"; // helper opsional, bisa hapus kalau tidak ada
 
 export default function Navbar() {
+  const pathname = usePathname();
+
+  const navItems = [
+    { label: "HOME", href: "/" },
+    { label: "BERITA TERKINI", href: "/category/latest-news" },
+    { label: "BERITA POPULER", href: "/category/popular-news" },
+    { label: "JAGA NEGERI", href: "/category/protect" },
+    { label: "BERITA OPINI", href: "/category/opinion-news" },
+  ];
+
   return (
     <div className="w-full bg-white">
+      {/* Banner */}
       <div className="relative w-full h-[113px]">
         <Image
           src="/bg-isu.jpg"
@@ -26,38 +39,31 @@ export default function Navbar() {
         </div>
       </div>
 
+      {/* Navbar */}
       <div className="flex max-w-screen-xl mx-auto items-center justify-between py-2 flex-wrap gap-y-2">
+        {/* Menu */}
         <div className="flex flex-wrap gap-x-4 md:gap-x-6 font-semibold text-sm mx-3 md:mx-3 lg:mx-3 xl:mx-0">
+          {navItems.map((item) => {
+            const isActive =
+              item.href === "/"
+                ? pathname === item.href
+                : pathname.startsWith(item.href);
+
+            return (
               <Link
-            href="/"
+                key={item.href}
-            className="text-[#795548] border-t-3 border-[#795548] pb-1"
+                href={item.href}
+                className={cn(
+                  "pb-1 transition-colors",
+                  isActive
+                    ? "text-white bg-[#795548] px-2 rounded"
+                    : "text-black hover:text-[#795548]"
+                )}
               >
-            HOME
+                {item.label}
-          </Link>
-          <Link
-            href="/category/latest-news"
-            className="text-black hover:text-[#795548]"
-          >
-            BERITA TERKINI
-          </Link>
-          <Link
-            href="/category/popular-news"
-            className="text-black hover:text-[#795548]"
-          >
-            BERITA POPULER
-          </Link>
-          <Link
-            href="/category/protect"
-            className="text-black hover:text-[#795548]"
-          >
-            JAGA NEGERI
-          </Link>
-          <Link
-            href="/category/opinion-news"
-            className="text-black hover:text-[#795548]"
-          >
-            BERITA OPINI
               </Link>
+            );
+          })}
         </div>
 
         {/* Ikon kanan */}