memowake-front/features/appState/appStateSlice.ts

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<number | null>) => {
                state.status = 'succeeded';
                state.uploadSessionStartTime = action.payload;
            })
            .addCase(syncUploadSessionState.rejected, (state) => {
                state.status = 'failed';
            })
            .addCase(endUploadSessionInDb.fulfilled, (state, action: PayloadAction<null>) => {
                state.uploadSessionStartTime = action.payload;
            });
    },
});

export default appStateSlice.reducer;