Added: common try catch wrapper

.husky/commit-msg

@@ -1,5 +1,5 @@
 #!/bin/bash
-. "$(dirname "$0")/_/husky.sh"
+# . "$(dirname "$0")/_/husky.sh"
 
 COMMIT_MSG=`cat $1`
 TEST=`head $INPUT_FILE`

.husky/pre-commit

@@ -1,5 +1,5 @@
 #!/bin/bash
 . "$(dirname "$0")/_/husky.sh"
 
-npm run lint:fix
-
+bun lint:fix
+bun test

App/Screens/CommonComponent/Layout.tsx

@@ -4,7 +4,6 @@ import {
   StatusBar,
   StyleSheet,
   View,
-  SafeAreaView,
   RefreshControl,
   StyleProp,
   ViewStyle,
@@ -16,6 +15,7 @@ import { isIOS } from '@Utils';
 import { useAppContext } from '@AppContext';
 import { NavigationBar, ConditionalRender } from '@CommonComponent';
 import { CommonStyle } from '@Theme';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
 interface LayoutProps {
   title?: string;
   titleCenter?: boolean;
@@ -63,11 +63,14 @@ const Layout = (props: React.PropsWithChildren<LayoutProps>) => {
     removeContainerView = false,
   } = props;
 
+  const { top, bottom } = useSafeAreaInsets();
+
   return (
-    <SafeAreaView
+    <View
       style={[
         CommonStyle.flex1,
         { backgroundColor: backgroundColor ?? appTheme.background },
+        { paddingTop: top, paddingBottom: bottom },
       ]}
     >
       <StatusBar
@@ -125,7 +128,7 @@ const Layout = (props: React.PropsWithChildren<LayoutProps>) => {
           </ScrollView>
         </ConditionalRender>
       </KeyboardAvoidingView>
-    </SafeAreaView>
+    </View>
   );
 };
 

App/Screens/Components/Home/Home.tsx

@@ -15,6 +15,7 @@ import {
   alertData,
   isIOS,
   width,
+  wrapAsync,
 } from '@Utils';
 import { useAppContext } from '@AppContext';
 import { useAppDispatch } from '@Stores';
@@ -35,42 +36,35 @@ const Home = () => {
       checkMinimumVersion();
       dispatch(fetchUser({ user: {}, loading: false }));
     }
-  }, [isFocused]);
-
-  const checkMinimumVersion = async () => {
-    try {
-      let shouldUpdate = compareAppVersions({
-        version,
-        minimumVersion: 'v1.0.0', // Wrap whole try block in if condition with apiConfig.serviceConfig and pass minimumVersion from api response
-      });
-      if (shouldUpdate) {
-        setIsUpdate(true);
-        return;
-      }
+  }, [isFocused]); // Original function wrapped with useTryCatch
+  const checkMinimumVersion = wrapAsync(async () => {
+    let shouldUpdate = compareAppVersions({
+      version,
+      minimumVersion: 'v1.0.0', // Wrap whole try block in if condition with apiConfig.serviceConfig and pass minimumVersion from api response
+    });
+    if (shouldUpdate) {
+      setIsUpdate(true);
       return;
-    } catch (e: any) {
-      console.log(e);
     }
-  };
+    return;
+  });
 
