fix ( middleware )

deskripsi:
- fix access api melalui middleware di: home, profile dan portofolio

src/app_modules/katalog/main/layout_new.tsx

@@ -22,7 +22,7 @@ export default function LayoutKatalogNew({ children }: { children: any }) {
          setLoading(true)
          const response = await apiGetUserProfile(`?profile=${param.id}`)
          const response2 = await funGetUserIdByToken()
-         if (response.success) {
+         if (response) {
             setAuthorId(response.data.id)
             setUserRoleId(response.data.masterUserRoleId)
             setUserLoginId(response2)

src/app_modules/katalog/portofolio/component/button_delete_new.tsx

@@ -1,98 +1,103 @@
 import { funGetUserIdByToken } from "@/app_modules/_global/fun/get";
-import { ComponentGlobal_NotifikasiBerhasil, ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global";
+import {
+  ComponentGlobal_NotifikasiBerhasil,
+  ComponentGlobal_NotifikasiGagal,
+} from "@/app_modules/_global/notif_global";
 import { UIGlobal_Modal } from "@/app_modules/_global/ui";
 import { Button } from "@mantine/core";
 import { useShallowEffect } from "@mantine/hooks";
 import { IconTrash } from "@tabler/icons-react";
 import { useParams, useRouter } from "next/navigation";
 import { useState } from "react";
-import { apiDeletePortofolio, apiGetOnePortofolioById } from "../lib/api_portofolio";
+import {
+  apiDeletePortofolio,
+  apiGetOnePortofolioById,
+} from "../lib/api_portofolio";
 import { IDetailPortofolioBisnis } from "../lib/type_portofolio";
 import { MainColor } from "@/app_modules/_global/color";
+import { apiGetUserId } from "@/app_modules/_global/lib/api_user";
+import { clientLogger } from "@/util/clientLogger";
 
-export default function ComponentPortofolio_ButtonDeleteNew() {
-   const param = useParams<{ id: string }>()
-   const [openModal, setModal] = useState(false)
-   const [loadingDel, setLoadingDel] = useState(false)
-   const [userLoginId, setUserLoginId] = useState("")
-   const [dataPorto, setDataPorto] = useState<IDetailPortofolioBisnis>()
-   const router = useRouter()
+export default function ComponentPortofolio_ButtonDeleteNew({
+  userLoginId,
+}: {
+  userLoginId: string;
+}) {
+  const param = useParams<{ id: string }>();
+  const [openModal, setModal] = useState(false);
+  const [loadingDel, setLoadingDel] = useState(false);
+  const [dataPorto, setDataPorto] = useState<IDetailPortofolioBisnis>();
+  const router = useRouter();
 
-
-   async function onDelete() {
-      try {
-         setLoadingDel(true)
-         const response = await apiDeletePortofolio(param.id)
-         if (response.success) {
-            ComponentGlobal_NotifikasiBerhasil(response.message)
-            router.back()
-         } else {
-            ComponentGlobal_NotifikasiGagal(response.message);
-         }
-      } catch (error) {
-         console.error(error)
-         ComponentGlobal_NotifikasiGagal("Gagal menghapus portofolio");
-      } finally {
-         setLoadingDel(false)
+  async function onDelete() {
+    try {
+      setLoadingDel(true);
+      const response = await apiDeletePortofolio(param.id);
+      if (response) {
+        ComponentGlobal_NotifikasiBerhasil(response.message);
+        router.back();
+      } else {
+        ComponentGlobal_NotifikasiGagal(response?.message);
       }
-   }
+    } catch (error) {
+      clientLogger.error("Error delete portofolio", error);
+      ComponentGlobal_NotifikasiGagal("Gagal menghapus portofolio");
+    } finally {
+      setLoadingDel(false);
+    }
+  }
 
-   async function funGetPortofolio() {
-      try {
-         const response = await apiGetOnePortofolioById(param.id, "bisnis")
-         const response2 = await funGetUserIdByToken()
-         if (response.success) {
-            setDataPorto(response.data)
-            setUserLoginId(response2)
-         }
-      } catch (error) {
-         console.error(error);
+  async function funGetPortofolio() {
+    try {
+      const response = await apiGetOnePortofolioById(param.id, "bisnis");
+      if (response) {
+        setDataPorto(response.data);
       }
-   }
+    } catch (error) {
+      console.error("Error get data button delete:", error);
+    }
+  }
 
-   useShallowEffect(() => {
-      funGetPortofolio()
-   }, []);
+  useShallowEffect(() => {
+    funGetPortofolio();
+  }, []);
 
+  return (
+    <>
+      {userLoginId === dataPorto?.authorId && (
+        <Button
+          radius={"xl"}
+          bg={MainColor.red}
+          color="red"
+          onClick={() => {
+            setModal(true);
+          }}
+        >
+          <IconTrash />
+        </Button>
+      )}
 
-   return (
-      <>
-         {userLoginId === dataPorto?.authorId ? (
-            <Button
-               radius={"xl"}
-               bg={MainColor.red}
-               color="red"
-               onClick={() => {
-                  setModal(true)
-               }}
-            >
-               <IconTrash />
-            </Button>
-         ) : (
-            ""
-         )}
-
-         <UIGlobal_Modal
-            title={"Anda yakin menghapus portofolio ini ?"}
-            opened={openModal}
-            close={() => setModal(false)}
-            buttonKiri={
-               <Button radius={"xl"} onClick={() => setModal(false)}>
-                  Batal
-               </Button>
-            }
-            buttonKanan={
-               <Button
-                  radius={"xl"}
-                  color="red"
-                  loaderPosition="center"
-                  loading={loadingDel}
-                  onClick={() => onDelete()}
-               >
-                  Hapus
-               </Button>
-            }
-         />
-      </>
-   )
-}
+      <UIGlobal_Modal
+        title={"Anda yakin menghapus portofolio ini ?"}
+        opened={openModal}
+        close={() => setModal(false)}
+        buttonKiri={
+          <Button radius={"xl"} onClick={() => setModal(false)}>
+            Batal
+          </Button>
+        }
+        buttonKanan={
+          <Button
+            radius={"xl"}
+            color="red"
+            loaderPosition="center"
+            loading={loadingDel}
+            onClick={() => onDelete()}
+          >
+            Hapus
+          </Button>
+        }
+      />
+    </>
+  );
+}

src/app_modules/katalog/portofolio/component/button_more_new.tsx

@@ -89,9 +89,9 @@ export default function ComponentPortofolio_ButtonMoreNew() {
          const response = await apiGetOnePortofolioById(param.id, "bisnis")
          const response3 = await apiGetOnePortofolioById(param.id, "lokasi")
          const response2 = await funGetUserIdByToken()
-         if (response.success) {
+         if (response) {
             setAuthorId(response.data.authorId)
-            setMapId((response3.data?.mapId !== null && response3.data?.mapId !== undefined) ? true : false)
+            setMapId((response3 !== null && response3.data?.mapId !== undefined) ? true : false)
             setUserLoginId(response2)
          }
       } catch (error) {

src/app_modules/katalog/portofolio/component/skeleton_view.tsx

@@ -0,0 +1,8 @@
+export {
+
+}
+
+function  Portofolio_SkeletonListPorto() {
+    
+    
+}

src/app_modules/katalog/portofolio/create/view.tsx

@@ -162,30 +162,6 @@ export default function CreatePortofolio({
             />
           </Stack>
 
-          {/* <TextInput
-            styles={{
-              label: {
-                color: MainColor.white,
-              },
-              // input: {
-              //   backgroundColor: MainColor.white,
-              // },
-              // required: {
-              //   color: MainColor.red,
-              // },
-            }}
-            withAsterisk
-            label="Nomor Telepon "
-            placeholder="Nomor telepon "
-            type="number"
-            onChange={(val) => {
-              setDataPortofolio({
-                ...dataPortofolio,
-                tlpn: val.target.value,
-              });
-            }}
-          /> */}
-
           <Stack spacing={5}>
             <Textarea
               styles={{

src/app_modules/katalog/portofolio/lib/api_portofolio.ts

@@ -1,19 +1,51 @@
 export const apiGetPortofolioByProfile = async (path?: string) => {
-   const response = await fetch(`/api/new/portofolio${(path) ? path : ''}`)
-   return await response.json().catch(() => null)
-}
+  const { token } = await fetch("/api/get-cookie").then((res) => res.json());
+  if (!token) return null;
 
-export const apiGetOnePortofolioById = async (path: string, cat:string) => {
-   const response = await fetch(`/api/new/portofolio/${path}?cat=${cat}`);
-   return await response.json().catch(() => null);
-}
+  const response = await fetch(`/api/new/portofolio${path ? path : ""}`, {
+    headers: {
+      "Content-Type": "application/json",
+      Accept: "application/json",
+      "Access-Control-Allow-Origin": "*",
+      Authorization: `Bearer ${token}`,
+    },
+  });
+
+  if (!response.ok) return null;
+  const data: Record<string, any> = await response.json();
+  return data;
+};
+
+export const apiGetOnePortofolioById = async (path: string, cat: string) => {
+  const { token } = await fetch("/api/get-cookie").then((res) => res.json());
+  if (!token) return null;
+
+  const response = await fetch(`/api/new/portofolio/${path}?cat=${cat}`, {
+    headers: {
+      "Content-Type": "application/json",
+      Accept: "application/json",
+      "Access-Control-Allow-Origin": "*",
+      Authorization: `Bearer ${token}`,
+    },
+  });
+
+  if (!response.ok) return null;
+  const data: Record<string, any> = await response.json();
+  return data;
+};
 
 export const apiDeletePortofolio = async (path: string) => {
-   const response = await fetch(`/api/new/portofolio/${path}`, {
-      method: "DELETE",
-      headers: {
-         "Content-Type": "application/json",
-      },
-   });
-   return await response.json().catch(() => null);
-}
+  const { token } = await fetch("/api/get-cookie").then((res) => res.json());
+  if (!token) return null;
+
+  const response = await fetch(`/api/new/portofolio/${path}`, {
+    method: "DELETE",
+    headers: {
+      "Content-Type": "application/json",
+      Authorization: `Bearer ${token}`,
+    },
+  });
+
+
+  return await response.json().catch(() => null);
+};

src/app_modules/katalog/portofolio/ui/ui_detail_data_new.tsx

@@ -38,7 +38,7 @@ export default function Portofolio_UiDetailDataNew() {
     try {
       setLoading(true);
       const response = await apiGetOnePortofolioById(param.id, "bisnis");
-      if (response.success) {
+      if (response) {
         setDataPorto(response.data);
       }
     } catch (error) {

src/app_modules/katalog/portofolio/ui/ui_detail_map_new.tsx

@@ -23,7 +23,7 @@ export default function Portofolio_UiMapNew({ mapboxToken }: { mapboxToken: stri
       try {
          setLoading(true)
          const response = await apiGetOnePortofolioById(param.id, "lokasi");
-         if (response.success) {
+         if (response) {
             setDataPorto(response.data);
          }
       } catch (error) {

src/app_modules/katalog/portofolio/ui/ui_detail_media_new.tsx

@@ -17,7 +17,7 @@ export default function Portofolio_UiSosialMediaNew() {
       try {
          setLoading(true)
          const response = await apiGetOnePortofolioById(param.id, "sosmed");
-         if (response.success) {
+         if (response) {
             setDataPorto(response.data);
          }
       } catch (error) {

src/app_modules/katalog/portofolio/ui/ui_detail_portofolio_new.tsx

@@ -5,15 +5,21 @@ import Portofolio_UiMapNew from "./ui_detail_map_new";
 import Portofolio_UiSosialMediaNew from "./ui_detail_media_new";
 import ComponentPortofolio_ButtonDeleteNew from "../component/button_delete_new";
 
-export default function Portofolio_UiDetailNew({ mapboxToken }: { mapboxToken: string }) {
-   return (
-      <>
-         <Stack mb={"lg"}>
-            <Portofolio_UiDetailDataNew />
-            <Portofolio_UiMapNew mapboxToken={mapboxToken} />
-            <Portofolio_UiSosialMediaNew />
-            <ComponentPortofolio_ButtonDeleteNew/>
-         </Stack>
-      </>
-   )
+export default function Portofolio_UiDetailNew({
+  mapboxToken,
+  userLoginId,
+}: {
+  mapboxToken: string;
+  userLoginId: string
+}) {
+  return (
+    <>
+      <Stack mb={"lg"}>
+        <Portofolio_UiDetailDataNew />
+        <Portofolio_UiMapNew mapboxToken={mapboxToken} />
+        <Portofolio_UiSosialMediaNew />
+        <ComponentPortofolio_ButtonDeleteNew userLoginId={userLoginId} />
+      </Stack>
+    </>
+  );
 }

src/app_modules/katalog/portofolio/ui/ui_list_detail_portofolio_new.tsx

@@ -1,59 +1,84 @@
 import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
-import { Box, Center } from "@mantine/core";
+import { Box, Center, Group, Skeleton, Stack } from "@mantine/core";
+import { useShallowEffect } from "@mantine/hooks";
 import { ScrollOnly } from "next-scroll-loader";
+import { useParams } from "next/navigation";
 import { useState } from "react";
 import { ComponentPortofolio_DaftarBoxView } from "../component/card_view_daftar";
-import { portofolio_funGetAllDaftarByid } from "../fun/get/get_all_portofolio";
-import { MODEL_PORTOFOLIO } from "../model/interface";
-import { useParams } from "next/navigation";
-import { useShallowEffect } from "@mantine/hooks";
 import { apiGetPortofolioByProfile } from "../lib/api_portofolio";
+import { MODEL_PORTOFOLIO } from "../model/interface";
+import _ from "lodash";
+import { ComponentGlobal_CardStyles } from "@/app_modules/_global/component";
+import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
 
 export default function Portofolio_UiListDetailNew() {
-   const param = useParams<{ id: string }>()
-   const profileId = param.id
-   const [data, setData] = useState<MODEL_PORTOFOLIO[]>([])
-   const [activePage, setActivePage] = useState(1)
+  const param = useParams<{ id: string }>();
+  const profileId = param.id;
+  const [data, setData] = useState<MODEL_PORTOFOLIO[] | null>(null);
+  const [activePage, setActivePage] = useState(1);
 
-   async function getPortofolio() {
-      try {
-         const response = await apiGetPortofolioByProfile(`?profile=${param.id}&cat=portofolio&page=1`)
-         if (response.success) {
-            setData(response.data);
-         }
-      } catch (error) {
-         console.error(error);
+  async function getPortofolio() {
+    try {
+      const response = await apiGetPortofolioByProfile(
+        `?profile=${param.id}&cat=portofolio&page=1`
+      );
+      if (response) {
+        setData(response.data);
       }
-   }
+    } catch (error) {
+      console.error(error);
+    }
+  }
 
+  useShallowEffect(() => {
+    getPortofolio();
+  }, []);
 
-   useShallowEffect(() => {
-      getPortofolio()
-   }, []);
+  if (_.isNull(data))
+    return (
+      <>
+        <Stack>
+          <CustomSkeleton height={80} radius={"md"} width={"100%"} />
+          <CustomSkeleton height={80} radius={"md"} width={"100%"} />
+        </Stack>
+      </>
+    );
 
-   return <>
+  return (
+    <>
       <Box py={5}>
-         <ScrollOnly
-            height="90vh"
-            renderLoading={() => (
-               <Center mt={"lg"}>
-                  <ComponentGlobal_Loader />
-               </Center>
-            )}
-            data={data}
-            setData={setData}
-            moreData={async () => {
-               const loadData = await portofolio_funGetAllDaftarByid({
-                  profileId,
-                  page: activePage + 1,
-               });
-               setActivePage((val) => val + 1);
+        <ScrollOnly
+          height="90vh"
+          renderLoading={() => (
+            <Center mt={"lg"}>
+              <ComponentGlobal_Loader />
+            </Center>
+          )}
+          data={data}
+          setData={setData as any}
+          moreData={async () => {
+            // const loadData = await portofolio_funGetAllDaftarByid({
+            //   profileId,
+            //   page: activePage + 1,
+            // });
 
-               return loadData;
-            }}
-         >
-            {(item) => <ComponentPortofolio_DaftarBoxView data={item} />}
-         </ScrollOnly>
+            try {
+              const response = await apiGetPortofolioByProfile(
+                `?profile=${param.id}&cat=portofolio&page=${activePage + 1}`
+              );
+              if (response) {
+                setActivePage((val) => val + 1);
+
+                return response.data;
+              }
+            } catch (error) {
+              console.error(error);
+            }
+          }}
+        >
+          {(item) => <ComponentPortofolio_DaftarBoxView data={item} />}
+        </ScrollOnly>
       </Box>
-   </>;
-}
+    </>
+  );
+}

src/app_modules/katalog/ui/list_portolio_new.tsx

@@ -19,7 +19,7 @@ export default function ListPortofolioProfileNew() {
       try {
          setLoading(true)
          const response = await apiGetPortofolioByProfile(`?profile=${param.id}&cat=profile`)
-         if (response.success) {
+         if (response) {
             setDataPortofolio(response.data);
          }
       } catch (error) {

src/app_modules/katalog/ui/profile_detail.tsx

@@ -65,7 +65,7 @@ export default function ProfileDetail() {
     try {
       setLoading(true);
       const response = await apiGetUserProfile(`?profile=${param.id}`);
-      if (response.success) {
+      if (response) {
         setDataProfile(response.data);
       }
     } catch (error) {