From 35f50f2df8dd3493e332d37f6a6a625bd5430c89 Mon Sep 17 00:00:00 2001 From: steve192 Date: Fri, 15 Mar 2024 18:25:36 +0100 Subject: [PATCH 1/3] feat: make updates asynchronous Signed-off-by: steve192 --- App.tsx | 4 +- src/helper/GlobalSnackbar.tsx | 62 ++++++++++++++++++++++++ src/i18n/de.json | 4 ++ src/i18n/en.json | 6 ++- src/screens/LoginScreen/SplashScreen.tsx | 28 ++++++----- 5 files changed, 89 insertions(+), 15 deletions(-) create mode 100644 src/helper/GlobalSnackbar.tsx diff --git a/App.tsx b/App.tsx index 1314384..9a6e2aa 100644 --- a/App.tsx +++ b/App.tsx @@ -1,10 +1,11 @@ /* eslint-disable no-unused-vars */ /* eslint-disable react/display-name */ import React from 'react'; -import {Provider as PaperProvider} from 'react-native-paper'; +import {Provider as PaperProvider, Snackbar} from 'react-native-paper'; import {enableScreens} from 'react-native-screens'; import {Provider, useSelector} from 'react-redux'; import {Prompt} from './src/helper/Prompt'; +import {GlobalSnackbar} from './src/helper/GlobalSnackbar'; import './src/i18n/config'; import MainNavigation from './src/navigation/MainNavigation'; import {RootState, store} from './src/redux/store'; @@ -41,6 +42,7 @@ const ReduxWrappedApp = () => { + ); }; diff --git a/src/helper/GlobalSnackbar.tsx b/src/helper/GlobalSnackbar.tsx new file mode 100644 index 0000000..48c0869 --- /dev/null +++ b/src/helper/GlobalSnackbar.tsx @@ -0,0 +1,62 @@ +import React from 'react'; +import {MD3Theme, Snackbar, withTheme} from 'react-native-paper'; + +interface Options { + message: string; + button1?:string; + button1Callback?: () => void; + button2?: string; + button2Callback?: () => void ; +} +interface State extends Options{ + shown: boolean; +} + +interface Props { + theme: MD3Theme +} +class SnackbarWithoutStyles extends React.Component { + private static component: SnackbarWithoutStyles; + constructor(props: Props) { + super(props); + SnackbarWithoutStyles.component = this; + this.state = { + shown: false, + message: '', + button1: '', + button1Callback: undefined, + }; + } + + render() { + return this.setState({shown: false})} + action={this.state.button1 ? { + label: this.state.button1, + onPress: this.state.button1Callback, + buttonColor: this.props.theme.colors.primary, + textColor: this.props.theme.colors.onPrimary + }: undefined}> + {this.state.message} + ; + } + + + componentDidMount() { + SnackbarWithoutStyles.component = this; + } + + public static show(options: Options) { + this.component.setState({...options, shown: true}); + } +} +export const SnackbarUtil = { + show: (options: Options) => { + SnackbarWithoutStyles.show(options); + }, +}; + +export const GlobalSnackbar = withTheme(SnackbarWithoutStyles); diff --git a/src/i18n/de.json b/src/i18n/de.json index f647869..719716d 100644 --- a/src/i18n/de.json +++ b/src/i18n/de.json @@ -9,6 +9,10 @@ "sunday": "Sonntag" }, "common": { + "update": { + "restartprompt": "Eine neue App Version ist verfügbar. Neustarten?", + "restartbutton": "Jetzt neustarten" + }, "or": "oder", "save": "Speichern", "unknownerror": "Unknown error occured", diff --git a/src/i18n/en.json b/src/i18n/en.json index 4141ae7..f86c463 100644 --- a/src/i18n/en.json +++ b/src/i18n/en.json @@ -9,6 +9,10 @@ "sunday": "Sunday" }, "common": { + "update": { + "restartprompt": "A new app version is available. Restart?", + "restartbutton": "Restart now" + }, "or": "or", "save": "Save", "unknownerror": "Unknown error occured", @@ -164,4 +168,4 @@ "week": "Week" } } -} \ No newline at end of file +} diff --git a/src/screens/LoginScreen/SplashScreen.tsx b/src/screens/LoginScreen/SplashScreen.tsx index bcfb032..5b957d4 100644 --- a/src/screens/LoginScreen/SplashScreen.tsx +++ b/src/screens/LoginScreen/SplashScreen.tsx @@ -11,6 +11,7 @@ import {changeBackendUrl, changeOnlineState} from '../../redux/features/settings import {useAppDispatch} from '../../redux/hooks'; import {LoginBackdrop} from './LoginBackdrop'; import {useAppTheme} from '../../styles/CentralStyles'; +import {SnackbarUtil} from '../../helper/GlobalSnackbar'; export const SplashScreen = () => { @@ -33,27 +34,28 @@ export const SplashScreen = () => { // Check for new app versions - try { - const info = await NetInfo.fetch(); - if (info.isInternetReachable) { - setStatusText(t('screens.splash.checkingforupdates')); + const info = await NetInfo.fetch(); + if (info.isInternetReachable) { + // Do update asynchronously + const updateAsync = async () => { console.log('Update check'); await new Promise((r) => setTimeout(r, 1000)); const update = await Updates.checkForUpdateAsync(); if (update.isAvailable) { console.log('Dowload update'); - setStatusText(t('screens.splash.downloading')); await Updates.fetchUpdateAsync(); console.log('Restarting app'); - setStatusText(t('screens.splash.restarting')); - await AppPersistence.clearOfflineData(); - Updates.reloadAsync() - .then((r) => console.log('Restart triggered', r)) - .catch((e) => console.error('Restarting failed', e)); + + SnackbarUtil.show({message: t('common.update.restartprompt'), button1: t('common.update.restartbutton'), button1Callback: () => { + AppPersistence.clearOfflineData().then(() => { + Updates.reloadAsync() + .then((r) => console.log('Restart triggered', r)) + .catch((e) => console.error('Restarting failed', e)); + }); + }}); } - } - } catch (e) { - // Ignore error, just start with unupdated version + }; + updateAsync(); } // TODO: Proper management of backend url via redux From 044a1148f050ff525a125ed8453f6e31c0d6d09e Mon Sep 17 00:00:00 2001 From: steve192 Date: Fri, 15 Mar 2024 18:36:14 +0100 Subject: [PATCH 2/3] use color scheme --- App.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/App.tsx b/App.tsx index 9a6e2aa..4a78dae 100644 --- a/App.tsx +++ b/App.tsx @@ -34,7 +34,7 @@ const ReduxWrappedApp = () => { } else if (selectedTheme == 'dark') { theme = OwnPaperThemeDark; } else { - theme = OwnPaperThemeDark; + theme = colorScheme == 'light' ? OwnPaperTheme : OwnPaperThemeDark; } From 91ba476d0af34163e57b56203b4ec4552fe6fc2d Mon Sep 17 00:00:00 2001 From: steve192 Date: Fri, 15 Mar 2024 18:36:36 +0100 Subject: [PATCH 3/3] cleanup code --- src/helper/Prompt.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/helper/Prompt.tsx b/src/helper/Prompt.tsx index cec436f..2fa9ee9 100644 --- a/src/helper/Prompt.tsx +++ b/src/helper/Prompt.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import {Button, Dialog, MD3Colors, MD3Theme, Paragraph, withTheme} from 'react-native-paper'; +import {Button, Dialog, MD3Theme, Paragraph, withTheme} from 'react-native-paper'; import CentralStyles from '../styles/CentralStyles'; interface Options {