diff --git a/components/form/content/spit-convert-form.tsx b/components/form/content/spit-convert-form.tsx index 20863b69..88545a51 100644 --- a/components/form/content/spit-convert-form.tsx +++ b/components/form/content/spit-convert-form.tsx @@ -13,6 +13,8 @@ import { Label } from "@/components/ui/label"; import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; import { Badge } from "@/components/ui/badge"; import { Alert, AlertDescription } from "@/components/ui/alert"; +import { Separator } from "@/components/ui/separator"; +import { ScrollArea } from "@/components/ui/scroll-area"; import { Select, SelectContent, @@ -53,7 +55,6 @@ import { getTagsBySubCategoryId, listEnableCategory, listEnableCategoryNew, - updateFilePlacements, } from "@/service/content/content"; import { generateDataRewrite, getDetailArticle } from "@/service/content/ai"; import { getCookiesDecrypt } from "@/lib/utils"; @@ -61,16 +62,6 @@ import { error } from "@/lib/swal"; import Swal from "sweetalert2"; import withReactContent from "sweetalert2-react-content"; import { close, loading } from "@/config/swal"; -import { - Dialog, - DialogClose, - DialogContent, - DialogHeader, - DialogTitle, - DialogTrigger, -} from "@/components/ui/dialog"; -import { Icon } from "@/components/ui/icon"; -import { getUserLevelForAssignments } from "@/service/task"; interface Category { id: number; @@ -99,31 +90,6 @@ interface Option { label: string; } -interface Destination { - id: string; - name: string; - subDestination?: SubDestination[]; -} - -interface SubDestination { - id: string; - name: string; -} - -type PlacementType = - | "all" - | "mabes" - | "polda" - | "international" - | "wilayah" - | "nasional" - | "satker" - | string; - -interface TempFileItem { - id: number | string; -} - // Updated FileType to reflect API response interface FileType { contentId: number; @@ -168,9 +134,9 @@ const WRITING_STYLES = [ ]; const PLACEMENT_OPTIONS = [ - { value: "semua", label: "Semua" }, - { value: "nasional", label: "Nasional" }, - { value: "wilayah", label: "Wilayah" }, + { value: "all", label: "Semua" }, + { value: "mabes", label: "Nasional" }, + { value: "polda", label: "Wilayah" }, { value: "international", label: "Internasional" }, ]; @@ -243,79 +209,6 @@ export default function FormConvertSPIT() { const userLevelId = getCookiesDecrypt("ulie"); const roleId = getCookiesDecrypt("urie"); const [isUserMabesApprover, setIsUserMabesApprover] = useState(false); - const [fileUnitSelections, setFileUnitSelections] = useState< - Array<{ - semua: boolean; - nasional: boolean; - wilayah: boolean; - international: boolean; - polda: boolean; - satker: boolean; - }> - >([]); - const [unitSelection, setUnitSelection] = useState({ - semua: false, - nasional: false, - wilayah: false, - international: false, - polda: false, - satker: false, - }); - const [fileCheckedLevels, setFileCheckedLevels] = useState< - Array> - >([]); - const [listDest, setListDest] = useState([]); - const [isDetailOfRegionShowed, setIsDetailOfRegionShowed] = useState(false); - const [isUpdatingFromMainCheckbox, setIsUpdatingFromMainCheckbox] = - useState(false); - const [mainCheckboxChangeType, setMainCheckboxChangeType] = - useState(""); - const [checkedLevels, setCheckedLevels] = useState>(new Set()); - const [expandedPolda, setExpandedPolda] = useState>( - {} - ); - - useEffect(() => { - async function fetchPoldaPolres() { - setIsLoading(true); - try { - const response = await getUserLevelForAssignments(); - setListDest(response?.data?.data.list); - const initialExpandedState = response?.data?.data.list.reduce( - (acc: any, polda: any) => { - acc[polda.id] = false; - return acc; - }, - {} - ); - setExpandedPolda(initialExpandedState); - console.log("polres", initialExpandedState); - } catch (error) { - console.error("Error fetching Polda/Polres data:", error); - } finally { - setIsLoading(false); - } - } - fetchPoldaPolres(); - }, []); - - // useEffect untuk sinkronisasi checkbox modal dengan checkbox utama - useEffect(() => { - if ( - listDest.length > 0 && - isUpdatingFromMainCheckbox && - mainCheckboxChangeType - ) { - syncModalWithMainCheckbox(); - } - }, [isUpdatingFromMainCheckbox, mainCheckboxChangeType]); - - // useEffect untuk update checkbox utama ketika pilihan modal berubah - useEffect(() => { - if (!isUpdatingFromMainCheckbox && listDest.length > 0) { - updateMainCheckboxFromModalLegacy(); - } - }, [checkedLevels, isUpdatingFromMainCheckbox]); useEffect(() => { initializeComponent(); @@ -644,42 +537,27 @@ export default function FormConvertSPIT() { ); }; - const getPlacementData = () => { - return files.map((file, index) => { - const fid = index; - - // ✅ LEVEL CHECKBOX (POLDA, SATKER, dst.) - const levelSet = fileCheckedLevels[fid] - ? Array.from(fileCheckedLevels[fid]) - : []; - - // ✅ PLACEMENTS UTAMA (nasional, wilayah, international) - const unit = fileUnitSelections[fid] || { - nasional: false, - wilayah: false, - international: false, - polda: false, - satker: false, - semua: false, - }; - - let placements: string[] = []; - - // ✅ Map utama - if (unit.nasional) placements.push("mabes"); - // if (unit.wilayah) placements.push("polda"); - if (unit.international) placements.push("international"); - if (unit.polda) placements.push("polda"); - if (unit.satker) placements.push("satker"); - - placements = Array.from(new Set(placements)); - - return { - mediaFileId: file.contentId, - placements: placements.join(","), // ✅ "polda,satker" - customLocationPlacements: levelSet.join(","), // ✅ "219,220,221,..." - }; - }); + const getPlacementData = (type: string) => { + const placementData: PlacementData[] = []; + if (type == "mabes") { + for (let i = 0; i < filePlacements.length; i++) { + if (filePlacements[i].length > 0) { + const placements = filePlacements[i]; + placementData.push({ + mediaFileId: files[i].contentId, + placements: placements.join(","), + }); + } + } + } else { + for (let i = 0; i < files.length; i++) { + placementData.push({ + mediaFileId: files[i].contentId, + placements: "polda", + }); + } + } + return placementData; }; const checkPlacement = (data: any) => { @@ -739,22 +617,13 @@ export default function FormConvertSPIT() { categoryId: selectedCategoryId, publishedFor: publishedFor.join(","), creator: data.contentCreator, - files: getPlacementData(), + files: isUserMabesApprover + ? getPlacementData("mabes") + : getPlacementData("polda"), }; await convertSPIT(requestData); - // update placements (CRITICAL) - const placementsPayload = buildPlacementsPayload(); - const responseFilePlacements = await updateFilePlacements( - placementsPayload - ); - if (responseFilePlacements?.error) { - close(); - error(responseFilePlacements?.message); - return false; - } - MySwal.fire({ title: "Success", text: "Data saved successfully", @@ -774,8 +643,6 @@ export default function FormConvertSPIT() { } finally { setIsSaving(false); } - - handleFileUnitChange; }; const handleDelete = async () => { @@ -829,772 +696,6 @@ export default function FormConvertSPIT() { ); } - const handleFileUnitChange = ( - fileIndex: number, - key: keyof typeof unitSelection, - value: boolean - ) => { - setFileUnitSelections((prev) => { - const newSelections = [...prev]; - const currentSelection = { ...newSelections[fileIndex] }; - - if (key === "semua") { - // Jika klik Semua, set semua value ke true/false - currentSelection.semua = value; - currentSelection.nasional = value; - currentSelection.wilayah = value; - currentSelection.international = value; - currentSelection.polda = value; - currentSelection.satker = value; - - // Update fileCheckedLevels untuk sinkronisasi dengan modal - setFileCheckedLevels((prevLevels) => { - const newArray = [...prevLevels]; - const currentFileLevels = new Set( - newArray[fileIndex] || new Set() - ); - - if (value) { - // Checklist semua item di modal - listDest.forEach((item: any) => { - currentFileLevels.add(Number(item.id)); - if (item.subDestination) { - item.subDestination.forEach((sub: any) => { - currentFileLevels.add(Number(sub.id)); - }); - } - }); - } else { - // Unchecklist semua item di modal - currentFileLevels.clear(); - } - - newArray[fileIndex] = currentFileLevels; - return newArray; - }); - } else { - // Jika wilayah dicentang, auto centang POLDA, SATKER - if (key === "wilayah") { - currentSelection.wilayah = value; - setIsDetailOfRegionShowed(value); - - if (value) { - // Ketika wilayah dicentang, auto centang POLDA, SATKER - currentSelection.polda = true; - currentSelection.satker = true; - - // Update fileCheckedLevels untuk mengisi semua POLDA dan SATKER POLRI ketika wilayah dicentang - setFileCheckedLevels((prevLevels) => { - const newArray = [...prevLevels]; - const currentFileLevels = new Set( - newArray[fileIndex] || new Set() - ); - - // Checklist semua POLDA di modal - listDest.forEach((item: any) => { - if (item.levelNumber === 2 && item.name !== "SATKER POLRI") { - currentFileLevels.add(Number(item.id)); - } - }); - - // Checklist SATKER POLRI dan semua sub-itemsnya - const satkerItem = listDest.find( - (item: any) => item.name === "SATKER POLRI" - ); - if (satkerItem) { - currentFileLevels.add(Number(satkerItem.id)); - // Checklist semua sub-items di bawah SATKER POLRI - if (satkerItem.subDestination) { - satkerItem.subDestination.forEach((sub: any) => { - currentFileLevels.add(Number(sub.id)); - }); - } - } - - newArray[fileIndex] = currentFileLevels; - return newArray; - }); - } else { - // Ketika wilayah di-uncheck, uncheck POLDA, SATKER dan hapus data POLDA dari fileCheckedLevels - currentSelection.polda = false; - currentSelection.satker = false; - - // Update fileCheckedLevels untuk menghapus semua POLDA dan SATKER POLRI ketika wilayah di-uncheck - setFileCheckedLevels((prevLevels) => { - const newArray = [...prevLevels]; - const currentFileLevels = new Set( - newArray[fileIndex] || new Set() - ); - - // Hapus semua POLDA dari modal - listDest.forEach((item: any) => { - if (item.levelNumber === 2 && item.name !== "SATKER POLRI") { - currentFileLevels.delete(Number(item.id)); - } - }); - - // Hapus SATKER POLRI dan semua sub-itemsnya - const satkerItem = listDest.find( - (item: any) => item.name === "SATKER POLRI" - ); - if (satkerItem) { - currentFileLevels.delete(Number(satkerItem.id)); - // Hapus semua sub-items di bawah SATKER POLRI - if (satkerItem.subDestination) { - satkerItem.subDestination.forEach((sub: any) => { - currentFileLevels.delete(Number(sub.id)); - }); - } - } - - newArray[fileIndex] = currentFileLevels; - return newArray; - }); - } - } else { - // Update salah satu saja - currentSelection[key] = value; - } - - // Cek apakah semua selain "semua" sudah dicentang - const allChecked = [ - "nasional", - "wilayah", - "international", - "polda", - "satker", - ].every((k) => currentSelection[k as keyof typeof unitSelection]); - - currentSelection.semua = allChecked; - } - - newSelections[fileIndex] = currentSelection; - return newSelections; - }); - }; - - const setupPlacement = ( - index: number, - placement: string, - checked: boolean - ) => { - let temp = [...filePlacements]; - if (checked) { - if (placement === "all") { - temp[index] = ["all", "mabes", "polda", "international"]; - setFileCheckedLevels((prevLevels) => { - const newArray = [...prevLevels]; - const currentFileLevels = new Set( - newArray[index] || new Set() - ); - listDest.forEach((item: any) => { - currentFileLevels.add(Number(item.id)); - if (item.subDestination) { - item.subDestination.forEach((sub: any) => { - currentFileLevels.add(Number(sub.id)); - }); - } - }); - newArray[index] = currentFileLevels; - return newArray; - }); - setFileUnitSelections((prevSelections) => { - const newSelections = [...prevSelections]; - const currentSelection = { ...newSelections[index] }; - currentSelection.nasional = true; - currentSelection.wilayah = true; - currentSelection.international = true; - currentSelection.polda = true; - // currentSelection.polres = true; - currentSelection.satker = true; - currentSelection.semua = true; - - newSelections[index] = currentSelection; - return newSelections; - }); - } else if (placement === "satker") { - const now = temp[index] || []; - if (!now.includes("satker")) { - now.push("satker"); - } - temp[index] = now; - } else { - const now = temp[index] || []; - if (!now.includes(placement)) { - now.push(placement); - } - const nonSatkerItems = now.filter( - (item) => item !== "satker" && item !== "all" - ); - if (nonSatkerItems.length === 3 && !now.includes("all")) { - now.push("all"); - } - temp[index] = now; - } - } else { - if (placement === "all") { - temp[index] = []; - setFileCheckedLevels((prevLevels) => { - const newArray = [...prevLevels]; - const currentFileLevels = new Set( - newArray[index] || new Set() - ); - currentFileLevels.clear(); - - newArray[index] = currentFileLevels; - return newArray; - }); - - // Update fileUnitSelections untuk checkbox tingkat utama - setFileUnitSelections((prevSelections) => { - const newSelections = [...prevSelections]; - const currentSelection = { ...newSelections[index] }; - - // Set semua checkbox tingkat utama ke false - currentSelection.nasional = false; - currentSelection.wilayah = false; - currentSelection.international = false; - currentSelection.polda = false; - // currentSelection.polres = false; - currentSelection.satker = false; - currentSelection.semua = false; - - newSelections[index] = currentSelection; - return newSelections; - }); - } else { - const now = temp[index]?.filter((a) => a !== placement); - console.log("now", now); - temp[index] = now; - if (placement === "wilayah") { - // Ketika wilayah di-uncheck, hapus wilayah, polda, dan satker - const now = temp[index]?.filter( - (a) => a !== "wilayah" && a !== "polda" && a !== "satker" - ); - temp[index] = now; - } else if (placement === "polda") { - // Ketika polda di-uncheck, hapus polda dari filePlacements - const now = temp[index]?.filter((a) => a !== "polda"); - temp[index] = now; - } else if (placement === "satker") { - // Ketika satker di-uncheck, hapus satker dari filePlacements - const now = temp[index]?.filter((a) => a !== "satker"); - temp[index] = now; - } else { - const now = temp[index]?.filter((a) => a !== placement); - temp[index] = now; - } - - // Hapus "all" jika tidak semua item ter-checklist - if (now.includes("all")) { - const nonSatkerItems = now.filter( - (item) => item !== "satker" && item !== "all" - ); - if (nonSatkerItems.length < 3) { - const newData = now.filter((b) => b !== "all"); - temp[index] = newData; - } - } - } - } - setFilePlacements(temp); - - // Update checklist levels di modal berdasarkan placement yang diubah - updateModalChecklistLevels(index, placement, checked); - }; - const updateModalChecklistLevels = ( - fileIndex: number, - placement: string, - checked: boolean - ) => { - if (!listDest || listDest.length === 0) return; - - setFileCheckedLevels((prev) => { - const newArray = [...prev]; - const currentFileLevels = new Set(newArray[fileIndex]); - - if (checked) { - if (placement === "polda") { - // Checklist semua POLDA (bukan SATKER POLRI) - listDest.forEach((item: any) => { - if (item.levelNumber === 2 && item.name !== "SATKER POLRI") { - currentFileLevels.add(Number(item.id)); - } - }); - } else if (placement === "satker") { - // Checklist SATKER POLRI dan semua sub-item di bawahnya - const satkerItem: any = listDest.find( - (item: any) => item.name === "SATKER POLRI" - ); - if (satkerItem) { - currentFileLevels.add(Number(satkerItem.id)); - if (satkerItem.subDestination) { - satkerItem.subDestination.forEach((sub: any) => { - currentFileLevels.add(Number(sub.id)); - }); - } - } - } - } else { - if (placement === "polda") { - // Unchecklist semua POLDA - listDest.forEach((item: any) => { - if (item.levelNumber === 2 && item.name !== "SATKER POLRI") { - currentFileLevels.delete(Number(item.id)); - } - }); - } else if (placement === "satker") { - // Unchecklist SATKER POLRI dan semua sub-item di bawahnya - const satkerItem: any = listDest.find( - (item: any) => item.name === "SATKER POLRI" - ); - if (satkerItem) { - currentFileLevels.delete(Number(satkerItem.id)); - if (satkerItem.subDestination) { - satkerItem.subDestination.forEach((sub: any) => { - currentFileLevels.delete(Number(sub.id)); - }); - } - } - } - } - - newArray[fileIndex] = currentFileLevels; - return newArray; - }); - }; - - // Fungsi untuk update checkbox utama berdasarkan checkbox modal (global/legacy) - const updateMainCheckboxFromModalLegacy = () => { - if (!isUpdatingFromMainCheckbox && listDest.length > 0) { - // Hitung item yang dipilih berdasarkan checkedLevels - const checkedPoldaCount = listDest.filter( - (item: any) => - item.levelNumber === 2 && - item.name !== "SATKER POLRI" && - checkedLevels.has(Number(item.id)) - ).length; - - const satkerItem: any = listDest.find( - (item: any) => item.name === "SATKER POLRI" - ); - const checkedSatkerCount = satkerItem - ? (checkedLevels.has(Number(satkerItem.id)) ? 1 : 0) + - (satkerItem.subDestination?.filter((sub: any) => - checkedLevels.has(Number(sub.id)) - ).length || 0) - : 0; - - // Checkbox aktif jika ADA item yang dipilih dalam kategori tersebut - const hasSelectedPolda = checkedPoldaCount > 0; - const hasSelectedSatker = checkedSatkerCount > 0; - - // Update unitSelection berdasarkan yang dipilih di modal - setUnitSelection((prev) => { - const newState = { ...prev }; - - // Update individual checkboxes - newState.polda = hasSelectedPolda; - newState.satker = hasSelectedSatker; - - // Update checkbox "semua" berdasarkan semua checkbox yang aktif - newState.semua = - newState.nasional && - newState.wilayah && - newState.international && - hasSelectedPolda && - hasSelectedSatker; - - return newState; - }); - } - }; - - const updateMainCheckboxFromModal = (fileIndex: number) => { - setFileUnitSelections((prev) => { - const newSelections = [...prev]; - const currentSelection = { ...newSelections[fileIndex] }; - const currentFileLevels = fileCheckedLevels[fileIndex]; - - if (!currentFileLevels) return prev; - - // Hitung total POLDA yang ada (bukan SATKER POLRI) - const totalPoldaCount = listDest.filter( - (item: any) => item.levelNumber === 2 && item.name !== "SATKER POLRI" - ).length; - - // Hitung berapa banyak POLDA yang ter-checklist (bukan SATKER POLRI) - const checkedPoldaCount = listDest.reduce((total: number, item: any) => { - if ( - item.levelNumber === 2 && - item.name !== "SATKER POLRI" && - currentFileLevels.has(Number(item.id)) - ) { - return total + 1; - } - return total; - }, 0); - - // Cek apakah SATKER POLRI ter-checklist - const satkerItem = listDest.find( - (item: any) => item.name === "SATKER POLRI" - ); - const isSatkerChecked = - satkerItem && currentFileLevels.has(Number(satkerItem.id)); - - // Update checkbox berdasarkan kondisi - // POLDA aktif jika ada minimal 1 POLDA ter-checklist - currentSelection.polda = checkedPoldaCount > 0; - currentSelection.satker = Boolean(isSatkerChecked); - - // Update checkbox "semua" berdasarkan semua checkbox yang aktif - currentSelection.semua = - currentSelection.nasional && - currentSelection.wilayah && - currentSelection.international && - currentSelection.polda && - currentSelection.satker; - - newSelections[fileIndex] = currentSelection; - return newSelections; - }); - }; - - const toggleExpand = (id: number) => { - setExpandedPolda((prev) => ({ - ...prev, - [id]: !prev[id], - })); - }; - - const handleFileCheckboxChangePlacement = ( - fileIndex: number, - levelId: number - ) => { - setFileCheckedLevels((prev) => { - const newArray = [...prev]; - const currentFileLevels = new Set(newArray[fileIndex]); - const isCurrentlyChecked = currentFileLevels.has(levelId); - - if (isCurrentlyChecked) { - currentFileLevels.delete(levelId); - - // Jika ini adalah POLDA yang di-unchecklist, unchecklist juga semua polres di bawahnya - const poldaItem = listDest.find( - (item: any) => Number(item.id) === levelId - ) as any; - if ( - poldaItem && - poldaItem.subDestination && - poldaItem.name !== "SATKER POLRI" - ) { - poldaItem.subDestination.forEach((polres: any) => { - currentFileLevels.delete(Number(polres.id)); - }); - } - - // Jika ini adalah SATKER POLRI yang di-unchecklist, unchecklist juga semua sub-item di bawahnya - if (poldaItem && poldaItem.name === "SATKER POLRI") { - poldaItem.subDestination?.forEach((subItem: any) => { - currentFileLevels.delete(Number(subItem.id)); - }); - } - } else { - currentFileLevels.add(levelId); - - // Jika ini adalah SATKER POLRI yang di-checklist, checklist juga semua sub-item di bawahnya - const satkerItem = listDest.find( - (item: any) => Number(item.id) === levelId - ) as any; - if (satkerItem && satkerItem.name === "SATKER POLRI") { - // Checklist semua sub-item di bawah SATKER POLRI (bukan POLRES) - satkerItem.subDestination?.forEach((subItem: any) => { - currentFileLevels.add(Number(subItem.id)); - }); - } - } - - newArray[fileIndex] = currentFileLevels; - - // Update checkbox utama berdasarkan perubahan di modal - // Pindahkan ke sini agar state sudah ter-update - setTimeout(() => updateMainCheckboxFromModal(fileIndex), 0); - - return newArray; - }); - }; - - const handleSelectAllSubItems = (fileIndex: number, polda: any) => { - setFileCheckedLevels((prev) => { - const newArray = [...prev]; - const currentFileLevels = new Set(newArray[fileIndex]); - - // Cek apakah semua sub-items sudah ter-checklist - const allSubItemsChecked = polda.subDestination?.every((sub: any) => - currentFileLevels.has(Number(sub.id)) - ); - - if (allSubItemsChecked) { - // Jika semua sudah ter-checklist, unchecklist semuanya - polda.subDestination?.forEach((sub: any) => { - currentFileLevels.delete(Number(sub.id)); - }); - } else { - // Jika belum semua ter-checklist, checklist semuanya - // Checklist SATKER POLRI juga jika belum ter-checklist - if (!currentFileLevels.has(Number(polda.id))) { - currentFileLevels.add(Number(polda.id)); - } - // Checklist semua sub-items - polda.subDestination?.forEach((sub: any) => { - currentFileLevels.add(Number(sub.id)); - }); - } - - newArray[fileIndex] = currentFileLevels; - - // Update checkbox utama berdasarkan perubahan di modal - setTimeout(() => updateMainCheckboxFromModal(fileIndex), 0); - - return newArray; - }); - }; - - // Fungsi untuk sinkronisasi checkbox modal dengan checkbox utama - const syncModalWithMainCheckbox = () => { - if (isUpdatingFromMainCheckbox) { - const newCheckedLevels = new Set(checkedLevels); - - // Handle checklist actions - menambahkan semua item ke modal - if (mainCheckboxChangeType === "polda_checked") { - // Checklist semua polda - listDest.forEach((item: any) => { - if (item.levelNumber === 2 && item.name !== "SATKER POLRI") { - newCheckedLevels.add(Number(item.id)); - } - }); - } else if (mainCheckboxChangeType === "satker_checked") { - // Checklist satker - const satkerItem: any = listDest.find( - (item: any) => item.name === "SATKER POLRI" - ); - if (satkerItem) { - newCheckedLevels.add(Number(satkerItem.id)); - // Checklist semua sub-item yang ada di bawah SATKER (bukan POLRES) - if (satkerItem.subDestination) { - satkerItem.subDestination.forEach((sub: any) => { - newCheckedLevels.add(Number(sub.id)); - }); - } - } - } else if (mainCheckboxChangeType === "semua_checked") { - // Checklist semua item - listDest.forEach((item: any) => { - newCheckedLevels.add(Number(item.id)); - // Checklist semua sub-item di bawah setiap item - if (item.subDestination) { - item.subDestination.forEach((sub: any) => { - newCheckedLevels.add(Number(sub.id)); - }); - } - }); - } else if (mainCheckboxChangeType === "polda_unchecked") { - // Clear polda dari checkedLevels, tapi jangan hapus SATKER POLRI - listDest.forEach((item: any) => { - if (item.levelNumber === 2 && item.name !== "SATKER POLRI") { - newCheckedLevels.delete(Number(item.id)); - } - }); - } else if (mainCheckboxChangeType === "satker_unchecked") { - // Clear satker dan semua sub-item di bawahnya dari checkedLevels - const satkerItem: any = listDest.find( - (item: any) => item.name === "SATKER POLRI" - ); - if (satkerItem) { - newCheckedLevels.delete(Number(satkerItem.id)); - if (satkerItem.subDestination) { - satkerItem.subDestination.forEach((sub: any) => { - newCheckedLevels.delete(Number(sub.id)); - }); - } - } - } else if (mainCheckboxChangeType === "semua_unchecked") { - // Clear semua - newCheckedLevels.clear(); - } - - setCheckedLevels(newCheckedLevels); - - // Reset flag setelah sinkronisasi selesai - setIsUpdatingFromMainCheckbox(false); - setMainCheckboxChangeType(""); - } - }; - - const toFileId = (f: any): string => String(f?.id ?? ""); - const ensureFileUnit = (fid: any) => { - setFileUnitSelections((prev) => { - if (prev[fid]) return prev; - return { - ...prev, - [fid]: { - semua: false, - nasional: false, - wilayah: false, - international: false, - polda: false, - satker: false, - }, - }; - }); - }; - const ensureFilePlacement = (fid: any) => { - setFilePlacements((prev) => (prev[fid] ? prev : { ...prev, [fid]: [] })); - }; - const ensureFileCheckedLevels = (fid: any) => { - setFileCheckedLevels((prev) => - prev[fid] ? prev : { ...prev, [fid]: new Set() } - ); - }; - - const buildPlacementsPayload = () => { - return files.map((file, index) => { - const fid = index; - - const levelSet = fileCheckedLevels[fid] - ? Array.from(fileCheckedLevels[fid]) - : []; - - const unit = fileUnitSelections[fid] || { - nasional: false, - wilayah: false, - international: false, - polda: false, - satker: false, - semua: false, - }; - - let placements: string[] = []; - - if (unit.nasional) placements.push("mabes"); - // if (unit.wilayah) placements.push("polda"); - if (unit.international) placements.push("international"); - if (unit.polda) placements.push("polda"); - if (unit.satker) placements.push("satker"); - - placements = Array.from(new Set(placements)); - - return { - mediaFileId: file.contentId, - placements: placements.join(","), // ✅ contoh: "polda,satker" - customLocationPlacements: levelSet.join(","), // ✅ contoh: "219,220,..." - }; - }); - }; - - const handleGlobalPlacement = ( - type: "semua" | "nasional" | "wilayah" | "international", - checked: boolean - ) => { - const count = files.length; - - // helper untuk ambil semua id POLDA + SATKER + sub - const getAllLevelIds = () => { - const set = new Set(); - listDest.forEach((d: any) => { - if (d?.id != null) set.add(Number(d.id)); - d?.subDestination?.forEach((sub: any) => { - if (sub?.id != null) set.add(Number(sub.id)); - }); - }); - return set; - }; - - // atur visibilitas panel detail wilayah - if ((type === "wilayah" || type === "semua") && checked) { - setIsDetailOfRegionShowed(true); - } - if (type === "semua" && !checked) { - setIsDetailOfRegionShowed(false); - } - - // ======= fileUnitSelections (checkbox per-bar isian) ======= - setFileUnitSelections( - Array.from({ length: count }, () => { - if (type === "semua") { - // ✅ AllSemua menyalakan SEMUA checkbox - return { - semua: checked, - nasional: checked, - wilayah: checked, - international: checked, - polda: checked, - satker: checked, - }; - } - if (type === "nasional") { - return { - semua: false, - nasional: checked, - wilayah: false, - international: false, - polda: false, - satker: false, - }; - } - if (type === "wilayah") { - return { - semua: false, - nasional: false, - wilayah: checked, - international: false, - polda: checked, // wilayah mengaktifkan polda - satker: checked, // dan satker - }; - } - // type === "international" - return { - semua: false, - nasional: false, - wilayah: false, - international: checked, - polda: false, - satker: false, - }; - }) - ); - - // ======= fileCheckedLevels (customLocationPlacements) ======= - setFileCheckedLevels( - Array.from({ length: count }, () => { - // AllSemua atau AllWilayah: checklist semua level - if (checked && (type === "semua" || type === "wilayah")) { - return getAllLevelIds(); - } - // lainnya: kosongkan (tidak memilih level spesifik) - return new Set(); - }) - ); - - // ======= (opsional) sinkron UI lain yang masih pakai filePlacements ======= - setFilePlacements( - Array.from({ length: count }, () => { - if (!checked) return []; - if (type === "semua") { - return ["all", "mabes", "polda", "international", "satker"]; - } - if (type === "nasional") { - return ["mabes"]; - } - if (type === "wilayah") { - return ["polda", "satker"]; - } - // international - return ["international"]; - }) - ); - }; - return (
{/* Header */} @@ -2024,8 +1125,8 @@ export default function FormConvertSPIT() { - handleGlobalPlacement( - option.value as any, + handleSelectAllPlacements( + option.value, Boolean(checked) ) } @@ -2069,344 +1170,7 @@ export default function FormConvertSPIT() { file.contentFileName || `File ${file.contentId}`}

-
- {/*
- - Pengaturan Distribusi -
*/} - - {/* Checkbox Tingkat Utama */} -
-
- {[ - { key: "semua", label: "Semua" }, - { - key: "nasional", - label: "Nasional", - }, - { key: "wilayah", label: "Wilayah" }, - { - key: "international", - label: "Internasional", - }, - ].map((item, idx) => ( -
- { - handleFileUnitChange( - index, - item.key as keyof typeof unitSelection, - value as boolean - ); - setupPlacement( - index, - item.key, - Boolean(value) - ); - }} - /> - -
- ))} -
- - {/* Detail Wilayah */} - {fileUnitSelections[index]?.wilayah && - isDetailOfRegionShowed && ( -
-

- Detail Wilayah: -

- - {/* Checkbox Sub-kategori dengan tombol Kustom sejajar */} -
- {[ - { key: "polda", label: "POLDA" }, - { - key: "satker", - label: "SATKER", - }, - ].map((item, idx) => ( -
- { - handleFileUnitChange( - index, - item.key as keyof typeof unitSelection, - value as boolean - ); - setupPlacement( - index, - item.key, - Boolean(value) - ); - }} - /> - -
- ))} - - {/* Tombol Kustom sejajar dengan checkbox */} -
- - - - - - - - Daftar Wilayah POLDA dan - SATKER - - -
- {listDest.map( - (polda: any) => ( -
- {/* Header POLDA */} -
- - {/* Tombol expand hanya untuk SATKER POLRI */} - {polda.name === - "SATKER POLRI" && - polda.subDestination && ( - - )} -
- - {/* Sub-items hanya untuk SATKER POLRI */} - {polda.name === - "SATKER POLRI" && - polda.subDestination && - expandedPolda[ - polda.id - ] && ( -
- {/* Tombol Pilih Semua untuk sub-items */} -
- {(() => { - const allSubItemsChecked = - polda.subDestination?.every( - ( - sub: any - ) => - fileCheckedLevels[ - index - ]?.has( - Number( - sub.id - ) - ) - ); - return ( - - ); - })()} -
-
- {polda.subDestination.map( - ( - sub: any - ) => ( - - ) - )} -
-
- )} -
- ) - )} -
-
- - - - - - -
- - -
-
-
- )} -
-
- - {/*
+
{PLACEMENT_OPTIONS.map((option) => (
))} -
*/} +
))} @@ -2608,6 +1372,2617 @@ export default function FormConvertSPIT() { ); } +// {spit with new layout file placements} +// "use client"; +// import React, { ChangeEvent, useEffect, useRef, useState } from "react"; +// import { useForm, Controller } from "react-hook-form"; +// import { zodResolver } from "@hookform/resolvers/zod"; +// import * as z from "zod"; +// import { useParams, useRouter } from "next/navigation"; +// import { useTranslations } from "next-intl"; +// import dynamic from "next/dynamic"; +// import Cookies from "js-cookie"; +// import { Input } from "@/components/ui/input"; +// import { Button } from "@/components/ui/button"; +// import { Label } from "@/components/ui/label"; +// import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; +// import { Badge } from "@/components/ui/badge"; +// import { Alert, AlertDescription } from "@/components/ui/alert"; +// import { +// Select, +// SelectContent, +// SelectItem, +// SelectTrigger, +// SelectValue, +// } from "@/components/ui/select"; +// import { Checkbox } from "@/components/ui/checkbox"; +// import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group"; +// import { +// AlertCircle, +// FileText, +// Image, +// Loader2, +// Save, +// Trash2, +// Edit3, +// Globe, +// Users, +// Tag, +// Eye, +// Settings, +// CheckCircle, +// XCircle, +// } from "lucide-react"; +// import { Swiper, SwiperSlide } from "swiper/react"; +// import { Swiper as SwiperType } from "swiper"; +// import "swiper/css"; +// import "swiper/css/free-mode"; +// import "swiper/css/navigation"; +// import "swiper/css/pagination"; +// import "swiper/css/thumbs"; +// import { FreeMode, Navigation, Pagination, Thumbs } from "swiper/modules"; +// import { +// convertSPIT, +// deleteSPIT, +// detailSPIT, +// getTagsBySubCategoryId, +// listEnableCategory, +// listEnableCategoryNew, +// updateFilePlacements, +// } from "@/service/content/content"; +// import { generateDataRewrite, getDetailArticle } from "@/service/content/ai"; +// import { getCookiesDecrypt } from "@/lib/utils"; +// import { error } from "@/lib/swal"; +// import Swal from "sweetalert2"; +// import withReactContent from "sweetalert2-react-content"; +// import { close, loading } from "@/config/swal"; +// import { +// Dialog, +// DialogClose, +// DialogContent, +// DialogHeader, +// DialogTitle, +// DialogTrigger, +// } from "@/components/ui/dialog"; +// import { Icon } from "@/components/ui/icon"; +// import { getUserLevelForAssignments } from "@/service/task"; + +// interface Category { +// id: number; +// name: string; +// } + +// interface Detail { +// id: string; +// contentTitle: string; +// contentDescription: string; +// slug: string; +// content: { +// id: number; +// name: string; +// }; +// contentCreator: string; +// creatorName: string; +// contentThumbnail: string; +// contentTag: string; +// categoryId?: number; +// contentList?: FileType[]; // keep as FileType[] +// } + +// interface Option { +// id: string; +// label: string; +// } + +// interface Destination { +// id: string; +// name: string; +// subDestination?: SubDestination[]; +// } + +// interface SubDestination { +// id: string; +// name: string; +// } + +// type PlacementType = +// | "all" +// | "mabes" +// | "polda" +// | "international" +// | "wilayah" +// | "nasional" +// | "satker" +// | string; + +// interface TempFileItem { +// id: number | string; +// } + +// // Updated FileType to reflect API response +// interface FileType { +// contentId: number; +// contentFile: string; // URL +// contentType: "IMAGE" | "VIDEO" | string; +// contentFileRawType?: string; // e.g. video/mp4 or image/jpeg +// contentFileName?: string | null; +// thumbnailFileUrl?: string | null; +// fileName?: string | null; +// } + +// interface PlacementData { +// mediaFileId: number; +// placements: string; +// } + +// // Schema +// const formSchema = z.object({ +// contentTitle: z.string().min(1, { message: "Judul diperlukan" }), +// contentDescription: z.string().optional(), +// contentRewriteDescription: z.string().optional(), +// contentCreator: z.string().min(1, { message: "Creator diperlukan" }), +// }); + +// type FormData = z.infer; + +// // Constants +// const PUBLISH_OPTIONS: Option[] = [ +// { id: "all", label: "SEMUA" }, +// { id: "5", label: "UMUM" }, +// { id: "6", label: "JOURNALIS" }, +// { id: "7", label: "POLRI" }, +// { id: "8", label: "KSP" }, +// ]; + +// const WRITING_STYLES = [ +// { value: "friendly", label: "Friendly" }, +// { value: "professional", label: "Profesional" }, +// { value: "informational", label: "Informational" }, +// { value: "neutral", label: "Neutral" }, +// { value: "witty", label: "Witty" }, +// ]; + +// const PLACEMENT_OPTIONS = [ +// { value: "semua", label: "Semua" }, +// { value: "nasional", label: "Nasional" }, +// { value: "wilayah", label: "Wilayah" }, +// { value: "international", label: "Internasional" }, +// ]; + +// // Dynamic imports +// const CustomEditor = dynamic( +// () => import("@/components/editor/custom-editor"), +// { +// ssr: false, +// loading: () => ( +//
+// +// Loading editor... +//
+// ), +// } +// ); + +// export default function FormConvertSPIT() { +// const MySwal = withReactContent(Swal); +// const router = useRouter(); +// const t = useTranslations("Form"); +// const { id } = useParams() as { id: string }; +// const [isAlreadySaved, setIsAlreadySaved] = useState(false); +// const { +// control, +// handleSubmit, +// setValue, +// formState: { errors, isSubmitting }, +// watch, +// } = useForm({ +// resolver: zodResolver(formSchema), +// defaultValues: { +// contentTitle: "", +// contentDescription: "", +// contentCreator: "", +// contentRewriteDescription: "", +// }, +// }); + +// // Component state +// const [isLoading, setIsLoading] = useState(true); +// const [isSaving, setIsSaving] = useState(false); +// const [isDeleting, setIsDeleting] = useState(false); +// const [detail, setDetail] = useState(null); +// const [categories, setCategories] = useState([]); +// const [selectedCategoryId, setSelectedCategoryId] = useState( +// null +// ); +// const [selectedFileType, setSelectedFileType] = useState< +// "original" | "rewrite" +// >("original"); +// const [selectedWritingStyle, setSelectedWritingStyle] = +// useState("professional"); +// const [showRewriteEditor, setShowRewriteEditor] = useState(false); +// const [isGeneratingRewrite, setIsGeneratingRewrite] = useState(false); +// const [isLoadingRewrite, setIsLoadingRewrite] = useState(false); +// // <-- changed: detailThumb is now FileType[] (objects from API) --> +// const [detailThumb, setDetailThumb] = useState([]); +// const [thumbsSwiper, setThumbsSwiper] = useState(null); +// const [files, setFiles] = useState([]); +// const [filePlacements, setFilePlacements] = useState([]); +// const [articleIds, setArticleIds] = useState([]); +// const [selectedArticleId, setSelectedArticleId] = useState( +// null +// ); +// const [articleBody, setArticleBody] = useState(""); +// const [tags, setTags] = useState([]); +// const [publishedFor, setPublishedFor] = useState([]); +// const [inputRef] = useState(useRef(null)); +// const userLevelId = getCookiesDecrypt("ulie"); +// const roleId = getCookiesDecrypt("urie"); +// const [isUserMabesApprover, setIsUserMabesApprover] = useState(false); +// const [fileUnitSelections, setFileUnitSelections] = useState< +// Array<{ +// semua: boolean; +// nasional: boolean; +// wilayah: boolean; +// international: boolean; +// polda: boolean; +// satker: boolean; +// }> +// >([]); +// const [unitSelection, setUnitSelection] = useState({ +// semua: false, +// nasional: false, +// wilayah: false, +// international: false, +// polda: false, +// satker: false, +// }); +// const [fileCheckedLevels, setFileCheckedLevels] = useState< +// Array> +// >([]); +// const [listDest, setListDest] = useState([]); +// const [isDetailOfRegionShowed, setIsDetailOfRegionShowed] = useState(false); +// const [isUpdatingFromMainCheckbox, setIsUpdatingFromMainCheckbox] = +// useState(false); +// const [mainCheckboxChangeType, setMainCheckboxChangeType] = +// useState(""); +// const [checkedLevels, setCheckedLevels] = useState>(new Set()); +// const [expandedPolda, setExpandedPolda] = useState>( +// {} +// ); + +// useEffect(() => { +// async function fetchPoldaPolres() { +// setIsLoading(true); +// try { +// const response = await getUserLevelForAssignments(); +// setListDest(response?.data?.data.list); +// const initialExpandedState = response?.data?.data.list.reduce( +// (acc: any, polda: any) => { +// acc[polda.id] = false; +// return acc; +// }, +// {} +// ); +// setExpandedPolda(initialExpandedState); +// console.log("polres", initialExpandedState); +// } catch (error) { +// console.error("Error fetching Polda/Polres data:", error); +// } finally { +// setIsLoading(false); +// } +// } +// fetchPoldaPolres(); +// }, []); + +// // useEffect untuk sinkronisasi checkbox modal dengan checkbox utama +// useEffect(() => { +// if ( +// listDest.length > 0 && +// isUpdatingFromMainCheckbox && +// mainCheckboxChangeType +// ) { +// syncModalWithMainCheckbox(); +// } +// }, [isUpdatingFromMainCheckbox, mainCheckboxChangeType]); + +// // useEffect untuk update checkbox utama ketika pilihan modal berubah +// useEffect(() => { +// if (!isUpdatingFromMainCheckbox && listDest.length > 0) { +// updateMainCheckboxFromModalLegacy(); +// } +// }, [checkedLevels, isUpdatingFromMainCheckbox]); + +// useEffect(() => { +// initializeComponent(); +// }, []); + +// useEffect(() => { +// checkUserPermissions(); +// }, [userLevelId, roleId]); + +// // Handle Swiper re-initialization when detailThumb changes +// useEffect(() => { +// if (thumbsSwiper && detailThumb.length > 0) { +// thumbsSwiper.update(); +// } +// }, [detailThumb, thumbsSwiper]); + +// const initializeComponent = async () => { +// try { +// setIsLoading(true); +// await Promise.all([ +// loadCategories(), +// id ? loadDetail() : Promise.resolve(), +// ]); +// } catch (error) { +// console.error("Failed to initialize component:", error); +// MySwal.fire({ +// title: "Error", +// text: "Failed to load data. Please try again.", +// icon: "error", +// confirmButtonColor: "#3085d6", +// }); +// } finally { +// setIsLoading(false); +// } +// }; + +// const checkUserPermissions = () => { +// if (userLevelId === "216" && roleId === "3") { +// setIsUserMabesApprover(true); +// } +// }; + +// const loadCategories = async () => { +// try { +// const response = await listEnableCategoryNew("1", true); +// const categories = response?.data?.data?.content || []; +// setCategories(categories); + +// const scheduleId = Cookies.get("scheduleId"); +// const scheduleType = Cookies.get("scheduleType"); + +// if (scheduleId && scheduleType === "3") { +// const persRilisCategory = categories.find((cat: Category) => +// cat.name.toLowerCase().includes("pers rilis") +// ); +// if (persRilisCategory) { +// setSelectedCategoryId(persRilisCategory.id); +// await loadTags(persRilisCategory.id); +// } +// } +// } catch (error) { +// console.error("Failed to load categories:", error); +// } +// }; + +// const loadTags = async (categoryId: number) => { +// try { +// const response = await getTagsBySubCategoryId(categoryId); +// if (response?.data?.data?.length > 0) { +// const apiTags = response?.data?.data?.map((tag: any) => tag.tagName); +// const tagsMerge = Array.from(new Set([...tags, ...apiTags])); +// setTags(tagsMerge); +// } +// } catch (error) { +// console.error("Failed to load tags:", error); +// } +// }; + +// const loadDetail = async () => { +// loading(); +// try { +// const response = await detailSPIT(id); +// const details = response?.data?.data; +// setIsAlreadySaved(details?.isPublish ? true : false); + +// if (!details) { +// throw new Error("Detail not found"); +// } + +// setDetail(details); + +// const contentList: FileType[] = (details.contentList || []).map( +// (it: any) => ({ +// contentId: it.contentId, +// contentFile: it.contentFile, +// contentType: it.contentType, +// contentFileRawType: it.contentFileRawType, +// contentFileName: it.contentFileName, +// thumbnailFileUrl: it.thumbnailFileUrl || null, +// fileName: it.contentFileName || null, +// }) +// ); + +// setFiles(contentList); +// setDetailThumb(contentList); + +// const fileCount = contentList.length || 0; +// setFilePlacements(Array(fileCount).fill([])); + +// setValue("contentTitle", details.contentTitle || ""); +// setValue("contentDescription", details.contentDescription || ""); +// setValue("contentCreator", details.contentCreator || ""); +// setValue( +// "contentRewriteDescription", +// (details as any).contentRewriteDescription || "" +// ); + +// if (details.categoryId) { +// setSelectedCategoryId(details.categoryId); +// await loadTags(details.categoryId); +// } + +// if (details.contentTag) { +// const contentTags = details.contentTag +// .split(",") +// .map((tag: string) => tag.trim()); +// setTags((prev) => Array.from(new Set([...prev, ...contentTags]))); +// } +// } catch (error) { +// console.error("Failed to load detail:", error); +// throw error; +// } +// close(); +// }; + +// const handleCategoryChange = async (categoryId: string) => { +// const id = Number(categoryId); +// setSelectedCategoryId(id); +// await loadTags(id); +// }; + +// const handleRewriteClick = async () => { +// if (!detail?.contentDescription) { +// MySwal.fire({ +// title: "Warning", +// text: "Please add content description first", +// icon: "warning", +// confirmButtonColor: "#3085d6", +// }); +// return; +// } + +// try { +// setIsGeneratingRewrite(true); +// const request = { +// style: selectedWritingStyle, +// lang: "id", +// contextType: "text", +// urlContext: null, +// context: detail.contentDescription, +// createdBy: roleId, +// sentiment: "Humorous", +// clientId: "7QTW8cMojyayt6qnhqTOeJaBI70W4EaQ", +// }; + +// const response = await generateDataRewrite(request); +// console.log("REWRITE RESPONSE:", response); + +// if (response?.error) { +// throw new Error(response.message); +// } + +// const newArticleId = response?.data?.data?.id; +// setArticleIds((prev) => { +// const updated = [...prev]; +// if (updated.length < 3) { +// updated.push(newArticleId); +// } else { +// updated[2] = newArticleId; +// } +// return updated; +// }); + +// setShowRewriteEditor(true); +// MySwal.fire({ +// title: "Success", +// text: "Content rewrite generated successfully", +// icon: "success", +// confirmButtonColor: "#3085d6", +// }); +// } catch (error) { +// console.error("Failed to generate rewrite:", error); +// MySwal.fire({ +// title: "Error", +// text: "Failed to generate content rewrite", +// icon: "error", +// confirmButtonColor: "#3085d6", +// }); +// } finally { +// setIsGeneratingRewrite(false); +// } +// }; + +// const handleArticleSelect = async (articleId: string) => { +// try { +// setIsLoadingRewrite(true); +// setSelectedArticleId(articleId); + +// let retryCount = 0; +// const maxRetries = 20; + +// while (retryCount < maxRetries) { +// const response = await getDetailArticle(articleId); +// const articleData = response?.data?.data; + +// if (articleData?.status === 2) { +// const cleanArticleBody = articleData.articleBody?.replace( +// /]*>/g, +// "" +// ); +// setArticleBody(cleanArticleBody || ""); +// setValue("contentRewriteDescription", cleanArticleBody || ""); +// break; +// } + +// retryCount++; +// await new Promise((resolve) => setTimeout(resolve, 5000)); +// } + +// if (retryCount >= maxRetries) { +// throw new Error("Timeout: Article processing took too long"); +// } +// } catch (error) { +// console.error("Failed to load article:", error); +// MySwal.fire({ +// title: "Error", +// text: "Failed to load article content", +// icon: "error", +// confirmButtonColor: "#3085d6", +// }); +// } finally { +// setIsLoadingRewrite(false); +// } +// }; + +// const handleAddTag = (e: React.KeyboardEvent) => { +// if (e.key === "Enter" && inputRef.current?.value.trim()) { +// e.preventDefault(); +// const newTag = inputRef.current.value.trim(); + +// if (!tags.includes(newTag)) { +// setTags((prev) => [...prev, newTag]); +// } + +// inputRef.current.value = ""; +// } +// }; + +// const handleRemoveTag = (index: number) => { +// setTags((prev) => prev.filter((_, i) => i !== index)); +// }; + +// const handlePublishTargetChange = (optionId: string) => { +// if (optionId === "all") { +// setPublishedFor((prev) => +// prev.length === PUBLISH_OPTIONS.filter((opt) => opt.id !== "all").length +// ? [] +// : PUBLISH_OPTIONS.filter((opt) => opt.id !== "all").map( +// (opt) => opt.id +// ) +// ); +// } else { +// setPublishedFor((prev) => +// prev.includes(optionId) +// ? prev.filter((id) => id !== optionId && id !== "all") +// : [...prev.filter((id) => id !== "all"), optionId] +// ); +// } +// }; + +// const handleFilePlacementChange = ( +// fileIndex: number, +// placement: string, +// checked: boolean +// ) => { +// setFilePlacements((prev) => { +// const updated = [...prev]; +// const currentPlacements = updated[fileIndex] || []; + +// if (checked) { +// if (placement === "all") { +// updated[fileIndex] = ["all", "mabes", "polda", "international"]; +// } else { +// const newPlacements = [...currentPlacements, placement]; +// if (newPlacements.length === 3 && !newPlacements.includes("all")) { +// newPlacements.push("all"); +// } +// updated[fileIndex] = newPlacements; +// } +// } else { +// if (placement === "all") { +// updated[fileIndex] = []; +// } else { +// const newPlacements = currentPlacements.filter( +// (p) => p !== placement +// ); +// if (newPlacements.length === 3 && newPlacements.includes("all")) { +// updated[fileIndex] = newPlacements.filter((p) => p !== "all"); +// } else { +// updated[fileIndex] = newPlacements; +// } +// } +// } + +// return updated; +// }); +// }; + +// const handleSelectAllPlacements = (placement: string, checked: boolean) => { +// setFilePlacements((prev) => +// prev.map((filePlacements) => +// checked +// ? Array.from(new Set([...filePlacements, placement])) +// : filePlacements.filter((p) => p !== placement) +// ) +// ); +// }; + +// const getPlacementData = () => { +// return files.map((file, index) => { +// const fid = index; + +// // ✅ LEVEL CHECKBOX (POLDA, SATKER, dst.) +// const levelSet = fileCheckedLevels[fid] +// ? Array.from(fileCheckedLevels[fid]) +// : []; + +// // ✅ PLACEMENTS UTAMA (nasional, wilayah, international) +// const unit = fileUnitSelections[fid] || { +// nasional: false, +// wilayah: false, +// international: false, +// polda: false, +// satker: false, +// semua: false, +// }; + +// let placements: string[] = []; + +// // ✅ Map utama +// if (unit.nasional) placements.push("mabes"); +// // if (unit.wilayah) placements.push("polda"); +// if (unit.international) placements.push("international"); +// if (unit.polda) placements.push("polda"); +// if (unit.satker) placements.push("satker"); + +// placements = Array.from(new Set(placements)); + +// return { +// mediaFileId: file.contentId, +// placements: placements.join(","), // ✅ "polda,satker" +// customLocationPlacements: levelSet.join(","), // ✅ "219,220,221,..." +// }; +// }); +// }; + +// const checkPlacement = (data: any) => { +// let temp = true; +// for (const element of data) { +// if (element.length < 1) { +// temp = false; +// break; +// } +// } + +// return temp; +// }; + +// const onSubmit = async (data: FormData) => { +// const pnmhTags = tags.filter((tag) => tag.toLowerCase().includes("pnmh")); + +// if (pnmhTags.length > 1) { +// MySwal.fire({ +// title: "Error", +// text: "Tags penugasan hanya diperbolehkan 1 (satu) saja.", +// icon: "error", +// confirmButtonColor: "#3085d6", +// }); +// return false; +// } + +// // if (!checkPlacement(filePlacements)) { +// // error("Select File Placement"); +// // return false; +// // } + +// if (!selectedCategoryId) { +// error("Select a category"); +// return false; +// } + +// if (publishedFor.length < 1) { +// error("Select Publish Target"); +// return false; +// } + +// try { +// setIsSaving(true); + +// const description = +// selectedFileType === "original" +// ? data.contentDescription +// : data.contentRewriteDescription; + +// const requestData = { +// spitId: id, +// title: data.contentTitle, +// description, +// htmlDescription: description, +// tags: tags.join(", "), +// categoryId: selectedCategoryId, +// publishedFor: publishedFor.join(","), +// creator: data.contentCreator, +// files: getPlacementData(), +// }; + +// await convertSPIT(requestData); + +// // update placements (CRITICAL) +// const placementsPayload = buildPlacementsPayload(); +// const responseFilePlacements = await updateFilePlacements( +// placementsPayload +// ); +// if (responseFilePlacements?.error) { +// close(); +// error(responseFilePlacements?.message); +// return false; +// } + +// MySwal.fire({ +// title: "Success", +// text: "Data saved successfully", +// icon: "success", +// confirmButtonColor: "#3085d6", +// }).then(() => { +// loadDetail(); +// }); +// } catch (error) { +// console.error("Failed to save:", error); +// MySwal.fire({ +// title: "Error", +// text: "Failed to save data", +// icon: "error", +// confirmButtonColor: "#3085d6", +// }); +// } finally { +// setIsSaving(false); +// } + +// handleFileUnitChange; +// }; + +// const handleDelete = async () => { +// const result = await MySwal.fire({ +// title: "Delete Content", +// text: "Are you sure you want to delete this content?", +// icon: "warning", +// showCancelButton: true, +// confirmButtonColor: "#dc3545", +// cancelButtonColor: "#6c757d", +// confirmButtonText: "Delete", +// cancelButtonText: "Cancel", +// }); + +// if (result.isConfirmed) { +// try { +// setIsDeleting(true); +// await deleteSPIT(id); + +// MySwal.fire({ +// title: "Success", +// text: "Content deleted successfully", +// icon: "success", +// confirmButtonColor: "#3085d6", +// }).then(() => { +// router.back(); +// }); +// } catch (error) { +// console.error("Failed to delete:", error); +// MySwal.fire({ +// title: "Error", +// text: "Failed to delete content", +// icon: "error", +// confirmButtonColor: "#3085d6", +// }); +// } finally { +// setIsDeleting(false); +// } +// } +// }; + +// // Loading state +// if (isLoading) { +// return ( +//
+//
+// +//

