feat: move satker and polda, update detail video and image on contributor

components/form/content/image-detail-form.tsx

@@ -133,11 +133,11 @@ export default function FormImageDetail() {
   const [filePlacements, setFilePlacements] = useState<string[][]>([]);
   const [detailThumb, setDetailThumb] = useState<any>([]);
   const [thumbsSwiper, setThumbsSwiper] = useState<any>(null);
+  const [isUserMabesApprover, setIsUserMabesApprover] = useState(false);
 
   const [selectedTarget, setSelectedTarget] = useState("");
   const [files, setFiles] = useState<FileType[]>([]);
   const [rejectedFiles, setRejectedFiles] = useState<number[]>([]);
-  const [isMabesApprover, setIsMabesApprover] = useState(false);
 
   let fileTypeId = "1";
 
@@ -157,7 +157,7 @@ export default function FormImageDetail() {
       userLevelId == "216" &&
       roleId == "3"
     ) {
-      setIsMabesApprover(true);
+      setIsUserMabesApprover(true);
     }
   }, [userLevelId, roleId]);
 
@@ -306,7 +306,7 @@ export default function FormImageDetail() {
       mediaUploadId: id,
       statusId: status,
       message: description,
-      files: isMabesApprover ? getPlacement() : [],
+      files: isUserMabesApprover ? getPlacement() : [],
     };
     loading();
     const response = await submitApproval(data);
@@ -330,9 +330,11 @@ export default function FormImageDetail() {
     }
 
     close();
+    submitApprovalSuccesss();
 
     return false;
   }
+  
   const setupPlacement = (
     index: number,
     placement: string,
@@ -396,8 +398,10 @@ export default function FormImageDetail() {
       icon: "success",
       confirmButtonColor: "#3085d6",
       confirmButtonText: "OK",
-    }).then(() => {
+    }).then((result) => {
-      router.push("/in/contributor/content/image");
+      if (result.isConfirmed) {
+        router.push("/contributor/content/image");
+      }
     });
   };
 
@@ -516,7 +520,7 @@ export default function FormImageDetail() {
             </div>
           </Card>
           <div className="w-4/12">
-            <Card className=" h-[800px]">
+            <Card className=" h-[900px]">
               <div className="px-3 py-3">
                 <div className="space-y-2">
                   <Label>Kreator</Label>
@@ -675,6 +679,7 @@ export default function FormImageDetail() {
                                 <Icon icon="humbleicons:times" color="red" />
                               </a>
                             </div>
+                            {isUserMabesApprover &&
                               <div className="flex flex-row gap-2">
                                 <div className="flex items-center space-x-2">
                                   <Checkbox
@@ -751,6 +756,7 @@ export default function FormImageDetail() {
                                   </label>
                                 </div>
                               </div>
+                            }
                           </div>
                         </div>
                       ))

components/form/content/video-detail-form.tsx

@@ -134,10 +134,11 @@ export default function FormVideoDetail() {
   const [detailVideo, setDetailVideo] = useState<any>([]);
   const [thumbsSwiper, setThumbsSwiper] = useState<any>(null);
 
+  const [filePlacements, setFilePlacements] = useState<string[][]>([]);
   const [selectedTarget, setSelectedTarget] = useState("");
   const [files, setFiles] = useState<FileType[]>([]);
   const [rejectedFiles, setRejectedFiles] = useState<number[]>([]);
-  const [isMabesApprover, setIsMabesApprover] = useState(false);
+  const [isUserMabesApprover, setIsUserMabesApprover] = useState(false);
 
   let fileTypeId = "2";
 
@@ -168,7 +169,7 @@ export default function FormVideoDetail() {
       userLevelId == "216" &&
       roleId == "3"
     ) {
-      setIsMabesApprover(true);
+      setIsUserMabesApprover(true);
     }
   }, [userLevelId, roleId]);
 
@@ -254,9 +255,16 @@ export default function FormVideoDetail() {
   }, [refresh, setValue]);
 
   const actionApproval = (e: string) => {
+    const temp = [];
+    for (const element of detail.files) {
+      temp.push([]);
+    }
+    setFilePlacements(temp);
     setStatus(e);
-    setModalOpen(true);
+    setFiles(detail.files);
+
     setDescription("");
+    setModalOpen(true);
   };
 
   const submit = async () => {
@@ -286,8 +294,7 @@ export default function FormVideoDetail() {
       mediaUploadId: id,
       statusId: status,
       message: description,
-      files: [],
+      files: isUserMabesApprover ? getPlacement() : [],
-      // files: isMabesApprover ? getPlacement() : [],
     };
 
     loading();
@@ -310,10 +317,57 @@ export default function FormVideoDetail() {
     }
 
     close();
+    submitApprovalSuccesss();
 
     return false;
   }
 
