CFE-4 implementation of mock handler structure

This commit is contained in:
AmirHossein Mahmoodi
2023-10-18 15:23:21 +03:30
parent 490a34f22f
commit c6f8f9b84c
17 changed files with 252 additions and 216 deletions

View File

@@ -1,6 +1,6 @@
import DataTable from "@/core/components/DataTable";
import MuiDatePicker from "@/core/components/MuiDatePicker";
import {EXPERT_MANAGEMENT} from "@/core/data/apiRoutes";
import {GET_EXPERTS} from "@/core/data/apiRoutes";
import TableToolbar from "../TableToolbar";
import TableRowActions from "../TableRowActions";
import {Box, Typography} from "@mui/material";
@@ -165,7 +165,7 @@ function ExpertManagementDataTable() {
return (
<Box sx={{px: 3}}>
<DataTable
tableUrl={EXPERT_MANAGEMENT}
tableUrl={GET_EXPERTS}
columns={columns}
selectableRow={false}
CustomToolbar={TableToolbar}

View File

@@ -3,7 +3,7 @@ import * as Yup from "yup";
import {useTranslations} from "next-intl";
import {useFormik} from "formik";
import useRequest from "@/lib/app/hooks/useRequest";
import {EXPERT_MANAGEMENT} from "@/core/data/apiRoutes";
import {ADD_EXPERT} from "@/core/data/apiRoutes";
import PersonalInfo from "@/components/dashboard/expert-management/Form/CreateForm/CreateContent/PersonalInfo";
import UserInfo from "@/components/dashboard/expert-management/Form/CreateForm/CreateContent/UserInfo";
import RestInfo from "@/components/dashboard/expert-management/Form/CreateForm/CreateContent/RestInfo";
@@ -60,7 +60,7 @@ const CreateContent = ({setOpenCreateDialog, mutate, fetchUrl}) => {
formData.append("position", values.position);
formData.append("roles", values.roles);
requestServer(`${EXPERT_MANAGEMENT}`, 'post', {auth: true, data: formData})
requestServer(`${ADD_EXPERT}`, 'post', {auth: true, data: formData})
.then((response) => {
setOpenCreateDialog(false)
mutate(fetchUrl)

View File

@@ -10,7 +10,7 @@ import {
} from "@mui/material";
import DeleteIcon from '@mui/icons-material/Delete';
import {useState} from "react";
import {EXPERT_MANAGEMENT} from "@/core/data/apiRoutes";
import {DELETE_EXPERT} from "@/core/data/apiRoutes";
import useRequest from "@/lib/app/hooks/useRequest";
import {useTranslations} from "next-intl";
@@ -22,7 +22,7 @@ const Delete = ({rowId, fetchUrl, mutate}) => {
const handleDelete = () => {
setIsSubmitting(true)
requestServer(`${EXPERT_MANAGEMENT}/${rowId}`, 'DELETE')
requestServer(`${DELETE_EXPERT}/${rowId}`, 'DELETE')
.then((response) => {
setOpenDeleteDialog(false);
mutate(fetchUrl)

View File

@@ -3,7 +3,7 @@ import * as Yup from "yup";
import {useTranslations} from "next-intl";
import {useFormik} from "formik";
import useRequest from "@/lib/app/hooks/useRequest";
import {EXPERT_MANAGEMENT} from "@/core/data/apiRoutes";
import {UPDATE_EXPERT} from "@/core/data/apiRoutes";
import PersonalInfo from "./PersonalInfo";
import UserInfo from "./UserInfo";
import RestInfo from "./RestInfo";
@@ -52,7 +52,7 @@ const UpdateContent = ({row, fetchUrl, mutate, setOpenUpdateDialog}) => {
formData.append("position", values.position);
formData.append("roles", values.roles);
requestServer(`${EXPERT_MANAGEMENT}/${row.original.id}`, 'post', {auth: true, data: formData})
requestServer(`${UPDATE_EXPERT}/${row.original.id}`, 'post', {auth: true, data: formData})
.then((response) => {
setOpenUpdateDialog(false)
mutate(fetchUrl)

View File

@@ -1,21 +1,24 @@
import {
Button,
Checkbox, CircularProgress,
Checkbox,
CircularProgress,
DialogActions,
DialogContent, DialogTitle,
DialogContent,
DialogTitle,
FormControl,
FormControlLabel,
FormHelperText,
FormLabel,
Grid,
Stack,
TextField, Typography
TextField,
Typography
} from "@mui/material";
import {useTranslations} from "next-intl";
import useRequest from "@/lib/app/hooks/useRequest";
import * as Yup from "yup";
import {useFormik} from "formik";
import {ADD_ROLE_MANAGEMENT} from "@/core/data/apiRoutes";
import {ADD_ROLE} from "@/core/data/apiRoutes";
import usePermissions from "@/lib/app/hooks/usePermissions";
const CreateContent = ({mutate, fetchUrl, setOpenConfirmDialog}) => {
@@ -40,7 +43,7 @@ const CreateContent = ({mutate, fetchUrl, setOpenConfirmDialog}) => {
formData.append(`permissions[${i}]`, values.permissions[i]);
}
requestServer(ADD_ROLE_MANAGEMENT, 'post', {
requestServer(ADD_ROLE, 'post', {
data: formData,
}).then(() => {
setOpenConfirmDialog(false)
@@ -95,38 +98,40 @@ const CreateContent = ({mutate, fetchUrl, setOpenConfirmDialog}) => {
fullWidth
>
<FormHelperText>{formik.touched.permissions && formik.errors.permissions}</FormHelperText>
{isLoading ?
<Stack direction={'row'} alignItems={'center'} spacing={2} justifyContent={'center'}>
<CircularProgress size={20}/>
<Typography variant={'caption'}>{t("AddDialog.loading_permissions_list")}</Typography>
</Stack>
:(
<Grid container spacing={2}>
<>
{permissions_list.map((permission) => (
<Grid key={permission.id} item xs={6}>
<FormControlLabel
control={
<Checkbox
data-testid="PermissionList-checkbox"
checked={formik.values.permissions.includes(permission.id)}
onChange={(e) => {
if (e.target.checked) {
formik.setFieldValue("permissions", [...formik.values.permissions, permission.id])
} else {
formik.setFieldValue("permissions", formik.values.permissions.filter((id) => id !== permission.id))
}
}}
/>
}
label={permission.name_fa}
/>
</Grid>
))}
</>
</Grid>
)
}
{isLoading ?
<Stack direction={'row'} alignItems={'center'} spacing={2}
justifyContent={'center'}>
<CircularProgress size={20}/>
<Typography
variant={'caption'}>{t("AddDialog.loading_permissions_list")}</Typography>
</Stack>
: (
<Grid container spacing={2}>
<>
{permissions_list.map((permission) => (
<Grid key={permission.id} item xs={6}>
<FormControlLabel
control={
<Checkbox
data-testid="PermissionList-checkbox"
checked={formik.values.permissions.includes(permission.id)}
onChange={(e) => {
if (e.target.checked) {
formik.setFieldValue("permissions", [...formik.values.permissions, permission.id])
} else {
formik.setFieldValue("permissions", formik.values.permissions.filter((id) => id !== permission.id))
}
}}
/>
}
label={permission.name_fa}
/>
</Grid>
))}
</>
</Grid>
)
}
</FormControl>
</FormLabel>
</Stack>

View File

@@ -1,5 +1,5 @@
import {Button, DialogActions, DialogContent, DialogTitle, Typography} from "@mui/material";
import {DELETE_ROLE_MANAGEMENT} from "@/core/data/apiRoutes";
import {DELETE_ROLE} from "@/core/data/apiRoutes";
import {useState} from "react";
import useRequest from "@/lib/app/hooks/useRequest";
import useNotification from "@/lib/app/hooks/useNotification";
@@ -12,7 +12,7 @@ const DeleteContent = ({rowId, fetchUrl, mutate, setOpenConfirmDialog}) => {
const {update_notification} = useNotification()
const handleSubmit = () => {
setIsSubmitting(true)
requestServer(`${DELETE_ROLE_MANAGEMENT}/${rowId}`, 'delete').then((response) => {
requestServer(`${DELETE_ROLE}/${rowId}`, 'delete').then((response) => {
mutate(fetchUrl)
update_notification()
}).catch(() => {
@@ -20,7 +20,7 @@ const DeleteContent = ({rowId, fetchUrl, mutate, setOpenConfirmDialog}) => {
setIsSubmitting(false)
});
}
return(
return (
<>
<DialogTitle>{t("DeleteDialog.delete")}</DialogTitle>
<DialogContent>
@@ -39,4 +39,4 @@ const DeleteContent = ({rowId, fetchUrl, mutate, setOpenConfirmDialog}) => {
</>
)
}
export default DeleteContent
export default DeleteContent

View File

@@ -1,18 +1,21 @@
import {
Box,
Button,
Checkbox, CircularProgress, DialogActions,
DialogContent, DialogTitle,
Checkbox,
CircularProgress,
DialogActions,
DialogContent,
DialogTitle,
FormControl,
FormControlLabel,
FormHelperText,
FormLabel,
Grid,
Stack,
TextField, Typography
TextField,
Typography
} from "@mui/material";
import {useFormik} from "formik";
import {UPDATE_ROLE_MANAGEMENT} from "@/core/data/apiRoutes";
import {UPDATE_ROLE} from "@/core/data/apiRoutes";
import * as Yup from "yup";
import usePermissions from "@/lib/app/hooks/usePermissions";
import useNotification from "@/lib/app/hooks/useNotification";
@@ -44,7 +47,7 @@ const UpdateContent = ({mutate, row, fetchUrl, setOpenConfirmDialog}) => {
formData.append(`permissions[${i}]`, values.permissions[i]);
}
requestServer(`${UPDATE_ROLE_MANAGEMENT}/${row.getValue("id")}`, 'post', {
requestServer(`${UPDATE_ROLE}/${row.getValue("id")}`, 'post', {
data: formData,
}).then((response) => {
mutate(fetchUrl)
@@ -56,7 +59,7 @@ const UpdateContent = ({mutate, row, fetchUrl, setOpenConfirmDialog}) => {
},
});
return(
return (
<>
<DialogTitle>{t("UpdateDialog.update")}</DialogTitle>
<DialogContent>
@@ -96,11 +99,13 @@ const UpdateContent = ({mutate, row, fetchUrl, setOpenConfirmDialog}) => {
>
<FormHelperText>{formik.touched.permissions && formik.errors.permissions}</FormHelperText>
{isLoading ?
<Stack direction={'row'} alignItems={'center'} spacing={2} justifyContent={'center'}>
<Stack direction={'row'} alignItems={'center'} spacing={2}
justifyContent={'center'}>
<CircularProgress size={20}/>
<Typography variant={'caption'}>{t("UpdateDialog.loading_permissions_list")}</Typography>
<Typography
variant={'caption'}>{t("UpdateDialog.loading_permissions_list")}</Typography>
</Stack>
:(
: (
<Grid container spacing={2}>
<>
{permissions_list.map((permission) => (

View File

@@ -1,5 +1,5 @@
import DataTable from "@/core/components/DataTable";
import {GET_ROLE_MANAGEMENT} from "@/core/data/apiRoutes";
import {GET_ROLES} from "@/core/data/apiRoutes";
import TableRowActions from "@/components/dashboard/role-management/TableRowActions";
import {Box, Typography} from "@mui/material";
import {useTranslations} from "next-intl";
@@ -65,10 +65,10 @@ const RoleManagementComponent = () => {
datatype: "numeric",
Cell: ({renderedCellValue}) => (<Typography variant="body2">{renderedCellValue}</Typography>),
}], []);
return(
return (
<Box sx={{px: 3}}>
<DataTable
tableUrl={GET_ROLE_MANAGEMENT}
tableUrl={GET_ROLES}
columns={columns}
selectableRow={false}
enableCustomToolbar={true}

View File

@@ -3,7 +3,7 @@ import FirstComponent from "@/components/first";
import MockAppWithProviders from "../../../../mocks/AppWithProvider";
import {server} from "../../../../mocks/server";
import {rest} from "msw";
import {GET_USER_ROUTE} from "@/core/data/apiRoutes";
import {GET_USER} from "@/core/data/apiRoutes";
describe("First Component From First Page", () => {
describe("Rendering", () => {
@@ -46,7 +46,7 @@ describe("First Component From First Page", () => {
});
it("Show Login Button And Do Not Show Dashboard Button When User Authentication Is Expired", async () => {
localStorage.setItem("_token", 'token');
server.use([rest.get(GET_USER_ROUTE, (req, res, ctx) => {
server.use([rest.get(GET_USER, (req, res, ctx) => {
return res(ctx.status(403))
})])
render(<MockAppWithProviders><FirstComponent/></MockAppWithProviders>);

View File

@@ -21,22 +21,21 @@ export const SET_USER_PASSWORD = BASE_URL + "/api/profile/change_password";
//end change password
//user data
export const GET_USER_ROUTE = BASE_URL + "/api/profile/info";
export const GET_USER = BASE_URL + "/api/profile/info";
//user data
//sidebar notification
export const GET_SIDEBAR_NOTIFICATION = BASE_URL + "/dashboard/notification"
//sidebar notification
// role management
export const GET_ROLE_MANAGEMENT =
export const GET_ROLES =
BASE_URL + "/api/roles"
export const ADD_ROLE_MANAGEMENT =
export const ADD_ROLE =
BASE_URL + "/api/roles"
export const UPDATE_ROLE_MANAGEMENT =
export const UPDATE_ROLE =
BASE_URL + "/api/roles"
export const DELETE_ROLE_MANAGEMENT =
export const DELETE_ROLE =
BASE_URL + "/api/roles"
export const GET_PERMISSIONS_LIST =
@@ -44,5 +43,8 @@ export const GET_PERMISSIONS_LIST =
//role management
//expert management
export const EXPERT_MANAGEMENT = BASE_URL + "/api/users";
export const GET_EXPERTS = BASE_URL + "/api/users";
export const ADD_EXPERT = BASE_URL + "/api/users";
export const UPDATE_EXPERT = BASE_URL + "/api/users";
export const DELETE_EXPERT = BASE_URL + "/api/users";
//expert management

View File

@@ -1,4 +1,4 @@
import {GET_USER_ROUTE} from "@/core/data/apiRoutes";
import {GET_USER} from "@/core/data/apiRoutes";
import axios from "axios";
import {createContext, useCallback, useEffect, useReducer} from "react";
import {errorRequest, errorResponse, errorSetting} from "@/core/utils/errorHandler";
@@ -71,7 +71,7 @@ export const UserProvider = ({children}) => {
(callback = () => {
}) => {
axios
.get(GET_USER_ROUTE, {
.get(GET_USER, {
headers: {authorization: `Bearer ${state.token}`},
})
.then(({data}) => {