Loading form data...

+//
+//
+// ); +// } + +// const handleFileUnitChange = ( +// fileIndex: number, +// key: keyof typeof unitSelection, +// value: boolean +// ) => { +// setFileUnitSelections((prev) => { +// const newSelections = [...prev]; +// const currentSelection = { ...newSelections[fileIndex] }; + +// if (key === "semua") { +// // Jika klik Semua, set semua value ke true/false +// currentSelection.semua = value; +// currentSelection.nasional = value; +// currentSelection.wilayah = value; +// currentSelection.international = value; +// currentSelection.polda = value; +// currentSelection.satker = value; + +// // Update fileCheckedLevels untuk sinkronisasi dengan modal +// setFileCheckedLevels((prevLevels) => { +// const newArray = [...prevLevels]; +// const currentFileLevels = new Set( +// newArray[fileIndex] || new Set() +// ); + +// if (value) { +// // Checklist semua item di modal +// listDest.forEach((item: any) => { +// currentFileLevels.add(Number(item.id)); +// if (item.subDestination) { +// item.subDestination.forEach((sub: any) => { +// currentFileLevels.add(Number(sub.id)); +// }); +// } +// }); +// } else { +// // Unchecklist semua item di modal +// currentFileLevels.clear(); +// } + +// newArray[fileIndex] = currentFileLevels; +// return newArray; +// }); +// } else { +// // Jika wilayah dicentang, auto centang POLDA, SATKER +// if (key === "wilayah") { +// currentSelection.wilayah = value; +// setIsDetailOfRegionShowed(value); + +// if (value) { +// // Ketika wilayah dicentang, auto centang POLDA, SATKER +// currentSelection.polda = true; +// currentSelection.satker = true; + +// // Update fileCheckedLevels untuk mengisi semua POLDA dan SATKER POLRI ketika wilayah dicentang +// setFileCheckedLevels((prevLevels) => { +// const newArray = [...prevLevels]; +// const currentFileLevels = new Set( +// newArray[fileIndex] || new Set() +// ); + +// // Checklist semua POLDA di modal +// listDest.forEach((item: any) => { +// if (item.levelNumber === 2 && item.name !== "SATKER POLRI") { +// currentFileLevels.add(Number(item.id)); +// } +// }); + +// // Checklist SATKER POLRI dan semua sub-itemsnya +// const satkerItem = listDest.find( +// (item: any) => item.name === "SATKER POLRI" +// ); +// if (satkerItem) { +// currentFileLevels.add(Number(satkerItem.id)); +// // Checklist semua sub-items di bawah SATKER POLRI +// if (satkerItem.subDestination) { +// satkerItem.subDestination.forEach((sub: any) => { +// currentFileLevels.add(Number(sub.id)); +// }); +// } +// } + +// newArray[fileIndex] = currentFileLevels; +// return newArray; +// }); +// } else { +// // Ketika wilayah di-uncheck, uncheck POLDA, SATKER dan hapus data POLDA dari fileCheckedLevels +// currentSelection.polda = false; +// currentSelection.satker = false; + +// // Update fileCheckedLevels untuk menghapus semua POLDA dan SATKER POLRI ketika wilayah di-uncheck +// setFileCheckedLevels((prevLevels) => { +// const newArray = [...prevLevels]; +// const currentFileLevels = new Set( +// newArray[fileIndex] || new Set() +// ); + +// // Hapus semua POLDA dari modal +// listDest.forEach((item: any) => { +// if (item.levelNumber === 2 && item.name !== "SATKER POLRI") { +// currentFileLevels.delete(Number(item.id)); +// } +// }); + +// // Hapus SATKER POLRI dan semua sub-itemsnya +// const satkerItem = listDest.find( +// (item: any) => item.name === "SATKER POLRI" +// ); +// if (satkerItem) { +// currentFileLevels.delete(Number(satkerItem.id)); +// // Hapus semua sub-items di bawah SATKER POLRI +// if (satkerItem.subDestination) { +// satkerItem.subDestination.forEach((sub: any) => { +// currentFileLevels.delete(Number(sub.id)); +// }); +// } +// } + +// newArray[fileIndex] = currentFileLevels; +// return newArray; +// }); +// } +// } else { +// // Update salah satu saja +// currentSelection[key] = value; +// } + +// // Cek apakah semua selain "semua" sudah dicentang +// const allChecked = [ +// "nasional", +// "wilayah", +// "international", +// "polda", +// "satker", +// ].every((k) => currentSelection[k as keyof typeof unitSelection]); + +// currentSelection.semua = allChecked; +// } + +// newSelections[fileIndex] = currentSelection; +// return newSelections; +// }); +// }; + +// const setupPlacement = ( +// index: number, +// placement: string, +// checked: boolean +// ) => { +// let temp = [...filePlacements]; +// if (checked) { +// if (placement === "all") { +// temp[index] = ["all", "mabes", "polda", "international"]; +// setFileCheckedLevels((prevLevels) => { +// const newArray = [...prevLevels]; +// const currentFileLevels = new Set( +// newArray[index] || new Set() +// ); +// listDest.forEach((item: any) => { +// currentFileLevels.add(Number(item.id)); +// if (item.subDestination) { +// item.subDestination.forEach((sub: any) => { +// currentFileLevels.add(Number(sub.id)); +// }); +// } +// }); +// newArray[index] = currentFileLevels; +// return newArray; +// }); +// setFileUnitSelections((prevSelections) => { +// const newSelections = [...prevSelections]; +// const currentSelection = { ...newSelections[index] }; +// currentSelection.nasional = true; +// currentSelection.wilayah = true; +// currentSelection.international = true; +// currentSelection.polda = true; +// // currentSelection.polres = true; +// currentSelection.satker = true; +// currentSelection.semua = true; + +// newSelections[index] = currentSelection; +// return newSelections; +// }); +// } else if (placement === "satker") { +// const now = temp[index] || []; +// if (!now.includes("satker")) { +// now.push("satker"); +// } +// temp[index] = now; +// } else { +// const now = temp[index] || []; +// if (!now.includes(placement)) { +// now.push(placement); +// } +// const nonSatkerItems = now.filter( +// (item) => item !== "satker" && item !== "all" +// ); +// if (nonSatkerItems.length === 3 && !now.includes("all")) { +// now.push("all"); +// } +// temp[index] = now; +// } +// } else { +// if (placement === "all") { +// temp[index] = []; +// setFileCheckedLevels((prevLevels) => { +// const newArray = [...prevLevels]; +// const currentFileLevels = new Set( +// newArray[index] || new Set() +// ); +// currentFileLevels.clear(); + +// newArray[index] = currentFileLevels; +// return newArray; +// }); + +// // Update fileUnitSelections untuk checkbox tingkat utama +// setFileUnitSelections((prevSelections) => { +// const newSelections = [...prevSelections]; +// const currentSelection = { ...newSelections[index] }; + +// // Set semua checkbox tingkat utama ke false +// currentSelection.nasional = false; +// currentSelection.wilayah = false; +// currentSelection.international = false; +// currentSelection.polda = false; +// // currentSelection.polres = false; +// currentSelection.satker = false; +// currentSelection.semua = false; + +// newSelections[index] = currentSelection; +// return newSelections; +// }); +// } else { +// const now = temp[index]?.filter((a) => a !== placement); +// console.log("now", now); +// temp[index] = now; +// if (placement === "wilayah") { +// // Ketika wilayah di-uncheck, hapus wilayah, polda, dan satker +// const now = temp[index]?.filter( +// (a) => a !== "wilayah" && a !== "polda" && a !== "satker" +// ); +// temp[index] = now; +// } else if (placement === "polda") { +// // Ketika polda di-uncheck, hapus polda dari filePlacements +// const now = temp[index]?.filter((a) => a !== "polda"); +// temp[index] = now; +// } else if (placement === "satker") { +// // Ketika satker di-uncheck, hapus satker dari filePlacements +// const now = temp[index]?.filter((a) => a !== "satker"); +// temp[index] = now; +// } else { +// const now = temp[index]?.filter((a) => a !== placement); +// temp[index] = now; +// } + +// // Hapus "all" jika tidak semua item ter-checklist +// if (now.includes("all")) { +// const nonSatkerItems = now.filter( +// (item) => item !== "satker" && item !== "all" +// ); +// if (nonSatkerItems.length < 3) { +// const newData = now.filter((b) => b !== "all"); +// temp[index] = newData; +// } +// } +// } +// } +// setFilePlacements(temp); + +// // Update checklist levels di modal berdasarkan placement yang diubah +// updateModalChecklistLevels(index, placement, checked); +// }; +// const updateModalChecklistLevels = ( +// fileIndex: number, +// placement: string, +// checked: boolean +// ) => { +// if (!listDest || listDest.length === 0) return; + +// setFileCheckedLevels((prev) => { +// const newArray = [...prev]; +// const currentFileLevels = new Set(newArray[fileIndex]); + +// if (checked) { +// if (placement === "polda") { +// // Checklist semua POLDA (bukan SATKER POLRI) +// listDest.forEach((item: any) => { +// if (item.levelNumber === 2 && item.name !== "SATKER POLRI") { +// currentFileLevels.add(Number(item.id)); +// } +// }); +// } else if (placement === "satker") { +// // Checklist SATKER POLRI dan semua sub-item di bawahnya +// const satkerItem: any = listDest.find( +// (item: any) => item.name === "SATKER POLRI" +// ); +// if (satkerItem) { +// currentFileLevels.add(Number(satkerItem.id)); +// if (satkerItem.subDestination) { +// satkerItem.subDestination.forEach((sub: any) => { +// currentFileLevels.add(Number(sub.id)); +// }); +// } +// } +// } +// } else { +// if (placement === "polda") { +// // Unchecklist semua POLDA +// listDest.forEach((item: any) => { +// if (item.levelNumber === 2 && item.name !== "SATKER POLRI") { +// currentFileLevels.delete(Number(item.id)); +// } +// }); +// } else if (placement === "satker") { +// // Unchecklist SATKER POLRI dan semua sub-item di bawahnya +// const satkerItem: any = listDest.find( +// (item: any) => item.name === "SATKER POLRI" +// ); +// if (satkerItem) { +// currentFileLevels.delete(Number(satkerItem.id)); +// if (satkerItem.subDestination) { +// satkerItem.subDestination.forEach((sub: any) => { +// currentFileLevels.delete(Number(sub.id)); +// }); +// } +// } +// } +// } + +// newArray[fileIndex] = currentFileLevels; +// return newArray; +// }); +// }; + +// // Fungsi untuk update checkbox utama berdasarkan checkbox modal (global/legacy) +// const updateMainCheckboxFromModalLegacy = () => { +// if (!isUpdatingFromMainCheckbox && listDest.length > 0) { +// // Hitung item yang dipilih berdasarkan checkedLevels +// const checkedPoldaCount = listDest.filter( +// (item: any) => +// item.levelNumber === 2 && +// item.name !== "SATKER POLRI" && +// checkedLevels.has(Number(item.id)) +// ).length; + +// const satkerItem: any = listDest.find( +// (item: any) => item.name === "SATKER POLRI" +// ); +// const checkedSatkerCount = satkerItem +// ? (checkedLevels.has(Number(satkerItem.id)) ? 1 : 0) + +// (satkerItem.subDestination?.filter((sub: any) => +// checkedLevels.has(Number(sub.id)) +// ).length || 0) +// : 0; + +// // Checkbox aktif jika ADA item yang dipilih dalam kategori tersebut +// const hasSelectedPolda = checkedPoldaCount > 0; +// const hasSelectedSatker = checkedSatkerCount > 0; + +// // Update unitSelection berdasarkan yang dipilih di modal +// setUnitSelection((prev) => { +// const newState = { ...prev }; + +// // Update individual checkboxes +// newState.polda = hasSelectedPolda; +// newState.satker = hasSelectedSatker; + +// // Update checkbox "semua" berdasarkan semua checkbox yang aktif +// newState.semua = +// newState.nasional && +// newState.wilayah && +// newState.international && +// hasSelectedPolda && +// hasSelectedSatker; + +// return newState; +// }); +// } +// }; + +// const updateMainCheckboxFromModal = (fileIndex: number) => { +// setFileUnitSelections((prev) => { +// const newSelections = [...prev]; +// const currentSelection = { ...newSelections[fileIndex] }; +// const currentFileLevels = fileCheckedLevels[fileIndex]; + +// if (!currentFileLevels) return prev; + +// // Hitung total POLDA yang ada (bukan SATKER POLRI) +// const totalPoldaCount = listDest.filter( +// (item: any) => item.levelNumber === 2 && item.name !== "SATKER POLRI" +// ).length; + +// // Hitung berapa banyak POLDA yang ter-checklist (bukan SATKER POLRI) +// const checkedPoldaCount = listDest.reduce((total: number, item: any) => { +// if ( +// item.levelNumber === 2 && +// item.name !== "SATKER POLRI" && +// currentFileLevels.has(Number(item.id)) +// ) { +// return total + 1; +// } +// return total; +// }, 0); + +// // Cek apakah SATKER POLRI ter-checklist +// const satkerItem = listDest.find( +// (item: any) => item.name === "SATKER POLRI" +// ); +// const isSatkerChecked = +// satkerItem && currentFileLevels.has(Number(satkerItem.id)); + +// // Update checkbox berdasarkan kondisi +// // POLDA aktif jika ada minimal 1 POLDA ter-checklist +// currentSelection.polda = checkedPoldaCount > 0; +// currentSelection.satker = Boolean(isSatkerChecked); + +// // Update checkbox "semua" berdasarkan semua checkbox yang aktif +// currentSelection.semua = +// currentSelection.nasional && +// currentSelection.wilayah && +// currentSelection.international && +// currentSelection.polda && +// currentSelection.satker; + +// newSelections[fileIndex] = currentSelection; +// return newSelections; +// }); +// }; + +// const toggleExpand = (id: number) => { +// setExpandedPolda((prev) => ({ +// ...prev, +// [id]: !prev[id], +// })); +// }; + +// const handleFileCheckboxChangePlacement = ( +// fileIndex: number, +// levelId: number +// ) => { +// setFileCheckedLevels((prev) => { +// const newArray = [...prev]; +// const currentFileLevels = new Set(newArray[fileIndex]); +// const isCurrentlyChecked = currentFileLevels.has(levelId); + +// if (isCurrentlyChecked) { +// currentFileLevels.delete(levelId); + +// // Jika ini adalah POLDA yang di-unchecklist, unchecklist juga semua polres di bawahnya +// const poldaItem = listDest.find( +// (item: any) => Number(item.id) === levelId +// ) as any; +// if ( +// poldaItem && +// poldaItem.subDestination && +// poldaItem.name !== "SATKER POLRI" +// ) { +// poldaItem.subDestination.forEach((polres: any) => { +// currentFileLevels.delete(Number(polres.id)); +// }); +// } + +// // Jika ini adalah SATKER POLRI yang di-unchecklist, unchecklist juga semua sub-item di bawahnya +// if (poldaItem && poldaItem.name === "SATKER POLRI") { +// poldaItem.subDestination?.forEach((subItem: any) => { +// currentFileLevels.delete(Number(subItem.id)); +// }); +// } +// } else { +// currentFileLevels.add(levelId); + +// // Jika ini adalah SATKER POLRI yang di-checklist, checklist juga semua sub-item di bawahnya +// const satkerItem = listDest.find( +// (item: any) => Number(item.id) === levelId +// ) as any; +// if (satkerItem && satkerItem.name === "SATKER POLRI") { +// // Checklist semua sub-item di bawah SATKER POLRI (bukan POLRES) +// satkerItem.subDestination?.forEach((subItem: any) => { +// currentFileLevels.add(Number(subItem.id)); +// }); +// } +// } + +// newArray[fileIndex] = currentFileLevels; + +// // Update checkbox utama berdasarkan perubahan di modal +// // Pindahkan ke sini agar state sudah ter-update +// setTimeout(() => updateMainCheckboxFromModal(fileIndex), 0); + +// return newArray; +// }); +// }; + +// const handleSelectAllSubItems = (fileIndex: number, polda: any) => { +// setFileCheckedLevels((prev) => { +// const newArray = [...prev]; +// const currentFileLevels = new Set(newArray[fileIndex]); + +// // Cek apakah semua sub-items sudah ter-checklist +// const allSubItemsChecked = polda.subDestination?.every((sub: any) => +// currentFileLevels.has(Number(sub.id)) +// ); + +// if (allSubItemsChecked) { +// // Jika semua sudah ter-checklist, unchecklist semuanya +// polda.subDestination?.forEach((sub: any) => { +// currentFileLevels.delete(Number(sub.id)); +// }); +// } else { +// // Jika belum semua ter-checklist, checklist semuanya +// // Checklist SATKER POLRI juga jika belum ter-checklist +// if (!currentFileLevels.has(Number(polda.id))) { +// currentFileLevels.add(Number(polda.id)); +// } +// // Checklist semua sub-items +// polda.subDestination?.forEach((sub: any) => { +// currentFileLevels.add(Number(sub.id)); +// }); +// } + +// newArray[fileIndex] = currentFileLevels; + +// // Update checkbox utama berdasarkan perubahan di modal +// setTimeout(() => updateMainCheckboxFromModal(fileIndex), 0); + +// return newArray; +// }); +// }; + +// // Fungsi untuk sinkronisasi checkbox modal dengan checkbox utama +// const syncModalWithMainCheckbox = () => { +// if (isUpdatingFromMainCheckbox) { +// const newCheckedLevels = new Set(checkedLevels); + +// // Handle checklist actions - menambahkan semua item ke modal +// if (mainCheckboxChangeType === "polda_checked") { +// // Checklist semua polda +// listDest.forEach((item: any) => { +// if (item.levelNumber === 2 && item.name !== "SATKER POLRI") { +// newCheckedLevels.add(Number(item.id)); +// } +// }); +// } else if (mainCheckboxChangeType === "satker_checked") { +// // Checklist satker +// const satkerItem: any = listDest.find( +// (item: any) => item.name === "SATKER POLRI" +// ); +// if (satkerItem) { +// newCheckedLevels.add(Number(satkerItem.id)); +// // Checklist semua sub-item yang ada di bawah SATKER (bukan POLRES) +// if (satkerItem.subDestination) { +// satkerItem.subDestination.forEach((sub: any) => { +// newCheckedLevels.add(Number(sub.id)); +// }); +// } +// } +// } else if (mainCheckboxChangeType === "semua_checked") { +// // Checklist semua item +// listDest.forEach((item: any) => { +// newCheckedLevels.add(Number(item.id)); +// // Checklist semua sub-item di bawah setiap item +// if (item.subDestination) { +// item.subDestination.forEach((sub: any) => { +// newCheckedLevels.add(Number(sub.id)); +// }); +// } +// }); +// } else if (mainCheckboxChangeType === "polda_unchecked") { +// // Clear polda dari checkedLevels, tapi jangan hapus SATKER POLRI +// listDest.forEach((item: any) => { +// if (item.levelNumber === 2 && item.name !== "SATKER POLRI") { +// newCheckedLevels.delete(Number(item.id)); +// } +// }); +// } else if (mainCheckboxChangeType === "satker_unchecked") { +// // Clear satker dan semua sub-item di bawahnya dari checkedLevels +// const satkerItem: any = listDest.find( +// (item: any) => item.name === "SATKER POLRI" +// ); +// if (satkerItem) { +// newCheckedLevels.delete(Number(satkerItem.id)); +// if (satkerItem.subDestination) { +// satkerItem.subDestination.forEach((sub: any) => { +// newCheckedLevels.delete(Number(sub.id)); +// }); +// } +// } +// } else if (mainCheckboxChangeType === "semua_unchecked") { +// // Clear semua +// newCheckedLevels.clear(); +// } + +// setCheckedLevels(newCheckedLevels); + +// // Reset flag setelah sinkronisasi selesai +// setIsUpdatingFromMainCheckbox(false); +// setMainCheckboxChangeType(""); +// } +// }; + +// const toFileId = (f: any): string => String(f?.id ?? ""); +// const ensureFileUnit = (fid: any) => { +// setFileUnitSelections((prev) => { +// if (prev[fid]) return prev; +// return { +// ...prev, +// [fid]: { +// semua: false, +// nasional: false, +// wilayah: false, +// international: false, +// polda: false, +// satker: false, +// }, +// }; +// }); +// }; +// const ensureFilePlacement = (fid: any) => { +// setFilePlacements((prev) => (prev[fid] ? prev : { ...prev, [fid]: [] })); +// }; +// const ensureFileCheckedLevels = (fid: any) => { +// setFileCheckedLevels((prev) => +// prev[fid] ? prev : { ...prev, [fid]: new Set() } +// ); +// }; + +// const buildPlacementsPayload = () => { +// return files.map((file, index) => { +// const fid = index; + +// const levelSet = fileCheckedLevels[fid] +// ? Array.from(fileCheckedLevels[fid]) +// : []; + +// const unit = fileUnitSelections[fid] || { +// nasional: false, +// wilayah: false, +// international: false, +// polda: false, +// satker: false, +// semua: false, +// }; + +// let placements: string[] = []; + +// if (unit.nasional) placements.push("mabes"); +// // if (unit.wilayah) placements.push("polda"); +// if (unit.international) placements.push("international"); +// if (unit.polda) placements.push("polda"); +// if (unit.satker) placements.push("satker"); + +// placements = Array.from(new Set(placements)); + +// return { +// mediaFileId: file.contentId, +// placements: placements.join(","), // ✅ contoh: "polda,satker" +// customLocationPlacements: levelSet.join(","), // ✅ contoh: "219,220,..." +// }; +// }); +// }; + +// const handleGlobalPlacement = ( +// type: "semua" | "nasional" | "wilayah" | "international", +// checked: boolean +// ) => { +// const count = files.length; + +// // helper untuk ambil semua id POLDA + SATKER + sub +// const getAllLevelIds = () => { +// const set = new Set(); +// listDest.forEach((d: any) => { +// if (d?.id != null) set.add(Number(d.id)); +// d?.subDestination?.forEach((sub: any) => { +// if (sub?.id != null) set.add(Number(sub.id)); +// }); +// }); +// return set; +// }; + +// // atur visibilitas panel detail wilayah +// if ((type === "wilayah" || type === "semua") && checked) { +// setIsDetailOfRegionShowed(true); +// } +// if (type === "semua" && !checked) { +// setIsDetailOfRegionShowed(false); +// } + +// // ======= fileUnitSelections (checkbox per-bar isian) ======= +// setFileUnitSelections( +// Array.from({ length: count }, () => { +// if (type === "semua") { +// // ✅ AllSemua menyalakan SEMUA checkbox +// return { +// semua: checked, +// nasional: checked, +// wilayah: checked, +// international: checked, +// polda: checked, +// satker: checked, +// }; +// } +// if (type === "nasional") { +// return { +// semua: false, +// nasional: checked, +// wilayah: false, +// international: false, +// polda: false, +// satker: false, +// }; +// } +// if (type === "wilayah") { +// return { +// semua: false, +// nasional: false, +// wilayah: checked, +// international: false, +// polda: checked, // wilayah mengaktifkan polda +// satker: checked, // dan satker +// }; +// } +// // type === "international" +// return { +// semua: false, +// nasional: false, +// wilayah: false, +// international: checked, +// polda: false, +// satker: false, +// }; +// }) +// ); + +// // ======= fileCheckedLevels (customLocationPlacements) ======= +// setFileCheckedLevels( +// Array.from({ length: count }, () => { +// // AllSemua atau AllWilayah: checklist semua level +// if (checked && (type === "semua" || type === "wilayah")) { +// return getAllLevelIds(); +// } +// // lainnya: kosongkan (tidak memilih level spesifik) +// return new Set(); +// }) +// ); + +// // ======= (opsional) sinkron UI lain yang masih pakai filePlacements ======= +// setFilePlacements( +// Array.from({ length: count }, () => { +// if (!checked) return []; +// if (type === "semua") { +// return ["all", "mabes", "polda", "international", "satker"]; +// } +// if (type === "nasional") { +// return ["mabes"]; +// } +// if (type === "wilayah") { +// return ["polda", "satker"]; +// } +// // international +// return ["international"]; +// }) +// ); +// }; + +// return ( +//
+// {/* Header */} +//
+//
+//

