Last active
March 12, 2021 22:49
-
-
Save QuadradS/64327f9ef237199c1f57c3d0bb6419ff to your computer and use it in GitHub Desktop.
Create reducer/action sample
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import {createAction} from "@reduxjs/toolkit"; | |
import * as constants from "../side-effects/constants"; | |
import {ICol, ISelect, IText} from "../form/reducer"; | |
export const showEditCol = createAction<{ c: ICol, rid: string } | null>(constants.EDIT_COL_MODAL) | |
export const showEditTextField = createAction<{ c: IText, rid: string, cid: string } | null>(constants.EDIT_TEXT_MODAL) | |
export const showEditSelect = createAction<{ c: ISelect, rid: string, cid: string } | null>(constants.EDIT_SELECT_MODAL) | |
export const activateDrag = createAction<{ type?: null | string, active?: boolean }>(constants.ACTIVATE_DRAG) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
export const EDIT_COL_MODAL = 'EDIT_COL_MODAL' | |
export const EDIT_TEXT_MODAL = 'EDIT_TEXT_MODAL' | |
export const EDIT_SELECT_MODAL = 'EDIT_SELECT_MODAL' | |
export const ACTIVATE_DRAG = 'ACTIVATE_DRAG' |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import {createReducer} from "@reduxjs/toolkit"; | |
import {IAction} from "../form/actions"; | |
import {activateDrag, showEditCol, showEditSelect, showEditTextField} from "./actions"; | |
import {ICol, ISelect, IText} from "../form/reducer"; | |
export interface ISideEffect { | |
editColModal: { c: ICol, rid: string } | null | |
editTextModal: { c: IText, rid: string, cid: string } | null | |
editSelectModal: { c: ISelect, rid: string, cid: string } | null | |
componentDrag: { | |
type: string | null | |
active: boolean | |
} | |
} | |
const initialState: ISideEffect = { | |
editColModal: null, | |
editTextModal: null, | |
editSelectModal: null, | |
componentDrag: { | |
type: null, | |
active: false | |
} | |
} | |
export default createReducer(initialState, (builder) => { | |
builder.addCase(showEditCol, (state, action: IAction<{ c: ICol, rid: string } | null>) => ({ | |
...state, | |
editColModal: action.payload | |
})) | |
builder.addCase(showEditTextField, (state, action: IAction<{ c: IText, rid: string, cid: string } | null>) => ({ | |
...state, | |
editTextModal: action.payload | |
})) | |
builder.addCase(showEditSelect, (state, action: IAction<{ c: ISelect, rid: string, cid: string } | null>) => ({ | |
...state, | |
editSelectModal: action.payload | |
})) | |
builder.addCase(activateDrag, (state, action: IAction<{ type?: null | string, active?: boolean }>) => ({ | |
...state, | |
componentDrag: { | |
...state.componentDrag, | |
...action.payload | |
} | |
})) | |
}) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment