Preview:
import { createSlice } from "@reduxjs/toolkit";
import { actionName } from "actionName-file-path"


export const sliceName = createSlice({
   name: "any-name",
   initialState: {
    // all initial states
  },
  reducers: {
    // all reducers defined here
    
    reducerName(state, action){
      // reducer logic
    }
  },
  extraReducers: {
    // all async extra reducers defined here
    
    [actionName.pending]: (state, action) => {
      // action object come from actionName 
      
      // const { response, data, params} = action.payload
    },

    [actionName.fulfilled]: (state, action) => {},

    [actionName.rejected]: (state, action) => {},
  }
})

export const { reducerName } = sliceName.actions; // import them in any components needed

export default sliceName.reducer; // import it in rootRedcer (allReducers)
downloadDownload PNG downloadDownload JPEG downloadDownload SVG

Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!

Click to optimize width for Twitter