-  const updateApp = async () => {
-    try {
-      if (isIOS) {
-        await openLink('');
-      } else {
-        await openLink('');
-      }
-    } catch (e: any) {
-      console.log(e);
+  // Original function wrapped with useTryCatch
+  const updateApp = wrapAsync(async () => {
+    if (isIOS) {
+      await openLink(''); // React Native app for testing
+    } else {
+      await openLink('');
     }
-  };
+  });
 
   return (
     <Layout title="Widgets" padding={20}>
       <CustomText large>Home screen</CustomText>
       <ButtonComponent
         onPress={() => {
           setShowModal(true);
+          updateApp();
         }}
         backColor={appTheme.themeColor}
         title="Show Modal"

App/Screens/Components/Login/Login.tsx

@@ -1,9 +1,14 @@
 import React, { useRef, useState } from 'react';
-import { View, SafeAreaView, StyleSheet, TextInput } from 'react-native';
-import { CustomText, CustomTextInput } from '@CommonComponent';
+import { View, StyleSheet, TextInput } from 'react-native';
+import { CustomText, CustomTextInput, Layout } from '@CommonComponent';
 import { BottomView, ButtonComponent } from '@SubComponents';
 import { CommonStyle } from '@Theme';
-import { Authentication, goToNextScreen, setItemInStorage } from '@Utils';
+import {
+  Authentication,
+  goToNextScreen,
+  setItemInStorage,
+  wrapAsync,
+} from '@Utils';
 import { Route } from '@Routes/AppRoutes';
 import { useAppContext } from '@AppContext';
 import { useAppNavigation } from '@Hooks';
@@ -73,21 +78,22 @@ const Login = () => {
     });
   };
 
-  const onLogin = () => {
-    try {
+  const onLogin = wrapAsync(
+    async () => {
       // Field Validation
       // Make api call ans store user in redux and token in Storage
       goToNextScreen(navigation, Route.HomeScreen);
       setItemInStorage(Authentication.TOKEN, 'set login token');
-    } catch (error) {
-      manageProcessing(false);
-    }
-  };
+    },
+    {
+      onError: () => {
+        manageProcessing(false);
+      },
+    },
+  );
 
   return (
-    <SafeAreaView
-      style={[flexContainer, { backgroundColor: appTheme.background }]}
-    >
+    <Layout>
       <View style={[flexContainer, center]}>
         <View style={outer}>
           <CustomText xxlarge style={[title, { color: appTheme.text }]}>
@@ -139,7 +145,7 @@ const Login = () => {
           />
         </View>
       </View>
-    </SafeAreaView>
+    </Layout>
   );
 };
 

App/Screens/Components/Search/Search.tsx

@@ -1,23 +1,26 @@
 import React from 'react';
-import { SafeAreaView } from 'react-native';
+import { View } from 'react-native';
 import { CommonStyle } from '@Theme';
-import { CustomText } from '@CommonComponent';
+import { CustomText, Layout } from '@CommonComponent';
 import { useAppContext } from '@AppContext';
 
 const Search = () => {
   const { appTheme } = useAppContext();
 
   return (
-    <SafeAreaView
-      style={[
-        CommonStyle.flexContainer,
-        CommonStyle.center,
-        { backgroundColor: appTheme.background },
-      ]}>
-      <CustomText xlarge style={{ color: appTheme.text }}>
-        Search Tab
-      </CustomText>
-    </SafeAreaView>
+    <Layout>
+      <View
+        style={[
+          CommonStyle.flexContainer,
+          CommonStyle.center,
+          { backgroundColor: appTheme.background },
+        ]}
+      >
+        <CustomText xlarge style={{ color: appTheme.text }}>
+          Search Tab
+        </CustomText>
+      </View>
+    </Layout>
   );
 };
 

App/Screens/Components/User/User.tsx

@@ -1,8 +1,8 @@
 import React from 'react';
-import { SafeAreaView, StyleSheet } from 'react-native';
+import { StyleSheet, View } from 'react-native';
 import { CommonStyle } from '@Theme';
 import { useAppContext } from '@AppContext';
