feat: add netinfo check in network screen

Author: ahmedAlaaInstabug

CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## [Unreleased](https://github.com/Instabug/Instabug-React-Native/compare/v14.1.0...dev)
+
+## Fixed
+
+- Intercept incomplete network Requests ([#1365](https://github.com/Instabug/Instabug-React-Native/pull/1365))
+
+
 ## [14.1.0](https://github.com/Instabug/Instabug-React-Native/compare/v14.0.0...v14.1.0) (January 2, 2025)
 
 ### Added

examples/default/package.json

@@ -11,6 +11,7 @@
   },
   "dependencies": {
     "@react-native-clipboard/clipboard": "^1.14.3",
+    "@react-native-community/netinfo": "^11.4.1",
     "@react-native-community/slider": "^4.5.5",
     "@react-navigation/bottom-tabs": "^6.5.7",
     "@react-navigation/native": "^6.1.6",

examples/default/src/screens/apm/NetworkScreen.tsx

@@ -11,12 +11,16 @@ import axios from 'axios';
 import type { HomeStackParamList } from '../../navigation/HomeStack';
 import type { NativeStackScreenProps } from '@react-navigation/native-stack';
 import { ListTile } from '../../components/ListTile';
+import { useNetInfo } from '@react-native-community/netinfo';
 
 export const NetworkScreen: React.FC<
   NativeStackScreenProps<HomeStackParamList, 'NetworkTraces'>
 > = ({ navigation }) => {
   const [endpointUrl, setEndpointUrl] = useState('');
   const { width, height } = useWindowDimensions();
+
+  const { isConnected } = useNetInfo();
+
   const defaultRequestUrl = 'https://jsonplaceholder.typicode.com/posts/1';
   const imageUrls = [
     'https://fastly.picsum.photos/id/57/200/300.jpg?hmac=l908G1qVr4r7dP947-tak2mY8Vvic_vEYzCXUCKKskY',
@@ -129,6 +133,7 @@ export const NetworkScreen: React.FC<
             />
             <CustomButton onPress={() => refetch} title="Reload GraphQL" />
             <View>
+              <Text>{isConnected ? 'Network is Connected' : 'Network is not connected'}</Text>
               {isLoading && <Text>Loading...</Text>}
               {isSuccess && <Text>GraphQL Data: {data.country.emoji}</Text>}
               {isError && <Text>Error!</Text>}

examples/default/yarn.lock

@@ -2041,6 +2041,11 @@
     prompts "^2.4.2"
     semver "^7.5.2"
 
+"@react-native-community/netinfo@^11.4.1":
+  version "11.4.1"
+  resolved "https://registry.yarnpkg.com/@react-native-community/netinfo/-/netinfo-11.4.1.tgz#a3c247aceab35f75dd0aa4bfa85d2be5a4508688"
+  integrity sha512-B0BYAkghz3Q2V09BF88RA601XursIEA111tnc2JOaN7axJWmNefmfjZqw/KdSxKZp7CZUuPpjBmz/WCR9uaHYg==
+
 "@react-native-community/slider@^4.5.5":
   version "4.5.5"
   resolved "https://registry.yarnpkg.com/@react-native-community/slider/-/slider-4.5.5.tgz#d70fc5870477760033769bbd6625d57e7d7678b2"