+  const getPlacement = () => {
+    console.log("getPlaa", filePlacements);
+    const temp = [];
+    for (let i = 0; i < filePlacements?.length; i++) {
+      if (filePlacements[i].length !== 0) {
+        const now = filePlacements[i].filter((a) => a !== "all");
+        const data = { mediaFileId: files[i].id, placement: now.join(",") };
+        temp.push(data);
+      }
+    }
+    return temp;
+  };
+
+  const setupPlacement = (
+    index: number,
+    placement: string,
+    checked: boolean
+  ) => {
+    let temp = [...filePlacements];
+    if (checked) {
+      if (placement === "all") {
+        temp[index] = ["all", "mabes", "polda", "international"];
+      } else {
+        const now = temp[index];
+        now.push(placement);
+        if (now.length === 3 && !now.includes("all")) {
+          now.push("all");
+        }
+        temp[index] = now;
+      }
+    } else {
+      if (placement === "all") {
+        temp[index] = [];
+      } else {
+        const now = temp[index].filter((a) => a !== placement);
+        console.log("now", now);
+        temp[index] = now;
+        if (now.length === 3 && now.includes("all")) {
+          const newData = now.filter((b) => b !== "all");
+          temp[index] = newData;
+        }
+      }
+    }
+    setFilePlacements(temp);
+  };
+
   function handleDeleteFileApproval(id: number) {
     const selectedFiles = files.filter((file) => file.id != id);
     setFiles(selectedFiles);
@@ -344,8 +398,10 @@ export default function FormVideoDetail() {
       icon: "success",
       confirmButtonColor: "#3085d6",
       confirmButtonText: "OK",
-    }).then(() => {
+    }).then((result) => {
-      router.push("/in/contributor/content/video");
+      if (result.isConfirmed) {
+        router.push("/contributor/content/video");
+      }
     });
   };
 
