User Maps

- app/(application)/(user)/maps/index.tsx
- screens/Maps/MapsView2.tsx

New Maps Component
- screens/Maps/DrawerMaps.tsx

Docs / Backup
- docs/PODS.back

### No Issue

app/(application)/(user)/maps/index.tsx

@@ -1,8 +1,4 @@
-import { BackButton } from "@/components";
-import MapsView from "@/screens/Maps/MapsView";
 import MapsView2 from "@/screens/Maps/MapsView2";
-import { Stack } from "expo-router";
-import { Platform, Text, View } from "react-native";
 
 export interface LocationItem {
   id: string | number;
@@ -21,8 +17,8 @@ export default function Maps() {
           headerLeft: () => <BackButton />,
         }}
         /> */}
-        {Platform.OS === "ios" ? <MapsView /> : <MapsView2 />}
+      {/* {Platform.OS === "ios" ? <MapsView /> : <MapsView2 />} */}
-      {/* <MapsView2 /> */}
+      <MapsView2 />
       {/* <View style={{ flex: 1, backgroundColor: "gray" }}><Text style={{ color: "white" }}>Map disabled</Text></View> */}
     </>
   );

docs/PODS.back

@@ -0,0 +1,101 @@
+NOTE:
+
+Untuk Development Selanjutnya:
+    Sekarang Anda bisa menjalankan:
+
+     1 # Untuk run iOS dev client
+     2 bun run ios
+     3 
+     4 # Atau dengan Expo
+     5 bunx expo run:ios
+
+    Jika di masa depan terjadi error serupa, Anda bisa gunakan command ini:
+
+     1 cd ios
+     2 rm -rf Pods Podfile.lock
+     3 pod install
+
+
+
+use_modular_headers!
+
+require File.join(File.dirname(`node --print "require.resolve('expo/package.json')"`), "scripts/autolinking")
+require File.join(File.dirname(`node --print "require.resolve('react-native/package.json')"`), "scripts/react_native_pods")
+
+require 'json'
+podfile_properties = JSON.parse(File.read(File.join(__dir__, 'Podfile.properties.json'))) rescue {}
+
+ENV['RCT_NEW_ARCH_ENABLED'] ||= '0' if podfile_properties['newArchEnabled'] == 'false'
+ENV['EX_DEV_CLIENT_NETWORK_INSPECTOR'] ||= podfile_properties['EX_DEV_CLIENT_NETWORK_INSPECTOR']
+ENV['RCT_USE_RN_DEP'] ||= '1' if podfile_properties['ios.buildReactNativeFromSource'] != 'true' && podfile_properties['newArchEnabled'] != 'false'
+ENV['RCT_USE_PREBUILT_RNCORE'] ||= '1' if podfile_properties['ios.buildReactNativeFromSource'] != 'true' && podfile_properties['newArchEnabled'] != 'false'
+platform :ios, podfile_properties['ios.deploymentTarget'] || '15.1'
+
+prepare_react_native_project!
+
+target 'HIPMIBadungConnect' do
+  use_expo_modules!
+
+  if ENV['EXPO_USE_COMMUNITY_AUTOLINKING'] == '1'
+    config_command = ['node', '-e', "process.argv=['', '', 'config'];require('@react-native-community/cli').run()"];
+  else
+    config_command = [
+      'npx',
+      'expo-modules-autolinking',
+      'react-native-config',
+      '--json',
+      '--platform',
+      'ios'
+    ]
+  end
+
+  config = use_native_modules!(config_command)
+
+  use_frameworks! :linkage => podfile_properties['ios.useFrameworks'].to_sym if podfile_properties['ios.useFrameworks']
+  use_frameworks! :linkage => ENV['USE_FRAMEWORKS'].to_sym if ENV['USE_FRAMEWORKS']
+
+
+  use_react_native!(
+    :path => config[:reactNativePath],
+    :hermes_enabled => podfile_properties['expo.jsEngine'] == nil || podfile_properties['expo.jsEngine'] == 'hermes',
+    # An absolute path to your application root.
+    :app_path => "#{Pod::Config.instance.installation_root}/..",
+    :privacy_file_aggregation_enabled => podfile_properties['apple.privacyManifestAggregationEnabled'] != 'false',
+  )
+
+  pod 'Firebase'
+  pod 'Firebase/Messaging'
+
+  # @generated begin post_installer - expo prebuild (DO NOT MODIFY) sync-4092f82b887b5b9edb84642c2a56984d69b9a403
+  post_install do |installer|
+# @generated begin @maplibre/maplibre-react-native:post-install - expo prebuild (DO NOT MODIFY) sync-6e76c80af0d70c0003d06822dd59b7c729fca472
+    $MLRN.post_install(installer)
+# @generated end @maplibre/maplibre-react-native:post-install
+
+    # Fix all script phases with incorrect paths
+    installer.pods_project.targets.each do |target|
+      target.build_phases.each do |phase|
+        next unless phase.respond_to?(:shell_script)
+        
+        # Fix duplicated path issue
+        if phase.shell_script.include?('with-environment.sh')
+          # Remove any existing path and use proper relative path
+          phase.shell_script = phase.shell_script.gsub(
+            %r{(/.*?/node_modules/react-native)+/scripts/xcode/with-environment.sh},
+            '${PODS_ROOT}/../../node_modules/react-native/scripts/xcode/with-environment.sh'
+          )
+        end
+      end
+    end
+    
+    # Standard React Native post install
+    react_native_post_install(
+      installer,
+      config[:reactNativePath],
+      :mac_catalyst_enabled => false,
+      :ccache_enabled => podfile_properties['apple.ccacheEnabled'] == 'true',
+    )
+  end
+  # @generated end post_installer
+ 
+end

