create active disactive feature
This commit is contained in:
jaanvi
parent
1c233360c4
commit
42300867a7
|
|
@ -172,7 +172,7 @@ const AddEditCategoryModal: React.FC<AddEditCategoryModalProps> = ({
|
|||
/>
|
||||
)}
|
||||
/>
|
||||
<Controller
|
||||
{!editRow &&<Controller
|
||||
name="password"
|
||||
control={control}
|
||||
rules={{
|
||||
|
|
@ -191,7 +191,7 @@ const AddEditCategoryModal: React.FC<AddEditCategoryModalProps> = ({
|
|||
helperText={errors.password?.message}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
/>}
|
||||
<Controller
|
||||
name="phone"
|
||||
control={control}
|
||||
|
|
|
|||
|
|
@ -7,10 +7,22 @@ import TableContainer from "@mui/material/TableContainer";
|
|||
import TableHead from "@mui/material/TableHead";
|
||||
import TableRow from "@mui/material/TableRow";
|
||||
import Paper, { paperClasses } from "@mui/material/Paper";
|
||||
import { Box, Button, IconButton, Menu } from "@mui/material";
|
||||
import { adminList, deleteAdmin } from "../../redux/slices/adminSlice";
|
||||
import { useDispatch } from "react-redux";
|
||||
import {
|
||||
Box,
|
||||
Button,
|
||||
dividerClasses,
|
||||
IconButton,
|
||||
listClasses,
|
||||
Menu,
|
||||
} from "@mui/material";
|
||||
import MoreVertRoundedIcon from "@mui/icons-material/MoreVertRounded";
|
||||
import { useDispatch } from "react-redux"; // Correct the import for dispatch
|
||||
import DeleteModal from "../Modals/DeleteModal";
|
||||
import { AppDispatch } from "../../redux/store/store";
|
||||
import ViewModal from "../Modals/ViewModal";
|
||||
|
||||
// Styled components for customization
|
||||
const StyledTableCell = styled(TableCell)(({ theme }) => ({
|
||||
[`&.${tableCellClasses.head}`]: {
|
||||
backgroundColor: " #1565c0",
|
||||
|
|
@ -38,22 +50,19 @@ export interface Column {
|
|||
|
||||
interface Row {
|
||||
[key: string]: any;
|
||||
status: number;
|
||||
statusValue: any;
|
||||
}
|
||||
|
||||
interface CustomTableProps {
|
||||
columns: Column[];
|
||||
rows: Row[];
|
||||
setDeleteModal: Function;
|
||||
// setRowData: Function;
|
||||
// setModalOpen: Function;
|
||||
setRowData: Function;
|
||||
setModalOpen: Function;
|
||||
viewModal: boolean;
|
||||
setViewModal: Function;
|
||||
deleteModal: boolean;
|
||||
setRowData: React.Dispatch<React.SetStateAction<any>>; // Adjust this type if needed
|
||||
setModalOpen: React.Dispatch<React.SetStateAction<boolean>>;
|
||||
handleStatusToggle: (id: string, currentStatus: number) => void;
|
||||
tableType?: string;
|
||||
}
|
||||
|
||||
const CustomTable: React.FC<CustomTableProps> = ({
|
||||
|
|
@ -66,27 +75,54 @@ const CustomTable: React.FC<CustomTableProps> = ({
|
|||
setViewModal,
|
||||
setModalOpen,
|
||||
handleStatusToggle,
|
||||
tableType,
|
||||
}) => {
|
||||
const dispatch = useDispatch<AppDispatch>();
|
||||
const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);
|
||||
const [selectedRow, setSelectedRow] = React.useState<Row | null>(null);
|
||||
|
||||
const open = Boolean(anchorEl);
|
||||
///const dispatch = useDispatch(); // Initialize dispatch
|
||||
|
||||
// Handle menu actions
|
||||
const handleClick = (event: React.MouseEvent<HTMLElement>, row: Row) => {
|
||||
setAnchorEl(event.currentTarget);
|
||||
setSelectedRow(row);
|
||||
setSelectedRow(row); // Ensure the row data is set
|
||||
setRowData(row);
|
||||
};
|
||||
|
||||
const handleClose = () => {
|
||||
setAnchorEl(null);
|
||||
};
|
||||
const dispatch = useDispatch<AppDispatch>();
|
||||
// Handle status toggle logic
|
||||
// const handleStatusToggle = (id: string, status: number) => {
|
||||
// dispatch(toggleStatus({ id, status })); // Dispatch the action to update status
|
||||
// };
|
||||
|
||||
const isImage = (value: any) => {
|
||||
if (typeof value === "string") {
|
||||
return value.startsWith("http") || value.startsWith("data:image"); // Check for URL or base64 image
|
||||
}
|
||||
return false;
|
||||
};
|
||||
|
||||
const handleDeleteButton = (id: string | undefined) => {
|
||||
if (!id) console.error("ID not found", id);
|
||||
|
||||
dispatch(deleteAdmin(id || ""));
|
||||
setDeleteModal(false); // Close the modal only after deletion
|
||||
handleClose();
|
||||
};
|
||||
|
||||
const handleViewButton = (id: string | undefined) => {
|
||||
if (!id) console.error("ID not found", id);
|
||||
|
||||
dispatch(adminList());
|
||||
setViewModal(false);
|
||||
};
|
||||
|
||||
const handleToggleStatus = () => {
|
||||
if (selectedRow) {
|
||||
// Toggle the opposite of current status
|
||||
const newStatus = selectedRow.statusValue === 1 ? 0 : 1;
|
||||
handleStatusToggle(selectedRow.id, newStatus);
|
||||
}
|
||||
handleClose();
|
||||
};
|
||||
|
||||
return (
|
||||
<Box sx={{ overflowX: "auto", width: "100%" }}>
|
||||
|
|
@ -97,7 +133,11 @@ const CustomTable: React.FC<CustomTableProps> = ({
|
|||
{columns.map((column) => (
|
||||
<StyledTableCell
|
||||
key={column.id}
|
||||
align={column.align}
|
||||
align={column.align || "left"}
|
||||
sx={{
|
||||
whiteSpace: "nowrap", // Prevent wrapping
|
||||
fontSize: { xs: "12px", sm: "14px" }, // Responsively adjust font size
|
||||
}}
|
||||
>
|
||||
{column.label}
|
||||
</StyledTableCell>
|
||||
|
|
@ -110,15 +150,33 @@ const CustomTable: React.FC<CustomTableProps> = ({
|
|||
{columns.map((column) => (
|
||||
<StyledTableCell
|
||||
key={column.id}
|
||||
align={column.align}
|
||||
align={column.align || "left"}
|
||||
sx={{
|
||||
whiteSpace: "nowrap", // Prevent wrapping
|
||||
fontSize: {
|
||||
xs: "12px",
|
||||
sm: "14px",
|
||||
}, // Responsively adjust font size
|
||||
}}
|
||||
>
|
||||
{column.id !== "action" ? (
|
||||
{isImage(row[column.id]) ? (
|
||||
<img
|
||||
src={row[column.id]}
|
||||
alt="Row "
|
||||
style={{
|
||||
width: "50px",
|
||||
height: "50px",
|
||||
objectFit: "cover",
|
||||
}}
|
||||
/>
|
||||
) : column.id !== "action" ? (
|
||||
row[column.id]
|
||||
) : (
|
||||
<IconButton
|
||||
onClick={(e) =>
|
||||
handleClick(e, row)
|
||||
}
|
||||
onClick={(e) => {
|
||||
handleClick(e, row);
|
||||
setRowData(row); // Store the selected row
|
||||
}}
|
||||
>
|
||||
<MoreVertRoundedIcon />
|
||||
</IconButton>
|
||||
|
|
@ -132,46 +190,106 @@ const CustomTable: React.FC<CustomTableProps> = ({
|
|||
</TableContainer>
|
||||
|
||||
{/* Menu Actions */}
|
||||
{open && selectedRow && (
|
||||
{open && (
|
||||
<Menu
|
||||
anchorEl={anchorEl}
|
||||
id="menu"
|
||||
open={open}
|
||||
onClose={handleClose}
|
||||
onClick={handleClose}
|
||||
transformOrigin={{ horizontal: "right", vertical: "top" }}
|
||||
anchorOrigin={{ horizontal: "right", vertical: "bottom" }}
|
||||
sx={{
|
||||
[`& .${listClasses.root}`]: {
|
||||
padding: "4px",
|
||||
},
|
||||
[`& .${paperClasses.root}`]: {
|
||||
padding: 0,
|
||||
},
|
||||
[`& .${dividerClasses.root}`]: {
|
||||
margin: "4px -4px",
|
||||
},
|
||||
}}
|
||||
>
|
||||
<Button
|
||||
variant="text"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
setViewModal(true);
|
||||
<Box
|
||||
sx={{
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
justifyContent: "flex-start",
|
||||
}}
|
||||
>
|
||||
View
|
||||
</Button>
|
||||
<Button variant="text" onClick={() => setModalOpen(true)}>
|
||||
Edit
|
||||
</Button>
|
||||
{/* This button now toggles the status based on the current status */}
|
||||
<Button
|
||||
variant="text"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
const newStatus = selectedRow?.status === 0 ? 0 : 1;
|
||||
handleStatusToggle(selectedRow?.id, newStatus);
|
||||
}}
|
||||
>
|
||||
{selectedRow?.status === 1 ? "Deactivate" : "Activate"}
|
||||
</Button>
|
||||
<Button
|
||||
variant="text"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
setViewModal(true);
|
||||
}}
|
||||
color="primary"
|
||||
sx={{
|
||||
justifyContent: "flex-start",
|
||||
py: 0,
|
||||
textTransform: "capitalize",
|
||||
}}
|
||||
>
|
||||
View
|
||||
</Button>
|
||||
{viewModal && (
|
||||
<ViewModal
|
||||
handleView={() =>
|
||||
handleViewButton(selectedRow?.id)
|
||||
}
|
||||
open={viewModal}
|
||||
setViewModal={setViewModal}
|
||||
id={selectedRow?.id}
|
||||
/>
|
||||
)}
|
||||
<Button
|
||||
variant="text"
|
||||
onClick={() => setModalOpen(true)}
|
||||
color="primary"
|
||||
sx={{
|
||||
justifyContent: "flex-start",
|
||||
py: 0,
|
||||
textTransform: "capitalize",
|
||||
}}
|
||||
>
|
||||
Edit
|
||||
</Button>
|
||||
|
||||
<Button
|
||||
variant="text"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
setDeleteModal(true);
|
||||
}}
|
||||
>
|
||||
Delete
|
||||
</Button>
|
||||
{tableType === "roleList" && (
|
||||
<Button variant="text" onClick={handleToggleStatus}>
|
||||
{selectedRow.statusValue === 1
|
||||
? "Deactivate"
|
||||
: "Activate"}
|
||||
</Button>
|
||||
)}
|
||||
|
||||
<Button
|
||||
variant="text"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
setDeleteModal(true);
|
||||
}}
|
||||
color="error"
|
||||
sx={{
|
||||
justifyContent: "flex-start",
|
||||
py: 0,
|
||||
textTransform: "capitalize",
|
||||
}}
|
||||
>
|
||||
Delete
|
||||
</Button>
|
||||
{deleteModal && (
|
||||
<DeleteModal
|
||||
handleDelete={() =>
|
||||
handleDeleteButton(selectedRow?.id)
|
||||
}
|
||||
open={deleteModal}
|
||||
setDeleteModal={setDeleteModal}
|
||||
id={selectedRow?.id}
|
||||
/>
|
||||
)}
|
||||
</Box>
|
||||
</Menu>
|
||||
)}
|
||||
</Box>
|
||||
|
|
|
|||
|
|
@ -56,9 +56,7 @@ const ProfilePage = () => {
|
|||
<Grid container spacing={2} alignItems="center">
|
||||
<Grid item>
|
||||
<Avatar
|
||||
//Eknoor singh
|
||||
//date:- 12-Feb-2025
|
||||
//user is called for name and email
|
||||
|
||||
alt={user?.name || "User Avatar"}
|
||||
src={"/static/images/avatar/7.jpg"}
|
||||
sx={{ width: 80, height: 80 }}
|
||||
|
|
@ -75,7 +73,7 @@ const ProfilePage = () => {
|
|||
Phone: {user?.phone || "N/A"}
|
||||
</Typography>
|
||||
<Typography variant="body2" color="text.secondary">
|
||||
Role: <b>{user?.role || "N/A"}</b>
|
||||
Role: <b>{user?.userType || "N/A"}</b>
|
||||
</Typography>
|
||||
</Grid>
|
||||
</Grid>
|
||||
|
|
|
|||
|
|
@ -43,6 +43,10 @@ export default function RoleList() {
|
|||
reset();
|
||||
};
|
||||
|
||||
const handleStatusToggle = (id: string, newStatus: number) => {
|
||||
dispatch(toggleStatus({ id, status: newStatus }));
|
||||
};
|
||||
|
||||
const handleCreate = async (data: {
|
||||
name: string;
|
||||
resource: {
|
||||
|
|
@ -120,158 +124,17 @@ export default function RoleList() {
|
|||
) : (
|
||||
<CustomTable
|
||||
columns={categoryColumns}
|
||||
rows={categoryRows}
|
||||
rows={categoryRows || []}
|
||||
setDeleteModal={setDeleteModal}
|
||||
deleteModal={deleteModal}
|
||||
setViewModal={setViewModal}
|
||||
viewModal={viewModal}
|
||||
setRowData={setRowData}
|
||||
setModalOpen={setModalOpen}
|
||||
handleStatusToggle={(id, currentStatus) => {
|
||||
// Correct logic to toggle between active and inactive
|
||||
const updatedStatus = currentStatus === 1 ? 0 : 1;
|
||||
dispatch(toggleStatus({ id, status: updatedStatus }));
|
||||
}}
|
||||
handleStatusToggle={handleStatusToggle}
|
||||
tableType="roleList"
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
// import React, { useEffect, useState } from "react";
|
||||
// import { Box, Button, Typography } from "@mui/material";
|
||||
// import AddEditRoleModal from "../../components/AddEditRoleModal";
|
||||
// import { useForm } from "react-hook-form";
|
||||
// import CustomTable, { Column } from "../../components/CustomTable";
|
||||
// import { useDispatch, useSelector } from "react-redux";
|
||||
// import { createRole, roleList } from "../../redux/slices/roleSlice";
|
||||
// import { AppDispatch, RootState } from "../../redux/store/store";
|
||||
|
||||
// export default function RoleList() {
|
||||
// const [modalOpen, setModalOpen] = useState(false);
|
||||
// const { reset } = useForm();
|
||||
|
||||
// const [deleteModal, setDeleteModal] = React.useState<boolean>(false);
|
||||
// const [viewModal, setViewModal] = React.useState<boolean>(false);
|
||||
// const [rowData, setRowData] = React.useState<any | null>(null);
|
||||
|
||||
// const dispatch = useDispatch<AppDispatch>();
|
||||
|
||||
// const roles = useSelector((state: RootState) => state.roleReducer.roles);
|
||||
|
||||
// useEffect(() => {
|
||||
// dispatch(roleList());
|
||||
// }, [dispatch]);
|
||||
|
||||
// const handleClickOpen = () => {
|
||||
// setRowData(null); // Reset row data when opening for new role
|
||||
// setModalOpen(!modalOpen);
|
||||
// };
|
||||
|
||||
// const handleCloseModal = () => {
|
||||
// setModalOpen(false);
|
||||
// setRowData(null);
|
||||
// reset();
|
||||
// };
|
||||
|
||||
// const handleCreate = async (data: {
|
||||
// name: string;
|
||||
// resource: {
|
||||
// moduleName: string;
|
||||
// moduleId: string;
|
||||
// permissions: string[];
|
||||
// }[];
|
||||
// }) => {
|
||||
// try {
|
||||
// await dispatch(createRole(data));
|
||||
// await dispatch(roleList()); // Refresh the list after creation
|
||||
// handleCloseModal();
|
||||
// } catch (error) {
|
||||
// console.error("Creation failed", error);
|
||||
// }
|
||||
// };
|
||||
|
||||
// const categoryColumns: Column[] = [
|
||||
// { id: "srno", label: "Sr No" },
|
||||
// { id: "name", label: "Name" },
|
||||
// { id: "action", label: "Action", align: "center" },
|
||||
// ];
|
||||
|
||||
// const categoryRows = roles?.length
|
||||
// ? roles?.map(function (
|
||||
// role: {
|
||||
// id: string;
|
||||
// name: string;
|
||||
// // email: string;
|
||||
|
||||
// // phone: string;
|
||||
// // location?: string;
|
||||
// // managerAssigned?: string;
|
||||
// // vehicle?: string;
|
||||
// },
|
||||
// index: number
|
||||
// ) {
|
||||
// return {
|
||||
// id: role?.id,
|
||||
// srno: index + 1,
|
||||
// name: role?.name,
|
||||
// // email: user?.email,
|
||||
// // phone: user?.phone,
|
||||
// // location: user?.location,
|
||||
// // managerAssigned: user?.managerAssigned,
|
||||
// // vehicle: user?.vehicle,
|
||||
// };
|
||||
// })
|
||||
// : [];
|
||||
|
||||
// console.log("Category Rows:", categoryRows);
|
||||
|
||||
// return (
|
||||
// <>
|
||||
// <Box
|
||||
// sx={{
|
||||
// width: "100%",
|
||||
// maxWidth: {
|
||||
// sm: "100%",
|
||||
// display: "flex",
|
||||
// justifyContent: "space-between",
|
||||
// alignItems: "center",
|
||||
// },
|
||||
// }}
|
||||
// >
|
||||
// <Typography
|
||||
// component="h2"
|
||||
// variant="h6"
|
||||
// sx={{ mt: 2, fontWeight: 600 }}
|
||||
// >
|
||||
// Roles
|
||||
// </Typography>
|
||||
// <Button
|
||||
// variant="contained"
|
||||
// size="medium"
|
||||
// sx={{ textAlign: "right" }}
|
||||
// onClick={handleClickOpen}
|
||||
// >
|
||||
// Add Role
|
||||
// </Button>
|
||||
// </Box>
|
||||
|
||||
// <CustomTable
|
||||
// columns={categoryColumns}
|
||||
// rows={categoryRows}
|
||||
// setDeleteModal={setDeleteModal}
|
||||
// deleteModal={deleteModal}
|
||||
// setViewModal={setViewModal}
|
||||
// viewModal={viewModal}
|
||||
// setRowData={setRowData}
|
||||
// setModalOpen={setModalOpen}
|
||||
// />
|
||||
// {/* <AddEditRoleModal
|
||||
// open={modalOpen}
|
||||
// handleClose={handleCloseModal}
|
||||
// handleCreate={handleCreate}
|
||||
// editRow={rowData}
|
||||
// /> */}
|
||||
// </>
|
||||
// );
|
||||
// }
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import { toast } from "sonner";
|
|||
|
||||
// Define TypeScript types
|
||||
interface Role {
|
||||
id: any;
|
||||
id: string;
|
||||
name: string;
|
||||
resource: {
|
||||
moduleName: string;
|
||||
|
|
@ -28,7 +28,7 @@ const initialState: RoleState = {
|
|||
error: null,
|
||||
};
|
||||
|
||||
export const roleList = createAsyncThunk<Role[], void, { rejectValue: string }>(
|
||||
export const roleList = createAsyncThunk<any, void, { rejectValue: string }>(
|
||||
"fetchRoles",
|
||||
async (_, { rejectWithValue }) => {
|
||||
try {
|
||||
|
|
@ -37,11 +37,12 @@ export const roleList = createAsyncThunk<Role[], void, { rejectValue: string }>(
|
|||
|
||||
const response = await http.get("get");
|
||||
|
||||
if (!response.data?.data) throw new Error("Invalid API response");
|
||||
if (!response.data) throw new Error("Invalid API response");
|
||||
|
||||
return response.data.data;
|
||||
// Return the full response to handle in the reducer
|
||||
return response.data;
|
||||
} catch (error: any) {
|
||||
toast.error("Error Fetching Roles" + error);
|
||||
toast.error("Error Fetching Roles: " + error.message);
|
||||
return rejectWithValue(
|
||||
error?.response?.data?.message || "An error occurred"
|
||||
);
|
||||
|
|
@ -51,7 +52,7 @@ export const roleList = createAsyncThunk<Role[], void, { rejectValue: string }>(
|
|||
|
||||
// Create Role
|
||||
export const createRole = createAsyncThunk<
|
||||
Role,
|
||||
any,
|
||||
{
|
||||
name: string;
|
||||
resource: {
|
||||
|
|
@ -61,11 +62,16 @@ export const createRole = createAsyncThunk<
|
|||
}[];
|
||||
},
|
||||
{ rejectValue: string }
|
||||
>("/CreateRole", async (data, { rejectWithValue }) => {
|
||||
>("role/createRole", async (data, { rejectWithValue }) => {
|
||||
try {
|
||||
const response = await http.post("create", data);
|
||||
toast.success("Role created successfully");
|
||||
return response.data;
|
||||
} catch (error: any) {
|
||||
toast.error(
|
||||
"Failed to create role: " +
|
||||
(error.response?.data?.message || "Unknown error")
|
||||
);
|
||||
return rejectWithValue(
|
||||
error.response?.data?.message || "An error occurred"
|
||||
);
|
||||
|
|
@ -73,23 +79,40 @@ export const createRole = createAsyncThunk<
|
|||
});
|
||||
|
||||
export const toggleStatus = createAsyncThunk<
|
||||
Role,
|
||||
{ id: string; status: number }, // status now expects a number (0 or 1)
|
||||
any,
|
||||
{ id: string; status: number },
|
||||
{ rejectValue: string }
|
||||
>("/toggleRoleStatus", async ({ id, status }, { rejectWithValue }) => {
|
||||
>("role/toggleStatus", async ({ id, status }, { rejectWithValue }) => {
|
||||
try {
|
||||
const response = await http.patch(`${id}`, { status });
|
||||
console.log("API Response:", response.data);
|
||||
return response.data;
|
||||
|
||||
if (response.data.statusCode === 200) {
|
||||
toast.success(
|
||||
response.data.message || "Status updated successfully"
|
||||
);
|
||||
// Return both the response data and the requested status for reliable state updates
|
||||
return {
|
||||
responseData: response.data,
|
||||
id,
|
||||
status,
|
||||
};
|
||||
} else {
|
||||
throw new Error(response.data.message || "Failed to update status");
|
||||
}
|
||||
} catch (error: any) {
|
||||
toast.error(
|
||||
"Error updating status: " + (error.message || "Unknown error")
|
||||
);
|
||||
return rejectWithValue(
|
||||
error.response?.data?.message || "An error occurred"
|
||||
error.response?.data?.message ||
|
||||
error.message ||
|
||||
"An error occurred"
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
const roleSlice = createSlice({
|
||||
name: "fetchRoles",
|
||||
name: "roles",
|
||||
initialState,
|
||||
reducers: {},
|
||||
extraReducers: (builder) => {
|
||||
|
|
@ -102,7 +125,11 @@ const roleSlice = createSlice({
|
|||
roleList.fulfilled,
|
||||
(state, action: PayloadAction<any>) => {
|
||||
state.loading = false;
|
||||
state.roles = action.payload.results; // Extract results from response
|
||||
// Properly extract roles from the response data structure
|
||||
state.roles =
|
||||
action.payload.data?.results ||
|
||||
action.payload.data ||
|
||||
[];
|
||||
}
|
||||
)
|
||||
.addCase(roleList.rejected, (state, action) => {
|
||||
|
|
@ -114,9 +141,12 @@ const roleSlice = createSlice({
|
|||
})
|
||||
.addCase(
|
||||
createRole.fulfilled,
|
||||
(state, action: PayloadAction<Role>) => {
|
||||
(state, action: PayloadAction<any>) => {
|
||||
state.loading = false;
|
||||
state.roles.push(action.payload);
|
||||
// Add the newly created role to the state if it exists in the response
|
||||
if (action.payload.data) {
|
||||
state.roles.push(action.payload.data);
|
||||
}
|
||||
}
|
||||
)
|
||||
.addCase(
|
||||
|
|
@ -126,27 +156,37 @@ const roleSlice = createSlice({
|
|||
state.error = action.payload || "Failed to create role";
|
||||
}
|
||||
)
|
||||
.addCase(toggleStatus.pending, (state) => {
|
||||
state.loading = true;
|
||||
})
|
||||
.addCase(
|
||||
toggleStatus.fulfilled,
|
||||
(state, action: PayloadAction<Role>) => {
|
||||
(state, action: PayloadAction<any>) => {
|
||||
state.loading = false;
|
||||
const updatedRole = action.payload;
|
||||
|
||||
const index = state.roles.findIndex(
|
||||
(role) => role.id === updatedRole.id
|
||||
// Get the id and updated status from the action payload
|
||||
const { id, status } = action.payload;
|
||||
|
||||
// Find and update the role with the new status
|
||||
const roleIndex = state.roles.findIndex(
|
||||
(role) => role.id === id
|
||||
);
|
||||
if (index >= 0) {
|
||||
state.roles[index] = {
|
||||
...state.roles[index],
|
||||
status: updatedRole.status,
|
||||
if (roleIndex !== -1) {
|
||||
state.roles[roleIndex] = {
|
||||
...state.roles[roleIndex],
|
||||
status: status,
|
||||
};
|
||||
}
|
||||
}
|
||||
)
|
||||
.addCase(toggleStatus.rejected, (state, action) => {
|
||||
state.loading = false;
|
||||
state.error = action.payload || "Failed to toggle role status";
|
||||
});
|
||||
.addCase(
|
||||
toggleStatus.rejected,
|
||||
(state, action: PayloadAction<string | undefined>) => {
|
||||
state.loading = false;
|
||||
state.error =
|
||||
action.payload || "Failed to toggle role status";
|
||||
}
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue