Add app scaffolding

.gitignore

@@ -0,0 +1 @@
+/node_modules

App.js

@@ -0,0 +1,89 @@
+import React, { useCallback, useEffect, useState } from 'react';
+import { LogBox, StatusBar, Text, View } from 'react-native';
+import * as SplashScreen from 'expo-splash-screen';
+import * as Font from 'expo-font';
+import { NavigationContainer, getFocusedRouteNameFromRoute } from '@react-navigation/native';
+import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+import { createNativeStackNavigator } from '@react-navigation/native-stack';
+import HomeScreen from './src/components/screens/home/index';
+import ConvoScreen from './src/components/screens/convo/index';
+import Ionicons from '@expo/vector-icons/Ionicons';
+import { Colors } from 'react-native-ui-lib';
+
+LogBox.ignoreAllLogs();
+
+// Keep the splash screen visible while we fetch resources
+// SplashScreen.preventAutoHideAsync();
+
+export default function App() {
+  const [appIsReady, setAppIsReady] = useState(false);
+
+  useEffect(() => {
+    async function prepare() {
+      try {
+        await Font.loadAsync(Ionicons.font);
+      } catch (e) {
+        console.warn(e);
+      } finally {
+        setAppIsReady(true);
+      }
+    }
+
+    prepare();
+  }, []);
+
+  if (!appIsReady) {
+    return null;
+  }
+
+  const Tab = createNativeStackNavigator();
+  const AppStack = createNativeStackNavigator();
+
+  function AppStackScreen() {
+    return (
+          <AppStack.Navigator initalRouteName="Inbox" screenOptions={{ headerShown: true }}>
+            <AppStack.Screen name="Inbox" component={HomeScreen} />
+            <AppStack.Screen 
+              name="Convo" 
+              component={ConvoScreen}
+              options={() => ({
+                tabBarStyle: {
+                  display: "none",
+                },
+                tabBarButton: () => null,
+              })}
+           />
+          </AppStack.Navigator>
+    )
+  }
+
+  return (
+    <NavigationContainer>
+      <StatusBar barStyle={'dark-content'} />
+      <Tab.Navigator screenOptions={({ route }) => ({
+          headerShown: false,
+          tabBarIcon: ({ focused, color, size }) => {
+            let iconName;
+
+            if (route.name === 'Home') {
+              iconName = focused
+                ? 'ios-home'
+                : 'ios-home-outline';
+            } else if (route.name === 'Settings') {
+              iconName = focused ? 'ios-settings' : 'ios-settings-outline';
+            } else if (route.name === 'Profile') {
+              iconName = focused ? 'ios-person' : 'ios-person-outline';
+            }
+
+            return <Ionicons name={iconName} size={size} color={color} />;
+          },
+          tabBarActiveTintColor: Colors.blue40,
+          tabBarInactiveTintColor: Colors.grey40,
+        })}>
+        <Tab.Screen name="Home" component={AppStackScreen} />
+        <Tab.Screen name="Profile" component={ProfileScreen} />
+        <Tab.Screen name="Settings" component={SettingsScreen} />
+      </Tab.Navigator>
+    </NavigationContainer>
+  );
+}

app.json

@@ -0,0 +1,32 @@
+{
+  "expo": {
+    "name": "sup",
+    "slug": "sup",
+    "version": "1.0.0",
+    "orientation": "portrait",
+    "icon": "./assets/icon.png",
+    "userInterfaceStyle": "light",
+    "splash": {
+      "image": "./assets/splash.png",
+      "resizeMode": "contain",
+      "backgroundColor": "#ffffff"
+    },
+    "assetBundlePatterns": [
+      "**/*"
+    ],
+    "ios": {
+      "supportsTablet": true,
+      "bundleIdentifier": "com.pixelfed.sup"
+    },
+    "android": {
+      "adaptiveIcon": {
+        "foregroundImage": "./assets/adaptive-icon.png",
+        "backgroundColor": "#ffffff"
+      },
+      "package": "com.pixelfed.sup"
+    },
+    "web": {
+      "favicon": "./assets/favicon.png"
+    }
+  }
+}

babel.config.js

@@ -0,0 +1,9 @@
+module.exports = function(api) {
+  api.cache(true);
+  return {
+    presets: ['babel-preset-expo'],
+    plugins: [
+      'react-native-reanimated/plugin',
+    ],
+  };
+};

index.js

@@ -0,0 +1,8 @@
+import { registerRootComponent } from 'expo';
+
+import App from './App';
+
+// registerRootComponent calls AppRegistry.registerComponent('main', () => App);
+// It also ensures that whether you load the app in Expo Go or in a native build,
+// the environment is set up appropriately
+registerRootComponent(App);

metro.config.js

@@ -0,0 +1,4 @@
+// Learn more https://docs.expo.io/guides/customizing-metro
+const { getDefaultConfig } = require('expo/metro-config');
+
+module.exports = getDefaultConfig(__dirname);

package.json

@@ -0,0 +1,34 @@
+{
+  "name": "sup",
+  "version": "1.0.0",
+  "scripts": {
+    "start": "expo start --dev-client",
+    "android": "expo run:android",
+    "ios": "expo run:ios",
+    "web": "expo start --web"
+  },
+  "dependencies": {
+    "@expo/vector-icons": "^13.0.0",
+    "@react-native-community/blur": "^4.3.2",
+    "@react-native-community/datetimepicker": "^7.4.0",
+    "@react-native-community/netinfo": "^9.4.1",
+    "@react-native-picker/picker": "^2.4.10",
+    "@react-navigation/bottom-tabs": "^6.5.8",
+    "@react-navigation/native": "^6.1.7",
+    "@react-navigation/native-stack": "^6.9.13",
+    "expo": "~48.0.18",
+    "expo-splash-screen": "~0.18.2",
+    "expo-status-bar": "~1.4.4",
+    "react": "18.2.0",
+    "react-native": "0.71.8",
+    "react-native-gesture-handler": "^2.12.0",
+    "react-native-reanimated": "~2.14.4",
+    "react-native-safe-area-context": "4.5.0",
+    "react-native-screens": "~3.20.0",
+    "react-native-ui-lib": "^7.5.2"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.20.0"
+  },
+  "private": true
+}