screens/Maps/DrawerMaps.tsx

@@ -0,0 +1,125 @@
+import {
+  DrawerCustom,
+  DummyLandscapeImage,
+  Spacing,
+  StackCustom,
+  TextCustom,
+  Grid,
+  ButtonCustom,
+} from "@/components";
+import GridTwoView from "@/components/_ShareComponent/GridTwoView";
+import { ICON_SIZE_SMALL } from "@/constants/constans-value";
+import { openInDeviceMaps } from "@/utils/openInDeviceMaps";
+import { FontAwesome, Ionicons } from "@expo/vector-icons";
+import { router } from "expo-router";
+
+interface TypeDrawerMaps {
+  openDrawer: boolean;
+  setOpenDrawer: (value: boolean) => void;
+  selected: {
+    id: string;
+    bidangBisnis: string;
+    nomorTelepon: string;
+    alamatBisnis: string;
+    namePin: string;
+    imageId: string;
+    portofolioId: string;
+    latitude: number;
+    longitude: number;
+  };
+}
+
+export default function DrawerMaps({
+  openDrawer,
+  setOpenDrawer,
+  selected,
+}: TypeDrawerMaps) {
+  return (
+    <DrawerCustom
+      isVisible={openDrawer}
+      closeDrawer={() => setOpenDrawer(false)}
+      height={"auto"}
+    >
+      <DummyLandscapeImage height={200} imageId={selected.imageId} />
+      <Spacing />
+      <StackCustom gap={"xs"}>
+        <GridTwoView
+          spanLeft={2}
+          spanRight={10}
+          leftItem={
+            <FontAwesome
+              name="building-o"
+              size={ICON_SIZE_SMALL}
+              color="white"
+            />
+          }
+          rightItem={<TextCustom>{selected.namePin}</TextCustom>}
+        />
+
+        <GridTwoView
+          spanLeft={2}
+          spanRight={10}
+          leftItem={
+            <Ionicons
+              name="list-outline"
+              size={ICON_SIZE_SMALL}
+              color="white"
+            />
+          }
+          rightItem={<TextCustom>{selected.bidangBisnis}</TextCustom>}
+        />
+
+        <GridTwoView
+          spanLeft={2}
+          spanRight={10}
+          leftItem={
+            <Ionicons
+              name="call-outline"
+              size={ICON_SIZE_SMALL}
+              color="white"
+            />
+          }
+          rightItem={<TextCustom>{selected.nomorTelepon}</TextCustom>}
+        />
+        <GridTwoView
+          spanLeft={2}
+          spanRight={10}
+          leftItem={
+            <Ionicons
+              name="location-outline"
+              size={ICON_SIZE_SMALL}
+              color="white"
+            />
+          }
+          rightItem={<TextCustom>{selected.alamatBisnis}</TextCustom>}
+        />
+
+        <Grid>
+          <Grid.Col span={6} style={{ paddingRight: 10 }}>
+            <ButtonCustom
+              onPress={() => {
+                setOpenDrawer(false);
+                router.push(`/portofolio/${selected.portofolioId}`);
+              }}
+            >
+              Detail
+            </ButtonCustom>
+          </Grid.Col>
+          <Grid.Col span={6} style={{ paddingLeft: 10 }}>
+            <ButtonCustom
+              onPress={() => {
+                openInDeviceMaps({
+                  latitude: selected.latitude,
+                  longitude: selected.longitude,
+                  title: selected.namePin,
+                });
+              }}
+            >
+              Buka Maps
+            </ButtonCustom>
+          </Grid.Col>
+        </Grid>
+      </StackCustom>
+    </DrawerCustom>
+  );
+}

