add en/vi language

components/ButtonCreateNewHaulOrTrip.tsx

@@ -3,6 +3,7 @@ import {
   queryStartNewHaul,
   queryUpdateTripState,
 } from "@/controller/TripController";
+import { useI18n } from "@/hooks/use-i18n";
 import {
   showErrorToast,
   showSuccessToast,
@@ -32,6 +33,7 @@ const ButtonCreateNewHaulOrTrip: React.FC<StartButtonProps> = ({
 }) => {
   const [isStarted, setIsStarted] = useState(false);
   const [isFinishHaulModalOpen, setIsFinishHaulModalOpen] = useState(false);
+  const { t } = useI18n();
 
   const { trip, getTrip } = useTrip();
   useEffect(() => {
@@ -44,34 +46,30 @@ const ButtonCreateNewHaulOrTrip: React.FC<StartButtonProps> = ({
 
   const handlePress = () => {
     if (isStarted) {
-      Alert.alert(
-        "Kết thúc mẻ lưới",
-        "Bạn có chắc chắn muốn kết thúc mẻ lưới này?",
-        [
-          {
-            text: "Hủy",
-            style: "cancel",
-          },
-          {
-            text: "Kết thúc",
-            onPress: () => {
-              setIsStarted(false);
-              Alert.alert("Thành công", "Đã kết thúc mẻ lưới!");
-            },
-          },
-        ]
-      );
-    } else {
-      Alert.alert("Bắt đầu mẻ lưới", "Bạn có muốn bắt đầu mẻ lưới mới?", [
+      Alert.alert(t("trip.endHaulTitle"), t("trip.endHaulConfirm"), [
         {
-          text: "Hủy",
+          text: t("trip.cancelButton"),
           style: "cancel",
         },
         {
-          text: "Bắt đầu",
+          text: t("trip.endButton"),
+          onPress: () => {
+            setIsStarted(false);
+            Alert.alert(t("trip.successTitle"), t("trip.endHaulSuccess"));
+          },
+        },
+      ]);
+    } else {
+      Alert.alert(t("trip.startHaulTitle"), t("trip.startHaulConfirm"), [
+        {
+          text: t("trip.cancelButton"),
+          style: "cancel",
+        },
+        {
+          text: t("trip.startButton"),
           onPress: () => {
             setIsStarted(true);
-            Alert.alert("Thành công", "Đã bắt đầu mẻ lưới mới!");
+            Alert.alert(t("trip.successTitle"), t("trip.startHaulSuccess"));
           },
         },
       ]);
@@ -84,7 +82,7 @@ const ButtonCreateNewHaulOrTrip: React.FC<StartButtonProps> = ({
 
   const handleStartTrip = async (state: number, note?: string) => {
     if (trip?.trip_status !== 2) {
-      showWarningToast("Chuyến đi đã được bắt đầu hoặc hoàn thành.");
+      showWarningToast(t("trip.alreadyStarted"));
       return;
     }
     try {
@@ -93,7 +91,7 @@ const ButtonCreateNewHaulOrTrip: React.FC<StartButtonProps> = ({
         note: note || "",
       });
       if (resp.status === 200) {
-        showSuccessToast("Bắt đầu chuyến đi thành công!");
+        showSuccessToast(t("trip.startTripSuccess"));
         await getTrip();
       }
     } catch (error) {
@@ -104,9 +102,7 @@ const ButtonCreateNewHaulOrTrip: React.FC<StartButtonProps> = ({
 
   const createNewHaul = async () => {
     if (trip?.fishing_logs?.some((f) => f.status === 0)) {
-      showWarningToast(
-        "Vui lòng kết thúc mẻ lưới hiện tại trước khi bắt đầu mẻ mới"
-      );
+      showWarningToast(t("trip.finishCurrentHaul"));
       return;
     }
     if (!gpsData) {
@@ -119,19 +115,19 @@ const ButtonCreateNewHaulOrTrip: React.FC<StartButtonProps> = ({
         start_at: new Date(),
         start_lat: gpsData.lat,
         start_lon: gpsData.lon,
-        weather_description: "Nắng đẹp",
+        weather_description: t("trip.weatherDescription"),
       };
 
       const resp = await queryStartNewHaul(body);
       if (resp.status === 200) {
-        showSuccessToast("Bắt đầu mẻ lưới mới thành công!");
+        showSuccessToast(t("trip.startHaulSuccess"));
         await getTrip();
       } else {
-        showErrorToast("Tạo mẻ lưới mới thất bại!");
+        showErrorToast(t("trip.createHaulFailed"));
       }
     } catch (error) {
       console.log(error);
-      // showErrorToast("Tạo mẻ lưới mới thất bại!");
+      // showErrorToast(t("trip.createHaulFailed"));
     }
   };
 
@@ -149,7 +145,7 @@ const ButtonCreateNewHaulOrTrip: React.FC<StartButtonProps> = ({
           style={{ backgroundColor: "green", borderRadius: 10 }}
           onPress={async () => handleStartTrip(3)}
         >
-          Bắt đầu chuyến đi
+          {t("trip.startTrip")}
         </IconButton>
       ) : checkHaulFinished() ? (
         <IconButton
@@ -158,7 +154,7 @@ const ButtonCreateNewHaulOrTrip: React.FC<StartButtonProps> = ({
           style={{ borderRadius: 10 }}
           onPress={() => setIsFinishHaulModalOpen(true)}
         >
-          Kết thúc mẻ lưới
+          {t("trip.endHaul")}
         </IconButton>
       ) : (
         <IconButton
@@ -169,7 +165,7 @@ const ButtonCreateNewHaulOrTrip: React.FC<StartButtonProps> = ({
             createNewHaul();
           }}
         >
-          Bắt đầu mẻ lưới
+          {t("trip.startHaul")}
         </IconButton>
       )}
       <CreateOrUpdateHaulModal