CRM/Frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

CFE-4 Merge branch 'feature/CFE-4_mock_handler_structure' into 'develop'

Browse Source
This commit is contained in:
AmirHossein Mahmoodi
2023-10-18 12:04:18 +00:00
parent 490a34f22f c6f8f9b84c
commit 53f17f786d
17 changed files with 252 additions and 216 deletions
Download Patch File Download Diff File Expand all files Collapse all files

153
mocks/handler.js
View File

@@ -1,146 +1,13 @@
import {
GET_PERMISSIONS_LIST,
GET_ROLE_MANAGEMENT,
GET_SIDEBAR_NOTIFICATION,
GET_USER_ROUTE,
SET_USER_PASSWORD,
EXPERT_MANAGEMENT,
GET_PROVINCE_LIST,
GET_ROLE_LIST,
} from "@/core/data/apiRoutes";
import {rest} from "msw";
import {userHandler} from "./handlers/user";
import {permissionsHandler} from "./handlers/permissions";
import {rolesHandler} from "./handlers/roles";
import {provincesHandler} from "./handlers/provinces";
import {expertsHandler} from "./handlers/experts";
export const handler = [
rest.get(GET_USER_ROUTE, (req, res, ctx) => {
return res(ctx.json({
data: {
id: 10,
permissions: [
"manage_users"
],
}
}))
}),
rest.get(GET_SIDEBAR_NOTIFICATION, (req, res, ctx) => {
return res(ctx.json({
data: []
}))
}),
rest.post(SET_USER_PASSWORD, (req, res, ctx) => {
return res(
ctx.status(200),
);
}),
rest.get(GET_PERMISSIONS_LIST, (req, res, ctx) => {
return res(ctx.json(
{
data: [
{
id: 1,
name: "manage_passenger_office_navgan",
name_fa: "مدیریت کارتابل رییس اداره مسافری استان"
},
{
id: 2,
name: "manage_province_working_group_navgan",
name_fa: "مدیریت کارتابل کارگروه استانی"
}
]
}
))
}),
rest.get(GET_ROLE_MANAGEMENT, (req, res, ctx) => {
return res(
ctx.json(
{
data: [
{
created_at: "2023-10-01T07:20:07.000000Z",
guard_name: "api",
id: 1,
name: "admin",
name_fa: "ادمین",
permissions: [
{
id: 1,
name: "manage_users",
},
{
id: 2,
name: "manage_roles",
},
],
updated_at: "2023-10-10T07:38:12.000000Z"
},
{
created_at: "2023-10-01T07:20:07.000000Z",
guard_name: "api",
id: 2,
name: "manager",
name_fa: "مدیر",
permissions: [
{
id: 1,
name: "manage_users",
},
{
id: 2,
name: "manage_roles",
},
],
updated_at: "2023-10-10T07:38:12.000000Z"
}
],
meta: {
totalRowCount: 2
}
}
),
);
}),
rest.get(GET_PROVINCE_LIST, (req, res, ctx) => {
return res(ctx.json({
data: [
{
id: 1,
name: "آذربایجان شرقی"
},
{
id: 3,
name: "اردبیل"
}
]
}))
}),
rest.get(GET_ROLE_LIST, (req, res, ctx) => {
return res(ctx.json({
data: [
{
id: 1,
name: "admin",
name_fa: "ادمین"
},
{
id: 2,
name: "manager",
name_fa: "مدیر"
}
]
}))
}),
rest.post(EXPERT_MANAGEMENT, (req, res, ctx) => {
return res(
ctx.status(200),
);
}),
rest.delete(`${EXPERT_MANAGEMENT}/:id`, (req, res, ctx) => {
return res(
ctx.status(200),
);
}),
rest.post(`${EXPERT_MANAGEMENT}/:id`, (req, res, ctx) => {
return res(
ctx.status(200),
);
}),
...userHandler,
...permissionsHandler,
...rolesHandler,
...provincesHandler,
...expertsHandler
]

20
mocks/handlers/experts.js Normal file
View File

@@ -0,0 +1,20 @@
import {rest} from "msw";
import {ADD_EXPERT, DELETE_EXPERT, UPDATE_EXPERT} from "@/core/data/apiRoutes";
export const expertsHandler = [
rest.post(ADD_EXPERT, (req, res, ctx) => {
return res(
ctx.status(200),
);
}),
rest.delete(`${DELETE_EXPERT}/:id`, (req, res, ctx) => {
return res(
ctx.status(200),
);
}),
rest.post(`${UPDATE_EXPERT}/:id`, (req, res, ctx) => {
return res(
ctx.status(200),
);
}),
]