-import { CustomText } from '@CommonComponent';
+import { CustomText, Layout } from '@CommonComponent';
 import { ButtonComponent } from '@SubComponents';
 
 const styles = StyleSheet.create({
@@ -18,44 +18,47 @@ const Users = () => {
   const { btnTitle, btnBorder } = styles;
 
   return (
-    <SafeAreaView
-      style={[
-        CommonStyle.flexContainer,
-        CommonStyle.center,
-        { backgroundColor: appTheme.background },
-      ]}>
-      <CustomText xlarge style={[btnTitle, { color: appTheme.text }]}>
-        Button Component
-      </CustomText>
-      <ButtonComponent title="Button" onPress={() => null} />
-      <ButtonComponent title="Button" isProcessing onPress={() => null} />
-      <ButtonComponent
-        title="Border Button"
-        border={appTheme.themeColor}
-        textColor={appTheme.themeColor}
-        backColor={appTheme.background}
-        onPress={() => null}
-      />
-      <ButtonComponent
-        title="Danger Button"
-        border={appTheme.red}
-        textColor={appTheme.red}
-        backColor={appTheme.background}
-        onPress={() => null}
-      />
-      <ButtonComponent
-        title="Disabled Button"
-        border={appTheme.lightText}
-        textColor={appTheme.lightText}
-        backColor={appTheme.background}
-        onPress={() => null}
-      />
-      <ButtonComponent
-        title="Rounded Button"
-        style={btnBorder}
-        onPress={() => null}
-      />
-    </SafeAreaView>
+    <Layout>
+      <View
+        style={[
+          CommonStyle.flexContainer,
+          CommonStyle.center,
+          { backgroundColor: appTheme.background },
+        ]}
+      >
+        <CustomText xlarge style={[btnTitle, { color: appTheme.text }]}>
+          Button Component
+        </CustomText>
+        <ButtonComponent title="Button" onPress={() => null} />
+        <ButtonComponent title="Button" isProcessing onPress={() => null} />
+        <ButtonComponent
+          title="Border Button"
+          border={appTheme.themeColor}
+          textColor={appTheme.themeColor}
+          backColor={appTheme.background}
+          onPress={() => null}
+        />
+        <ButtonComponent
+          title="Danger Button"
+          border={appTheme.red}
+          textColor={appTheme.red}
+          backColor={appTheme.background}
+          onPress={() => null}
+        />
+        <ButtonComponent
+          title="Disabled Button"
+          border={appTheme.lightText}
+          textColor={appTheme.lightText}
+          backColor={appTheme.background}
+          onPress={() => null}
+        />
+        <ButtonComponent
+          title="Rounded Button"
+          style={btnBorder}
+          onPress={() => null}
+        />
+      </View>
+    </Layout>
   );
 };
 

App/Utils/Helper.ts

@@ -4,7 +4,9 @@ import { CommonActions } from '@react-navigation/native';
 import DeviceInfo from 'react-native-device-info';
 import { AxiosHeaders } from 'axios';
 import { ApiConfig } from '@ApiConfig';
-import { getItemFromStorage, removeStoreItem, Authentication } from '@Utils';
+import { getItemFromStorage, removeStoreItem } from '@Utils/Storage';
+import { Authentication } from '@Utils/Enums';
+import { wrapAsync } from '@Utils/TryCatchWrapper';
 import { Route } from '@Routes/AppRoutes';
 import { store } from '@Stores';
 import { logout } from '@Slices/UserSlice';
@@ -86,7 +88,7 @@ export const goToNextScreen = async (navigation: any, nextScreen: string) => {
 };
 
 export const getHeaders = () => {
-  let token: string | null = ApiConfig.token;
+  let token: string | null | undefined = ApiConfig.token;
   if (!token) {
     token = getItemFromStorage(Authentication.TOKEN);
   }
@@ -134,16 +136,12 @@ export const compareAppVersions = ({
   return isVersionValid;
 };
 
-export const openLink = async (url: string, checkUrl = true) => {
-  try {
-    let canOpenUrl = true;
-    if (checkUrl) {
-      canOpenUrl = await Linking.canOpenURL(url);
-    }
-    if (canOpenUrl) {
-      await Linking.openURL(url);
-    }
-  } catch (e) {
-    console.log(e);
+export const openLink = wrapAsync(async (url: string, checkUrl = true) => {
+  let canOpenUrl = true;
+  if (checkUrl) {
+    canOpenUrl = await Linking.canOpenURL(url);
   }
-};
+  if (canOpenUrl) {
+    await Linking.openURL(url);
+  }
+});