diff --git a/src/app/api/user/id/route.ts b/src/app/api/user/id/route.ts
index 25add98e..43869102 100644
--- a/src/app/api/user/id/route.ts
+++ b/src/app/api/user/id/route.ts
@@ -1,4 +1,4 @@
-import { NextResponse } from 'next/server';
+import { NextResponse } from "next/server";
 import { cookies } from "next/headers";
 import { decrypt } from "@/app/(auth)/_lib/decrypt";
 
@@ -7,7 +7,11 @@ export async function GET() {
 
   if (!SESSION_KEY) {
     return NextResponse.json(
-      { success: false, error: "Session key not configured" },
+      {
+        success: false,
+        error: "Session key not configured",
+        message: "Session key not configured",
+      },
       { status: 500 }
     );
   }
@@ -17,7 +21,7 @@ export async function GET() {
 
   if (!token) {
     return NextResponse.json(
-      { success: false, error: "No token found" },
+      { success: false, error: "No token found", message: "No token found" },
       { status: 401 }
     );
   }
@@ -30,19 +34,24 @@ export async function GET() {
 
     if (!decoded) {
       return NextResponse.json(
-        { success: false, error: "Invalid token" },
+        { success: false, error: "Invalid token", message: "Invalid token" },
         { status: 401 }
       );
     }
 
     return NextResponse.json({
       success: true,
+      message: "Berhasil mendapatkan data",
       userId: decoded.id,
     });
   } catch (error) {
     console.error("Error decoding token:", error);
     return NextResponse.json(
-      { success: false, error: "Failed to decode token" },
+      {
+        success: false,
+        error: "Failed to decode token",
+        message: "Failed to decode token",
+      },
       { status: 500 }
     );
   }
diff --git a/src/app/dev/(user)/portofolio/create/[id]/layout.tsx b/src/app/dev/(user)/portofolio/create/[id]/layout.tsx
index 537ae898..f85ba783 100644
--- a/src/app/dev/(user)/portofolio/create/[id]/layout.tsx
+++ b/src/app/dev/(user)/portofolio/create/[id]/layout.tsx
@@ -1,18 +1,10 @@
 import { CreatePortofolioLayout } from "@/app_modules/katalog/portofolio";
 import React from "react";
 
-export default async function Layout({
-  children,
-  params,
-}: {
-  children: React.ReactNode;
-  params: { id: string };
-}) {
+export default function Layout({ children }: { children: React.ReactNode }) {
   return (
     <>
-      <CreatePortofolioLayout profileId={params.id}>
-        {children}
-      </CreatePortofolioLayout>
+      <CreatePortofolioLayout>{children}</CreatePortofolioLayout>
     </>
   );
 }
diff --git a/src/app/dev/(user)/portofolio/create/[id]/page.tsx b/src/app/dev/(user)/portofolio/create/[id]/page.tsx
index ef1d4f9c..94c12680 100644
--- a/src/app/dev/(user)/portofolio/create/[id]/page.tsx
+++ b/src/app/dev/(user)/portofolio/create/[id]/page.tsx
@@ -1,7 +1,6 @@
-import { CreatePortofolio } from "@/app_modules/katalog/portofolio";
 import Portofolio_V3_Create from "@/app_modules/katalog/portofolio/create/new_create";
 
-export default async function Page() {
+export default function Page() {
   return (
     <>
       {/* <CreatePortofolio /> */}
diff --git a/src/app/dev/(user)/portofolio/daftar-portofolio/[id]/page.tsx b/src/app/dev/(user)/portofolio/daftar-portofolio/[id]/page.tsx
index 5b2146ad..28e8e756 100644
--- a/src/app/dev/(user)/portofolio/daftar-portofolio/[id]/page.tsx
+++ b/src/app/dev/(user)/portofolio/daftar-portofolio/[id]/page.tsx
@@ -1,6 +1,6 @@
 import { ListDetailPortofolioNew } from "@/app_modules/katalog/portofolio";
 
-export default async function Page() {
+export default function Page() {
   return (
     <>
       <ListDetailPortofolioNew />
diff --git a/src/app/dev/(user)/portofolio/edit/data/[id]/layout.tsx b/src/app/dev/(user)/portofolio/edit/data/[id]/layout.tsx
index d7afbec8..086540a6 100644
--- a/src/app/dev/(user)/portofolio/edit/data/[id]/layout.tsx
+++ b/src/app/dev/(user)/portofolio/edit/data/[id]/layout.tsx
@@ -1,7 +1,7 @@
 import { LayoutPortofolio_EditDataBisnis } from "@/app_modules/katalog/portofolio";
 import React from "react";
 
-export default async function Layout({
+export default function Layout({
   children,
 }: {
   children: React.ReactNode;
diff --git a/src/app/dev/(user)/portofolio/edit/data/[id]/page.tsx b/src/app/dev/(user)/portofolio/edit/data/[id]/page.tsx
index 23e0b3c4..991d3519 100644
--- a/src/app/dev/(user)/portofolio/edit/data/[id]/page.tsx
+++ b/src/app/dev/(user)/portofolio/edit/data/[id]/page.tsx
@@ -1,11 +1,10 @@
-import { Portofolio_EditDataBisnis } from "@/app_modules/katalog/portofolio";
 import Portofolio_V3_EditDataBisnis from "@/app_modules/katalog/portofolio/edit/data/ui_new_edit_data";
 
-export default async function Page() {
+export default function Page() {
   return (
     <>
       {/* <Portofolio_EditDataBisnis /> */}
-      <Portofolio_V3_EditDataBisnis/>
+      <Portofolio_V3_EditDataBisnis />
     </>
   );
 }
diff --git a/src/app/dev/(user)/portofolio/edit/logo/[id]/layout.tsx b/src/app/dev/(user)/portofolio/edit/logo/[id]/layout.tsx
index 32425b82..0cc6189d 100644
--- a/src/app/dev/(user)/portofolio/edit/logo/[id]/layout.tsx
+++ b/src/app/dev/(user)/portofolio/edit/logo/[id]/layout.tsx
@@ -1,7 +1,7 @@
 import { LayoutPortofolio_EditLogoBisnis } from "@/app_modules/katalog/portofolio";
 import React from "react";
 
-export default async function Layout({
+export default function Layout({
     children,
   }: {
     children: React.ReactNode;
diff --git a/src/app/dev/(user)/portofolio/edit/logo/[id]/page.tsx b/src/app/dev/(user)/portofolio/edit/logo/[id]/page.tsx
index 40c4ef61..2c734e11 100644
--- a/src/app/dev/(user)/portofolio/edit/logo/[id]/page.tsx
+++ b/src/app/dev/(user)/portofolio/edit/logo/[id]/page.tsx
@@ -1,6 +1,6 @@
 import { Portofolio_EditLogoBisnis } from "@/app_modules/katalog/portofolio";
 
-export default async function Page() {
+export default function Page() {
   return (
     <>
       <Portofolio_EditLogoBisnis />
diff --git a/src/app/dev/(user)/portofolio/edit/medsos/[id]/layout.tsx b/src/app/dev/(user)/portofolio/edit/medsos/[id]/layout.tsx
index 095732f9..52e7048d 100644
--- a/src/app/dev/(user)/portofolio/edit/medsos/[id]/layout.tsx
+++ b/src/app/dev/(user)/portofolio/edit/medsos/[id]/layout.tsx
@@ -1,7 +1,7 @@
 import { LayoutPortofolio_EditMedsosBisnis } from "@/app_modules/katalog/portofolio";
 import React from "react";
 
-export default async function Layout({
+export default function Layout({
   children,
 }: {
   children: React.ReactNode;
diff --git a/src/app/dev/(user)/portofolio/edit/medsos/[id]/page.tsx b/src/app/dev/(user)/portofolio/edit/medsos/[id]/page.tsx
index 601539f0..13bda6bb 100644
--- a/src/app/dev/(user)/portofolio/edit/medsos/[id]/page.tsx
+++ b/src/app/dev/(user)/portofolio/edit/medsos/[id]/page.tsx
@@ -1,13 +1,6 @@
 import { Portofolio_EditMedsosBisnis } from "@/app_modules/katalog/portofolio";
-import { Portofolio_geOnetMedsosById } from "@/app_modules/katalog/portofolio/fun/get/get_one_medsos_by_id";
-import _ from "lodash";
-
-export default async function Page() {
-  // let portoId = params.id;
-  // const dataMedsos = await Portofolio_geOnetMedsosById(portoId).then((res) =>
-  //   _.omit(res, ["active", "createdAt", "updatedAt", "portofolioId"])
-  // );
 
+export default function Page() {
   return (
     <>
       <Portofolio_EditMedsosBisnis />
diff --git a/src/app/dev/(user)/portofolio/main/[id]/layout.tsx b/src/app/dev/(user)/portofolio/main/[id]/layout.tsx
index b6c68e76..d514ed1e 100644
--- a/src/app/dev/(user)/portofolio/main/[id]/layout.tsx
+++ b/src/app/dev/(user)/portofolio/main/[id]/layout.tsx
@@ -1,14 +1,9 @@
-import { funGetUserIdByToken } from "@/app_modules/_global/fun/get";
 import { PortofolioLayoutNew } from "@/app_modules/katalog/portofolio";
 
-export default async function Layout({ children, }: { children: any;  }) {
-  const userLoginId = await funGetUserIdByToken();
-
+export default function Layout({ children }: { children: any }) {
   return (
     <>
-      <PortofolioLayoutNew userLoginId={userLoginId}>
-        {children}
-      </PortofolioLayoutNew>
+      <PortofolioLayoutNew>{children}</PortofolioLayoutNew>
     </>
   );
 }
diff --git a/src/app/dev/(user)/portofolio/main/[id]/page.tsx b/src/app/dev/(user)/portofolio/main/[id]/page.tsx
index 741c8aff..dc4954d3 100644
--- a/src/app/dev/(user)/portofolio/main/[id]/page.tsx
+++ b/src/app/dev/(user)/portofolio/main/[id]/page.tsx
@@ -1,16 +1,10 @@
-import { funGetUserIdByToken } from "@/app_modules/_global/fun/get";
 import { Portofolio_UiDetailNew } from "@/app_modules/katalog/portofolio";
 
 const mapboxToken = process.env.MAPBOX_TOKEN!;
-export default async function Page() {
-  const userLoginId = await funGetUserIdByToken()
-
+export default function Page() {
   return (
     <>
-      <Portofolio_UiDetailNew
-        mapboxToken={mapboxToken}
-        userLoginId={userLoginId}
-      />
+      <Portofolio_UiDetailNew mapboxToken={mapboxToken} />
     </>
   );
 }
diff --git a/src/app_modules/katalog/portofolio/create/layout.tsx b/src/app_modules/katalog/portofolio/create/layout.tsx
index 684fdf4b..5f640732 100644
--- a/src/app_modules/katalog/portofolio/create/layout.tsx
+++ b/src/app_modules/katalog/portofolio/create/layout.tsx
@@ -8,19 +8,11 @@ import UI_NewLayoutTamplate, {
 
 export default function CreatePortofolioLayout({
   children,
-  profileId,
 }: {
   children: any;
-  profileId: any;
 }) {
   return (
     <>
-      {/* <UIGlobal_LayoutTamplate
-        header={<UIGlobal_LayoutHeaderTamplate title="Tambah Portofolio" />}
-      >
-        {children}
-      </UIGlobal_LayoutTamplate> */}
-
       <UI_NewLayoutTamplate>
         <UI_NewHeader>
           <Component_Header title="Tambah Portofolio" />
diff --git a/src/app_modules/katalog/portofolio/ui/ui_detail_portofolio_new.tsx b/src/app_modules/katalog/portofolio/ui/ui_detail_portofolio_new.tsx
index 3286531f..d19e2409 100644
--- a/src/app_modules/katalog/portofolio/ui/ui_detail_portofolio_new.tsx
+++ b/src/app_modules/katalog/portofolio/ui/ui_detail_portofolio_new.tsx
@@ -1,17 +1,38 @@
-'use client'
+"use client";
 import { Stack } from "@mantine/core";
 import Portofolio_UiDetailDataNew from "./ui_detail_data_new";
 import Portofolio_UiMapNew from "./ui_detail_map_new";
 import Portofolio_UiSosialMediaNew from "./ui_detail_media_new";
 import ComponentPortofolio_ButtonDeleteNew from "../component/button_delete_new";
+import { apiNewGetUserIdByToken } from "@/app_modules/_global/lib/api_fetch_global";
+import { useShallowEffect } from "@mantine/hooks";
+import { useState } from "react";
 
 export default function Portofolio_UiDetailNew({
   mapboxToken,
-  userLoginId,
 }: {
   mapboxToken: string;
-  userLoginId: string
 }) {
+  const [userLoginId, setUserLoginId] = useState("");
+
+  useShallowEffect(() => {
+    onLoadDataUser();
+  }, []);
+
+  async function onLoadDataUser() {
+    try {
+      const response = await apiNewGetUserIdByToken();
+      if (response.success) {
+        setUserLoginId(response.userId);
+      } else {
+        console.error("Error get user id", response.message);
+        setUserLoginId("");
+      }
+    } catch (error) {
+      console.error("Error get user id", error);
+      setUserLoginId("");
+    }
+  }
   return (
     <>
       <Stack mb={"lg"}>
@@ -22,4 +43,4 @@ export default function Portofolio_UiDetailNew({
       </Stack>
     </>
   );
-}
\ No newline at end of file
+}
diff --git a/src/app_modules/katalog/portofolio/ui/ui_layout_new.tsx b/src/app_modules/katalog/portofolio/ui/ui_layout_new.tsx
index 8da98463..0cd68eb5 100644
--- a/src/app_modules/katalog/portofolio/ui/ui_layout_new.tsx
+++ b/src/app_modules/katalog/portofolio/ui/ui_layout_new.tsx
@@ -5,29 +5,38 @@ import UI_NewLayoutTamplate, {
   UI_NewHeader,
 } from "@/app_modules/_global/ui/V2_layout_tamplate";
 import ComponentPortofolio_ButtonMoreNew from "../component/button_more_new";
+import { useState } from "react";
+import { useShallowEffect } from "@mantine/hooks";
+import { apiNewGetUserIdByToken } from "@/app_modules/_global/lib/api_fetch_global";
 
 export default function PortofolioLayoutNew({
   children,
-  userLoginId,
 }: {
   children: any;
-  userLoginId: string;
 }) {
+  const [userLoginId, setUserLoginId] = useState("");
+
+  useShallowEffect(() => {
+    onLoadDataUser();
+  }, []);
+
+  async function onLoadDataUser() {
+    try {
+      const response = await apiNewGetUserIdByToken();
+      if (response.success) {
+        setUserLoginId(response.userId);
+      } else {
+        console.error("Error get user id", response.message);
+        setUserLoginId("");
+      }
+    } catch (error) {
+      console.error("Error get user id", error);
+      setUserLoginId("");
+    }
+  }
+
   return (
     <>
-      {/* <UIGlobal_LayoutTamplate
-        header={
-          <UIGlobal_LayoutHeaderTamplate
-            title="Detail Portofolio"
-            customButtonRight={
-              <ComponentPortofolio_ButtonMoreNew userLoginId={userLoginId} />
-            }
-          />
-        }
-      >
-        {children}
-      </UIGlobal_LayoutTamplate> */}
-
       <UI_NewLayoutTamplate>
         <UI_NewHeader>
           <Component_Header