preparing for large layouts

app/mobile/src/access/useAccess.hook.js

@@ -1,5 +1,6 @@
 import { useState, useEffect } from 'react';
 import { useWindowDimensions } from 'react-native';
+import config from 'constants/Config';
 
 export function useAccess() {
 
@@ -13,7 +14,7 @@ export function useAccess() {
   }
 
   useEffect(() => {
-    if (dimensions.width > 650) {
+    if (dimensions.width > config.tabbedWidth) {
       updateState({ split: true });
     }
     else {

app/mobile/src/constants/Config.js

@@ -0,0 +1,5 @@
+export const Config = {
+  tabbedWidth: 650,
+};
+
+export default Config;

app/mobile/src/session/Session.jsx

@@ -47,6 +47,7 @@ export function Session() {
   return (
     <SafeAreaProvider>
       <NavigationContainer>
+        { state.tabbed && (
           <Tab.Navigator
             screenOptions={({ route }) => ({
               tabBarStyle: styles.tabBar,
@@ -71,6 +72,7 @@ export function Session() {
             <Tab.Screen name="Profile" component={ProfileStackScreen} />
             <Tab.Screen name="Contacts" component={ContactStackScreen} />
           </Tab.Navigator>
+        )}
       </NavigationContainer>
     </SafeAreaProvider>
   );

app/mobile/src/session/useSession.hook.js

@@ -2,12 +2,14 @@ import { useState, useEffect, useContext } from 'react';
 import { useWindowDimensions } from 'react-native';
 import { useNavigate } from 'react-router-dom';
 import { AppContext } from 'context/AppContext';
+import config from 'constants/Config';
 
 export function useSession() {
 
   const [state, setState] = useState({
+    tabbled: null,
   });
-
+  const dimensions = useWindowDimensions();
   const app = useContext(AppContext);
   const navigate = useNavigate();
 
@@ -15,11 +17,16 @@ export function useSession() {
     setState((s) => ({ ...s, ...value }));
   }
 
+  useEffect(() => {
+    if (dimensions.width > config.tabbedWidth) {
+      updateState({ tabbed: false });
+    }
+    else {
+      updateState({ tabbed: true });
+    }
+  }, [dimensions]);
+
   const actions = {
-    logout: async () => {
-      await app.actions.logout();
-      navigate('/');
-    },
   };
 
   return { state, actions };