Add refresh socket connection and service validation

app/(tabs)/index.tsx

@@ -38,14 +38,18 @@ import {
 import { setDueAmount } from "@/store/paymentSlice";
 import { Image } from "expo-image";
 import EMINotification from "@/components/Payments/EmiNotification";
+import { initSocket } from "@/services/socket";
+import { useSnackbar } from "@/contexts/Snackbar";
 
 export default function HomeScreen() {
   const { t } = useTranslation();
   const navigation = useNavigation();
   const [isSupportModalVisible, setIsSupportModalVisible] = useState(false);
-  const { SoC, SoH, chargingState, lat, lon, loading, totalDistance } =
+  const { SoC, SoH, chargingState, lat, lon, loading, totalDistance, error } =
     useSelector((state: RootState) => state.telemetry);
 
+  const { showSnackbar } = useSnackbar();
+
   const [refreshing, setRefreshing] = useState(false);
   const spinValue = useState(new Animated.Value(0))[0];
 
@@ -206,12 +210,15 @@ export default function HomeScreen() {
       setRefreshing(true);
       startSpin();
 
-      // await dispatch(clearUser());
+      await dispatch(clearUser());
-      await dispatch(getUserDetails());
+      await Promise.all([
-      await dispatch(getPaymentSummary());
+        dispatch(getUserDetails()).unwrap(),
+        dispatch(getPaymentSummary()).unwrap(),
+      ]);
 
-      console.log("Manual refresh complete");
+      await initSocket();
     } catch (error) {
+      showSnackbar("Something went wrong", "error");
       console.error("Manual refresh failed", error);
     } finally {
       stopSpin();
@@ -291,12 +298,10 @@ export default function HomeScreen() {
         ) : null}
 
         <View style={styles.map}>
-          {loading ? (
+          {error ? (
             <View style={styles.errorContainer}>
               <LocationOff />
-              <Text style={styles.errorText}>
+              <Text style={styles.errorText}>{t("home.error-location")}</Text>
-                {t("home.fetching-location")}
-              </Text>
             </View>
           ) : lat != null && lon != null && !(lat == 0 && lon == 0) ? (
             <>
@@ -342,18 +347,19 @@ export default function HomeScreen() {
           ) : (
             <View style={styles.errorContainer}>
               <LocationOff />
-              <Text style={styles.errorText}>{t("home.error-location")}</Text>
+              <Text style={styles.errorText}>
+                {t("home.fetching-location")}
+              </Text>
             </View>
           )}
         </View>
-        {warrantyEndDate && warrantyStartDate && (
+
-          <TouchableOpacity onPress={() => router.push("/(tabs)/my-battery")}>
+        <TouchableOpacity onPress={() => router.push("/(tabs)/my-battery")}>
-            <BatteryWarrantyCard
+          <BatteryWarrantyCard
-              warrantyStartDate={warrantyStartDate}
+            warrantyStartDate={warrantyStartDate}
-              warrantyEndDate={warrantyEndDate}
+            warrantyEndDate={warrantyEndDate}
-            />
+          />
-          </TouchableOpacity>
+        </TouchableOpacity>
-        )}
       </ScrollView>
       <CustomerSupportModal
         visible={isSupportModalVisible}

app/(tabs)/service.tsx

@@ -341,17 +341,26 @@ export default function ServiceFormScreen(): JSX.Element {
               </View>
               <View style={{ marginTop: 8 }}>
                 <Text style={styles.label}>
-                  {t("service.issue")} <Text style={styles.required}>*</Text>
+                  {t("service.issue")}{" "}
+                  {values.serviceType == "On-demand" && (
+                    <Text style={styles.required}>*</Text>
+                  )}
                 </Text>
                 <TouchableOpacity
                   style={[styles.inputBox]}
                   onPress={toggleIssueSelector}
-                  disabled={values.serviceType === "Regular" || isLoadingIssues}
+                  disabled={
+                    values.serviceType === "Regular" ||
+                    isLoadingIssues ||
+                    values.serviceType == null
+                  }
                 >
                   <Text
                     style={[
                       styles.issueText,
-                      values.serviceType === "Regular" &&
+                      (values.serviceType === "Regular" ||
+                        values.serviceType == null ||
+                        isLoadingIssues) &&
                         styles.issueTextDisabled,
                     ]}
                   >
@@ -366,7 +375,7 @@ export default function ServiceFormScreen(): JSX.Element {
 
               <View style={{ marginTop: 8 }}>
                 <Text style={styles.label}>
-                  {t("service.select-datetime")}
+                  {t("service.select-datetime")}{" "}
                   <Text style={styles.required}>*</Text>
                 </Text>
                 <TouchableOpacity

components/Payments/PaymentHistoryCard.tsx

@@ -18,8 +18,6 @@ export default ({
   method,
   status,
 }: PaymentHistoryCardProps) => {
-  //failure, confirmed, pending
-
   const router = useRouter();
 
   const handlePress = () => {
@@ -58,7 +56,6 @@ export default ({
   const statusStyle = getStatusStyle(status);
 
   return (
-    // <TouchableOpacity style={styles.paymentCard} onPress={handlePress}>
     <TouchableOpacity style={styles.paymentCard} onPress={handlePress}>
       <View style={styles.paymentCardTop}>
         <Text style={styles.paymentDate}>{date}</Text>
@@ -82,7 +79,6 @@ export default ({
         )}
       </View>
     </TouchableOpacity>
-    // </TouchableOpacity>
   );
 };
 

constants/config.ts

@@ -69,7 +69,7 @@ export const useTabConfig = () => {
 };
 
 export const SERVICE = {
-  ENABLE_REGULAR_SERVICE_AFTER_IN_MONTHS: 6,
+  ENABLE_REGULAR_SERVICE_AFTER_IN_MONTHS: 1,
 };
 
 export const MESSAGES = {

services/socket.ts

@@ -4,6 +4,7 @@ import {
   updateTelemetry,
   setTelemetryLoading,
   setTelemetryError,
+  clearTelemetry,
 } from "../store/telemetrySlice";
 import { BmsState } from "@/constants/types";
 import { BASE_URL, SOCKET_BASE_URL, VECTOR_BASE_URL } from "@/constants/config";
@@ -29,6 +30,7 @@ const fetchToken = async (): Promise<string> => {
       `${BASE_URL}/api/v1/vec-token`
     );
 
+    console.log("response.data.data.token", response.data.data.token);
     return response.data.data.token;
   } catch (error) {
     console.error("Error fetching token:", error);
@@ -106,11 +108,18 @@ export const connectSocket = () => {
 
 export const initSocket = async () => {
   try {
+    if (socket) {
+      socket.disconnect();
+      socket = null;
+      console.log("Previous socket disconnected before reinitializing");
+    }
+
+    store.dispatch(clearTelemetry());
     const hardwareDeviceId =
       store.getState().user.data?.batteries?.[0]?.device_id;
     if (!hardwareDeviceId) {
       console.warn("initSocket skipped: hardwareDeviceId not ready");
-      return; // just exit gracefully
+      return;
     }
 
     console.log(hardwareDeviceId, "hardware deviced");

store/telemetrySlice.ts

@@ -37,9 +37,14 @@ export const telemetrySlice = createSlice({
       state.loading = false;
       state.error = action.payload;
     },
+    clearTelemetry: () => initialState,
   },
 });
 
-export const { updateTelemetry, setTelemetryLoading, setTelemetryError } =
+export const {
-  telemetrySlice.actions;
+  updateTelemetry,
+  setTelemetryLoading,
+  clearTelemetry,
+  setTelemetryError,
+} = telemetrySlice.actions;
 export default telemetrySlice.reducer;

store/userSlice.ts

@@ -113,7 +113,7 @@ const userSlice = createSlice({
   initialState,
   reducers: {
     clearUser: (state) => {
-      state.data = null;
+      state.loading = true;
       state.error = null;
       state.loading = false;
       state.paymentSummary = null;