From 53c03fb418a7168a64fce9d231e8ff8340d99f01 Mon Sep 17 00:00:00 2001 From: Mohammad Jalali Date: Mon, 2 Oct 2023 16:25:29 +0330 Subject: [PATCH] CFE-3 bringing all directories and finish test of DataTable index and start CreatForm test --- public/locales/fa/app.json | 14 ++ .../DataTable/__tests__/index.test.js | 30 ++- .../expert-management/DataTable/index.jsx | 182 +++++++++++++++++- .../Form/ChangePassword/index.jsx | 7 + .../CreateContent/__tests__/index.test.js | 0 .../Form/CreateForm/CreateContent/index.jsx | 0 .../Form/CreateForm/__tests__/index.test.js | 18 ++ .../Form/CreateForm/index.jsx | 30 +++ .../Form/DeleteForm/index.jsx | 7 + .../Form/UpdateForm/index.jsx | 7 + .../expert-management/TableRowActions.jsx | 28 +++ .../expert-management/TableToolbar.jsx | 14 ++ src/core/components/DataTable.jsx | 10 +- src/core/data/apiRoutes.js | 6 +- src/lib/app/contexts/language.jsx | 6 +- 15 files changed, 328 insertions(+), 31 deletions(-) create mode 100644 src/components/dashboard/expert-management/Form/ChangePassword/index.jsx create mode 100644 src/components/dashboard/expert-management/Form/CreateForm/CreateContent/__tests__/index.test.js create mode 100644 src/components/dashboard/expert-management/Form/CreateForm/CreateContent/index.jsx create mode 100644 src/components/dashboard/expert-management/Form/CreateForm/__tests__/index.test.js create mode 100644 src/components/dashboard/expert-management/Form/CreateForm/index.jsx create mode 100644 src/components/dashboard/expert-management/Form/DeleteForm/index.jsx create mode 100644 src/components/dashboard/expert-management/Form/UpdateForm/index.jsx diff --git a/public/locales/fa/app.json b/public/locales/fa/app.json index e813849..734325b 100644 --- a/public/locales/fa/app.json +++ b/public/locales/fa/app.json @@ -118,5 +118,19 @@ "upload_file_format": "فرمت قابل قبول : png,jpg,pdf", "delete": "پاک کردن", "uploadfile_error": "حجم فایل بیشتر از 2 مگابایت می باشد" + }, + "ExpertMangement": { + "id": "کد یکتا", + "name": "نام", + "username": "نام کاربری", + "email": "پست الکترونیک", + "phone_number": "شماره همراه", + "national_id": "کد ملی", + "position": "سمت", + "province_name": "استان", + "city_name": "شهر", + "role_name": "نقش", + "updated_at": "آخرین بروزرسانی", + "create": "افزودن کارشناس" } } diff --git a/src/components/dashboard/expert-management/DataTable/__tests__/index.test.js b/src/components/dashboard/expert-management/DataTable/__tests__/index.test.js index 4d8b676..3b7f516 100644 --- a/src/components/dashboard/expert-management/DataTable/__tests__/index.test.js +++ b/src/components/dashboard/expert-management/DataTable/__tests__/index.test.js @@ -2,21 +2,21 @@ import {render, screen} from "@testing-library/react"; import MockAppWithProviders from "../../../../../../mocks/AppWithProvider"; import ExpertManagementDataTable from "@/components/dashboard/expert-management/DataTable"; -describe("Expert Management Component From Expert Management", () => { +describe("ExpertManagementDatatable Component From Expert Management", () => { describe("Rendering", () => { it("Table Headers Rendered", () => { render(); - const idHeader = screen.queryByText(/کد یکتا/i); - const nameHeader = screen.queryByText(/نام/i); - const usernameHeader = screen.queryByText(/نام کاربری/i); - const emailHeader = screen.queryByText(/پست الکترونیک/i); - const phone_numberHeader = screen.queryByText(/شماره همراه/i); - const national_idHeader = screen.queryByText(/کد ملی/i); - const positionHeader = screen.queryByText(/سمت/i); - const province_nameHeader = screen.queryByText(/استان/i); - const city_nameHeader = screen.queryByText(/شهر/i); - const role_nameHeader = screen.queryByText(/نقش/i); - const updated_atHeader = screen.queryByText(/آخرین بروزرسانی/i); + const idHeader = screen.queryByText("کد یکتا"); + const nameHeader = screen.queryByText("نام"); + const usernameHeader = screen.queryByText("نام کاربری"); + const emailHeader = screen.queryByText("پست الکترونیک"); + const phone_numberHeader = screen.queryByText("شماره همراه"); + const national_idHeader = screen.queryByText("کد ملی"); + const positionHeader = screen.queryByText("سمت"); + const province_nameHeader = screen.queryByText("استان"); + const city_nameHeader = screen.queryByText("شهر"); + const role_nameHeader = screen.queryByText("نقش"); + const updated_atHeader = screen.queryByText("آخرین بروزرسانی"); expect(idHeader).toBeInTheDocument(); expect(nameHeader).toBeInTheDocument(); expect(usernameHeader).toBeInTheDocument(); @@ -30,10 +30,4 @@ describe("Expert Management Component From Expert Management", () => { expect(updated_atHeader).toBeInTheDocument(); }); }); - describe("Behavioral", () => { - - }); - describe("Validation", () => { - - }); }); \ No newline at end of file diff --git a/src/components/dashboard/expert-management/DataTable/index.jsx b/src/components/dashboard/expert-management/DataTable/index.jsx index 9dee9b6..67bb64f 100644 --- a/src/components/dashboard/expert-management/DataTable/index.jsx +++ b/src/components/dashboard/expert-management/DataTable/index.jsx @@ -1,6 +1,186 @@ +import DataTable from "@/core/components/DataTable"; +import MuiDatePicker from "@/core/components/MuiDatePicker"; +import {GET_EXPERT_MANAGEMENT_LIST} from "@/core/data/apiRoutes"; +import TableToolbar from "../TableToolbar"; +import TableRowActions from "../TableRowActions"; +import {Box, Typography} from "@mui/material"; +import {useTranslations} from "next-intl"; +import {useMemo} from "react"; + function ExpertManagementDataTable() { + const t = useTranslations(); + const columns = useMemo( + () => [ + { + accessorFn: (row) => row.id, + id: "id", + header: t("ExpertMangement.id"), + enableColumnFilter: true, + datatype: "numeric", + filterFn: "equals", + columnFilterModeOptions: [ + "equals", + "notEquals", + "contains", + "lessThan", + "greaterThan", + "between", + ], + Cell: ({renderedCellValue}) => ( + {renderedCellValue} + ), + }, + { + accessorFn: (row) => row.name, + id: "name", + header: t("ExpertMangement.name"), + enableColumnFilter: true, + datatype: "text", + filterFn: "contains", + columnFilterModeOptions: ["contains", "equals", "notEquals"], + Cell: ({renderedCellValue}) => ( + {renderedCellValue} + ), + }, + { + accessorFn: (row) => row.username, + id: "username", + header: t("ExpertMangement.username"), + enableColumnFilter: true, + datatype: "text", + filterFn: "contains", + columnFilterModeOptions: ["contains", "equals", "notEquals"], + Cell: ({renderedCellValue}) => ( + {renderedCellValue} + ), + }, + { + accessorFn: (row) => row.email, + id: "email", + header: t("ExpertMangement.email"), + enableColumnFilter: true, + datatype: "text", + filterFn: "contains", + columnFilterModeOptions: ["contains", "equals", "notEquals"], + Cell: ({renderedCellValue}) => ( + {renderedCellValue} + ), + }, + { + accessorFn: (row) => row.phone_number, + id: "phone_number", + header: t("ExpertMangement.phone_number"), + enableColumnFilter: true, + datatype: "numeric", + filterFn: "equals", + columnFilterModeOptions: ["contains", "equals", "notEquals"], + Cell: ({renderedCellValue}) => ( + {renderedCellValue} + ), + }, + { + accessorFn: (row) => row.national_id, + id: "national_id", + header: t("ExpertMangement.national_id"), + enableColumnFilter: true, + datatype: "numeric", + filterFn: "equals", + columnFilterModeOptions: ["contains", "equals", "notEquals"], + Cell: ({renderedCellValue}) => ( + {renderedCellValue} + ), + }, + { + accessorFn: (row) => row.position, + id: "position", + header: t("ExpertMangement.position"), + enableColumnFilter: true, + datatype: "text", + filterFn: "contains", + columnFilterModeOptions: ["contains", "equals", "notEquals"], + Cell: ({renderedCellValue}) => ( + {renderedCellValue} + ), + }, + { + accessorFn: (row) => row.province_name, + id: "province_name", + header: t("ExpertMangement.province_name"), + enableColumnFilter: false, + datatype: "text", + filterFn: "contains", + columnFilterModeOptions: ["contains", "equals", "notEquals"], + Cell: ({renderedCellValue}) => ( + {renderedCellValue} + ), + }, + { + accessorFn: (row) => row.city_name, + id: "city_name", + header: t("ExpertMangement.city_name"), + enableColumnFilter: false, + datatype: "text", + filterFn: "contains", + columnFilterModeOptions: ["contains", "equals", "notEquals"], + Cell: ({renderedCellValue}) => ( + {renderedCellValue} + ), + }, + { + accessorFn: (row) => row.roles[0].name_fa, + id: "roles[0].name_fa", + header: t("ExpertMangement.role_name"), + enableColumnFilter: false, + datatype: "text", + filterFn: "contains", + columnFilterModeOptions: ["contains", "equals", "notEquals"], + Cell: ({renderedCellValue}) => ( + {renderedCellValue} + ), + }, + { + accessorFn: (row) => + moment(row.updated_at).locale("fa").format("HH:mm | yyyy/MM/DD"), + id: "updated_at", + header: t("ExpertMangement.updated_at"), + enableColumnFilter: true, + datatype: "date", + filterFn: "lessThan", + columnFilterModeOptions: ["lessThan", "greaterThan"], + Cell: ({renderedCellValue}) => { + return {renderedCellValue}; + }, + Header: ({column}) => <>{column.columnDef.header}, + Filter: ({column}) => { + return ( + + ); + }, + }, + ], + [] + ); return ( -

asdads

+ + + ); } diff --git a/src/components/dashboard/expert-management/Form/ChangePassword/index.jsx b/src/components/dashboard/expert-management/Form/ChangePassword/index.jsx new file mode 100644 index 0000000..ea3d11c --- /dev/null +++ b/src/components/dashboard/expert-management/Form/ChangePassword/index.jsx @@ -0,0 +1,7 @@ +const ChangePassword = () => { + return ( + <> + ) +} + +export default ChangePassword \ No newline at end of file diff --git a/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/__tests__/index.test.js b/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/__tests__/index.test.js new file mode 100644 index 0000000..e69de29 diff --git a/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/index.jsx b/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/index.jsx new file mode 100644 index 0000000..e69de29 diff --git a/src/components/dashboard/expert-management/Form/CreateForm/__tests__/index.test.js b/src/components/dashboard/expert-management/Form/CreateForm/__tests__/index.test.js new file mode 100644 index 0000000..20feced --- /dev/null +++ b/src/components/dashboard/expert-management/Form/CreateForm/__tests__/index.test.js @@ -0,0 +1,18 @@ +import {render, screen} from "@testing-library/react"; +import MockAppWithProviders from "../../../../../../mocks/AppWithProvider"; +import CreateForm from "../../CreateForm"; + +describe("CreateForm Component From Expert Management", () => { + describe("Rendering", () => { + it("Create Button Rendered", () => { + render(); + const versionControler = screen.queryByTitle("ثبت کارشناس"); + expect(versionControler).toBeInTheDocument(); + }); + it("Dialog Header Rendered", () => { + render(); + const versionControler = screen.queryByText("ثبت کارشناس"); + expect(versionControler).toBeInTheDocument(); + }); + }); +}); \ No newline at end of file diff --git a/src/components/dashboard/expert-management/Form/CreateForm/index.jsx b/src/components/dashboard/expert-management/Form/CreateForm/index.jsx new file mode 100644 index 0000000..09c6a5b --- /dev/null +++ b/src/components/dashboard/expert-management/Form/CreateForm/index.jsx @@ -0,0 +1,30 @@ +const Create = () => { + return ( + <> + + + + + + + {t("ExpertMangement.create")} + + + + ) +} + +export default Create \ No newline at end of file diff --git a/src/components/dashboard/expert-management/Form/DeleteForm/index.jsx b/src/components/dashboard/expert-management/Form/DeleteForm/index.jsx new file mode 100644 index 0000000..11320cc --- /dev/null +++ b/src/components/dashboard/expert-management/Form/DeleteForm/index.jsx @@ -0,0 +1,7 @@ +const Delete = () => { + return ( + <> + ) +} + +export default Delete \ No newline at end of file diff --git a/src/components/dashboard/expert-management/Form/UpdateForm/index.jsx b/src/components/dashboard/expert-management/Form/UpdateForm/index.jsx new file mode 100644 index 0000000..59da7cd --- /dev/null +++ b/src/components/dashboard/expert-management/Form/UpdateForm/index.jsx @@ -0,0 +1,7 @@ +const Update = () => { + return ( + <> + ) +} + +export default Update \ No newline at end of file diff --git a/src/components/dashboard/expert-management/TableRowActions.jsx b/src/components/dashboard/expert-management/TableRowActions.jsx index e69de29..19830ce 100644 --- a/src/components/dashboard/expert-management/TableRowActions.jsx +++ b/src/components/dashboard/expert-management/TableRowActions.jsx @@ -0,0 +1,28 @@ +import {Box} from "@mui/material"; +import Update from "./Form/UpdateForm" +import Delete from "./Form/DeleteForm"; +import ChangePassword from "./Form/ChangePassword"; + +const TableRowActions = ({row, mutate, fetchUrl}) => { + return ( + + + + + + ); +}; + +export default TableRowActions; diff --git a/src/components/dashboard/expert-management/TableToolbar.jsx b/src/components/dashboard/expert-management/TableToolbar.jsx index e69de29..7eb047b 100644 --- a/src/components/dashboard/expert-management/TableToolbar.jsx +++ b/src/components/dashboard/expert-management/TableToolbar.jsx @@ -0,0 +1,14 @@ +import {useTranslations} from "next-intl"; +import Create from "./Form/CreateForm"; +import {Box} from "@mui/material"; + +function TableToolbar({mutate, fetchUrl}) { + const t = useTranslations(); + return ( + + + + ); +} + +export default TableToolbar; diff --git a/src/core/components/DataTable.jsx b/src/core/components/DataTable.jsx index b3b0f26..10fdffa 100644 --- a/src/core/components/DataTable.jsx +++ b/src/core/components/DataTable.jsx @@ -42,13 +42,11 @@ function DataTable(props) { const [updateTime, setupdateTime] = useState( moment().format("HH:mm | jYYYY/jM/jD") ); - const tableLocalization = useMemo( () => languageList.find((item) => item.key == languageApp).tableLocalization, [languageApp, languageList] ); - const fetchUrl = useMemo(() => { const url = new URL(props.tableUrl); url.searchParams.set( @@ -73,12 +71,10 @@ function DataTable(props) { url.searchParams.set("sorting", JSON.stringify(sorting ?? [])); return url; }, [ - props.tableUrl, columnFilters, columnFilterFns, pagination, sorting, - props.columns, ]); const {data, isValidating, mutate} = useSWR(fetchUrl, fetcher, { @@ -91,6 +87,7 @@ function DataTable(props) { setupdateTime(moment().format("HH:mm | jYYYY/jM/jD")); }, [isValidating, languageApp]); + return ( ( <> {props.enableCustomToolbar /* send condition */ - ? props.CustomToolbar /* send component */ - : ""} + ? () /* send component */ + : } )} renderBottomToolbarCustomActions={({table}) => ( @@ -159,7 +156,6 @@ function DataTable(props) { )} state={{ - isLoading: isValidating, columnFilters, columnFilterFns, pagination, diff --git a/src/core/data/apiRoutes.js b/src/core/data/apiRoutes.js index 06dd4e9..e9351ad 100644 --- a/src/core/data/apiRoutes.js +++ b/src/core/data/apiRoutes.js @@ -10,4 +10,8 @@ export const SET_USER_PASSWORD = BASE_URL + "/dashboard/profile/change_password" //user data export const GET_USER_ROUTE = BASE_URL + "/dashboard/profile/info"; -//user data \ No newline at end of file +//user data + +//expert management +export const GET_EXPERT_MANAGEMENT_LIST = BASE_URL + "/dashboard/experts/show"; +//expert management \ No newline at end of file diff --git a/src/lib/app/contexts/language.jsx b/src/lib/app/contexts/language.jsx index e3f41f4..e9e24f7 100644 --- a/src/lib/app/contexts/language.jsx +++ b/src/lib/app/contexts/language.jsx @@ -18,7 +18,7 @@ export const LanguageProvider = ({children}) => { ]; const {user, userChangedLanguage, changeLanguageState} = useUser(); const [languageIsReady, setLanguageIsReady] = useState(false); - const [languageApp, setLanguageApp] = useState(); + const [languageApp, setLanguageApp] = useState(process.env.NEXT_PUBLIC_DEFAULT_LANGUAGE); const [directionApp, setDirectionApp] = useState( process.env.NEXT_PUBLIC_DEFAULT_DIRECTION ); @@ -26,9 +26,7 @@ export const LanguageProvider = ({children}) => { useEffect(() => { const lang = localStorage.getItem("_language"); - if (!lang && !languageApp) { - setLanguageApp(process.env.NEXT_PUBLIC_DEFAULT_LANGUAGE); - } else if (lang) { + if (lang) { setLanguageApp(lang); } }, []);