install redux toolkit

1npm install @reduxjs/toolkit react-redux

1import { createSlice } from '@reduxjs/toolkit';
2
3export const counterSlice = createSlice({
4  name: 'counter',
5  initialState: {
6    value: 0,
7  },
8  reducers: {
9    increment: state => { 
10      state.value += 1;
11    },
12    decrement: state => {
13      state.value -= 1;
14    },
15    incrementByAmount: (state, action) => {
16      state.value += action.payload;
17    },
18  },
19});
20
21export const { increment, decrement, incrementByAmount } = counterSlice.actions;
22
23export const selectCount = state => state.counter.value;
24
25export default counterSlice.reducer;
26

1import { createSlice } from '@reduxjs/toolkit'
2// Slice
3const slice = createSlice({
4  name: 'user',
5  initialState: {
6    user: null,
7  },
8  reducers: {
9    loginSuccess: (state, action) => {
10      state.user = action.payload;
11    },
12    logoutSuccess: (state, action) =>  {
13      state.user = null;
14    },
15  },
16});
17export default slice.reducer
18// Actions
19const { loginSuccess, logoutSuccess } = slice.actions
20export const login = ({ username, password }) => async dispatch => {
21  try {
22    // const res = await api.post('/api/auth/login/', { username, password })
23    dispatch(loginSuccess({username}));
24  } catch (e) {
25    return console.error(e.message);
26  }
27}
28export const logout = () => async dispatch => {
29  try {
30    // const res = await api.post('/api/auth/logout/')
31    return dispatch(logoutSuccess())
32  } catch (e) {
33    return console.error(e.message);
34  }
35}