diff --git a/src/pages/AdminList/index.tsx b/src/pages/AdminList/index.tsx index 2502445..3f2b4f4 100644 --- a/src/pages/AdminList/index.tsx +++ b/src/pages/AdminList/index.tsx @@ -8,7 +8,6 @@ import { useDispatch, useSelector } from "react-redux" import { adminList } from "../../redux/slices/authSlice" import { AppDispatch, RootState } from "../../redux/store/store" // Import RootState for selector - // Sample data for categories export default function AdminList() { @@ -19,21 +18,17 @@ export default function AdminList() { const [deleteModal, setDeleteModal] = React.useState(false) const [rowData, setRowData] = React.useState(null) - const dispatch = useDispatch(); + const dispatch = useDispatch() // Fetching admin data from the Redux store - const admins = useSelector((state: RootState) => state.auth.admins); - - - console.log(admins, "woihfiuwhfownfownefoi") + const admins = useSelector((state: RootState) => state.auth.admins) // Dispatching the API call when the component mounts useEffect(() => { - dispatch(adminList()); - }, [dispatch]); - + dispatch(adminList()) + }, [dispatch]) - const handleClickOpen = () => { + const handleClickOpen = () => { setModalOpen(true) setEditRow(null) } @@ -55,11 +50,15 @@ export default function AdminList() { ] // If no admins are available, display the sample data - const categoryRows = admins?.length ? admins?.map((admin: { name: any; role: any }, index: number) => ({ - srno: index + 1, - name: admin?.name, - role: admin.role, - })) : [] + const categoryRows = admins?.length + ? admins?.map( + (admin: { name: string; role: string }, index: number) => ({ + srno: index + 1, + name: admin?.name, + role: admin?.role || "N/A", + }) + ) + : [] return ( <> diff --git a/src/redux/slices/F b/src/redux/slices/F new file mode 100644 index 0000000..5a1b828 --- /dev/null +++ b/src/redux/slices/F @@ -0,0 +1,32 @@ +import { createSlice, createAsyncThunk } from '@reduxjs/toolkit'; +import axios from 'axios'; + +// Example: You might have an API call for deleting admin like this +export const deleteAdmin = createAsyncThunk( + 'auth/deleteAdmin', + async (adminId: number, thunkAPI) => { + try { + const response = await axios.delete(`/api/admins/${adminId}`); + return adminId; // Return the ID of the deleted admin + } catch (error) { + return thunkAPI.rejectWithValue(error.response.data); + } + } +); + +const authSlice = createSlice({ + name: 'auth', + initialState: { + admins: [], // Array of admins + }, + reducers: {}, + extraReducers: (builder) => { + builder.addCase(deleteAdmin.fulfilled, (state, action) => { + // Remove the deleted admin from the state + state.admins = state.admins.filter((admin) => admin.id !== action.payload); + }); + // Handle rejected state if needed + }, +}); + +export default authSlice.reducer; diff --git a/src/redux/slices/authSlice.ts b/src/redux/slices/authSlice.ts index aff6def..d33de3a 100644 --- a/src/redux/slices/authSlice.ts +++ b/src/redux/slices/authSlice.ts @@ -5,22 +5,27 @@ import { toast } from "react-toastify" // Define types for state interface User { - map(arg0: (admin: { name: any; role: any }, index: number) => { srno: number; name: any; role: any }): unknown + map( + arg0: ( + admin: { name: string; role: string }, + index: number + ) => { srno: number; name: string; role: string } + ): unknown id: string email: string } interface Admin { - id: string, - name: string, + id: string + name: string role: string } interface AuthState { - user: User | null; - admins: Admin[]; - isAuthenticated: boolean; - isLoading: boolean; - error: string | null; + user: User | null + admins: Admin[] + isAuthenticated: boolean + isLoading: boolean + error: string | null } // Async thunk for login @@ -30,7 +35,10 @@ export const loginUser = createAsyncThunk< { rejectValue: string } >("auth/login", async ({ email, password }, { rejectWithValue }) => { try { - const response = await backendHttp.post("admin/login", { email, password }) + const response = await backendHttp.post("admin/login", { + email, + password, + }) localStorage.setItem("authToken", response.data?.data?.token) // Save token toast.success(response.data?.message) return response.data @@ -66,19 +74,21 @@ export const adminList = createAsyncThunk< { rejectValue: string } >("/auth", async (_, { rejectWithValue }) => { try { - const response = await apiHttp.get("/auth"); + const response = await apiHttp.get("/auth") console.log(response) - return response?.data?.data?.map((admin: { name: string; role: string }) => ({ - - name: admin?.name, - role: admin?.role || "N/A", - })); - console.log(response.data.data) + return response?.data?.data?.map( + (admin: { name: string; role: string }) => ({ + name: admin?.name, + role: admin?.role, + }) + ) + // console.log(response.data.data) } catch (error: any) { - return rejectWithValue(error.response?.data?.message || "An error occurred"); + return rejectWithValue( + error.response?.data?.message || "An error occurred" + ) } -}); - +}) const initialState: AuthState = { user: null, @@ -86,7 +96,7 @@ const initialState: AuthState = { isAuthenticated: false, isLoading: false, error: null, -}; +} const authSlice = createSlice({ name: "auth", @@ -140,16 +150,18 @@ const authSlice = createSlice({ } ) - // created by Jaanvi and Eknoor - .addCase(adminList.pending, (state) => { + // created by Jaanvi and Eknoor + .addCase(adminList.pending, (state) => { state.isLoading = true state.error = null }) - .addCase(adminList.fulfilled, (state, action: PayloadAction) => { - state.isLoading = false; - state.admins = action.payload; // ✅ Store admins correctly - }) - + .addCase( + adminList.fulfilled, + (state, action: PayloadAction) => { + state.isLoading = false + state.admins = action.payload // ✅ Store admins correctly + } + ) .addCase( adminList.rejected,