Fix: admin map

Deskripsi:
- Fix map image
## No Issue

src/app_modules/admin/_admin_global/_component/comp_admin_load_image.tsx

@@ -56,7 +56,6 @@ export function Admin_ComponentLoadImageLandscape({
         <Image
           onClick={() => {
             setLoading(true);
-
             router.push(RouterAdminGlobal.preview_image({ id: fileId }), {
               scroll: false,
             });

src/app_modules/admin/_admin_global/comp_preview_image_admin.tsx

@@ -1,16 +1,17 @@
 "use client";
 
+import { Box, Center, Image, ScrollArea, Skeleton, Stack, Text } from "@mantine/core";
+import AdminGlobal_ComponentBackButton from "./back_button";
 import { APIs, pathAssetImage } from "@/app/lib";
-import { Box, Center, Image, ScrollArea, Skeleton, Stack } from "@mantine/core";
 import { useShallowEffect } from "@mantine/hooks";
-import { useRouter } from "next/navigation";
 import { useState } from "react";
-import AdminGlobal_ComponentBackButton from "../back_button";
 
-export function Admin_UiImagePreview({ fileId }: { fileId: string }) {
-  const router = useRouter();
+export function Admin_ComponentPreviewImageAdmin({
+  fileId,
+}: {
+  fileId: string;
+}) {
   const [isImage, setIsImage] = useState<boolean | null>(null);
-  const [isLoading, setIsLoading] = useState(false);
 
   const url = APIs.GET({ fileId: fileId });
 
@@ -29,14 +30,16 @@ export function Admin_UiImagePreview({ fileId }: { fileId: string }) {
       console.log(error);
     }
   }
+
   return (
     <>
       <Stack>
         <AdminGlobal_ComponentBackButton />
-
         <Box style={{ zIndex: 0 }} h={"90vh"} pos={"static"} px={"lg"}>
           {isImage === null ? (
-            <Skeleton height={200} radius={"sm"} />
+            <Center>
+              <Skeleton height={300} w={200} radius={"sm"} />
+            </Center>
           ) : isImage ? (
             <ScrollArea h={"100%"}>
               <Center>

src/app_modules/admin/_admin_global/index.ts

@@ -1,7 +1,5 @@
 import { Admin_ComponentLoadImageLandscape } from "./_component/comp_admin_load_image";
 import { Admin_ComponentSkeletonNavbar } from "./_component/comp_admin_skeleton_navbar";
-import { Admin_UiImagePreview } from "./_ui/ui_admin_image_preview";
 
-export { Admin_ComponentLoadImageLandscape };
-export { Admin_UiImagePreview };
-export { Admin_ComponentSkeletonNavbar };
+export { Admin_ComponentLoadImageLandscape, Admin_ComponentSkeletonNavbar };
+

src/app_modules/admin/map/component/comp_detail_data_drawer.tsx

@@ -1,16 +1,7 @@
-import { APIs } from "@/app/lib";
+"use client";
+
 import { MODEL_MAP } from "@/app_modules/map/lib/interface";
-import {
-  AspectRatio,
-  Box,
-  Button,
-  Center,
-  Grid,
-  Image,
-  Stack,
-  Text,
-} from "@mantine/core";
-import { useShallowEffect } from "@mantine/hooks";
+import { Box, Button, Center, Grid, Stack, Text } from "@mantine/core";
 import {
   IconBuildingSkyscraper,
   IconListDetails,
@@ -18,42 +9,17 @@ import {
   IconPhoneCall,
   IconPinned,
 } from "@tabler/icons-react";
-import { useState } from "react";
-import { adminMap_funGetOneById } from "../fun/fun_get_one_by_id";
 import { Admin_ComponentLoadImageLandscape } from "../../_admin_global";
 
 export function ComponentAdminMap_DetailDataDrawer({
-  mapId,
+  data,
 }: {
-  mapId: string;
+  data: MODEL_MAP;
 }) {
-  const [data, setData] = useState<MODEL_MAP>();
-
-  useShallowEffect(() => {
-    onLoadMap(mapId);
-  }, [mapId]);
-
-  async function onLoadMap(mapId: string) {
-    try {
-      const res = await adminMap_funGetOneById({ mapId: mapId });
-      setData(res as any);
-    } catch (error) {
-      console.log(error);
-    }
-  }
-
   return (
     <>
       <Stack>
-        <Admin_ComponentLoadImageLandscape fileId={data?.imageId as any}/>
-        {/* <AspectRatio ratio={1 / 1} mah={300}>
-          <Image
-            radius={"md"}
-            width={300}
-            alt="Photo"
-            src={APIs.GET({ fileId: data?.imageId as string })}
-          />
-        </AspectRatio> */}
+        <Admin_ComponentLoadImageLandscape fileId={data?.imageId as any} />
 
         <Box>
           <Grid>
@@ -97,7 +63,6 @@ export function ComponentAdminMap_DetailDataDrawer({
             </Grid.Col>
           </Grid>
         </Box>
-
         {data ? (
           <Center>
             <Button

src/app_modules/admin/map/component/drawer_detail_map.tsx

@@ -1,11 +1,7 @@
 "use client";
 
 import { MODEL_MAP } from "@/app_modules/map/lib/interface";
-import {
-  Drawer,
-  Group,
-  Text
-} from "@mantine/core";
+import { Drawer, Group, Text } from "@mantine/core";
 import { useShallowEffect } from "@mantine/hooks";
 import _ from "lodash";
 import { useState } from "react";
@@ -55,7 +51,7 @@ export function ComponentAdminMap_Drawer({
         {_.isEmpty(data) ? (
           <ComponentAdminMap_SkeletonDrawer />
         ) : (
-          <ComponentAdminMap_DetailDataDrawer mapId={mapId} />
+          <ComponentAdminMap_DetailDataDrawer data={data} />
         )}
 
         {/* <pre>{JSON.stringify(data, null, 2)}</pre> */}

src/app_modules/admin/map/ui/ui_map_view.tsx

@@ -1,25 +1,23 @@
 "use client";
 
-import { MODEL_MAP } from "@/app_modules/map/lib/interface";
-import ComponentAdminGlobal_IsEmptyData from "../../_admin_global/is_empty_data";
-import { useState } from "react";
+import { APIs } from "@/app/lib";
+import { AccentColor } from "@/app_modules/_global/color/color_pallet";
 import {
   defaultLatLong,
   defaultMapZoom,
 } from "@/app_modules/map/lib/default_lat_long";
-import { Avatar, Image, Paper, Stack, Text } from "@mantine/core";
+import { MODEL_MAP } from "@/app_modules/map/lib/interface";
+import { Avatar, Stack } from "@mantine/core";
 import "mapbox-gl/dist/mapbox-gl.css";
+import { useState } from "react";
 import Map, {
   AttributionControl,
   Marker,
   NavigationControl,
   ScaleControl,
 } from "react-map-gl";
+import ComponentAdminGlobal_IsEmptyData from "../../_admin_global/is_empty_data";
 import { ComponentAdminMap_Drawer } from "../component";
-import { AccentColor } from "@/app_modules/_global/color/color_pallet";
-import { RouterPortofolio } from "@/app/lib/router_hipmi/router_katalog";
-import { RouterMap } from "@/app/lib/router_hipmi/router_map";
-import { APIs } from "@/app/lib";
 
 export function UiAdminMap_MapBoxView({
   mapboxToken,