EXPO 52

.gitignore

@@ -14,11 +14,21 @@ web-build/
 
 # macOS
 .DS_Store
+dist/
 
 # yarn
-yarn-error.log
+yarn-debug.log*
+yarn-error.log*
+
+# Yarn 3.x
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/sdks
+!.yarn/versions
+.pnp.*
 
-dist/
 
 # project files
 

.yarnrc.yml

@@ -0,0 +1,7 @@
+compressionLevel: mixed
+
+enableGlobalCache: false
+
+nodeLinker: node-modules
+
+yarnPath: .yarn/releases/yarn-4.6.0.cjs

README.md

@@ -21,15 +21,15 @@
 - [🏆 Why Use BACA?](#-why-use-baca)
 - [🔍 Preview](#-preview)
 - [🚀 How to Use?](#-how-to-use)
-    - [🏃‍♂️ Quick Steps](#️-quick-steps)
+  - [🏃‍♂️ Quick Steps](#️-quick-steps)
 - [🛠 Prerequisites](#-prerequisites)
 - [📦 What's Inside?](#-whats-inside)
 - [Libraries and Tools](#libraries-and-tools)
 - [🔜 Future Plans](#-future-plans)
 - [👏 How to Contribute](#-how-to-contribute)
-    - [Steps to Contribute](#steps-to-contribute)
+  - [Steps to Contribute](#steps-to-contribute)
 - [🤙 How to Run Locally](#-how-to-run-locally)
-    - [Environment Variables Setup](#environment-variables-setup)
+  - [Environment Variables Setup](#environment-variables-setup)
 - [📘 License](#-license)
 - [📝 Feedback](#-feedback)
 - [👨‍👩‍👧‍👦 Contributors](#-contributors)
@@ -65,6 +65,8 @@ While there are many project starters for React Native, we offer features that a
 - **Fully Typed**
   - Ensures robust code quality.
 - **Comprehensive App Deployment Documentation**
+- **New architecture**
+  - Works on new architecture of react native
 
 ## 🔍 Preview
 
@@ -107,7 +109,7 @@ Ideally it would be good to have finished [React Native Environment setup](https
 ### Libraries and Tools
 
 - **TypeScript**: Strictly typed code for enhanced development experience.
-- **Expo v50**: The latest Expo framework with modern React Native features.
+- **Expo v52**: The latest Expo framework with modern React Native features.
 - **Prettier and Eslint**: Automatically format and lint your code.
 - **Babel-Module-Resolver**: Unified imports.
 - **Jest and @testing-library/react-native**: Unit tests for React Native components.

ReactotronConfig.ts

@@ -1,5 +1,4 @@
 import AsyncStorage from '@react-native-async-storage/async-storage'
-import { NativeModules } from 'react-native'
 import Reactotron from 'reactotron-react-native'
 
 /**
@@ -10,16 +9,9 @@ import Reactotron from 'reactotron-react-native'
  * See: https://github.com/infinitered/reactotron/blob/master/docs/quick-start-react-native.md#configure-reactotron-with-your-project
  */
 
-let scriptHostname
-if (__DEV__) {
-  const scriptURL = NativeModules.SourceCode.scriptURL
-  scriptHostname = scriptURL.split('://')[1].split(':')[0]
-}
-
 Reactotron?.setAsyncStorageHandler?.(AsyncStorage)
   .configure({
     name: 'Reactotron In Expo demo',
-    host: scriptHostname,
   })
   .useReactNative({
     asyncStorage: false,

app.json

@@ -1,14 +1,15 @@
 {
   "expo": {
+    "newArchEnabled": true,
     "android": {
       "jsEngine": "hermes",
-      "versionCode": 22,
+      "versionCode": 27,
       "softwareKeyboardLayoutMode": "pan",
       "googleServicesFile": "./google-services.json"
     },
     "assetBundlePatterns": ["**/*"],
     "ios": {
-      "buildNumber": "22",
+      "buildNumber": "27",
       "config": {
         "usesNonExemptEncryption": false
       },
@@ -21,16 +22,11 @@
     "orientation": "portrait",
     "owner": "binarapps",
     "slug": "expo-typescript-template",
-    "splash": {
-      "backgroundColor": "#ffffff",
-      "image": "./assets/splash.png",
-      "resizeMode": "cover"
-    },
     "updates": {
       "fallbackToCacheTimeout": 0
     },
     "userInterfaceStyle": "automatic",
-    "version": "2.5.0",
+    "version": "2.6.1",
     "plugins": [
       "@react-native-google-signin/google-signin",
       "expo-asset",
@@ -46,6 +42,18 @@
             "useFrameworks": "static"
           }
         }
+      ],
+      [
+        "expo-splash-screen",
+        {
+          "backgroundColor": "#ffffff",
+          "image": "./assets/splash-light.png",
+          "dark": {
+            "image": "./assets/splash-dark.png",
+            "backgroundColor": "#0D1320"
+          },
+          "imageWidth": 200
+        }
       ]
     ],
     "web": {

app/(app)/(authorized)/_layout.tsx

@@ -14,5 +14,5 @@ export default function AuthorizedLayout() {
     return <Redirect href="/sign-in" />
   }
 
-  return <Stack screenOptions={{ headerBackTitleVisible: false }} />
+  return <Stack screenOptions={{ headerBackButtonDisplayMode: 'minimal' }} />
 }

app/(app)/_layout.tsx

@@ -6,7 +6,7 @@ export const unstable_settings = {
 
 export default function AppLayout() {
   return (
-    <Stack screenOptions={{ headerShown: false, headerBackTitleVisible: false }}>
+    <Stack screenOptions={{ headerShown: false, headerBackButtonDisplayMode: 'minimal' }}>
       <Stack.Screen name="(authorized)" />
       <Stack.Screen name="(not-authorized)" />
       <Stack.Screen name="(common)" />

docs/docs/bootstrap/BOOTSTRAP_TESTING.mdx

@@ -61,7 +61,8 @@ Config inside the app is prepared that your icons will be named respectively:
   - favicon-staging.png
   - favicon-production.png
 - splash screen:
-  - splash.png
+  - splash-dark.png
+  - splash-light.png
 
 And placed in proper folders: