diff --git a/public/img/3db9b189-72dd-4a9c-947c-1833f18695c0.png b/public/img/3db9b189-72dd-4a9c-947c-1833f18695c0.png
new file mode 100644
index 00000000..b4ef2a39
Binary files /dev/null and b/public/img/3db9b189-72dd-4a9c-947c-1833f18695c0.png differ
diff --git a/src/app/api/portofolio/create/route.ts b/src/app/api/portofolio/create/route.ts
index 7b28b78c..2a89f55e 100644
--- a/src/app/api/portofolio/create/route.ts
+++ b/src/app/api/portofolio/create/route.ts
@@ -17,7 +17,6 @@ export async function POST(req: Request) {
         masterBidangBisnisId: body.masterBidangBisnisId,
       },
     });
-    console.log(data)
 
     return NextResponse.json({ status: 201, success: true });
   }
diff --git a/src/app/api/profile/create/route.ts b/src/app/api/profile/create/route.ts
index 6f984be7..012231e5 100644
--- a/src/app/api/profile/create/route.ts
+++ b/src/app/api/profile/create/route.ts
@@ -5,7 +5,7 @@ import { NextResponse } from "next/server";
 export async function POST(req: Request) {
   if (req.method === "POST") {
     const body = await req.json();
-    myConsole(body);
+    // myConsole(body);
 
     const data = await prisma.profile.create({
       data: {
diff --git a/src/app/api/profile/foto/[name]/route.ts b/src/app/api/profile/foto/[name]/route.ts
index 9d4a9101..c1d3a267 100644
--- a/src/app/api/profile/foto/[name]/route.ts
+++ b/src/app/api/profile/foto/[name]/route.ts
@@ -1,11 +1,22 @@
 import { NextRequest, NextResponse } from "next/server";
-import fs from 'fs'
+import fs from "fs";
 
-export async function GET(req: NextRequest, { params }: { params: { name: string } }) {
-    const fl = fs.readFileSync(`./public/img/${params.name}`)
+export async function GET(
+  req: NextRequest,
+  { params }: { params: { name: string } }
+) {
+  if (!fs.existsSync(`./public/img/${params.name}`)) {
+    const fl = fs.readFileSync(`./public/aset/avatar.png`);
     return new NextResponse(fl, {
-        headers: {
-            "Content-Type": "image/png"
-        }
-    })
-}
\ No newline at end of file
+      headers: {
+        "Content-Type": "image/png",
+      },
+    });
+  }
+  const fl = fs.readFileSync(`./public/img/${params.name}`);
+  return new NextResponse(fl, {
+    headers: {
+      "Content-Type": "image/png",
+    },
+  });
+}
diff --git a/src/app_modules/home/view.tsx b/src/app_modules/home/view.tsx
index dd424d84..f0ef46ac 100644
--- a/src/app_modules/home/view.tsx
+++ b/src/app_modules/home/view.tsx
@@ -35,8 +35,11 @@ import { useRouter } from "next/navigation";
 import { useAtom } from "jotai";
 import { gs_token } from "./state/global_state";
 import { loadDataProfile } from "../katalog/profile/fun/fun_get_profile";
-import { gs_profile } from "../katalog/profile/state/global_state";
+import { gs_fotoProfile, gs_profile } from "../katalog/profile/state/global_state";
 import { loadListPortofolio } from "../katalog/portofolio/fun/fun_get_all_portofolio";
+import { gs_ListPortofolio } from "../katalog/portofolio/state/global_state";
+import { myConsole } from "@/app/fun/my_console";
+import { getFotoProfile } from "../katalog/profile/api/get-foto-profile";
 
 const listHalaman = [
   {
@@ -99,10 +102,19 @@ export default function HomeView() {
     loadDataProfile(setProfile);
   }, []);
 
-  // const [listPorto, setListPorto] = useState<any | null>(null);
-  // useShallowEffect(() => {
-  //   loadListPortofolio(profile?.id).then((res) => setListPorto(res));
-  // }, [profile?.id]);
+  const [foto, setFoto] = useAtom(gs_fotoProfile);
+  useShallowEffect(() => {
+    if (profile?.imagesId === undefined) {
+      return myConsole("Waiting data");
+    } else {
+      getFotoProfile(profile?.imagesId).then((v) => setFoto(v?.url));
+    }
+  }, [profile?.imagesId]);
+
+  const [listPorto, setListPorto] = useAtom(gs_ListPortofolio)
+  useShallowEffect(() => {
+    loadListPortofolio(profile?.id).then((res) => setListPorto(res));
+  }, [profile?.id]);
 
   return (
     <>
diff --git a/src/app_modules/katalog/profile/edit/view.tsx b/src/app_modules/katalog/profile/edit/view.tsx
index 80383563..9f7a80d5 100644
--- a/src/app_modules/katalog/profile/edit/view.tsx
+++ b/src/app_modules/katalog/profile/edit/view.tsx
@@ -18,7 +18,7 @@ export default function EditProfile({ data }: { data: any }) {
   const router = useRouter();
 
   //Get data profile
-  const [profile, setProfile] = useState(data)
+  const [profile, setProfile] = useAtom(gs_profile)
   useShallowEffect(() => {
     loadDataProfile(setProfile);
   }, []);
diff --git a/src/app_modules/katalog/profile/state/global_state.ts b/src/app_modules/katalog/profile/state/global_state.ts
index c5101f15..0bdc53d3 100644
--- a/src/app_modules/katalog/profile/state/global_state.ts
+++ b/src/app_modules/katalog/profile/state/global_state.ts
@@ -2,5 +2,6 @@ import { atomWithStorage } from "jotai/utils";
 import { getProfile } from "..";
 
 export const gs_profile = atomWithStorage<any | null>("gs_profile", null);
+export const gs_fotoProfile = atomWithStorage<any | null>("gs_fotoProfile" , null)
 
 
diff --git a/src/app_modules/katalog/profile/upload/view.tsx b/src/app_modules/katalog/profile/upload/view.tsx
index 6ed393f3..19ed9a1d 100644
--- a/src/app_modules/katalog/profile/upload/view.tsx
+++ b/src/app_modules/katalog/profile/upload/view.tsx
@@ -4,7 +4,7 @@ import { AspectRatio, FileButton, Image, Paper, Title } from "@mantine/core";
 import { useShallowEffect } from "@mantine/hooks";
 import { useAtom } from "jotai";
 import { loadDataProfile } from "../fun/fun_get_profile";
-import { gs_profile } from "../state/global_state";
+import { gs_fotoProfile, gs_profile } from "../state/global_state";
 import { getFotoProfile } from "../api/get-foto-profile";
 import { useState } from "react";
 import { ApiHipmi } from "@/app/lib/api";
@@ -16,7 +16,7 @@ export default function UploadFotoProfile() {
     loadDataProfile(setProfile);
   }, []);
 
-  const [foto, setFoto] = useState<any | null>(null);
+  const [foto, setFoto] = useAtom(gs_fotoProfile)
   useShallowEffect(() => {
     if (profile?.imagesId === undefined || profile?.imagesId === null) {
       myConsole("Waiting data");
@@ -29,7 +29,7 @@ export default function UploadFotoProfile() {
     <>
     {/* {JSON.stringify(foto)} */}
       <AspectRatio ratio={1 / 1} >
-       <Paper  p={"lg"}>
+       <Paper  p={"lg"} shadow="xl">
        {foto ? <Image alt="" src={ApiHipmi.get_foto + `${foto}`} /> : <Image alt="" src={"/aset/avatar.png"} />}
        </Paper>
       </AspectRatio>
diff --git a/src/app_modules/katalog/profile/view/view.tsx b/src/app_modules/katalog/profile/view/view.tsx
index 6a262074..3157037f 100644
--- a/src/app_modules/katalog/profile/view/view.tsx
+++ b/src/app_modules/katalog/profile/view/view.tsx
@@ -30,67 +30,70 @@ import { useAtom } from "jotai";
 import { ApiHipmi } from "@/app/lib/api";
 import { loadDataProfile } from "../fun/fun_get_profile";
 import { getFotoProfile } from "../api/get-foto-profile";
+import { gs_fotoProfile, gs_profile } from "../state/global_state";
 
-export default function ProfileView({data}: {data: any}) {
+export default function ProfileView({ data }: { data: any }) {
   const router = useRouter();
 
   //Get data profile
-  const [profile, setProfile] = useState(data);
+  const [profile, setProfile] = useAtom(gs_profile);
   useShallowEffect(() => {
     loadDataProfile(setProfile);
   }, []);
 
-  const [foto, setFoto] = useState<any | null>(null);
+  const [foto, setFoto] = useAtom(gs_fotoProfile);
   useShallowEffect(() => {
-    if (profile?.imagesId === undefined || profile?.imagesId === null) {
-      myConsole("Waiting data");
+    if (profile?.imagesId === undefined) {
+      return myConsole("Waiting data");
     } else {
-      getFotoProfile(profile.imagesId).then((res) => setFoto(res?.url));
+      getFotoProfile(profile?.imagesId).then((v) => setFoto(v?.url));
     }
-    myConsole(profile?.imagesId);
   }, [profile?.imagesId]);
 
   return (
     <>
-    {/* {JSON.stringify(data)} */}
+      {/* {JSON.stringify(data)} */}
       {/* Background dan foto */}
       <Box>
         <Paper bg={"gray"} p={"md"}>
           <Image alt="" src={"/aset/logo.png"} />
         </Paper>
         <Center>
-          {foto ? (
-            <Image
-              radius={50}
-              alt=""
-              src={ApiHipmi.get_foto + `${foto}`}
-              height={100}
-              width={100}
-              sx={{
-                position: "absolute",
-                marginBottom: 10,
-                paddingBottom: 10,
-              }}
-            />
-          ) : (
-            <Image
-              radius={50}
-              alt=""
-              src={"/aset/avatar.png"}
-              height={100}
-              width={100}
-              sx={{
-                position: "absolute",
-                marginBottom: 10,
-                paddingBottom: 10,
-              }}
-            />
-          )}
+          <Paper
+            radius={100}
+            h={105}
+            w={105}
+            sx={{
+              borderStyle: "solid",
+              borderRadius: "100%",
+              borderWidth: 2,
+              marginBottom: 10,
+              paddingBottom: 10,
+              position: "absolute",
+              zIndex: 0,
+            }}
+          >
+            <Center h={101}>
+              <Image
+                src={ApiHipmi.get_foto + foto ?? ""}
+                alt=""
+                radius={100}
+                width={100}
+                height={100}
+                sx={
+                  {
+                    // position: "fixed",
+                  }
+                }
+              />
+            </Center>
+          </Paper>
         </Center>
+
         <Center>
           <ActionIcon
             mr={-70}
-            mt={10}
+            mt={15}
             variant="transparent"
             bg={"gray"}
             radius={50}