import { createAsyncThunk, createSlice, PayloadAction } from '@reduxjs/toolkit'; import { getAppState, setAppState } from '../../lib/db'; interface AppState { uploadSessionStartTime: number | null; status: 'idle' | 'loading' | 'succeeded' | 'failed'; } const initialState: AppState = { uploadSessionStartTime: null, status: 'idle', }; // Thunk to fetch the session start time from the database export const syncUploadSessionState = createAsyncThunk( 'appState/syncUploadSessionState', async () => { const startTimeStr = await getAppState('uploadSessionStartTime'); return startTimeStr ? parseInt(startTimeStr, 10) : null; } ); // Thunk to clear the session state in the database, which will then be reflected in the store export const endUploadSessionInDb = createAsyncThunk( 'appState/endUploadSessionInDb', async () => { await setAppState('uploadSessionStartTime', null); return null; } ); const appStateSlice = createSlice({ name: 'appState', initialState, reducers: {}, extraReducers: (builder) => { builder .addCase(syncUploadSessionState.pending, (state) => { state.status = 'loading'; }) .addCase(syncUploadSessionState.fulfilled, (state, action: PayloadAction) => { state.status = 'succeeded'; state.uploadSessionStartTime = action.payload; }) .addCase(syncUploadSessionState.rejected, (state) => { state.status = 'failed'; }) .addCase(endUploadSessionInDb.fulfilled, (state, action: PayloadAction) => { state.uploadSessionStartTime = action.payload; }); }, }); export default appStateSlice.reducer;