120 lines
2.8 KiB
TypeScript
120 lines
2.8 KiB
TypeScript
import { createSlice, createAsyncThunk } from '@reduxjs/toolkit';
|
|
import axios from 'axios';
|
|
|
|
interface MainState {
|
|
users: any;
|
|
loading: boolean;
|
|
notify: {
|
|
showNotification: boolean;
|
|
textNotification: string;
|
|
typeNotification: string;
|
|
};
|
|
}
|
|
|
|
const initialState: MainState = {
|
|
users: [],
|
|
loading: false,
|
|
notify: {
|
|
showNotification: false,
|
|
textNotification: '',
|
|
typeNotification: 'warn',
|
|
},
|
|
};
|
|
|
|
export const fetch = createAsyncThunk('users/fetch', async (data: any) => {
|
|
const { id, query } = data;
|
|
const result = await axios.get(`users${query || (id ? `/${id}` : '')}`);
|
|
return id ? result.data : result.data.rows;
|
|
});
|
|
|
|
export const deleteItem = createAsyncThunk(
|
|
'users/deleteUser',
|
|
async (id: string, thunkAPI) => {
|
|
try {
|
|
await axios.delete(`users/${id}`);
|
|
thunkAPI.dispatch(fetch({ id: '', query: '' }));
|
|
} catch (error) {
|
|
console.log(error);
|
|
}
|
|
|
|
// showNotification('Users has been deleted', 'success');
|
|
},
|
|
);
|
|
|
|
export const create = createAsyncThunk(
|
|
'users/createUser',
|
|
async (data: any) => {
|
|
const result = await axios.post('users', { data });
|
|
// showNotification('Users has been created', 'success');
|
|
return result.data;
|
|
},
|
|
);
|
|
|
|
export const update = createAsyncThunk(
|
|
'users/updateUser',
|
|
async (payload: any) => {
|
|
const result = await axios.put(`users/${payload.id}`, {
|
|
id: payload.id,
|
|
data: payload.data,
|
|
});
|
|
return result.data;
|
|
},
|
|
);
|
|
|
|
export const usersSlice = createSlice({
|
|
name: 'users',
|
|
initialState,
|
|
reducers: {},
|
|
extraReducers: (builder) => {
|
|
builder.addCase(fetch.pending, (state) => {
|
|
state.loading = true;
|
|
});
|
|
builder.addCase(fetch.rejected, (state) => {
|
|
state.loading = false;
|
|
});
|
|
|
|
builder.addCase(fetch.fulfilled, (state, action) => {
|
|
state.users = action.payload;
|
|
state.loading = false;
|
|
});
|
|
|
|
builder.addCase(deleteItem.pending, (state) => {
|
|
state.loading = true;
|
|
});
|
|
|
|
builder.addCase(deleteItem.fulfilled, (state) => {
|
|
state.loading = false;
|
|
});
|
|
|
|
builder.addCase(deleteItem.rejected, (state) => {
|
|
state.loading = false;
|
|
});
|
|
|
|
builder.addCase(create.pending, (state) => {
|
|
state.loading = true;
|
|
});
|
|
builder.addCase(create.rejected, (state) => {
|
|
state.loading = false;
|
|
});
|
|
|
|
builder.addCase(create.fulfilled, (state) => {
|
|
state.loading = false;
|
|
});
|
|
|
|
builder.addCase(update.pending, (state) => {
|
|
state.loading = true;
|
|
});
|
|
builder.addCase(update.fulfilled, (state) => {
|
|
state.loading = false;
|
|
});
|
|
builder.addCase(update.rejected, (state) => {
|
|
state.loading = false;
|
|
});
|
|
},
|
|
});
|
|
|
|
// Action creators are generated for each case reducer function
|
|
// export const { } = usersSlice.actions
|
|
|
|
export default usersSlice.reducer;
|