Update expo example app (#76)

* feat: update example app to SDK 46

* chore: bump react-native-size-matters version

* chore: bump react-native-version

* feat: refactor navigation

* chore: add StatusBar

Author: Randall71

.gitignore

@@ -1,3 +1,4 @@
 node_modules
 coverage
-settings.json
+settings.json
+.expo

examples/expo-example-app/.babelrc

@@ -1,28 +1,23 @@
-import React from 'react';
-import {StackNavigator} from 'react-navigation';
-import HomeScreen from './components/Home';
-import FeedPage from './components/Feed';
-import ChatPage from './components/Chat';
+import React from "react";
+import HomeScreen from "./components/Home";
+import FeedPage from "./components/Feed";
+import ChatPage from "./components/Chat";
+import { NavigationContainer } from "@react-navigation/native";
+import { createNativeStackNavigator } from "@react-navigation/native-stack";
+import { StatusBar } from "expo-status-bar";
 
-export default StackNavigator({
-    Home: {
-        screen: HomeScreen,
-        navigationOptions: {
-            title: 'Home'
-        }
-    },
-    Chat: {
-        screen: ChatPage,
-        navigationOptions: {
-            title: 'Chat'
-        }
-    },
-    Feed: {
-        screen: FeedPage,
-        navigationOptions: {
-            title: 'Feed'
-        }
-    }
-}, {
-    initialRouteName: 'Home'
-});
+const NativeStack = createNativeStackNavigator();
+
+export default function App() {
+  return (
+    <NavigationContainer>
+      <StatusBar style="dark" />
+
+      <NativeStack.Navigator initialRouteName="Home">
+        <NativeStack.Screen name="Home" component={HomeScreen} />
+        <NativeStack.Screen name="Chat" component={ChatPage} />
+        <NativeStack.Screen name="Feed" component={FeedPage} />
+      </NativeStack.Navigator>
+    </NavigationContainer>
+  );
+}

examples/expo-example-app/App.js

@@ -2,7 +2,6 @@
   "expo": {
     "name": "Size Matters Example",
     "slug": "size-matters",
-    "sdkVersion": "22.0.0",
     "privacy": "public"
   }
 }

examples/expo-example-app/app.json

@@ -0,0 +1,6 @@
+module.exports = function (api) {
+  api.cache(true);
+  return {
+    presets: ["babel-preset-expo"],
+  };
+};

examples/expo-example-app/babel.config.js

@@ -3,26 +3,27 @@
   "version": "0.1.0",
   "private": true,
   "devDependencies": {
-    "jest-expo": "^22.0.0",
-    "react-native-scripts": "1.7.0",
-    "react-test-renderer": "16.0.0-beta.5"
+    "@babel/core": "^7.12.9",
+    "jest-expo": "^46.0.0"
   },
-  "main": "./node_modules/react-native-scripts/build/bin/crna-entry.js",
+  "main": "node_modules/expo/AppEntry.js",
   "scripts": {
-    "start": "react-native-scripts start",
-    "eject": "react-native-scripts eject",
-    "android": "react-native-scripts android",
-    "ios": "react-native-scripts ios",
-    "test": "node node_modules/jest/bin/jest.js --watch"
+    "start": "expo start",
+    "android": "expo start --android",
+    "ios": "expo start --ios"
   },
   "jest": {
     "preset": "jest-expo"
   },
   "dependencies": {
-    "expo": "^22.0.2",
-    "react": "16.0.0-beta.5",
-    "react-native": "^0.49.5",
-    "react-native-size-matters": "^0.1.0",
-    "react-navigation": "^1.0.0-beta.21"
+    "@react-navigation/native": "^6.0.13",
+    "@react-navigation/native-stack": "^6.9.1",
+    "expo": "^46.0.0",
+    "expo-status-bar": "~1.4.0",
+    "react": "18.0.0",
+    "react-native": "0.69.6",
+    "react-native-safe-area-context": "4.3.1",
+    "react-native-screens": "~3.15.0",
+    "react-native-size-matters": "^0.4.0"
   }
 }