Only fetch data when is connected to the internet

app/index.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect } from 'react';
+import React, { useEffect, useState } from 'react';
 import { Redirect, useRouter } from 'expo-router';
 import { useTranslation } from 'react-i18next';
 
@@ -16,6 +16,8 @@ export default function OnboardStartScreen() {
     const { token, isLoading } = useToken();
     const { t, i18n } = useTranslation();
     const router = useRouter();
+    const [ isConnected, setIsConnected ] = useState( false );
+
 
     const fetchData = async () => {
         const response = await Request.post( 'sessions/get', { token: token } );
@@ -34,10 +36,14 @@ export default function OnboardStartScreen() {
     };
 
     useEffect( () => {
-        if (!isLoading && token) {
+        if (!isLoading && token && isConnected) {
             fetchData();
         }
-    }, [ isLoading, token, router ] );
+    }, [ isLoading, token, isConnected, router ] );
+
+    const handleConnectionChange = () => {
+        setIsConnected( true );
+    };
 
     if (!isLoading && !token) {
         return <Redirect href="/(onboarding)/start"/>;
@@ -45,7 +51,7 @@ export default function OnboardStartScreen() {
 
     return (
         <ThemedView style={{ flex: 1 }}>
-            <NoInternetConnectionScreen onReconnect={fetchData}/>
+            <NoInternetConnectionScreen connected={handleConnectionChange}/>
             <LoadingScreen message={t( "loading" ) + '...'}/>
         </ThemedView>
     )