Merge pull request #51 from yssk22/develop

[expo] fix loading with Suspense

expo/features/common/components/Loading.tsx

@@ -0,0 +1,19 @@
+import { useColor } from '@hpapp/features/settings/context/theme';
+import { ActivityIndicator, StyleSheet, View } from 'react-native';
+
+export default function Loading() {
+  const [color] = useColor('primary');
+  return (
+    <View style={styles.container}>
+      <ActivityIndicator color={color} />
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center'
+  }
+});

expo/features/home/HomeScreen.tsx

@@ -1,4 +1,5 @@
 import ArtistsTab from '@hpapp/features/artist/ArtistsTab';
+import Loading from '@hpapp/features/common/components/Loading';
 import EventsTab from '@hpapp/features/home/Events';
 import GoodsTab from '@hpapp/features/home/GoodsTab';
 import HomeTab from '@hpapp/features/home/HomeTab';
@@ -9,7 +10,7 @@ import { useColor } from '@hpapp/features/settings/context/theme';
 import { UPFCProvider } from '@hpapp/features/upfc/context';
 import { t } from '@hpapp/system/i18n';
 import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
-import React from 'react';
+import React, { Suspense } from 'react';
 import { View, StyleSheet } from 'react-native';
 import Ionicons from 'react-native-vector-icons/Ionicons';
 
@@ -54,8 +55,10 @@ function tabComponent(c: React.ElementType<any>) {
   return function TabComponent() {
     return (
       <View style={styles.tab}>
-        <AppUpdateBanner />
-        {React.createElement(c)}
+        <Suspense fallback={<Loading />}>
+          <AppUpdateBanner />
+          {React.createElement(c)}
+        </Suspense>
       </View>
     );
   };

expo/features/root/banner/AppUpdateBanner.tsx

@@ -1,6 +1,7 @@
 import Text from '@hpapp/features/common/components/Text';
 import { FontSize, Spacing } from '@hpapp/features/common/constants';
 import { useColor } from '@hpapp/features/settings/context/theme';
+import Constants from 'expo-constants';
 import * as Updates from 'expo-updates';
 import { useState, useEffect } from 'react';
 import { AppState, AppStateStatus, TouchableOpacity, StyleSheet, View } from 'react-native';
@@ -49,9 +50,11 @@ export default function AppUpdateBanner({
           setUpdateAvailable(update.isAvailable);
         }
       } catch (e: any) {
-        logging.Error('features.root.banner.AppUpdateBanner', 'failed to check update', {
-          error: e.toString()
-        });
+        if (Constants.expoConfig?.extra?.hpapp?.isDev !== true) {
+          logging.Error('features.root.banner.AppUpdateBanner', 'failed to check update', {
+            error: e.toString()
+          });
+        }
         if (!unmounted) {
           setUpdateCheckState(null);
           setUpdateAvailable(false);

expo/features/root/protected/ProtectedRoot.tsx

@@ -1,11 +1,11 @@
+import Loading from '@hpapp/features/common/components/Loading';
 import { initURICache } from '@hpapp/features/common/hooks/uricache';
 import Initialize from '@hpapp/features/root/protected/Initializer';
 import LoadError from '@hpapp/features/root/protected/LoadError';
 import RootWrapper from '@hpapp/features/root/protected/RootWrapper';
 import { ServiceRootProvider } from '@hpapp/features/root/protected/context';
 import { Screen, ScreenParams, createStackNavigator } from '@hpapp/features/root/protected/stack';
 import { useNavigationContainerRef } from '@react-navigation/native';
-import { Text } from '@rneui/base';
 
 const Stack = createStackNavigator({
   rootComponent: RootWrapper
@@ -17,14 +17,7 @@ export default function ProtectedRoot({ screens }: { screens: Screen<ScreenParam
   const navigation = useNavigationContainerRef<ReactNavigation.RootParamList>();
   return (
     <Initialize initializers={initializers}>
-      <ServiceRootProvider
-        errorFallback={<LoadError />}
-        loadingFallback={
-          <>
-            <Text>Loading</Text>
-          </>
-        }
-      >
+      <ServiceRootProvider errorFallback={<LoadError />} loadingFallback={<Loading />}>
         <Stack ref={navigation} screens={screens} initialRouteName="/" />
       </ServiceRootProvider>
     </Initialize>

expo/package.json

@@ -7,14 +7,15 @@
     "start": "expo start --dev-client --lan",
     "start-go": "yarn expo start",
     "eas-build-pre-install": "./scripts/eas-build-pre-install.sh",
-    "build-dev": "HPAPP_CONFIG_NAME=dev ./scripts/eas.sh build --profile dev --non-interactive",
-    "build-beta": "HPAPP_CONFIG_NAME=beta ./scripts/eas.sh build --profile beta --non-interactive",
-    "build-prod": "HPAPP_CONFIG_NAME=prod ./scripts/eas.sh build --profile prod --non-interactive",
-    "update-beta": "HPAPP_CONFIG_NAME=beta ./scripts/eas.sh update --channel beta --non-interactive --auto",
     "relay": "node ./scripts/genschema.js && yarn relay-compiler",
     "test": "yarn jest ./",
     "lint": "yarn eslint ./",
-    "genscreen": "node ./scripts/genscreen.js"
+    "genscreen": "node ./scripts/genscreen.js",
+    "start-dev": "HPAPP_CONFIG_NAME=dev expo start --dev-client --lan",
+    "build-dev": "HPAPP_CONFIG_NAME=dev ./scripts/eas.sh build --profile dev --non-interactive",
+    "build-beta": "HPAPP_CONFIG_NAME=beta ./scripts/eas.sh build --profile beta --non-interactive",
+    "build-prod": "HPAPP_CONFIG_NAME=prod ./scripts/eas.sh build --profile prod --non-interactive",
+    "update-beta": "HPAPP_CONFIG_NAME=beta ./scripts/eas.sh update --channel beta --non-interactive --auto"
   },
   "relay": {
     "src": "./",

expo/system/logging/Console.ts

@@ -2,7 +2,7 @@
 import { LogLevel, LogSink } from '@hpapp/system/logging/types';
 import Constants from 'expo-constants';
 
-const defaultEvents = '.*'; // '.*';
+const defaultEvents: string[] = []; //'.*'; // '.*';
 
 const consoleEvents: RegExp[] = (Constants.expoConfig?.extra?.hpapp?.consoleEvents || [defaultEvents]).map(
   (re: string) => {