feat: implement restriction to mobile devices

frontend/src/App.jsx

@@ -24,6 +24,9 @@ function App() {
   const [tgUser, setTgUser] = useState(JSON.parse(localStorage.getItem('tg_user')));
   const [showModal, setShowModal] = useState(false);
   const navigate = useNavigate();
+  const [isMobile, setIsMobile] = useState(false);
+  const [modal, setModal] = useState(true);
+
 
   const connectWalletMutation = useConnectWallet(setWalletId);
   useEffect(() => {
@@ -69,6 +72,35 @@ function App() {
   const closeModal = () => {
     setShowModal(false);
   };
+
+  useEffect(() => {
+    const checkMobile = () => {
+      const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+
+      const mobileRegex = /android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i;
+
+      const isMobileDevice = mobileRegex.test(userAgent);
+      setIsMobile(isMobileDevice);
+
+      const isMobileWidth = window.innerWidth <= 768;
+      setIsMobile(isMobileDevice || isMobileWidth);
+    };
+
+    checkMobile();
+
+    window.addEventListener('resize', checkMobile);
+
+    return () => window.removeEventListener('resize', checkMobile);
+  }, []);
+
+  const handleCloseModal = () => {
+    setModal(false);
+  };
+
+  const openTelegramBot = () => {
+    const telegramBotLink = 'https://t.me/spotnet_bot';
+    window.open(telegramBotLink, '_blank');
+  };
 
   return (
     <div className="App">
@@ -109,6 +141,20 @@ function App() {
         </Routes>
       </main>
       <Footer />
+      {isMobile && (
+         <ActionModal
+         isOpen={modal}
+         title="Mobile website restriction"
+         subTitle=""
+         content={[
+          'Please, use desktop version or telegram mini-app'
+         ]}
+         cancelLabel="Cancel"
+         submitLabel="Open in Telegram"
+         submitAction={openTelegramBot}
+         cancelAction={handleCloseModal}
+       />
+      )}
     </div>
   );
 }