feat: update banner and pop up

app/[locale]/(protected)/admin/settings/popup/component/popup-table.tsx

@@ -28,7 +28,7 @@ import { useSearchParams } from "next/navigation";
 import { close, loading } from "@/config/swal";
 import { Link, useRouter } from "@/i18n/routing";
 import columns from "./popup-column";
-import { listBanner, listStaticBanner } from "@/service/settings/settings";
+import { getListPopUp, listBanner, listStaticBanner } from "@/service/settings/settings";
 import { listDataPopUp } from "@/service/broadcast/broadcast";
 
 const PopUpListTable = () => {
@@ -84,82 +84,73 @@ const PopUpListTable = () => {
 
   React.useEffect(() => {
     if (dataChange) {
-      router.push("/admin/settings/banner");
+      router.push("/admin/settings/popup");
     }
-    getListBanner();
+    getPopUp();
   }, [dataChange]);
 
   React.useEffect(() => {
-    getListBanner();
+    getPopUp();
     // getListStaticBanner();
   }, [page, showData]);
 
-  async function getListBanner() {
+  async function getPopUp() {
     loading();
     let temp: any;
 
-    // const response = await listDataPopUp(
+    const response = await getListPopUp();
-    //   page - 1,
+    const data = response?.data?.data?.content;
-    //   showData,
+    console.log("banner", data);
-    //   "",
+    setGetData(data);
-    //   categoryFilter?.sort().join(","),
-    //   statusFilter?.sort().join(",")
-    // );
-    // const data = response?.data?.data?.content;
-    // console.log("banner", data);
-    // setGetData(data);
-
-     const response = await listBanner();
-        const data = response?.data?.data?.content;
-        console.log("banner", data);
-        setGetData(data);
 
     close();
   }
 
   return (
     <>
-      <Table className="overflow-hidden mt-10">
+      {table && 
-        <TableHeader>
+        <Table className="overflow-hidden mt-10">
-          {table.getHeaderGroups().map((headerGroup) => (
+          <TableHeader>
-            <TableRow key={headerGroup.id} className="bg-default-200">
+            {table.getHeaderGroups().map((headerGroup) => (
-              {headerGroup.headers.map((header) => (
+              <TableRow key={headerGroup.id} className="bg-default-200">
-                <TableHead key={header.id}>
+                {headerGroup.headers.map((header) => (
-                  {header.isPlaceholder
+                  <TableHead key={header.id}>
-                    ? null
+                    {header.isPlaceholder
-                    : flexRender(
+                      ? null
-                        header.column.columnDef.header,
+                      : flexRender(
-                        header.getContext()
+                          header.column.columnDef.header,
-                      )}
+                          header.getContext()
-                </TableHead>
+                        )}
-              ))}
+                  </TableHead>
-            </TableRow>
-          ))}
-        </TableHeader>
-        <TableBody>
-          {table.getRowModel().rows?.length ? (
-            table.getRowModel().rows.map((row) => (
-              <TableRow
-                key={row.id}
-                data-state={row.getIsSelected() && "selected"}
-                className="h-[75px]"
-              >
-                {row.getVisibleCells().map((cell) => (
-                  <TableCell key={cell.id}>
-                    {flexRender(cell.column.columnDef.cell, cell.getContext())}
-                  </TableCell>
                 ))}
               </TableRow>
-            ))
+            ))}
-          ) : (
+          </TableHeader>
-            <TableRow>
+          <TableBody>
-              <TableCell colSpan={columns.length} className="h-24 text-center">
+            {table?.getRowModel()?.rows?.length ? (
-                No results.
+              table?.getRowModel()?.rows.map((row) => (
-              </TableCell>
+                <TableRow
-            </TableRow>
+                  key={row.id}
-          )}
+                  data-state={row.getIsSelected() && "selected"}
-        </TableBody>
+                  className="h-[75px]"
-      </Table>
+                >
+                  {row.getVisibleCells().map((cell) => (
+                    <TableCell key={cell.id}>
+                      {flexRender(cell.column.columnDef.cell, cell.getContext())}
+                    </TableCell>
+                  ))}
+                </TableRow>
+              ))
+            ) : (
+              <TableRow>
+                <TableCell colSpan={columns.length} className="h-24 text-center">
+                  No results.
+                </TableCell>
+              </TableRow>
+            )}
+          </TableBody>
+        </Table>
+      }
     </>
   );
 };

app/[locale]/(protected)/admin/settings/popup/component/table.tsx

@@ -237,7 +237,7 @@ const ContentListPopUp = () => {
 
   const { toast } = useToast();
 
-  const handleBanner = async (ids: number[]) => {
+  const handlePopUp = async (ids: number[]) => {
     try {
       await Promise.all(ids.map((id) => setPopUp(id, true)));
       toast({
@@ -413,7 +413,7 @@ const ContentListPopUp = () => {
             <span>Pilih Semua</span>
           </div>
           {selectedItems.length > 0 && (
-            <Button color="primary" onClick={() => handleBanner(selectedItems)}>
+            <Button color="primary" onClick={() => handlePopUp(selectedItems)}>
               Jadikan PopUp
             </Button>
           )}

components/landing-page/event-calender.tsx

@@ -315,11 +315,11 @@ const EventCalender = () => {
                         </div>
                       </div>
 
-                      <div className="flex gap-2">
+                      {/* <div className="flex gap-2">
                         <button className="px-4 py-2 bg-gray-300 dark:bg-zinc-700 text-gray-700 dark:text-gray-300 text-sm font-medium rounded-lg hover:bg-gray-400 dark:hover:bg-zinc-600 transition-colors">
                           {t("share", { defaultValue: "Share" })}
                         </button>
-                      </div>
+                      </div> */}
                     </div>
                   </div>
                 ) : (

components/landing-page/hero-new-polda.tsx

@@ -41,24 +41,6 @@ const HeroModal = ({
   const swiperRef = useRef<SwiperClass | null>(null);
 
   useEffect(() => {
-    async function fetchCategories() {
-      const url = "https://netidhub.com/api/csrf";
-
-      try {
-        const response = await fetch(url);
-
-        if (!response.ok) {
-          throw new Error(`HTTP error! status: ${response.status}`);
-        }
-
-        const data = await response.json();
-        return data;
-      } catch (error) {
-        console.error("Fetch error: ", error);
-      }
-    }
-
-    fetchCategories();
     initFetch();
   }, []);
 
@@ -269,32 +251,39 @@ const HeroNewPolda = (props: { group?: string }) => {
   }, []);
 
   useEffect(() => {
-    async function fetchCategories() {
-      const url = "https://netidhub.com/api/csrf";
-
-      try {
-        const response = await fetch(url);
-
-        if (!response.ok) {
-          throw new Error(`HTTP error! status: ${response.status}`);
-        }
-
-        const data = await response.json();
-        return data;
-      } catch (error) {
-        console.error("Fetch error: ", error);
-      }
-    }
-
-    fetchCategories();
     initFetch();
   }, []);
 
   const initFetch = async () => {
-    const response = await getHeroData(locale == "en");
+    const request = {
-    console.log(response);
+      title: "",
+      page: 0,
+      size: 5,
+      sortBy: "createdAt",
+      contentTypeId:
+        selectedTab == "image"
+          ? "1"
+          : selectedTab == "video"
+          ? "2"
+          : selectedTab == "text"
+          ? "3"
+          : selectedTab == "audio"
+          ? "4"
+          : "",
+      group:
+        props.group == "mabes"
+          ? ""
+          : props.group == "polda" && poldaName && String(poldaName)?.length > 1
+          ? poldaName
+          : props.group == "satker" &&
+            satkerName &&
+            String(satkerName)?.length > 1
+          ? "satker-" + satkerName
+          : "",
+      isInt: locale == "en" ? true : false,
+    };
+    const response = await getListContent(request);
     let data = response?.data?.data?.content;
-    setHeroData(data);
 
     if (
       data &&
@@ -318,6 +307,7 @@ const HeroNewPolda = (props: { group?: string }) => {
   useEffect(() => {
     fecthNewContent();
   }, [selectedTab]);
+
   const fecthNewContent = async () => {
     console.log("Satker Name : ", satkerName);
     const request = {
@@ -348,7 +338,6 @@ const HeroNewPolda = (props: { group?: string }) => {
       isInt: locale == "en" ? true : false,
     };
     const response = await getListContent(request);
-    console.log("category", response);
     setNewContent(response?.data?.data?.content);
   };
 

components/landing-page/hero-new.tsx

@@ -80,6 +80,7 @@ const HeroModal = ({
     : "";
 
   useEffect(() => {
+    console.log("Show modal popup list");
     initFetch();
   }, []);
 
@@ -103,10 +104,9 @@ const HeroModal = ({
       locale == "en"
     );
 
-    const banners = response?.data?.data || [];
+    const interstitial = response?.data?.data || [];
-
+    console.log("banner Modal", interstitial);
-    console.log("banner Modal", banners);
+    setHeroData(interstitial);
-    setHeroData(banners);
   };
 
   return (
@@ -230,6 +230,7 @@ const HeroNew = (props: { group?: string }) => {
   useEffect(() => {
     fecthNewContent();
   }, [selectedTab]);
+
   const fecthNewContent = async () => {
     console.log("Satker Name : ", satkerName);
     const request = {
@@ -315,6 +316,7 @@ const HeroNew = (props: { group?: string }) => {
   // Show hero modal after 20 seconds when website is fully loaded
   useEffect(() => {
     const timer = setTimeout(() => {
+      console.log("Show modal popup");
       setShowModal(true);
     }, 30000); // 30 seconds
 
@@ -322,32 +324,39 @@ const HeroNew = (props: { group?: string }) => {
   }, []);
 
   useEffect(() => {
-    async function fetchCategories() {
-      const url = "https://netidhub.com/api/csrf";
-
-      try {
-        const response = await fetch(url);
-
-        if (!response.ok) {
-          throw new Error(`HTTP error! status: ${response.status}`);
-        }
-
-        const data = await response.json();
-        return data;
-      } catch (error) {
-        console.error("Fetch error: ", error);
-      }
-    }
-
-    fetchCategories();
     initFetch();
   }, []);
 
   const initFetch = async () => {
-    const response = await getHeroData(locale == "en");
+    const request = {
-    console.log(response);
+      title: "",
+      page: 0,
+      size: 5,
+      sortBy: "createdAt",
+      contentTypeId:
+        selectedTab == "image"
+          ? "1"
+          : selectedTab == "video"
+          ? "2"
+          : selectedTab == "text"
+          ? "3"
+          : selectedTab == "audio"
+          ? "4"
+          : "",
+      group:
+        props.group == "mabes"
+          ? ""
+          : props.group == "polda" && poldaName && String(poldaName)?.length > 1
+          ? poldaName
+          : props.group == "satker" &&
+            satkerName &&
+            String(satkerName)?.length > 1
+          ? "satker-" + satkerName
+          : "",
+      isInt: locale == "en" ? true : false,
+    };
+    const response = await getListContent(request);
     let data = response?.data?.data?.content;
-    setHeroData(data);
 
     if (data) {
       const resStatic = await listStaticBanner(
@@ -363,8 +372,8 @@ const HeroNew = (props: { group?: string }) => {
         locale == "en"
       );
 
-      for (let i = 0; i < resStatic?.data?.data?.length; i++) {
+      for (let i = resStatic?.data?.data?.length; i >= 0 ; i--) {
-        const media = resStatic?.data.data[i]?.mediaUpload;
+        const media = resStatic?.data?.data[i];
         if (!media) continue;
         media.fileTypeId = media?.fileType?.id ?? null;
         data = data.filter((item: any) => item.id != media.id);
@@ -399,7 +408,7 @@ const HeroNew = (props: { group?: string }) => {
     <div className="flex items-start justify-center mx-auto w-auto">
       <div className="relative">
         {showModal && (
-          <HeroModal onClose={() => setShowModal(false)} group="mabes" />
+          <HeroModal onClose={() => setShowModal(false)} group={props.group || "mabes"} />
         )}
       </div>
       {isLoading ? (
@@ -466,7 +475,7 @@ const HeroNew = (props: { group?: string }) => {
           </Carousel>
 
           <div className="hidden lg:flex flex-col gap-3 absolute bottom-4 right-4 w-[520px] bg-black/40 p-4 rounded-lg z-10">
-            {content?.slice(0, 3).map((item: any) => (
+            {newContent?.slice(0, 3).map((item: any) => (
               <li key={item?.id} className="flex gap-4 flex-row lg:w-full mx-2">
                 <div className="flex-shrink-0 w-32 rounded-lg">
                   <Image

components/partials/header/locale-switcher.tsx

@@ -37,18 +37,24 @@ export default function LocalSwitcher() {
   useEffect(() => {
     const storedLang = getLanguage();
 
-    if (!storedLang) {
+    if (pathname.includes("polda")){
-      setLanguage("in");
-      setSelectedLang("in");
-
       startTransition(() => {
-        router.replace(pathname, { locale: "in" });
+          router.replace(pathname, { locale: "in" });
       });
     } else {
-      setSelectedLang(storedLang);
+      if (!storedLang) {
-      startTransition(() => {
+        setLanguage("in");
-        router.replace(pathname, { locale: storedLang });
+        setSelectedLang("in");
-      });
+
+        startTransition(() => {
+          router.replace(pathname, { locale: "in" });
+        });
+      } else {
+        setSelectedLang(storedLang);
+        startTransition(() => {
+          router.replace(pathname, { locale: storedLang });
+        });
+      }
     }
   }, []);
 

service/settings/settings.ts

@@ -153,6 +153,11 @@ export async function deleteAdvertisements(id: string | number) {
   return httpDeleteInterceptor(url);
 }
 
+export async function getListPopUp() {
+  const url = `media/interstitial/pagination`;
+  return httpGetInterceptor(url);
+}
+
 export async function setPopUp(id: number, status: boolean) {
   const url = `media/interstitial?id=${id}&status=${status}`;
   return httpPostInterceptor(url);