diff --git a/src/components/topmenu.tsx b/src/components/topmenu.tsx index 79c62a5..fd4ece1 100644 --- a/src/components/topmenu.tsx +++ b/src/components/topmenu.tsx @@ -88,7 +88,7 @@ export const TopMenu = function(props: { onClick?: () => void }) { }, [dispatch, handleMenuClose, discTitle]); const handleExit = useCallback(() => { - dispatch(appActions.setState('WELCOME')); + dispatch(appActions.setMainView('WELCOME')); handleMenuClose(); }, [dispatch, handleMenuClose]); @@ -196,7 +196,7 @@ export const TopMenu = function(props: { onClick?: () => void }) { ref={helpLinkRef} onClick={handleHelpLink} > - Support and FAQs + Support and FAQ diff --git a/src/components/win95/app.tsx b/src/components/win95/app.tsx index 0d4865f..3ef51bd 100644 --- a/src/components/win95/app.tsx +++ b/src/components/win95/app.tsx @@ -68,7 +68,7 @@ export const W95App = () => { const [isMenuOpen, setMenuOpen] = useState(false); const handleExit = useCallback(() => { - dispatch(appActions.setState('WELCOME')); + dispatch(appActions.setMainView('WELCOME')); }, [dispatch]); const closeMenu = useCallback(() => { diff --git a/src/index.tsx b/src/index.tsx index babae3a..bc28aa8 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -36,7 +36,7 @@ serviceRegistry.mediaRecorderService = new MediaRecorderService(); if (navigator && navigator.usb) { navigator.usb.ondisconnect = function() { - store.dispatch(appActions.setState('WELCOME')); + store.dispatch(appActions.setMainView('WELCOME')); }; } else { store.dispatch(appActions.setBrowserSupported(false)); diff --git a/src/redux/actions.ts b/src/redux/actions.ts index baa20b3..451258d 100644 --- a/src/redux/actions.ts +++ b/src/redux/actions.ts @@ -56,7 +56,7 @@ export function pair() { try { let connected = await serviceRegistry.netmdService!.connect(); if (connected) { - dispatch(appStateActions.setState('MAIN')); + dispatch(appStateActions.setMainView('MAIN')); return; } } catch (err) { @@ -67,7 +67,7 @@ export function pair() { try { let paired = await serviceRegistry.netmdService!.pair(); if (paired) { - dispatch(appStateActions.setState('MAIN')); + dispatch(appStateActions.setMainView('MAIN')); return; } dispatch(batchActions([appStateActions.setPairingMessage(`Connection Failed`), appStateActions.setPairingFailed(true)])); diff --git a/src/redux/app-feature.ts b/src/redux/app-feature.ts index 0223650..5d8167f 100644 --- a/src/redux/app-feature.ts +++ b/src/redux/app-feature.ts @@ -17,24 +17,29 @@ export interface AppState { hasNotificationSupport: boolean; } -const initialState: AppState = { - mainView: 'WELCOME', - loading: false, - pairingFailed: false, - pairingMessage: ``, - browserSupported: true, - darkMode: loadPreference('darkMode', false), - vintageMode: loadPreference('vintageMode', false), - aboutDialogVisible: false, - notifyWhenFinished: loadPreference('notifyWhenFinished', false), - hasNotificationSupport: true, +export const buildInitialState = (): AppState => { + return { + mainView: 'WELCOME', + loading: false, + pairingFailed: false, + pairingMessage: ``, + browserSupported: true, + darkMode: loadPreference('darkMode', false), + vintageMode: loadPreference('vintageMode', false), + aboutDialogVisible: false, + notifyWhenFinished: loadPreference('notifyWhenFinished', false), + hasNotificationSupport: true, + }; }; +const initialState: AppState = buildInitialState(); + export const slice = createSlice({ name: 'app', initialState, reducers: { - setState: (state, action: PayloadAction) => { + setMainView: (state, action: PayloadAction) => { + // CAVEAT: There's a middleware that resets the state when mainView is set to WELCOME state.mainView = action.payload; }, setLoading: (state, action: PayloadAction) => { @@ -62,7 +67,7 @@ export const slice = createSlice({ }, setVintageMode: (state, action: PayloadAction) => { state.vintageMode = action.payload; - savePreference('vintageMode', state.vintageMode); + savePreference('vintageMode', action.payload); }, showAboutDialog: (state, action: PayloadAction) => { state.aboutDialogVisible = action.payload; diff --git a/src/redux/store.ts b/src/redux/store.ts index b29ed15..e0c98f9 100644 --- a/src/redux/store.ts +++ b/src/redux/store.ts @@ -6,7 +6,7 @@ import panicDialog, { actions as panicDialogActions } from './panic-dialog-featu import convertDialog from './convert-dialog-feature'; import dumpDialog from './dump-dialog-feature'; import recordDialog from './record-dialog-feature'; -import appState, { actions as appActions } from './app-feature'; +import appState, { actions as appActions, buildInitialState as buildInitialAppState } from './app-feature'; import main from './main-feature'; const errorCatcher: Middleware = store => next => async action => { @@ -30,12 +30,15 @@ let reducer = combineReducers({ main, }); -const resetStateAction = appActions.setState.toString(); +const resetStateAction = appActions.setMainView.toString(); const resetStatePayoload = 'WELCOME'; const resetStateReducer: typeof reducer = function(...args) { const [state, action] = args; if (action.type === resetStateAction && action.payload === resetStatePayoload) { - return initialState; + return { + ...initialState, + appState: buildInitialAppState(), + }; } return reducer(...args); };