+// SPIT Convert Form +//

+//

+// Convert and manage your SPIT content +//

+//
+//
+// +// +//
+//
+ +//
+//
+// {/* Main Content */} +//
+// {/* Basic Information */} +// +// +// +// +// Basic Information +// +// +// +// {/* Title */} +//
+// +// ( +// +// )} +// /> +// {errors.contentTitle && ( +// +// +// +// {errors.contentTitle.message} +// +// +// )} +//
+ +// {/* Category */} +//
+// +// +//
+// +// + +// {/* Content Editor */} +// +// +// +// +// Content Editor +// +// +// +// {/* Pilih Upload Type */} +//
+// +// +// setSelectedFileType(value) +// } +// className="grid grid-cols-2 gap-4" +// > +//
+// +// +//
+//
+// +// +//
+// +//
+ +// {/* Tampilkan keduanya berdampingan */} +//
+// {/* Original Content */} +//
+// +// ( +// +// )} +// /> +//
+ +// {/* Rewrite Content */} +//
+// + +//
+//
+// +// +//
+// +//
+ +// {showRewriteEditor && ( +//
+// {articleIds.length > 0 && ( +//
+// {articleIds.map((articleId, index) => ( +// +// ))} +//
+// )} + +//
+// +// ( +// +// )} +// /> +//
+//
+// )} +//
+//
+// +// + +// {/* Media Files */} +//
+//
+// {detailThumb.length > 0 && ( +// +// +// +// +// Media Files +// +// +// +//
+// +// {detailThumb.map((item) => ( +// +// {item.contentType === "VIDEO" ? ( +//
+//
+// ) : ( +//
+// {`Media { +// console.error("Image load error:", e); +// e.currentTarget.style.display = "none"; +// }} +// /> +//
+// )} +// +// ))} +// + +// +// {detailThumb.map((item) => ( +// +// {item.contentType === "VIDEO" ? ( +//
+// {/* use preload metadata so browser doesn't download full video */} +//
+// ) : ( +//
+// {`Thumbnail { +// console.error( +// "Thumbnail image load error:", +// e +// ); +// e.currentTarget.style.display = "none"; +// }} +// /> +//
+// )} +// +// ))} +// +//
+// +// +// )} + +// {/* File Placement */} +// {files.length > 0 && isUserMabesApprover && ( +// +// +// +// +// File Placement +// +// +// +// {files.length > 1 && ( +//
+// {PLACEMENT_OPTIONS.map((option) => ( +//
+// +// handleGlobalPlacement( +// option.value as any, +// Boolean(checked) +// ) +// } +// /> +// +//
+// ))} +//
+// )} + +//
+// {files.map((file, index) => ( +//
+// {file.contentType === "VIDEO" ? ( +//
+// ))} +//
+// +// +// )} +//
+ +// {/* Sidebar */} +//
+// +// +// +// +// Creator Information +// +// +// +//
+// +// ( +// +// )} +// /> +// {errors.contentCreator && ( +// +// +// +// {errors.contentCreator.message} +// +// +// )} +//
+// +// + +// {/* Preview */} +// {detail?.contentThumbnail && ( +// +// +// +// +// Preview +// +// +// +// Content thumbnail +// +// +// )} + +// {/* Tags */} +// +// +// +// +// Tags +// +// +// +//
+// +// +//
+// {tags.length > 0 && ( +//
+// {tags.map((tag, index) => ( +// handleRemoveTag(index)} +// > +// {tag} +// +// +// ))} +//
+// )} +// +// + +// {/* Publish Targets */} +// +// +// +// +// Publish Targets +// +// +// +// {PUBLISH_OPTIONS.map((option) => ( +//
+// opt.id !== "all" +// ).length +// : publishedFor.includes(option.id) +// } +// onCheckedChange={() => +// handlePublishTargetChange(option.id) +// } +// /> +// +//
+// ))} +// +// + +// {/* Submit Button */} +// +// +// + +// {isAlreadySaved && ( +// +// +// +// Konten sudah disimpan. Anda tidak dapat menyimpan +// ulang. +// +// +// )} +// +// +//
+//
+//
+//
+//
+//
+// ); +// } + // "use client"; // import React, { ChangeEvent, useEffect, useRef, useState } from "react"; // import { useForm, Controller } from "react-hook-form";