screens/Maps/MapsView2.tsx

@@ -10,20 +10,8 @@ import {
   MapView,
   PointAnnotation,
 } from "@maplibre/maplibre-react-native";
-import { router, useFocusEffect } from "expo-router";
+import { useFocusEffect } from "expo-router";
-import {
+import DrawerMaps from "./DrawerMaps";
-  DrawerCustom,
-  DummyLandscapeImage,
-  Spacing,
-  StackCustom,
-  TextCustom,
-  Grid,
-  ButtonCustom,
-} from "@/components";
-import GridTwoView from "@/components/_ShareComponent/GridTwoView";
-import { ICON_SIZE_SMALL } from "@/constants/constans-value";
-import { openInDeviceMaps } from "@/utils/openInDeviceMaps";
-import { FontAwesome, Ionicons } from "@expo/vector-icons";
 
 const MAP_STYLE = "https://tiles.openfreemap.org/styles/liberty";
 
@@ -146,92 +134,11 @@ export default function MapsView2() {
         </MapView>
       </View>
 
-      <DrawerCustom
+      <DrawerMaps
-        isVisible={openDrawer}
+        openDrawer={openDrawer}
-        closeDrawer={() => setOpenDrawer(false)}
+        setOpenDrawer={setOpenDrawer}
-        height={"auto"}
+        selected={selected}
-      >
+      />
-        <DummyLandscapeImage height={200} imageId={selected.imageId} />
-        <Spacing />
-        <StackCustom gap={"xs"}>
-          <GridTwoView
-            spanLeft={2}
-            spanRight={10}
-            leftItem={
-              <FontAwesome
-                name="building-o"
-                size={ICON_SIZE_SMALL}
-                color="white"
-              />
-            }
-            rightItem={<TextCustom>{selected.namePin}</TextCustom>}
-          />
-
-          <GridTwoView
-            spanLeft={2}
-            spanRight={10}
-            leftItem={
-              <Ionicons
-                name="list-outline"
-                size={ICON_SIZE_SMALL}
-                color="white"
-              />
-            }
-            rightItem={<TextCustom>{selected.bidangBisnis}</TextCustom>}
-          />
-
-          <GridTwoView
-            spanLeft={2}
-            spanRight={10}
-            leftItem={
-              <Ionicons
-                name="call-outline"
-                size={ICON_SIZE_SMALL}
-                color="white"
-              />
-            }
-            rightItem={<TextCustom>{selected.nomorTelepon}</TextCustom>}
-          />
-          <GridTwoView
-            spanLeft={2}
-            spanRight={10}
-            leftItem={
-              <Ionicons
-                name="location-outline"
-                size={ICON_SIZE_SMALL}
-                color="white"
-              />
-            }
-            rightItem={<TextCustom>{selected.alamatBisnis}</TextCustom>}
-          />
-
-          <Grid>
-            <Grid.Col span={6} style={{ paddingRight: 10 }}>
-              <ButtonCustom
-                onPress={() => {
-                  setOpenDrawer(false);
-                  router.push(`/portofolio/${selected.portofolioId}`);
-                }}
-              >
-                Detail
-              </ButtonCustom>
-            </Grid.Col>
-            <Grid.Col span={6} style={{ paddingLeft: 10 }}>
-              <ButtonCustom
-                onPress={() => {
-                  openInDeviceMaps({
-                    latitude: selected.latitude,
-                    longitude: selected.longitude,
-                    title: selected.namePin,
-                  });
-                }}
-              >
-                Buka Maps
-              </ButtonCustom>
-            </Grid.Col>
-          </Grid>
-        </StackCustom>
-      </DrawerCustom>
     </>
   );
 }