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/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,13 @@ 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
+                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}