23
mocks/handlers/permissions.js Normal file
View File

@@ -0,0 +1,23 @@
import {rest} from "msw";
import {GET_PERMISSIONS_LIST} from "@/core/data/apiRoutes";
export const permissionsHandler = [
rest.get(GET_PERMISSIONS_LIST, (req, res, ctx) => {
return res(ctx.json(
{
data: [
{
id: 1,
name: "manage_passenger_office_navgan",
name_fa: "مدیریت کارتابل رییس اداره مسافری استان"
},
{
id: 2,
name: "manage_province_working_group_navgan",
name_fa: "مدیریت کارتابل کارگروه استانی"
}
]
}
))
})
]

19
mocks/handlers/provinces.js Normal file
View File

@@ -0,0 +1,19 @@
import {rest} from "msw";
import {GET_PROVINCE_LIST} from "@/core/data/apiRoutes";
export const provincesHandler = [
rest.get(GET_PROVINCE_LIST, (req, res, ctx) => {
return res(ctx.json({
data: [
{
id: 1,
name: "آذربایجان شرقی"
},
{
id: 3,
name: "اردبیل"
}
]
}))
}),
]

70
mocks/handlers/roles.js Normal file
View File

@@ -0,0 +1,70 @@
import {rest} from "msw";
import {GET_ROLE_LIST, GET_ROLES} from "@/core/data/apiRoutes";
export const rolesHandler = [
rest.get(GET_ROLES, (req, res, ctx) => {
return res(
ctx.json(
{
data: [
{
created_at: "2023-10-01T07:20:07.000000Z",
guard_name: "api",
id: 1,
name: "admin",
name_fa: "ادمین",
permissions: [
{
id: 1,
name: "manage_users",
},
{
id: 2,
name: "manage_roles",
},
],
updated_at: "2023-10-10T07:38:12.000000Z"
},
{
created_at: "2023-10-01T07:20:07.000000Z",
guard_name: "api",
id: 2,
name: "manager",
name_fa: "مدیر",
permissions: [
{
id: 1,
name: "manage_users",
},
{
id: 2,
name: "manage_roles",
},
],
updated_at: "2023-10-10T07:38:12.000000Z"
}
],
meta: {
totalRowCount: 2
}
}
),
);
}),
rest.get(GET_ROLE_LIST, (req, res, ctx) => {
return res(ctx.json({
data: [
{
id: 1,
name: "admin",
name_fa: "ادمین"
},
{
id: 2,
name: "manager",
name_fa: "مدیر"
}
]
}))
}),
]

25
mocks/handlers/user.js Normal file
View File

@@ -0,0 +1,25 @@
import {rest} from "msw";
import {GET_SIDEBAR_NOTIFICATION, GET_USER, SET_USER_PASSWORD} from "@/core/data/apiRoutes";
export const userHandler = [
rest.get(GET_USER, (req, res, ctx) => {
return res(ctx.json({
data: {
id: 10,
permissions: [
"manage_users"
],
}
}))
}),
rest.get(GET_SIDEBAR_NOTIFICATION, (req, res, ctx) => {
return res(ctx.json({
data: []
}))
}),
rest.post(SET_USER_PASSWORD, (req, res, ctx) => {
return res(
ctx.status(200),
);
}),
]

4
src/components/dashboard/expert-management/DataTable/index.jsx
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}

4
src/components/dashboard/expert-management/Form/CreateForm/CreateContent/index.jsx
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)

4
src/components/dashboard/expert-management/Form/DeleteForm/index.jsx
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)

4
src/components/dashboard/expert-management/Form/UpdateForm/UpdateContent/index.jsx
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)

79
src/components/dashboard/role-management/Form/CreateForm/CreateContent.jsx
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>

8
src/components/dashboard/role-management/Form/DeleteForm/DeleteContent.jsx
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

25
src/components/dashboard/role-management/Form/UpdateForm/UpdateContent.jsx
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) => (

6
src/components/dashboard/role-management/RoleManagementComponent.jsx
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}

4
src/components/first/__tests__/index.test.js
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>);

16
src/core/data/apiRoutes.js
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

4
src/lib/app/contexts/user.jsx
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}) => {