Merge branch 'main' of https://gitlab.com/hanifsalafi/mediahub_redesign into dev-anang

app/[locale]/(protected)/notifications/components/notifications-table.tsx

@@ -83,7 +83,7 @@ const NotificationsList: React.FC = () => {
     <div className="mx-3">
       <div className="space-y-3">
         {notifications.length > 0 ? (
-          notifications.map((notification) => (
+          notifications?.map((notification) => (
             <div
               key={notification.id}
               className="flex items-start space-x-4 p-4 border rounded-lg shadow-sm bg-white cursor-pointer"

app/[locale]/(public)/content-management/download/page.tsx

@@ -64,7 +64,7 @@ const Galery = (props: any) => {
       loading();
       const response = await getInfoProfile();
 
-      // console.log(response?.data.data);
+      // console.log(response?.data?.data);
       setProfile(response?.data?.data);
       close();
     }

app/[locale]/(public)/content-management/galery/page.tsx

@@ -67,7 +67,7 @@ const Galery = (props: any) => {
       loading();
       const response = await getInfoProfile();
 
-      // console.log(response?.data.data);
+      // console.log(response?.data?.data);
       setProfile(response?.data?.data);
       close();
     }

app/[locale]/(public)/content-management/rewrite/create/[id]/page.tsx

@@ -163,30 +163,30 @@ const page = (props: { states?: string }) => {
         setValue("title", response?.data?.data?.title);
         setValue("mainKeyword", response?.data?.data?.title);
         setValue("seo", response?.data?.data?.description);
-        setContent(response?.data.data);
+        setContent(response?.data?.data);
-        setIsFromSPIT(response?.data.data?.isFromSPIT);
+        setIsFromSPIT(response?.data?.data?.isFromSPIT);
         setListSuggestion(responseGet?.data?.data);
         console.log("data list file", response?.data?.data);
-        // const mainUrl = response?.data.data?.files[0]?.url;
+        // const mainUrl = response?.data?.data?.files[0]?.url;
-        // const ticket = response?.data.data?.files[0]?.ticket;
+        // const ticket = response?.data?.data?.files[0]?.ticket;
         // const urlBlob = await getBlobContent(mainUrl, ticket);
         setMain({
-          id: response?.data.data?.files[0]?.id,
+          id: response?.data?.data?.files[0]?.id,
-          type: response?.data.data?.fileType.name,
+          type: response?.data?.data?.fileType.name,
-          url: Number(response?.data.data?.fileType?.id) == 4 ? response?.data.data?.files[0]?.secondaryUrl : response?.data.data?.files[0]?.url,
+          url: Number(response?.data?.data?.fileType?.id) == 4 ? response?.data?.data?.files[0]?.secondaryUrl : response?.data?.data?.files[0]?.url,
-          thumbnailFileUrl: response?.data.data?.files[0]?.thumbnailFileUrl,
+          thumbnailFileUrl: response?.data?.data?.files[0]?.thumbnailFileUrl,
-          names: response?.data.data?.files[0]?.fileName,
+          names: response?.data?.data?.files[0]?.fileName,
-          format: response?.data.data?.files[0]?.format,
+          format: response?.data?.data?.files[0]?.format,
-          widthPixel: response?.data.data?.files[0]?.widthPixel,
+          widthPixel: response?.data?.data?.files[0]?.widthPixel,
-          heightPixel: response?.data.data?.files[0]?.heightPixel,
+          heightPixel: response?.data?.data?.files[0]?.heightPixel,
-          size: response?.data.data?.files[0]?.size,
+          size: response?.data?.data?.files[0]?.size,
-          caption: response?.data.data?.files[0]?.caption,
+          caption: response?.data?.data?.files[0]?.caption,
         });
 
         // Send Meta Data
         const metaData = {
-          title: response?.data.data?.title,
+          title: response?.data?.data?.title,
-          image: response?.data.data?.thumbnailLink,
+          image: response?.data?.data?.thumbnailLink,
         };
 
         setCookiesEncrypt("meta_data", metaData);

app/[locale]/(public)/content-management/rewrite/detail/[id]/page.tsx

@@ -59,7 +59,7 @@ const page = (props: any) => {
       loading();
       const response = await getInfoProfile();
 
-      // console.log(response?.data.data);
+      // console.log(response?.data?.data);
       setProfile(response?.data?.data);
       close();
     }

app/[locale]/(public)/content-management/rewrite/page.tsx

@@ -43,7 +43,7 @@ const page = (props: any) => {
     async function initState() {
       loading();
       const response = await getInfoProfile();
-      console.log(response?.data.data);
+      console.log(response?.data?.data);
       setProfile(response?.data?.data);
       close();
     }

components/form/blog/blog-form.tsx

@@ -147,7 +147,7 @@ export default function FormBlog() {
   //         // setValue("categoryId", findCategory.id);
   //         setSelectedCategory(findCategory.id); // Set the selected category
   //         const response = await getTagsBySubCategoryId(findCategory.id);
-  //         setTags(response?.data.data);
+  //         setTags(response?.data?.data);
   //       }
   //     }
   //   } catch (error) {
@@ -176,7 +176,7 @@ export default function FormBlog() {
       return;
     }
 
-    const blogId = response?.data.data.id;
+    const blogId = response?.data?.data.id;
     if (blogId && thumbnail) {
       const formMedia = new FormData();
       formMedia.append("file", thumbnail);

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

@@ -204,7 +204,7 @@ export default function FormAudioDetail() {
           // setValue("categoryId", findCategory.id);
           setSelectedCategory(findCategory.id); // Set the selected category
           const response = await getTagsBySubCategoryId(findCategory.id);
-          setTags(response?.data.data);
+          setTags(response?.data?.data);
         }
       }
     } catch (error) {

components/form/content/audio-form.tsx

@@ -52,6 +52,7 @@ import Image from "next/image";
 import { error, loading } from "@/config/swal";
 import { Item } from "@radix-ui/react-dropdown-menu";
 import dynamic from "next/dynamic";
+import { getCsrfToken } from "@/service/auth";
 
 interface FileWithPreview extends File {
   preview: string;
@@ -395,7 +396,7 @@ export default function FormAudio() {
           // setValue("categoryId", findCategory.id);
           setSelectedCategory(findCategory.id); // Set the selected category
           const response = await getTagsBySubCategoryId(findCategory.id);
-          setTags(response?.data.data);
+          setTags(response?.data?.data);
         }
       }
     } catch (error) {
@@ -467,7 +468,7 @@ export default function FormAudio() {
         MySwal.fire("Error", response?.message, "error");
         return;
       }
-      Cookies.set("idCreate", response?.data.data, { expires: 1 });
+      Cookies.set("idCreate", response?.data?.data, { expires: 1 });
       id = response?.data?.data;
 
       // Upload Thumbnail
@@ -528,8 +529,16 @@ export default function FormAudio() {
     // const placements = getPlacement(file.placements);
     // console.log("Placementttt:  : ", placements);
 
+    const resCsrf = await getCsrfToken();
+    const csrfToken = resCsrf?.data?.token;
+    console.log("CSRF TOKEN : ", csrfToken);
+    const headers = {
+      "X-XSRF-TOKEN": csrfToken
+    };
+
     const upload = new Upload(file, {
       endpoint: `${process.env.NEXT_PUBLIC_API}/media/file/upload`,
+      headers: headers,
       retryDelays: [0, 3000, 6000, 12_000, 24_000],
       chunkSize: 20_000,
       metadata: {
@@ -539,6 +548,10 @@ export default function FormAudio() {
         duration,
         isWatermark: "false", // hardcode
       },
+      onBeforeRequest: function (req) {
+        var xhr = req.getUnderlyingObject()
+        xhr.withCredentials = true
+      },
       onError: async (e: any) => {
         console.log("Error upload :", e);
         error(e);

components/form/content/audio-update-form.tsx

@@ -163,7 +163,7 @@ export default function FormAudioUpdate() {
           // setValue("categoryId", findCategory.id);
           setSelectedCategory(findCategory.id); // Set the selected category
           const response = await getTagsBySubCategoryId(findCategory.id);
-          setTags(response?.data.data);
+          setTags(response?.data?.data);
         }
       }
     } catch (error) {

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

@@ -312,7 +312,7 @@ export default function FormImageAI() {
         if (findCategory) {
           setSelectedCategory(findCategory.id);
           const response = await getTagsBySubCategoryId(findCategory.id);
-          setTags(response?.data.data);
+          setTags(response?.data?.data);
         }
       }
     } catch (error) {

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

@@ -192,7 +192,7 @@ export default function FormImageDetail() {
           // setValue("categoryId", findCategory.id);
           setSelectedCategory(findCategory.id); // Set the selected category
           const response = await getTagsBySubCategoryId(findCategory.id);
-          setTags(response?.data.data);
+          setTags(response?.data?.data);
         }
       }
     } catch (error) {

components/form/content/image-form.tsx

@@ -54,6 +54,7 @@ import { Item } from "@radix-ui/react-dropdown-menu";
 import { data } from "jquery";
 import { options } from "@fullcalendar/core/preact.js";
 import dynamic from "next/dynamic";
+import { getCsrfToken } from "@/service/auth";
 
 interface FileWithPreview extends File {
   preview: string;
@@ -401,7 +402,7 @@ export default function FormImage() {
           // setValue("categoryId", findCategory.id);
           setSelectedCategory(findCategory.id); // Set the selected category
           const response = await getTagsBySubCategoryId(findCategory.id);
-          setTags(response?.data.data);
+          setTags(response?.data?.data);
         }
       }
     } catch (error) {
@@ -468,11 +469,11 @@ export default function FormImage() {
       const response = await createMedia(requestData);
       console.log("Form Data Submitted:", requestData);
 
-      if (response?.error) {
+      // if (response?.error) {
-        MySwal.fire("Error", response?.message, "error");
+      //   MySwal.fire("Error", response?.message, "error");
-        return;
+      //   return;
-      }
+      // }
-      Cookies.set("idCreate", response?.data.data, { expires: 1 });
+      Cookies.set("idCreate", response?.data?.data, { expires: 1 });
       id = response?.data?.data;
 
       // Upload Thumbnail
@@ -537,9 +538,17 @@ export default function FormImage() {
 
     // const placements = getPlacement(file.placements);
     // console.log("Placementttt:  : ", placements);
+    
+    const resCsrf = await getCsrfToken();
+    const csrfToken = resCsrf?.data?.token;
+    console.log("CSRF TOKEN : ", csrfToken);
+    const headers = {
+      "X-XSRF-TOKEN": csrfToken
+    };
 
     const upload = new Upload(file, {
       endpoint: `${process.env.NEXT_PUBLIC_API}/media/file/upload`,
+      headers: headers,
       retryDelays: [0, 3000, 6000, 12_000, 24_000],
       chunkSize: 20_000,
       metadata: {
@@ -549,6 +558,10 @@ export default function FormImage() {
         duration,
         isWatermark: "true", // hardcode
       },
+      onBeforeRequest: function (req) {
+        var xhr = req.getUnderlyingObject()
+        xhr.withCredentials = true
+      },
       onError: async (e: any) => {
         console.log("Error upload :", e);
         error(e);

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

@@ -168,7 +168,7 @@ export default function FormImageUpdate() {
           // setValue("categoryId", findCategory.id);
           setSelectedCategory(findCategory.id); // Set the selected category
           const response = await getTagsBySubCategoryId(findCategory.id);
-          setTags(response?.data.data);
+          setTags(response?.data?.data);
         }
       }
     } catch (error) {

components/form/content/spit-convert-form.tsx

@@ -204,7 +204,7 @@ export default function FormConvertSPIT() {
           // setValue("categoryId", findCategory.id);
           setSelectedCategoryId(findCategory.id); // Set the selected category
           const response = await getTagsBySubCategoryId(findCategory.id);
-          setTags(response?.data.data);
+          setTags(response?.data?.data);
         }
       }
     } catch (error) {

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

@@ -202,7 +202,7 @@ export default function FormTeksDetail() {
           // setValue("categoryId", findCategory.id);
           setSelectedCategory(findCategory.id); // Set the selected category
           const response = await getTagsBySubCategoryId(findCategory.id);
-          setTags(response?.data.data);
+          setTags(response?.data?.data);
         }
       }
     } catch (error) {

components/form/content/teks-form.tsx

@@ -52,6 +52,7 @@ import Image from "next/image";
 import { error, loading } from "@/config/swal";
 import { Item } from "@radix-ui/react-dropdown-menu";
 import dynamic from "next/dynamic";
+import { getCsrfToken } from "@/service/auth";
 
 interface FileWithPreview extends File {
   preview: string;
@@ -395,7 +396,7 @@ export default function FormTeks() {
           // setValue("categoryId", findCategory.id);
           setSelectedCategory(findCategory.id); // Set the selected category
           const response = await getTagsBySubCategoryId(findCategory.id);
-          setTags(response?.data.data);
+          setTags(response?.data?.data);
         }
       }
     } catch (error) {
@@ -466,7 +467,7 @@ export default function FormTeks() {
         MySwal.fire("Error", response?.message, "error");
         return;
       }
-      Cookies.set("idCreate", response?.data.data, { expires: 1 });
+      Cookies.set("idCreate", response?.data?.data, { expires: 1 });
       id = response?.data?.data;
 
       // Upload Thumbnail
@@ -527,8 +528,16 @@ export default function FormTeks() {
     // const placements = getPlacement(file.placements);
     // console.log("Placementttt:  : ", placements);
 
+    const resCsrf = await getCsrfToken();
+    const csrfToken = resCsrf?.data?.token;
+    console.log("CSRF TOKEN : ", csrfToken);
+    const headers = {
+      "X-XSRF-TOKEN": csrfToken
+    };
+
     const upload = new Upload(file, {
       endpoint: `${process.env.NEXT_PUBLIC_API}/media/file/upload`,
+      headers: headers,
       retryDelays: [0, 3000, 6000, 12_000, 24_000],
       chunkSize: 20_000,
       metadata: {
@@ -538,6 +547,10 @@ export default function FormTeks() {
         duration,
         isWatermark: "false", // hardcode
       },
+      onBeforeRequest: function (req) {
+        var xhr = req.getUnderlyingObject()
+        xhr.withCredentials = true
+      },
       onError: async (e: any) => {
         console.log("Error upload :", e);
         error(e);

components/form/content/teks-update-form.tsx

@@ -159,7 +159,7 @@ export default function FormTeksUpdate() {
           // setValue("categoryId", findCategory.id);
           setSelectedCategory(findCategory.id); // Set the selected category
           const response = await getTagsBySubCategoryId(findCategory.id);
-          setTags(response?.data.data);
+          setTags(response?.data?.data);
         }
       }
     } catch (error) {

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

@@ -204,7 +204,7 @@ export default function FormVideoDetail() {
           // setValue("categoryId", findCategory.id);
           setSelectedCategory(findCategory.id); // Set the selected category
           const response = await getTagsBySubCategoryId(findCategory.id);
-          setTags(response?.data.data);
+          setTags(response?.data?.data);
         }
       }
     } catch (error) {

components/form/content/video-form.tsx

@@ -52,6 +52,7 @@ import Image from "next/image";
 import { error, loading } from "@/config/swal";
 import { Item } from "@radix-ui/react-dropdown-menu";
 import dynamic from "next/dynamic";
+import { getCsrfToken } from "@/service/auth";
 
 const CustomEditor = dynamic(
   () => {
@@ -395,7 +396,7 @@ export default function FormVideo() {
           // setValue("categoryId", findCategory.id);
           setSelectedCategory(findCategory.id); // Set the selected category
           const response = await getTagsBySubCategoryId(findCategory.id);
-          setTags(response?.data.data);
+          setTags(response?.data?.data);
         }
       }
     } catch (error) {
@@ -466,7 +467,7 @@ export default function FormVideo() {
         MySwal.fire("Error", response?.message, "error");
         return;
       }
-      Cookies.set("idCreate", response?.data.data, { expires: 1 });
+      Cookies.set("idCreate", response?.data?.data, { expires: 1 });
       id = response?.data?.data;
 
       // Upload Thumbnail
@@ -526,9 +527,16 @@ export default function FormVideo() {
 
     // const placements = getPlacement(file.placements);
     // console.log("Placementttt:  : ", placements);
+    const resCsrf = await getCsrfToken();
+    const csrfToken = resCsrf?.data?.token;
+    console.log("CSRF TOKEN : ", csrfToken);
+    const headers = {
+      "X-XSRF-TOKEN": csrfToken
+    };
 
     const upload = new Upload(file, {
       endpoint: `${process.env.NEXT_PUBLIC_API}/media/file/upload`,
+      headers: headers,
       retryDelays: [0, 3000, 6000, 12_000, 24_000],
       chunkSize: 20_000,
       metadata: {
@@ -538,6 +546,10 @@ export default function FormVideo() {
         duration,
         isWatermark: "false", // hardcode
       },
+      onBeforeRequest: function (req) {
+        var xhr = req.getUnderlyingObject()
+        xhr.withCredentials = true
+      },
       onError: async (e: any) => {
         console.log("Error upload :", e);
         error(e);

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

@@ -170,7 +170,7 @@ export default function FormVideoUpdate() {
           // setValue("categoryId", findCategory.id);
           setSelectedCategory(findCategory.id); // Set the selected category
           const response = await getTagsBySubCategoryId(findCategory.id);
-          setTags(response?.data.data);
+          setTags(response?.data?.data);
         }
       }
     } catch (error) {

components/landing-page/header-management.tsx

@@ -25,14 +25,14 @@ const HeaderManagement = () => {
     async function getProvinces() {
       const response = await getListPorvinces();
 
-      // console.log(response?.data.data);
+      // console.log(response?.data?.data);
       setProvince(response?.data?.data);
     }
 
     // async function getDisticts() {
     //   const response = await getListDistricts();
-    //   console.log(response?.data.data);
+    //   console.log(response?.data?.data);
-    //   setDistrict(response?.data.data);
+    //   setDistrict(response?.data?.data);
     // }
     initState();
     getProvinces(); // getDisticts();

components/landing-page/sidebar-management.tsx

@@ -26,14 +26,14 @@ const SidebarManagement = () => {
     async function getProvinces() {
       const response = await getListPorvinces();
 
-      // console.log(response?.data.data);
+      // console.log(response?.data?.data);
       setProvince(response?.data?.data);
     }
 
     // async function getDisticts() {
     //   const response = await getListDistricts();
-    //   console.log(response?.data.data);
+    //   console.log(response?.data?.data);
-    //   setDistrict(response?.data.data);
+    //   setDistrict(response?.data?.data);
     // }
     initState();
     getProvinces(); // getDisticts();

components/partials/auth/login-form.tsx

@@ -11,7 +11,7 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { z } from "zod";
 import { cn, setCookiesEncrypt } from "@/lib/utils";
 import { Loader2 } from "lucide-react";
-import { getCsrfToken, getProfile, login } from "@/service/auth";
+import { getProfile, login } from "@/service/auth";
 import { toast } from "sonner";
 import { Link, useRouter } from "@/components/navigation";
 import { warning } from "@/lib/swal";

components/partials/header/notifications.tsx

@@ -127,7 +127,7 @@ const Notifications = () => {
         </DropdownMenuLabel>
         <div className="h-[300px] xl:h-[350px]">
           <ScrollArea className="h-full">
-            {notifications.map((item: Notification, index: number) => (
+            {notifications?.map((item: Notification, index: number) => (
               <DropdownMenuItem
                 key={`inbox-${index}`}
                 className="flex gap-9 py-2 px-4 cursor-pointer group "

service/http-config/axios-interceptor-instance.ts

@@ -1,6 +1,6 @@
 import axios from "axios";
 import Cookies from "js-cookie";
-import { login } from "../auth";
+import { getCsrfToken, login } from "../auth";
 
 const baseURL = "https://netidhub.com/api/";
 
@@ -33,9 +33,11 @@ axiosInterceptorInstance.interceptors.request.use(
 // Response interceptor
 axiosInterceptorInstance.interceptors.response.use(
   (response) => {
+    console.log("Response interceptor : ", response);
     return response;
   },
   async function (error) {
+    console.log("Error interceptor : ", error.response.status);
     const originalRequest = error.config;
     if (error.response.status === 401 && !originalRequest._retry) {
       originalRequest._retry = true;

service/http-config/http-interceptor-service.ts

@@ -1,6 +1,7 @@
 import { useRouter } from "next/navigation";
 import axiosInterceptorInstance from "./axios-interceptor-instance";
 import Cookies from "js-cookie";
+import { getCsrfToken } from "../auth";
 
 export async function httpGetInterceptor(pathUrl: any) {
   const pathname = window.location.pathname;
@@ -35,8 +36,20 @@ export async function httpPostInterceptor(
   data?: any,
   headers?: any
 ) {
+  const resCsrf = await getCsrfToken();
+  const csrfToken = resCsrf?.data?.token;
+
+  const defaultHeaders = {
+    "Content-Type": "application/json",
+  };
+  const mergedHeaders = {
+    ...defaultHeaders,
+    ...headers,
+    ...(csrfToken ? { "X-XSRF-TOKEN": csrfToken } : {}),
+  };
+
   const response = await axiosInterceptorInstance
-    .post(pathUrl, data, headers)
+    .post(pathUrl, data, { headers: mergedHeaders })
     .catch((error) => error.response);
   console.log("Response interceptor : ", response);
   if (response?.status == 200 || response?.status == 201) {
@@ -64,8 +77,20 @@ export async function httpPutInterceptor(
   data: any,
   headers?: any
 ) {
+  const resCsrf = await getCsrfToken();
+  const csrfToken = resCsrf?.data?.token;
+
+  const defaultHeaders = {
+    "Content-Type": "application/json",
+  };
+  const mergedHeaders = {
+    ...defaultHeaders,
+    ...headers,
+    ...(csrfToken ? { "X-XSRF-TOKEN": csrfToken } : {}),
+  };
+
   const response = await axiosInterceptorInstance
-    .put(pathUrl, data, { headers })
+    .put(pathUrl, data, { headers: mergedHeaders })
     .catch((error) => error.response);
   console.log("Response interceptor : ", response);
   if (response?.status == 200 || response?.status == 201) {
@@ -89,8 +114,19 @@ export async function httpPutInterceptor(
 }
 
 export async function httpDeleteInterceptor(pathUrl: any) {
+  const resCsrf = await getCsrfToken();
+  const csrfToken = resCsrf?.data?.token;
+
+  const defaultHeaders = {
+    "Content-Type": "application/json",
+  };
+  const mergedHeaders = {
+    ...defaultHeaders,
+    ...(csrfToken ? { "X-XSRF-TOKEN": csrfToken } : {}),
+  };
+
   const response = await axiosInterceptorInstance
-    .delete(pathUrl)
+    .delete(pathUrl, { headers: mergedHeaders})
     .catch((error) => error.response);
   console.log("Response interceptor : ", response);
   if (response?.status == 200 || response?.status == 201) {