Files
static-cms/src/store/slices/snackbars.ts
2022-10-20 18:41:46 -04:00

51 lines
1.3 KiB
TypeScript

import { createSlice } from '@reduxjs/toolkit';
import { v4 as uuid } from 'uuid';
import type { PayloadAction } from '@reduxjs/toolkit';
import type { RootState } from '..';
type MessageType = 'error' | 'warning' | 'info' | 'success';
export interface SnackbarMessage {
id: string;
type: MessageType;
message:
| string
| ({
key: string;
} & Record<string, unknown>);
}
// Define a type for the slice state
export interface SnackbarState {
messages: SnackbarMessage[];
}
// Define the initial state using that type
const initialState: SnackbarState = {
messages: [],
};
export const SnackbarSlice = createSlice({
name: 'snackbar',
// `createSlice` will infer the state type from the `initialState` argument
initialState,
reducers: {
addSnackbar: (state, action: PayloadAction<Omit<SnackbarMessage, 'id'>>) => {
state.messages.push({
id: uuid(),
...action.payload,
});
},
removeSnackbarById: (state, action: PayloadAction<string>) => {
state.messages = state.messages.filter(message => message.id !== action.payload);
},
},
});
export const { addSnackbar, removeSnackbarById } = SnackbarSlice.actions;
export const selectSnackbars = (state: RootState) => state.snackbar.messages;
export default SnackbarSlice.reducer;