From 11fe52c339d6c182114b2256c18722a1169226db Mon Sep 17 00:00:00 2001 From: Mohammad Jalali Date: Sat, 14 Oct 2023 15:52:02 +0330 Subject: [PATCH] add gender/telephone id and change name to full_name and role_id to roles and compelete rest of test instead CreatContent component --- public/locales/fa/app.json | 14 +-- .../PersonalInfo/__tests__/index.test.js | 86 +++++++++++++++++-- .../CreateContent/PersonalInfo/index.jsx | 76 +++++++++++++--- .../PositionAndRole/__tests__/index.test.js | 8 +- .../RestInfo/PositionAndRole/index.jsx | 14 +-- .../RestInfo/Province/__tests__/index.test.js | 4 +- .../CreateContent/RestInfo/Province/index.jsx | 2 +- .../CreateContent/__tests__/index.test.js | 16 ++-- .../Form/CreateForm/CreateContent/index.jsx | 18 ++-- 9 files changed, 188 insertions(+), 50 deletions(-) diff --git a/public/locales/fa/app.json b/public/locales/fa/app.json index 08ce5fd..54d5622 100644 --- a/public/locales/fa/app.json +++ b/public/locales/fa/app.json @@ -123,7 +123,7 @@ }, "ExpertMangement": { "id": "کد یکتا", - "name": "نام", + "name": "نام کامل", "username": "نام کاربری", "email": "پست الکترونیک", "phone_number": "شماره همراه", @@ -136,15 +136,17 @@ "personal_info": "مشخصات کارشناس", "user_info": "اطلاعات کاربری", "rest_info": "اطلاعات تکمیلی", - "text_field_name": "نام", + "text_field_full_name": "نام کامل", "text_field_username": "نام کاربری", "text_field_email": "پست الکترونیک", "text_field_phone_number": "شماره همراه", + "text_field_telephone_id": "کد تلفن", + "text_field_gender": "جنسیت", "text_field_national_id": "کد ملی", "text_field_password": "رمز عبور", "text_field_position": "سمت", "text_field_province_id": "استان", - "text_field_role_id": "نقش", + "text_field_roles": "نقش", "text_field_loading_provinces_list": "درحال دریافت شهر ها", "text_field_error_fetching_provinces": "خطا در دریافت شهر ها", "text_field_loading_roles_list": "درحال دریافت نقش ها", @@ -153,16 +155,18 @@ "text_field_loading_cities_list": "درحال دریافت شهر ها", "text_field_error_fetching_cities": "خطا در دریافت شهر ها", "text_field_new_password": "رمز عبور جدید", - "error_message_name": "نام خود را وارد کنید", + "error_message_full_name": "نام کامل خود را وارد کنید", "error_message_username": "نام کاربری خود را وارد کنید", "error_message_email": "پست الکترونیک خود را وارد کنید", "error_message_phone_number": "شماره همراه خود را وارد کنید", + "error_message_telephone_id": "کد تلفن خود را وارد کنید", + "error_message_gender": "جنسیت خود را وارد کنید", "error_message_national_id": "کد ملی خود را وارد کنید", "error_message_password": "رمز عبور خود را وارد کنید", "error_message_password_regex": "رمز عبور باید حداقل 8 کاراکتر و متشکل از عدد، حرف یا سمبل باشد", "error_message_position": "سمت خود را وارد کنید", "error_message_province_id": "استان خود را وارد کنید", - "error_message_role_id": "نقش خود را وارد کنید", + "error_message_roles": "نقش خود را وارد کنید", "error_message_new_password": "رمز عبور جدید را وارد کنید", "error_message_new_password_regex": "رمز عبور باید حداقل 8 کاراکتر و متشکل از عدد، حرف یا سمبل باشد", "button_cancel": "بستن", diff --git a/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/PersonalInfo/__tests__/index.test.js b/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/PersonalInfo/__tests__/index.test.js index 3c11418..0f79edd 100644 --- a/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/PersonalInfo/__tests__/index.test.js +++ b/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/PersonalInfo/__tests__/index.test.js @@ -5,23 +5,28 @@ import * as Yup from "yup"; import {Formik} from "formik"; import PersonalInfo from "@/components/dashboard/expert-management/Form/CreateForm/CreateContent/PersonalInfo"; import {useTranslations} from "next-intl"; +import Province from "@/components/dashboard/expert-management/Form/CreateForm/CreateContent/RestInfo/Province"; const CreateFormMock = ({Component}) => { const t = useTranslations(); const validationSchema = Yup.object().shape({ - name: Yup.string().required(t("ExpertMangement.error_message_name")), + full_name: Yup.string().required(t("ExpertMangement.error_message_full_name")), email: Yup.string().required(t("ExpertMangement.error_message_email")), phone_number: Yup.string().required(t("ExpertMangement.error_message_phone_number")), - national_id: Yup.string().required(t("ExpertMangement.error_message_national_id")) + telephone_id: Yup.string().required(t("ExpertMangement.error_message_telephone_id")), + national_id: Yup.string().required(t("ExpertMangement.error_message_national_id")), + gender: Yup.string().required(t("ExpertMangement.error_message_gender")) }); return ( { @@ -35,11 +40,11 @@ const CreateFormMock = ({Component}) => { describe("PersonalInfo Component From Expert Management", () => { describe("Rendering", () => { - it("Name TextField Rendered", async () => { + it("full_name TextField Rendered", async () => { render(); await waitFor(() => { - const nameTextField = screen.queryByLabelText('نام'); - expect(nameTextField).toBeInTheDocument(); + const fullNameTextField = screen.queryByLabelText('نام کامل'); + expect(fullNameTextField).toBeInTheDocument(); }); }); it("Email TextField Rendered", async () => { @@ -56,6 +61,13 @@ describe("PersonalInfo Component From Expert Management", () => { expect(phoneNumberTextField).toBeInTheDocument(); }); }); + it("telephone id TextField Rendered", async () => { + render(); + await waitFor(() => { + const telephoneIdTextField = screen.queryByLabelText('کد تلفن'); + expect(telephoneIdTextField).toBeInTheDocument(); + }); + }); it("National Id TextField Rendered", async () => { render(); await waitFor(() => { @@ -63,11 +75,18 @@ describe("PersonalInfo Component From Expert Management", () => { expect(nationalIdTextField).toBeInTheDocument(); }); }); + it("Gender Select Box Rendered", async () => { + render(); + await waitFor(() => { + const genderSelectBox = screen.getByTestId('select-box'); + expect(genderSelectBox).toBeInTheDocument(); + }); + }); }); describe("Behavioral", () => { it("Name TextField Work Correctly", async () => { render(); - const nameTextField = screen.queryByLabelText('نام'); + const nameTextField = screen.queryByLabelText('نام کامل'); fireEvent.change(nameTextField, {target: {value: 'exampleName'}}); await act(() => { expect(nameTextField).toHaveValue('exampleName'); @@ -89,6 +108,14 @@ describe("PersonalInfo Component From Expert Management", () => { expect(phoneNumberTextField).toHaveValue('examplePhoneNumber'); }) }); + it("Telephone Id TextField Work Correctly", async () => { + render(); + const telephoneIdTextField = screen.queryByLabelText('کد تلفن'); + fireEvent.change(telephoneIdTextField, {target: {value: 'exampleTelephoneId'}}); + await act(() => { + expect(telephoneIdTextField).toHaveValue('exampleTelephoneId'); + }) + }); it("National Id TextField Work Correctly", async () => { render(); const nationalIdTextField = screen.queryByLabelText('کد ملی'); @@ -97,18 +124,34 @@ describe("PersonalInfo Component From Expert Management", () => { expect(nationalIdTextField).toHaveValue('exampleNationalId'); }) }); + it("Gender Select Box Work Correctly", async () => { + render(); + const genderSelectBox = screen.getByTestId('select-box'); + const genderSelectOpener = await waitFor(() => screen.getByTestId("option-opener-gender")); + + await waitFor(() => { + expect(genderSelectBox).toBeInTheDocument(); + }); + + fireEvent.mouseDown(genderSelectOpener); + await waitFor(() => { + const selectItem = screen.queryByText("مرد"); + expect(selectItem).toBeInTheDocument(); + }); + + }); }); describe("validation", () => { it('Should See Error When Name Input Is Empty', async () => { render(); - const nameInput = screen.queryByLabelText('نام'); + const nameInput = screen.queryByLabelText('نام کامل'); fireEvent.change(nameInput, {target: {value: ''}}); fireEvent.blur(nameInput); await waitFor(() => { - expect(screen.queryByText("نام خود را وارد کنید")).toBeInTheDocument() + expect(screen.queryByText("نام کامل خود را وارد کنید")).toBeInTheDocument() }); }); it('Should See Error When Email Input Is Empty', async () => { @@ -135,6 +178,18 @@ describe("PersonalInfo Component From Expert Management", () => { expect(screen.queryByText("شماره همراه خود را وارد کنید")).toBeInTheDocument() }); }); + it('Should See Error When telephone Id Input Is Empty', async () => { + render(); + + const telephoneIdTextField = screen.queryByLabelText('کد تلفن'); + + fireEvent.change(telephoneIdTextField, {target: {value: ''}}); + fireEvent.blur(telephoneIdTextField); + + await waitFor(() => { + expect(screen.queryByText("کد تلفن خود را وارد کنید")).toBeInTheDocument() + }); + }); it('Should See Error When National Id Input Is Empty', async () => { render(); @@ -147,5 +202,18 @@ describe("PersonalInfo Component From Expert Management", () => { expect(screen.queryByText("کد ملی خود را وارد کنید")).toBeInTheDocument() }); }); + it('Should Select An Item With Valid Value of gender', async () => { + render(); + const genderInput = screen.getByTestId("input-gender") + const genderSelectOpener = await waitFor(() => screen.getByTestId("option-opener-gender")); + + fireEvent.mouseDown(genderSelectOpener); + const selectItem = await waitFor(() => screen.queryByText("مرد")); + expect(selectItem).toBeInTheDocument(); + fireEvent.click(selectItem); + await waitFor(() => { + expect(genderInput.value).toBe('male') + }); + }); }) }); \ No newline at end of file diff --git a/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/PersonalInfo/index.jsx b/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/PersonalInfo/index.jsx index 0dde112..f92bf38 100644 --- a/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/PersonalInfo/index.jsx +++ b/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/PersonalInfo/index.jsx @@ -1,27 +1,32 @@ -import {Grid, TextField} from "@mui/material"; +import {FormControl, FormHelperText, Grid, InputLabel, MenuItem, Select, TextField} from "@mui/material"; import {useTranslations} from "next-intl"; const PersonalInfo = ({formik}) => { const t = useTranslations(); + const genderList = [ + {id: 1, name_en: "male", name_fa: "مرد"}, + {id: 2, name_en: "female", name_fa: "زن"} + ] + return ( - + - + { sx={{width: "100%"}} /> - + { sx={{width: "100%"}} /> - + { sx={{width: "100%"}} /> + + + + + + {t("ExpertMangement.text_field_gender")} + + + {formik.touched.gender && formik.errors.gender ? formik.errors.gender : ""} + + + ) } diff --git a/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/RestInfo/PositionAndRole/__tests__/index.test.js b/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/RestInfo/PositionAndRole/__tests__/index.test.js index e788764..0e6cf4b 100644 --- a/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/RestInfo/PositionAndRole/__tests__/index.test.js +++ b/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/RestInfo/PositionAndRole/__tests__/index.test.js @@ -11,13 +11,13 @@ const CreateFormMock = ({Component}) => { const t = useTranslations(); const validationSchema = Yup.object().shape({ position: Yup.string().required(t("ExpertMangement.error_message_position")), - role_id: Yup.string().required(t("ExpertMangement.error_message_role_id")) + roles: Yup.string().required(t("ExpertMangement.error_message_roles")) }); return ( { @@ -56,7 +56,7 @@ describe("CreateContent Component From Expert Management", () => { }); it("Role Select Box Work Correctly", async () => { render(); - const roleSelect = screen.getByTestId("option-opener"); + const roleSelect = screen.getByTestId("option-opener-role"); await waitFor(() => { expect(roleSelect).toBeInTheDocument(); }); @@ -83,7 +83,7 @@ describe("CreateContent Component From Expert Management", () => { it('Should Select An Item With Valid Value of role', async () => { render(); const roleInput = screen.getByTestId("input-role-id") - const roleSelectOpener = await waitFor(() => screen.getByTestId("option-opener")); + const roleSelectOpener = await waitFor(() => screen.getByTestId("option-opener-role")); fireEvent.mouseDown(roleSelectOpener); const selectItem = await waitFor(() => screen.queryByText("ادمین")); diff --git a/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/RestInfo/PositionAndRole/index.jsx b/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/RestInfo/PositionAndRole/index.jsx index 5af2a8b..6befbff 100644 --- a/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/RestInfo/PositionAndRole/index.jsx +++ b/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/RestInfo/PositionAndRole/index.jsx @@ -28,15 +28,15 @@ const PositionAndRole = ({formik}) => { - {t("ExpertMangement.text_field_role_id")} + {t("ExpertMangement.text_field_roles")} - {formik.touched.role_id && formik.errors.role_id ? formik.errors.role_id : ""} + {formik.touched.roles && formik.errors.roles ? formik.errors.roles : ""} diff --git a/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/RestInfo/Province/__tests__/index.test.js b/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/RestInfo/Province/__tests__/index.test.js index 08fab78..354df01 100644 --- a/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/RestInfo/Province/__tests__/index.test.js +++ b/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/RestInfo/Province/__tests__/index.test.js @@ -41,7 +41,7 @@ describe("CreateContent Component From Expert Management", () => { it("Province Select Box Work Correctly", async () => { render(); const provinceSelectBox = screen.getByTestId('select-box'); - const provinceSelectOpener = await waitFor(() => screen.getByTestId("option-opener")); + const provinceSelectOpener = await waitFor(() => screen.getByTestId("option-opener-province")); await waitFor(() => { expect(provinceSelectBox).toBeInTheDocument(); @@ -59,7 +59,7 @@ describe("CreateContent Component From Expert Management", () => { it('Should Select An Item With Valid Value of province', async () => { render(); const provinceInput = screen.getByTestId("input-province-id") - const provinceSelectOpener = await waitFor(() => screen.getByTestId("option-opener")); + const provinceSelectOpener = await waitFor(() => screen.getByTestId("option-opener-province")); fireEvent.mouseDown(provinceSelectOpener); const selectItem = await waitFor(() => screen.queryByText("آذربایجان شرقی")); diff --git a/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/RestInfo/Province/index.jsx b/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/RestInfo/Province/index.jsx index f9e7c94..4c8995c 100644 --- a/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/RestInfo/Province/index.jsx +++ b/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/RestInfo/Province/index.jsx @@ -30,7 +30,7 @@ const Province = ({formik}) => { "data-testid": "input-province-id" }} data-testid="select-box" - SelectDisplayProps={{"data-testid": 'option-opener'}} + SelectDisplayProps={{"data-testid": 'option-opener-province'}} onBlur={formik.handleBlur} fullWidth variant="outlined" 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 index 6576125..cccc604 100644 --- 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 @@ -21,9 +21,9 @@ describe("CreateContent Component From Expert Management", () => { }); describe("Form Submission", () => { it('Should enable the submit button when the inputs are valid', async () => { - render(); + render(); - const submitButton = screen.getByText('ثبت'); + const submitButton = screen.queryByText('ثبت'); const nameInput = screen.queryByLabelText('نام'); const usernameInput = screen.queryByLabelText('نام کاربری'); @@ -32,8 +32,10 @@ describe("CreateContent Component From Expert Management", () => { const nationalIdInput = screen.queryByLabelText('کد ملی'); const passwordInput = screen.queryByLabelText('رمز عبور'); const positionInput = screen.queryByLabelText('سمت'); - // const provinceInput = screen.queryByLabelText('استان'); - // const roleInput = screen.queryByLabelText('نقش'); + const provinceSelectOpener = screen.getByTestId("option-opener-province"); + const roleSelectOpener = screen.getByTestId("option-opener-role"); + fireEvent.mouseDown(provinceSelectOpener); + fireEvent.mouseDown(roleSelectOpener); fireEvent.change(nameInput, {target: {value: 'nameTest'}}); fireEvent.change(usernameInput, {target: {value: 'usernameTest'}}); @@ -42,8 +44,10 @@ describe("CreateContent Component From Expert Management", () => { fireEvent.change(nationalIdInput, {target: {value: 'nationalIdTest'}}); fireEvent.change(passwordInput, {target: {value: 'passwordTest'}}); fireEvent.change(positionInput, {target: {value: 'positionTest'}}); - // fireEvent.change(provinceInput, {target: {value: 1}}); - // fireEvent.change(roleInput, {target: {value: 1}}); + const selectItemProvince = await waitFor(() => screen.queryByText("آذربایجان شرقی")); + fireEvent.click(selectItemProvince); + const selectItemRole = await waitFor(() => screen.queryByText("ادمین")); + fireEvent.click(selectItemRole); await waitFor(() => { expect(submitButton).not.toBeDisabled(); diff --git a/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/index.jsx b/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/index.jsx index bc5c157..a7e0ef5 100644 --- a/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/index.jsx +++ b/src/components/dashboard/expert-management/Form/CreateForm/CreateContent/index.jsx @@ -13,10 +13,12 @@ const CreateContent = ({setOpenCreateDialog, mutate, fetchUrl}) => { const requestServer = useRequest() const validationSchema = Yup.object().shape({ - name: Yup.string().required(t("ExpertMangement.error_message_name")), + full_name: Yup.string().required(t("ExpertMangement.error_message_full_name")), username: Yup.string().required(t("ExpertMangement.error_message_username")), email: Yup.string().required(t("ExpertMangement.error_message_email")), phone_number: Yup.string().required(t("ExpertMangement.error_message_phone_number")), + telephone_id: Yup.string().required(t("ExpertMangement.error_message_telephone_id")), + gender: Yup.string().required(t("ExpertMangement.error_message_gender")), national_id: Yup.string().required(t("ExpertMangement.error_message_national_id")), password: Yup.string() .required(t("ExpertMangement.error_message_password")) @@ -26,33 +28,37 @@ const CreateContent = ({setOpenCreateDialog, mutate, fetchUrl}) => { ), position: Yup.string().required(t("ExpertMangement.error_message_position")), province_id: Yup.string().required(t("ExpertMangement.error_message_province_id")), - role_id: Yup.string().required(t("ExpertMangement.error_message_role_id")) + roles: Yup.string().required(t("ExpertMangement.error_message_roles")) }); const formik = useFormik({ initialValues: { - name: "", + full_name: "", username: "", email: "", phone_number: "", + telephone_id: "", + gender: "", national_id: "", password: "", position: "", province_id: "", - role_id: "" + roles: "" }, validationSchema, onSubmit: (values, {setSubmitting}) => { const formData = new FormData(); - formData.append("name", values.name); + formData.append("full_name", values.full_name); formData.append("national_id", values.national_id); formData.append("phone_number", values.phone_number); + formData.append("telephone_id", values.telephone_id); + formData.append("gender", values.gender); formData.append("email", values.email); formData.append("username", values.username); formData.append("password", values.password); formData.append("province_id", values.province_id); formData.append("position", values.position); - formData.append("role_id", values.role_id); + formData.append("roles", values.roles); requestServer(`${CREATE_EXPERT_MANAGEMENT}`, 'post', {auth: true, data: formData}) .then((response) => {