{contentAudio?.map((audio: any) => (
-
+
-
@@ -365,7 +361,36 @@ const Galery = (props: any) => {
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
))}
) : (
@@ -377,12 +402,41 @@ const Galery = (props: any) => {
contentImage?.length > 0 ? (
+
+
{audio?.mediaUpload?.title}
-
@@ -365,7 +361,36 @@ const Galery = (props: any) => {
Content Rewrite
+ +
+
+
+
{contentImage?.map((image: any) => (
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
))}
@@ -395,7 +449,7 @@ const Galery = (props: any) => {
) : contentDocument.length > 0 ? (
([]);
const [isFromSPIT, setIsFromSPIT] = useState(false);
const [listSuggestion, setListSuggestion] = useState();
- const [main, setMain] = useState();
+ const [main, setMain] = useState();
const userId = getCookiesDecrypt("uie");
const userRoleId = getCookiesDecrypt("urie");
- const [articleIds, setArticleIds] = useState([]);
+ const [articleIds, setArticleIds] = useState([]);
const [isGeneratedArticle, setIsGeneratedArticle] = useState(false);
- const [selectedArticleId, setSelectedArticleId] = useState(null);
+ const [selectedArticleId, setSelectedArticleId] = useState(null);
const [articleBody, setArticleBody] = useState("");
const [selectedAdvConfig, setSelectedAdvConfig] = useState("");
const [selectedWritingStyle, setSelectedWritingStyle] = useState("");
@@ -36,11 +57,235 @@ const page = () => {
const [selectedMainKeyword, setSelectedMainKeyword] = useState("");
const [selectedSEO, setSelectedSEO] = useState("");
const [selectedSize, setSelectedSize] = useState("");
- const [detailArticle, setDetailArticle] = useState(null);
+ const [detailArticle, setDetailArticle] = useState(null);
const [contentType, setContentType] = useState("all");
+ const [isLoadingData, setIsLoadingData] = useState(false);
+ const [detailData, setDetailData] = useState(null);
+ const [articleImages, setArticleImages] = useState([]);
const userLevelId = getCookiesDecrypt("ulie");
const roleId = getCookiesDecrypt("urie");
+ type ImageSchema = z.infer;
+
+ const validationSchema = Yup.object().shape({
+ title: Yup.string().required("Judul tidak boleh kosong"),
+ });
+
+ let componentMounted = true;
+
+ const { control } = useForm({
+ resolver: zodResolver(imageSchema),
+ });
+
+ const formOptions = {
+ resolver: yupResolver(validationSchema),
+ };
+
+ const {
+ register,
+ handleSubmit,
+ reset,
+ formState: { errors },
+ setValue,
+ } = useForm(formOptions);
+
+ const handleArticleIdClick = async (id: string) => {
+ setIsLoadingData(true);
+ let retryCount = 0;
+ const maxRetries = 20;
+
+ try {
+ const waitForStatusUpdate = async () => {
+ while (retryCount < maxRetries) {
+ const res = await getDetailArticle(id);
+ const articleData = res?.data?.data;
+
+ if (articleData?.status === 2) {
+ return articleData;
+ }
+
+ retryCount++;
+ await new Promise((resolve) => setTimeout(resolve, 5000));
+ }
+
+ throw new Error("Timeout: Artikel belum selesai diproses.");
+ };
+ const articleData = await waitForStatusUpdate();
+ const cleanArticleBody = articleData?.articleBody?.replace(/]*>/g, "");
+ const articleImagesData = articleData?.imagesUrl?.split(",");
+ setArticleBody(cleanArticleBody || "");
+ setDetailData(articleData);
+ setSelectedArticleId(id);
+ setArticleImages(articleImagesData || []);
+ } catch (error) {
+ console.error("Error fetching article details:", error);
+ } finally {
+ setIsLoadingData(false);
+ }
+ };
+
+ const save = async (data: any) => {
+ const request = {
+ title: data.title,
+ articleId: detailArticle?.id,
+ mediaUploadId: id.split("-")?.[0],
+ articleBody: detailArticle?.articleBody,
+ metaTitle: detailArticle?.metaTitle,
+ metaDescription: detailArticle?.metaDescription,
+ mainKeyword: detailArticle?.mainKeyword,
+ additionalKeyword: detailArticle?.additionalKeyword,
+ articleSize: detailArticle?.articleSize,
+ style: detailArticle?.style,
+ website: detailArticle?.website,
+ imageUrl: detailArticle?.imageUrl,
+ };
+ loading();
+ const res = await saveContentRewrite(request);
+ if (res?.error) {
+ error(res?.message);
+ return false;
+ }
+ successSubmit();
+ };
+
+ function successSubmit() {
+ MySwal.fire({
+ title: "Sukses",
+ icon: "success",
+ confirmButtonColor: "#3085d6",
+ confirmButtonText: "OK",
+ }).then((result) => {
+ if (result.isConfirmed) {
+ router.push("/content-management/rewrite");
+ }
+ });
+ }
+
+ function onSubmit(data: any) {
+ MySwal.fire({
+ title: "Simpan Data",
+ text: "",
+ icon: "warning",
+ showCancelButton: true,
+ cancelButtonColor: "#d33",
+ confirmButtonColor: "#3085d6",
+ confirmButtonText: "Simpan",
+ }).then((result) => {
+ if (result.isConfirmed) {
+ save(data);
+ }
+ });
+ }
+ useEffect(() => {
+ async function initState() {
+ setLoadingState(true);
+ const response = await getDetail(id, states == "polda" ? "polda" : "mabes");
+ console.log("Detail dataaaa ::", response);
+ if (response?.data?.data?.isActive == false) {
+ window.location.replace("/");
+ }
+ const responseGet = await getPublicSuggestionList(id?.split("-")?.[0]);
+
+ // close();
+ if (componentMounted) {
+ setContent(response?.data.data);
+ setIsFromSPIT(response?.data.data?.isFromSPIT);
+ setListSuggestion(responseGet?.data?.data);
+ console.log("data list file", response?.data.data?.files);
+ // const mainUrl = response?.data.data?.files[0]?.url;
+ // const ticket = response?.data.data?.files[0]?.ticket;
+ // const urlBlob = await getBlobContent(mainUrl, ticket);
+ setMain({
+ id: response?.data.data?.files[0]?.id,
+ type: response?.data.data?.fileType.name,
+ url: Number(response?.data.data?.fileType?.id) == 4 ? response?.data.data?.files[0]?.secondaryUrl : response?.data.data?.files[0]?.url,
+ thumbnailFileUrl: response?.data.data?.files[0]?.thumbnailFileUrl,
+ names: response?.data.data?.files[0]?.fileName,
+ format: response?.data.data?.files[0]?.format,
+ widthPixel: response?.data.data?.files[0]?.widthPixel,
+ heightPixel: response?.data.data?.files[0]?.heightPixel,
+ size: response?.data.data?.files[0]?.size,
+ caption: response?.data.data?.files[0]?.caption,
+ });
+
+ // Send Meta Data
+ const metaData = {
+ title: response?.data.data?.title,
+ image: response?.data.data?.thumbnailLink,
+ };
+
+ setCookiesEncrypt("meta_data", metaData);
+ setLoadingState(false); // (2) write some value to state
+ // await new Promise(resolve => setTimeout(resolve, 1000)); // 2 sec
+ // setIdm();
+ }
+
+ return () => {
+ // This code runs when component is unmounted
+ componentMounted = false; // (4) set it to false if we leave the page
+ };
+ }
+
+ initState();
+ }, [id]);
+
+ const handleGenerateArtikel = async () => {
+ loading();
+ const request = {
+ advConfig: selectedAdvConfig,
+ style: selectedWritingStyle,
+ website: "None",
+ connectToWeb: true,
+ lang: selectedLanguage,
+ pointOfView: "None",
+ title: content?.title,
+ imageSource: "Web",
+ mainKeyword: content?.title,
+ additionalKeywords: content?.htmlDescription,
+ targetCountry: null,
+ articleSize: selectedSize,
+ 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: any) => {
+ if (prevIds.length < 5) {
+ return [...prevIds, newArticleId];
+ } else {
+ const updatedIds = [...prevIds];
+ updatedIds[4] = newArticleId;
+ return updatedIds;
+ }
+ });
+
+ Cookies.set("nulisAIArticleIdTemp", articleIds);
+ };
+
+ const handleArticleClick = async (id: any) => {
+ const res = await getDetailArticle(id);
+ const articleData = res?.data?.data;
+ const cleanArticleBody = articleData?.articleBody?.replace(/]*>/g, "");
+
+ const articleImagesData = articleData?.imagesUrl?.split(","); // Split URLs into an array
+
+ setArticleBody(cleanArticleBody || ""); // Set articleBody for CKEditor
+ setDetailArticle(articleData);
+ setSelectedArticleId(id);
+ // setArticleImages(articleImagesData || []); // Set images array in state
+ };
+
return (
<>
{image?.mediaUpload?.title}
+ Content Rewrite
+ +
+
+
+
{contentDocument?.map((document: any) => (
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
))}
) : (
diff --git a/app/[locale]/(public)/content-management/rewrite/create/[id]/page.tsx b/app/[locale]/(public)/content-management/rewrite/create/[id]/page.tsx
index 0237434c..e2c3f8c5 100644
--- a/app/[locale]/(public)/content-management/rewrite/create/[id]/page.tsx
+++ b/app/[locale]/(public)/content-management/rewrite/create/[id]/page.tsx
@@ -3,30 +3,51 @@
import HeaderManagement from "@/components/landing-page/header-management";
import SidebarManagement from "@/components/landing-page/sidebar-management";
import { useRouter } from "@/i18n/routing";
-import { getCookiesDecrypt } from "@/lib/utils";
+import { getCookiesDecrypt, setCookiesEncrypt } from "@/lib/utils";
import { useSearchParams } from "next/navigation";
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
import Swal from "sweetalert2";
import withReactContent from "sweetalert2-react-content";
import { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectTrigger, SelectValue } from "@/components/ui/select";
+import { Controller, useForm } from "react-hook-form";
+import * as z from "zod";
+import { zodResolver } from "@hookform/resolvers/zod";
+import CustomEditor from "@/components/editor/custom-editor";
+import { generateDataArticle, getDetailArticle } from "@/service/content/ai";
+import { Button } from "@/components/ui/button";
+import { error, loading } from "@/config/swal";
+import { saveContentRewrite } from "@/service/content/content";
+import { getPublicSuggestionList } from "@/service/landing/landing";
+import { getDetail } from "@/service/detail/detail";
+import { yupResolver } from "@hookform/resolvers/yup";
+import * as Yup from "yup";
+import { htmlToString } from "@/utils/globals";
+import Cookies from "js-cookie";
-const page = () => {
- // const { states } = props;
+const imageSchema = z.object({
+ title: z.string().min(1, { message: "Judul diperlukan" }),
+ description: z.string().min(2, { message: "Narasi Penugasan harus lebih dari 2 karakter." }),
+ creatorName: z.string().min(1, { message: "Creator diperlukan" }),
+ // tags: z.string().min(1, { message: "Judul diperlukan" }),
+});
+
+const page = (props: { states?: any }) => {
+ const { states } = props;
const [profile, setProfile] = useState();
const MySwal = withReactContent(Swal);
const router = useRouter();
const [, setLoadingState] = useState(false);
const searchParams = useSearchParams();
const id: any = searchParams?.get("title");
- const [content, setContent] = useState([]);
+ const [content, setContent] = useState
-
-
+ {document?.mediaUpload?.title}
+
+ {document?.mediaUpload?.title}
+
Content Rewrite
+ +
+
+
+ Content Rewrite
-