diff --git a/app/(application)/(user)/maps/[id]/custom-pin.tsx b/app/(application)/(user)/maps/[id]/custom-pin.tsx
index a026a4f..8ea9893 100644
--- a/app/(application)/(user)/maps/[id]/custom-pin.tsx
+++ b/app/(application)/(user)/maps/[id]/custom-pin.tsx
@@ -21,7 +21,7 @@ export default function MapsCustomPin() {
       <ButtonCustom
         onPress={() => {
           console.log(`Simpan maps ${id}`);
-          router.replace(`/portofolio/${id}`);
+          router.back();
         }}
       >
         Simpan
diff --git a/app/(application)/(user)/maps/[id]/edit.tsx b/app/(application)/(user)/maps/[id]/edit.tsx
index 3d0a77a..2688034 100644
--- a/app/(application)/(user)/maps/[id]/edit.tsx
+++ b/app/(application)/(user)/maps/[id]/edit.tsx
@@ -19,7 +19,7 @@ export default function MapsEdit() {
       <ButtonCustom
         onPress={() => {
           console.log(`Simpan maps ${id}`);
-          router.replace(`/portofolio/${id}`);
+          router.back()
         }}
       >
         Simpan
diff --git a/components/Drawer/MenuDrawerDynamicGird.tsx b/components/Drawer/MenuDrawerDynamicGird.tsx
index cba0440..db54a10 100644
--- a/components/Drawer/MenuDrawerDynamicGird.tsx
+++ b/components/Drawer/MenuDrawerDynamicGird.tsx
@@ -1,27 +1,37 @@
 import { AccentColor, MainColor } from "@/constants/color-palet";
-import { ICON_SIZE_MEDIUM, TEXT_SIZE_SMALL } from "@/constants/constans-value";
-import { Ionicons } from "@expo/vector-icons";
+import { TEXT_SIZE_SMALL } from "@/constants/constans-value";
 import { StyleSheet, Text, TouchableOpacity, View } from "react-native";
+import { IMenuDrawerItem } from "../_Interface/types";
 
 const MenuDrawerDynamicGrid = ({ data, columns = 3, onPressItem }: any) => {
   const numColumns = columns;
 
   return (
     <View style={styles.container}>
-      {data.map((item: any, index: any) => (
+      {data.map((item: IMenuDrawerItem, index: any) => (
         <TouchableOpacity
           key={index}
           style={[styles.itemContainer, { flexBasis: `${100 / numColumns}%` }]}
           onPress={() => onPressItem?.(item)}
         >
-          <View style={styles.iconContainer}>
-            <Ionicons
+          <View
+            style={[
+              styles.iconContainer,
+              { backgroundColor: item.color || AccentColor.blue },
+            ]}
+          >
+            {item.icon}
+            {/* <Ionicons
               name={item.icon}
               size={ICON_SIZE_MEDIUM}
               color={item.color || MainColor.white_gray}
-            />
+            /> */}
           </View>
-          <Text style={styles.label}>{item.label}</Text>
+          <Text
+            style={[styles.label, { color: item.color || AccentColor.white }]}
+          >
+            {item.label}
+          </Text>
         </TouchableOpacity>
       ))}
     </View>
@@ -54,4 +64,4 @@ const styles = StyleSheet.create({
     textAlign: "center",
     color: MainColor.white_gray,
   },
-});
\ No newline at end of file
+});
diff --git a/components/_Interface/types.ts b/components/_Interface/types.ts
index ecf36f9..5f2cfe0 100644
--- a/components/_Interface/types.ts
+++ b/components/_Interface/types.ts
@@ -20,7 +20,7 @@ interface ITabs {
 }
 
 interface IMenuDrawerItem {
-  icon: string;
+  icon: React.ReactNode;
   label: string;
   path?: string;
   color?: string;
diff --git a/screens/Portofolio/ListPage.tsx b/screens/Portofolio/ListPage.tsx
index 2e3693d..4ad7416 100644
--- a/screens/Portofolio/ListPage.tsx
+++ b/screens/Portofolio/ListPage.tsx
@@ -1,4 +1,7 @@
 import { IMenuDrawerItem } from "@/components/_Interface/types";
+import { AccentColor } from "@/constants/color-palet";
+import { ICON_SIZE_MEDIUM } from "@/constants/constans-value";
+import { Ionicons } from "@expo/vector-icons";
 
 export const drawerItemsPortofolio = ({
   id,
@@ -6,27 +9,27 @@ export const drawerItemsPortofolio = ({
   id: string;
 }): IMenuDrawerItem[] => [
   {
-    icon: "create",
+    icon: <Ionicons name="create" size={ICON_SIZE_MEDIUM} color={AccentColor.white} />,
     label: "Edit portofolio",
     path: `/(application)/portofolio/${id}/edit`,
   },
   {
-    icon: "camera",
+    icon: <Ionicons name="camera" size={ICON_SIZE_MEDIUM} color={AccentColor.white} />,
     label: "Edit logo ",
     path: `/(application)/portofolio/${id}/edit-logo`,
   },
   {
-    icon: "image",
+    icon: <Ionicons name="image" size={ICON_SIZE_MEDIUM} color={AccentColor.white} />,
     label: "Edit social media ",
     path: `/(application)/portofolio/${id}/edit-social-media`,
   },
   {
-    icon: "add-circle",
+    icon: <Ionicons name="add-circle" size={ICON_SIZE_MEDIUM} color={AccentColor.white} />,
     label: "Edit Map",
     path: `/(application)/maps/${id}/edit`,
   },
   {
-    icon: "create-outline",
+    icon: <Ionicons name="create-outline" size={ICON_SIZE_MEDIUM} color={AccentColor.white} />,
     label: "Custom Pin Map",
     path: `/(application)/maps/${id}/custom-pin`,
   },
diff --git a/screens/Profile/ListPage.tsx b/screens/Profile/ListPage.tsx
index ad62eac..1019b50 100644
--- a/screens/Profile/ListPage.tsx
+++ b/screens/Profile/ListPage.tsx
@@ -1,23 +1,54 @@
 import { IMenuDrawerItem } from "@/components/_Interface/types";
+import { AccentColor, MainColor } from "@/constants/color-palet";
+import { ICON_SIZE_MEDIUM } from "@/constants/constans-value";
+import { Ionicons } from "@expo/vector-icons";
 
-export const drawerItemsProfile = ({ id }: { id: string }): IMenuDrawerItem[] => [
+export const drawerItemsProfile = ({
+  id,
+}: {
+  id: string;
+}): IMenuDrawerItem[] => [
   {
-    icon: "create",
+    icon: (
+      <Ionicons
+        name="create"
+        size={ICON_SIZE_MEDIUM}
+        color={AccentColor.white}
+      />
+    ),
     label: "Edit profile",
     path: `/(application)/profile/${id}/edit`,
   },
   {
-    icon: "camera",
+    icon: (
+      <Ionicons
+        name="camera"
+        size={ICON_SIZE_MEDIUM}
+        color={AccentColor.white}
+      />
+    ),
     label: "Ubah foto profile",
     path: `/(application)/profile/${id}/update-photo`,
   },
   {
-    icon: "image",
+    icon: (
+      <Ionicons
+        name="image"
+        size={ICON_SIZE_MEDIUM}
+        color={AccentColor.white}
+      />
+    ),
     label: "Ubah latar belakang",
     path: `/(application)/profile/${id}/update-background`,
   },
   {
-    icon: "add-circle",
+    icon: (
+      <Ionicons
+        name="add-circle"
+        size={ICON_SIZE_MEDIUM}
+        color={AccentColor.white}
+      />
+    ),
     label: "Tambah portofolio",
     path: `/(application)/portofolio/${id}/create`,
   },
@@ -26,10 +57,27 @@ export const drawerItemsProfile = ({ id }: { id: string }): IMenuDrawerItem[] =>
   //   label: "Dashboard Admin",
   //   path: `/(application)/profile/dashboard-admin`,
   // },
-  { icon: "log-out", label: "Keluar", color: "red", path: "" },
   {
-    icon: "create-outline",
+    icon: (
+      <Ionicons
+        name="log-out"
+        size={ICON_SIZE_MEDIUM}
+        color={AccentColor.white}
+      />
+    ),
+    label: "Keluar",
+    color: MainColor.red,
+    path: "",
+  },
+  {
+    icon: (
+      <Ionicons
+        name="create-outline"
+        size={ICON_SIZE_MEDIUM}
+        color={AccentColor.white}
+      />
+    ),
     label: "Create profile",
     path: `/(application)/profile/${id}/create`,
   },
-];
\ No newline at end of file
+];