From 1b748285c919004511b00d80dd4aaf2cd25af4d6 Mon Sep 17 00:00:00 2001
From: Tran Anh Tuan <tunztunzz@Trans-Mac-mini.local>
Date: Thu, 6 Nov 2025 17:45:03 +0700
Subject: [PATCH] =?UTF-8?q?s=E1=BB=ADa=20l=20fix=20xcall=20api=20getTrip?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 CauTrucDuAn.md                           |  4 +--
 app/(tabs)/index.tsx                     | 42 +++++++++++-------------
 app/(tabs)/tripInfo.tsx                  | 12 +++----
 components/ButtonCreateNewHaulOrTrip.tsx |  2 +-
 state/use-trip.ts                        |  2 +-
 5 files changed, 29 insertions(+), 33 deletions(-)

diff --git a/CauTrucDuAn.md b/CauTrucDuAn.md
index f0ae7b0..ba25312 100644
--- a/CauTrucDuAn.md
+++ b/CauTrucDuAn.md
@@ -247,7 +247,7 @@ export async function login(body: Model.LoginRequestBody) {
 
 ```typescript
 export async function fetchGpsData() {
-  return api.get<Model.GPSResonse>(API_GET_GPS);
+  return api.get<Model.GPSResponse>(API_GET_GPS);
 }
 ```
 
@@ -388,7 +388,7 @@ export default function TabLayout() {
 1. **State management:**
 
 ```typescript
-const [gpsData, setGpsData] = useState<Model.GPSResonse | null>(null);
+const [gpsData, setGpsData] = useState<Model.GPSResponse | null>(null);
 ```
 
 2. **Fetch GPS data:**
diff --git a/app/(tabs)/index.tsx b/app/(tabs)/index.tsx
index ae7de51..c4b6127 100644
--- a/app/(tabs)/index.tsx
+++ b/app/(tabs)/index.tsx
@@ -30,19 +30,11 @@ import {
   convertWKTtoLatLngString,
 } from "@/utils/geom";
 import { useEffect, useRef, useState } from "react";
-import {
-  Animated,
-  Image as RNImage,
-  StyleSheet,
-  View
-} from "react-native";
+import { Animated, Image as RNImage, StyleSheet, View } from "react-native";
 import MapView, { Circle, Marker } from "react-native-maps";
 
-
 export default function HomeScreen() {
-  const [gpsData, setGpsData] = useState<Model.GPSResonse | null>(
-    null
-  );
+  const [gpsData, setGpsData] = useState<Model.GPSResponse | null>(null);
   const [alarmData, setAlarmData] = useState<Model.AlarmResponse | null>(null);
   const [entityData, setEntityData] = useState<
     Model.TransformedEntity[] | null
@@ -54,9 +46,8 @@ export default function HomeScreen() {
   const [circleRadius, setCircleRadius] = useState(100);
   const [zoomLevel, setZoomLevel] = useState(10);
   const [isFirstLoad, setIsFirstLoad] = useState(true);
-  const [polylineCoordinates, setPolylineCoordinates] = useState<
-    PolylineWithLabelProps | null
-  >(null);
+  const [polylineCoordinates, setPolylineCoordinates] =
+    useState<PolylineWithLabelProps | null>(null);
   const [polygonCoordinates, setPolygonCoordinates] = useState<
     PolygonWithLabelProps[]
   >([]);
@@ -76,7 +67,7 @@ export default function HomeScreen() {
     getEntitiesEventBus();
     getBanzonesEventBus();
     getTrackPointsEventBus();
-    const queryGpsData = (gpsData: Model.GPSResonse) => {
+    const queryGpsData = (gpsData: Model.GPSResponse) => {
       if (gpsData) {
         // console.log("GPS Data: ", gpsData);
         setGpsData(gpsData);
@@ -182,7 +173,6 @@ export default function HomeScreen() {
               label: zone?.zone_name ?? "",
               content: zone?.message ?? "",
             });
-            
           }
         } else if (geom_type === 1) {
           // foundPolygon = true;
@@ -293,8 +283,9 @@ export default function HomeScreen() {
 
   return (
     <View
-      // edges={["top"]} 
-      style={styles.container}>
+      // edges={["top"]}
+      style={styles.container}
+    >
       <MapView
         onMapReady={handleMapReady}
         onRegionChangeComplete={handleRegionChangeComplete}
@@ -351,7 +342,9 @@ export default function HomeScreen() {
 
               return (
                 <PolygonWithLabel
-                  key={`polygon-${index}-${gpsData?.lat || 0}-${gpsData?.lon || 0}`}
+                  key={`polygon-${index}-${gpsData?.lat || 0}-${
+                    gpsData?.lon || 0
+                  }`}
                   coordinates={polygon.coordinates}
                   label={polygon.label}
                   content={polygon.content}
@@ -367,7 +360,11 @@ export default function HomeScreen() {
         )}
         {gpsData !== null && (
           <Marker
-            key={platform === IOS_PLATFORM ? `${gpsData.lat}-${gpsData.lon}` : "gps-data"}
+            key={
+              platform === IOS_PLATFORM
+                ? `${gpsData.lat}-${gpsData.lon}`
+                : "gps-data"
+            }
             coordinate={{
               latitude: gpsData.lat,
               longitude: gpsData.lon,
@@ -412,10 +409,11 @@ export default function HomeScreen() {
                     height: 32,
                     transform: [
                       {
-                        rotate: `${typeof gpsData.h === "number" && !isNaN(gpsData.h)
+                        rotate: `${
+                          typeof gpsData.h === "number" && !isNaN(gpsData.h)
                             ? gpsData.h
                             : 0
-                          }deg`,
+                        }deg`,
                       },
                     ],
                   }}
@@ -425,7 +423,7 @@ export default function HomeScreen() {
           </Marker>
         )}
       </MapView>
-     
+
       <View className="absolute top-14 right-2 shadow-md">
         <SosButton />
       </View>
diff --git a/app/(tabs)/tripInfo.tsx b/app/(tabs)/tripInfo.tsx
index 934a8b3..c57358b 100644
--- a/app/(tabs)/tripInfo.tsx
+++ b/app/(tabs)/tripInfo.tsx
@@ -5,17 +5,15 @@ import CrewListTable from "@/components/tripInfo/CrewListTable";
 import FishingToolsTable from "@/components/tripInfo/FishingToolsList";
 import NetListTable from "@/components/tripInfo/NetListTable";
 import TripCostTable from "@/components/tripInfo/TripCostTable";
-import { useTrip } from "@/state/use-trip";
-import { useEffect } from "react";
 import { Platform, ScrollView, StyleSheet, Text, View } from "react-native";
 import { SafeAreaView } from "react-native-safe-area-context";
 
 export default function TripInfoScreen() {
-  const { trip, getTrip } = useTrip();
-  useEffect(() => {
-    getTrip();
-  }, []);
-  
+  // const { trip, getTrip } = useTrip();
+  // useEffect(() => {
+  //   getTrip();
+  // }, []);
+
   return (
     <SafeAreaView style={styles.safeArea} edges={["top", "left", "right"]}>
       <View style={styles.header}>
diff --git a/components/ButtonCreateNewHaulOrTrip.tsx b/components/ButtonCreateNewHaulOrTrip.tsx
index 2873882..0d6629f 100644
--- a/components/ButtonCreateNewHaulOrTrip.tsx
+++ b/components/ButtonCreateNewHaulOrTrip.tsx
@@ -30,7 +30,7 @@ const ButtonCreateNewHaulOrTrip: React.FC<StartButtonProps> = ({
   const { trip, getTrip } = useTrip();
   useEffect(() => {
     getTrip();
-  }, [trip === null]);
+  }, []);
 
   const checkHaulFinished = () => {
     return trip?.fishing_logs?.some((h) => h.status === 0);
diff --git a/state/use-trip.ts b/state/use-trip.ts
index e77e643..085d53e 100644
--- a/state/use-trip.ts
+++ b/state/use-trip.ts
@@ -13,7 +13,7 @@ export const useTrip = create<Trip>((set) => ({
   getTrip: async () => {
     try {
       const response = await queryTrip();
-      console.log("Trip fetching: ", response.data);
+      console.log("Trip fetching API");
 
       set({ trip: response.data, loading: false });
     } catch (error) {