From dd3bcb9dfd18e12f6e8fe06ad925014446959bbf Mon Sep 17 00:00:00 2001
From: Lau Chaves <laurens004@gmail.com>
Date: Thu, 25 Jul 2024 11:46:40 -0600
Subject: [PATCH] #245: Add Network Check for Sepolia (#291)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* #245: add network check sepolia

* Applying Code Review

* Fix network

---------

Co-authored-by: lauchaves <lauchavesmendez@gmail.comA>
Co-authored-by: Uğur Eren <contact@ugureren.net>
---
 JoyboyCommunity/src/app/App.tsx | 27 ++++++++++++++++++++++++++-
 1 file changed, 26 insertions(+), 1 deletion(-)

diff --git a/JoyboyCommunity/src/app/App.tsx b/JoyboyCommunity/src/app/App.tsx
index 05fb2701..5c70aeb4 100644
--- a/JoyboyCommunity/src/app/App.tsx
+++ b/JoyboyCommunity/src/app/App.tsx
@@ -1,12 +1,14 @@
 import '@walletconnect/react-native-compat';
 
+import {starknetChainId, useAccount} from '@starknet-react/core';
 import * as Font from 'expo-font';
 import * as SplashScreen from 'expo-splash-screen';
 import {useCallback, useEffect, useState} from 'react';
 import {View} from 'react-native';
 
+import {CHAIN_ID} from '../constants/env';
 import {useTips} from '../hooks';
-import {useToast} from '../hooks/modals';
+import {useDialog, useToast} from '../hooks/modals';
 import {Router} from './Router';
 
 SplashScreen.preventAutoHideAsync();
@@ -18,6 +20,29 @@ export default function App() {
   const tips = useTips();
   const {showToast} = useToast();
 
+  const {showDialog, hideDialog} = useDialog();
+
+  const account = useAccount();
+
+  useEffect(() => {
+    const chainId = account.chainId ? starknetChainId(account.chainId) : undefined;
+
+    if (chainId) {
+      if (chainId !== CHAIN_ID) {
+        showDialog({
+          title: 'Wrong Network',
+          description:
+            'Joyboy currently only supports the Starknet Sepolia network. Please switch to the Sepolia network to continue.',
+          buttons: [],
+        });
+      } else {
+        hideDialog();
+      }
+    }
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [account.chainId]);
+
   useEffect(() => {
     (async () => {
       try {