@@ -610,7 +666,7 @@ export default function FormVideoDetail() {
                     <DialogTitle>Berikan Komentar</DialogTitle>
                   </DialogHeader>
                   {status == "2"
-                    ? files?.map((file) => (
+                    ? files?.map((file, index) => (
                         <div
                           key={file.id}
                           className="flex flex-row gap-2 items-center"
@@ -619,13 +675,27 @@ export default function FormVideoDetail() {
                           <div className="flex flex-col gap-2 w-full">
                             <div className="flex justify-between text-sm">
                               {file.fileName}
-                              <a>
+                              <a
+                                onClick={() =>
+                                  handleDeleteFileApproval(file.id)
+                                }
+                              >
                                 <Icon icon="humbleicons:times" color="red" />
                               </a>
                             </div>
+                            {isUserMabesApprover &&
                               <div className="flex flex-row gap-2">
                                 <div className="flex items-center space-x-2">
-                                <Checkbox id="terms" />
+                                  <Checkbox
+                                    id="terms"
+                                    value="all"
+                                    checked={filePlacements[index]?.includes(
+                                      "all"
+                                    )}
+                                    onCheckedChange={(e) =>
+                                      setupPlacement(index, "all", Boolean(e))
+                                    }
+                                  />
                                   <label
                                     htmlFor="terms"
                                     className="text-xs font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
@@ -634,7 +704,15 @@ export default function FormVideoDetail() {
                                   </label>
                                 </div>
                                 <div className="flex items-center space-x-2">
-                                <Checkbox id="terms" />
+                                  <Checkbox
+                                    id="terms"
+                                    checked={filePlacements[index]?.includes(
+                                      "mabes"
+                                    )}
+                                    onCheckedChange={(e) =>
+                                      setupPlacement(index, "mabes", Boolean(e))
+                                    }
+                                  />
                                   <label
                                     htmlFor="terms"
                                     className="text-xs font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
@@ -643,7 +721,15 @@ export default function FormVideoDetail() {
                                   </label>
                                 </div>
                                 <div className="flex items-center space-x-2">
-                                <Checkbox id="terms" />
+                                  <Checkbox
+                                    id="terms"
+                                    checked={filePlacements[index]?.includes(
+                                      "polda"
+                                    )}
+                                    onCheckedChange={(e) =>
+                                      setupPlacement(index, "polda", Boolean(e))
+                                    }
+                                  />
                                   <label
                                     htmlFor="terms"
                                     className="text-xs font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
@@ -653,7 +739,19 @@ export default function FormVideoDetail() {
                                 </div>
 
                                 <div className="flex items-center space-x-2">
-                                <Checkbox id="terms" />
+                                  <Checkbox
+                                    id="terms"
+                                    checked={filePlacements[index]?.includes(
+                                      "international"
+                                    )}
+                                    onCheckedChange={(e) =>
+                                      setupPlacement(
+                                        index,
+                                        "international",
+                                        Boolean(e)
+                                      )
+                                    }
+                                  />
                                   <label
                                     htmlFor="terms"
                                     className="text-xs font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
@@ -662,6 +760,7 @@ export default function FormVideoDetail() {
                                   </label>
                                 </div>
                               </div>
+                            }
                           </div>
                         </div>
                       ))
@@ -744,7 +843,7 @@ export default function FormVideoDetail() {
                     <Button
                       type="button"
                       color="primary"
-                      onClick={submitApprovalSuccesss}
+                      onClick={() => submit()}
                     >
                       Submit
                     </Button>

components/landing-page/division.tsx

@@ -94,7 +94,7 @@ const Division = () => {
             filteredList.map((region, index) =>
               !seeAllValue ? (
                 index < 7 ? (
-                  <Link href={`/polda/${region.slug}`} key={index} className="flex flex-col items-center text-center group">
+                  <Link href={`/satker/${region.slug}`} key={index} className="flex flex-col items-center text-center group">
                     <div className="relative w-20 h-20 rounded-full border-2 border-[#bb3523] overflow-hidden mb-2 flex items-center justify-center">
                       <img src={region.logo} alt={region.name} className="w-3/4 h-3/4 object-contain group-hover:scale-110 transition-transform duration-300" />
                     </div>
@@ -104,7 +104,7 @@ const Division = () => {
                   ""
                 )
               ) : (
-                <Link href={`/polda/${region.slug}`} key={index} className="flex flex-col items-center text-center group">
+                <Link href={`/satker/${region.slug}`} key={index} className="flex flex-col items-center text-center group">
                   <div className="relative w-20 h-20 rounded-full border-2 border-[#bb3523] overflow-hidden mb-2 flex items-center justify-center">
                     <img src={region.logo} alt={region.name} className="w-3/4 h-3/4 object-contain group-hover:scale-110 transition-transform duration-300" />
                   </div>

components/landing-page/new-content.tsx

@@ -18,17 +18,22 @@ const NewContent = (props: { type: string }) => {
   const pathname = usePathname();
   const params = useParams();
   const locale = params?.locale;
+  const poldaName = params?.polda_name;
+  const satkerName = params?.satker_name;
   const t = useTranslations("LandingPage");
 
   useEffect(() => {
     initFetch();
   }, [selectedTab]);
   const initFetch = async () => {
+    console.log("Satker Name : ", satkerName);
     const request = {
+      title: "",
       page: 0,
       size: 5,
       sortBy: props.type == "popular" ? "clickCount" : "createdAt",
       contentTypeId: selectedTab == "image" ? "1" : selectedTab == "video" ? "2" : selectedTab == "text" ? "3" : selectedTab == "audio" ? "4" : "",
+      group: poldaName && String(poldaName)?.length > 1 ? poldaName : "",
     };
     const response = await getListContent(request);
     console.log("category", response);

service/landing/landing.ts

@@ -10,9 +10,7 @@ export async function getCategoryData() {
 
 export async function getListContent(props: any) {
   return await httpGetInterceptor(
-    `media/public/list?enablePage=1&sort=desc&sortBy=${props.sortBy}&size=${props.size}&page=${props.page}&typeId=${props.contentTypeId}&title=${
+    `media/public/list?enablePage=1&sort=desc&sortBy=${props.sortBy}&size=${props.size}&page=${props.page}&typeId=${props.contentTypeId}&title=${props.title}&group=${props.group}&categoryId=&fileFormats=&tags=&startDate=&endDate=&month=&year=`
-      props.title ? props.title : ""
-    }&categoryId=&fileFormats=&tags=&group=&startDate=&endDate=&month=&year=`
   );
 }