diff --git a/frontend/cypress.config.js b/frontend/cypress.config.js index a48f5dd3fa..f8c3f9b81c 100755 --- a/frontend/cypress.config.js +++ b/frontend/cypress.config.js @@ -21,6 +21,7 @@ module.exports = defineConfig({ "cypress/e2e/batchOrderEntry.cy.js", "cypress/e2e/dashboard.cy.js", "cypress/e2e/labNumberManagement.cy.js", + "cypress/e2e/AdminE2E/MenuConfig/globalMenuConfig.cy.js", ]; return config; }, diff --git a/frontend/cypress/e2e/AdminE2E/MenuConfig/globalMenuConfig.cy.js b/frontend/cypress/e2e/AdminE2E/MenuConfig/globalMenuConfig.cy.js new file mode 100644 index 0000000000..270f8784b2 --- /dev/null +++ b/frontend/cypress/e2e/AdminE2E/MenuConfig/globalMenuConfig.cy.js @@ -0,0 +1,56 @@ +import LoginPage from "../../../pages/LoginPage"; + +let loginPage = null; +let homePage = null; +let adminPage = null; +let globalMenuConfigPage = null; + +before(() => { + // Initialize LoginPage object and navigate to Admin Page + loginPage = new LoginPage(); + loginPage.visit(); + + homePage = loginPage.goToHomePage(); + adminPage = homePage.goToAdminPage(); +}); + +describe("Global Menu Configuration", function () { + it("User navigates to the Global Menu Configuration page", function () { + globalMenuConfigPage = adminPage.goToGlobalMenuConfigPage(); + }); + + it("User turns 0ff the toggle switch and submits", function () { + globalMenuConfigPage.turnOffToggleSwitch(); + globalMenuConfigPage.submitButton(); + }); + + it("User turns on the toggle switch", function () { + globalMenuConfigPage.turnOnToggleSwitch(); + }); + it("User checks the menu items and submits", function () { + globalMenuConfigPage.checkMenuItem("home"); + globalMenuConfigPage.checkMenuItem("order"); + globalMenuConfigPage.checkMenuItem("billing"); + globalMenuConfigPage.checkMenuItem("immunoChem"); + globalMenuConfigPage.checkMenuItem("cytology"); + globalMenuConfigPage.checkMenuItem("results"); + globalMenuConfigPage.checkMenuItem("validation"); + globalMenuConfigPage.checkMenuItem("patient"); + globalMenuConfigPage.checkMenuItem("pathology"); + globalMenuConfigPage.checkMenuItem("workplan"); + globalMenuConfigPage.checkMenuItem("nonConform"); + globalMenuConfigPage.checkMenuItem("reports"); + globalMenuConfigPage.checkMenuItem("study"); + globalMenuConfigPage.checkMenuItem("admin"); + globalMenuConfigPage.checkMenuItem("help"); + globalMenuConfigPage.submitButton(); + }); + it("User relogs in to verify the menu changes", function () { + // Initialize LoginPage object and navigate to the menu + loginPage = new LoginPage(); + loginPage.visit(); + + homePage = loginPage.goToHomePage(); + globalMenuConfigPage = homePage.openNavigationMenu(); + }); +}); diff --git a/frontend/cypress/e2e/login.cy.js b/frontend/cypress/e2e/login.cy.js index 5d91ab5eab..dd5bcc441b 100755 --- a/frontend/cypress/e2e/login.cy.js +++ b/frontend/cypress/e2e/login.cy.js @@ -45,12 +45,10 @@ describe("Failing or Succeeding to Login", function () { login.signIn(); if (user.correctPass === true) { - cy.get("header#mainHeader > button[title='Open menu']") - .should("exist") - .and( - "span:nth-of-type(3) > .cds--btn.cds--btn--icon-only.cds--btn--primary.cds--header__action > svg > path:nth-of-type(1)", - "exist", - ); + cy.get("header#mainHeader > button[title='Open menu']").should( + "exist", + ); + cy.get(".custom-action svg path:first-of-type").should("exist"); } else { cy.get("div[role='status']").should("be.visible"); } diff --git a/frontend/cypress/pages/AdminPage.js b/frontend/cypress/pages/AdminPage.js index 0d059f1a02..42574ab6c8 100644 --- a/frontend/cypress/pages/AdminPage.js +++ b/frontend/cypress/pages/AdminPage.js @@ -1,5 +1,6 @@ //This handles all pages of the admin import LabNumberManagementPage from "./LabNumberManagementPage"; +import GlobalMenuConfigPage from "./GlobalMenuConfigPage"; class AdminPage { constructor() {} @@ -7,26 +8,33 @@ class AdminPage { visit() { cy.visit("/administration"); //need to confirm this } - //this page is also included in the homepage - goToAdminPage() { - this.openNavigationMenu(); - cy.get("#menu_administration").click(); - cy.get("#menu_administration_nav").click(); - return new AdminPage(); - } //lab number management goToLabNumberManagementPage() { // Click on the element using the provided selector cy.get("a.cds--side-nav__link[href='#labNumber']") - .should("be.visible") // Ensure the element is visible - .click(); // Click to navigate to the page + .should("be.visible") + .click(); + + cy.url().should("include", "#labNumber"); + cy.contains("Lab Number Management").should("be.visible"); + + return new LabNumberManagementPage(); + } + + //global menu configuration + goToGlobalMenuConfigPage() { + // Expand the dropdown by clicking the button with the expanded state + cy.contains("span", "Menu Configuration").click(); + cy.get("ul.cds--side-nav__menu").should("be.visible"); // Ensure the dropdown menu is visible + // Click the link for "Global Menu Configuration" + cy.get('a.cds--side-nav__link[href="#globalMenuManagement"]').click(); // Click the "Global Menu Configuration" link - // Verify the URL or some unique identifier of the target page - cy.url().should("include", "#labNumber"); // Validate URL fragment - cy.contains("Lab Number Management").should("be.visible"); // Confirm presence of the page content + // Verify the URL and the visibility of the content + cy.url().should("include", "#globalMenuManagement"); + cy.contains("Global Menu Management").should("be.visible"); - return new LabNumberManagementPage(); // Return the page object + return new GlobalMenuConfigPage(); } } diff --git a/frontend/cypress/pages/GlobalMenuConfigPage.js b/frontend/cypress/pages/GlobalMenuConfigPage.js new file mode 100644 index 0000000000..2bb95abcb0 --- /dev/null +++ b/frontend/cypress/pages/GlobalMenuConfigPage.js @@ -0,0 +1,54 @@ +class GlobalMenuConfigPage { + constructor() {} + + // This method is used to visit the page + visit() { + cy.visit("/administration#globalMenuManagement"); + } + + turnOffToggleSwitch() { + cy.get("div.cds--toggle__switch").click(); + } + + turnOnToggleSwitch() { + cy.get("div.cds--toggle label div > div").should("be.visible").click(); + } + + checkMenuItem = function (menuItem) { + // Map of menu items to their respective checkboxes + const menuItems = { + home: "#menu_home_checkbox", + order: "#menu_sample_checkbox", + immunoChem: "#menu_immunochem_checkbox", + cytology: "#menu_cytology_checkbox", + results: "#menu_results_checkbox", + validation: "#menu_resultvalidation_checkbox", + reports: "#menu_reports_checkbox", + study: "#menu_reports_study_checkbox", + billing: "#menu_billing_checkbox", + admin: "#menu_administration_checkbox", + help: "#menu_help_checkbox", + patient: "#menu_patient_checkbox", + nonConform: "#menu_nonconformity_checkbox", + workplan: "#menu_workplan_checkbox", + pathology: "#menu_pathology_checkbox", + }; + + // Get the corresponding checkbox selector based on the passed menuItem + const checkboxSelector = menuItems[menuItem]; + + if (checkboxSelector) { + // Perform the check action, forcing it to check even if covered + cy.get(checkboxSelector).check({ force: true }); + } else { + // If no valid menuItem is passed, log an error + cy.log("Invalid menu item"); + } + }; + + submitButton() { + cy.contains("button", "Submit").click(); + } +} + +export default GlobalMenuConfigPage; diff --git a/frontend/cypress/pages/HomePage.js b/frontend/cypress/pages/HomePage.js index ff7c338a7c..9def37f26a 100755 --- a/frontend/cypress/pages/HomePage.js +++ b/frontend/cypress/pages/HomePage.js @@ -197,6 +197,7 @@ class HomePage { goToAdminPage() { this.openNavigationMenu(); cy.get("#menu_administration").click(); + //cy.get("#menu_administration_nav").click(); return new AdminPage(); } } diff --git a/frontend/src/components/Style.css b/frontend/src/components/Style.css index 7e113f90bd..2db9a8e960 100644 --- a/frontend/src/components/Style.css +++ b/frontend/src/components/Style.css @@ -40,7 +40,7 @@ li.clickableUserDetails:hover { } .adminPageContent { - margin-left: 17%; + margin-left: 18%; margin-right: 1%; } @@ -516,9 +516,18 @@ button { grid-template-columns: 1fr; } } -@media screen and (max-width: 550px) { + +@media screen and (max-width: 1053px) { + .adminPageContent { + margin-left: 9%; + margin-right: 5%; + } +} + +@media screen and (max-width: 500px) { .adminPageContent { margin-left: 15%; + margin-right: 5%; } } @@ -527,11 +536,6 @@ button { flex-direction: column; } } -@media screen and (max-width: 500px) { - .adminPageContent { - margin-left: 17%; - } -} @media screen and (max-width: 322px) { .logo { diff --git a/frontend/src/components/admin/userManagement/UserAddModify.js b/frontend/src/components/admin/userManagement/UserAddModify.js index 3535aef10b..e3e9ab0b17 100644 --- a/frontend/src/components/admin/userManagement/UserAddModify.js +++ b/frontend/src/components/admin/userManagement/UserAddModify.js @@ -56,6 +56,14 @@ function UserAddModify() { const intl = useIntl(); const [saveButton, setSaveButton] = useState(true); + const [validation, setValidation] = useState({ + validatepassword: false, + password: false, + password2: false, + loginName: false, + firstName: false, + secondName: false, + }); const [isLoading, setIsLoading] = useState(true); const [isLocked, setIsLocked] = useState("radio-2"); const [isDisabled, setIsDisabled] = useState("radio-4"); @@ -110,6 +118,14 @@ function UserAddModify() { setIsLoading(true); } else { setUserData(res); + setValidation({ + validatepassword: true, + password: true, + password2: true, + loginName: true, + firstName: true, + secondName: true, + }); var KeyList = []; Object.keys(res.selectedTestSectionLabUnits).map((key) => KeyList.push(key), @@ -277,6 +293,14 @@ function UserAddModify() { userDataShow.accountDisabled === "Y" ? "radio-3" : "radio-4", ); setIsActive(userDataShow.accountActive === "Y" ? "radio-5" : "radio-6"); + if ( + userDataShow.userPassword && + userDataShow.userPassword === userDataShow.confirmPassword + ) { + setValidation({ ...validation, validatepassword: true }); + } else { + setValidation({ ...validation, validatepassword: false }); + } } }, [userDataShow]); @@ -365,9 +389,11 @@ function UserAddModify() { }); } setSaveButton(true); + setValidation({ ...validation, loginName: false }); } else { setNotificationVisible(false); setSaveButton(false); + setValidation({ ...validation, loginName: true }); setUserDataPost((prevUserDataPost) => ({ ...prevUserDataPost, userLoginName: value, @@ -400,9 +426,11 @@ function UserAddModify() { }); } setSaveButton(true); + setValidation({ ...validation, password: false }); } else { setNotificationVisible(false); setSaveButton(false); + setValidation({ ...validation, password: true }); setUserDataPost((prevUserDataPost) => ({ ...prevUserDataPost, userPassword: value, @@ -435,9 +463,11 @@ function UserAddModify() { }); } setSaveButton(true); + setValidation({ ...validation, password2: false }); } else { setNotificationVisible(false); setSaveButton(false); + setValidation({ ...validation, password2: true }); setUserDataPost((prevUserDataPost) => ({ ...prevUserDataPost, confirmPassword: value, @@ -466,9 +496,11 @@ function UserAddModify() { }); } setSaveButton(true); + setValidation({ ...validation, firstName: false }); } else { setNotificationVisible(false); setSaveButton(false); + setValidation({ ...validation, firstName: true }); setUserDataPost((prevUserDataPost) => ({ ...prevUserDataPost, userFirstName: value, @@ -497,6 +529,7 @@ function UserAddModify() { }); } setSaveButton(true); + setValidation({ ...validation, secondName: false }); } else { setNotificationVisible(false); setUserDataPost((prevUserDataPost) => ({ @@ -504,6 +537,7 @@ function UserAddModify() { userLastName: value, })); setSaveButton(false); + setValidation({ ...validation, secondName: true }); } setUserDataShow((prevUserData) => ({ @@ -514,6 +548,7 @@ function UserAddModify() { function handleExpirationDateChange(e) { setSaveButton(false); + setValidation({ ...validation, expDate: true }); setUserDataPost((prevUserDataPost) => ({ ...prevUserDataPost, expirationDate: e.target.value, @@ -526,6 +561,7 @@ function UserAddModify() { function handleTimeoutChange(e) { setSaveButton(false); + setValidation({ ...validation, timeout: true }); setUserDataPost((prevUserDataPost) => ({ ...prevUserDataPost, timeout: e.target.value, @@ -538,6 +574,7 @@ function UserAddModify() { function handleAccountActiveChange(e) { setSaveButton(false); + setValidation({ ...validation, active: true }); setUserDataPost((prevUserDataPost) => ({ ...prevUserDataPost, accountActive: e.target.value, @@ -550,6 +587,7 @@ function UserAddModify() { function handleAccountDisabledChange(e) { setSaveButton(false); + setValidation({ ...validation, disabled: true }); setUserDataPost((prevUserDataPost) => ({ ...prevUserDataPost, accountDisabled: e.target.value, @@ -562,6 +600,7 @@ function UserAddModify() { function handleAccountLockedChange(e) { setSaveButton(false); + setValidation({ ...validation, locked: true }); setUserDataPost((prevUserDataPost) => ({ ...prevUserDataPost, accountLocked: e.target.value, @@ -575,12 +614,14 @@ function UserAddModify() { function handleCopyUserPermissionsChange() { if (copyUserPermission.length > 0) { setSaveButton(false); + setValidation({ ...validation, copy: true }); } } function handleAutoCompleteCopyUserPermissionsChange(selectedUserId) { setCopyUserPermission(selectedUserId); setSaveButton(false); + setValidation({ ...validation, autoCopy: true }); } function handleCopyUserPermissionsChangeClick() { @@ -625,6 +666,7 @@ function UserAddModify() { selectedRoles: updatedRoles, })); setSaveButton(false); + setValidation({ ...validation, checkBox: true }); } function handleTestSectionsSelectChange(e, key) { @@ -658,6 +700,7 @@ function UserAddModify() { setSelectedTestSectionLabUnits(updatedTestSectionLabUnits); setSaveButton(false); + setValidation({ ...validation, testSection: true }); } const addRoleToSelectedUnits = (key, roleIdToAdd) => { @@ -667,6 +710,7 @@ function UserAddModify() { if (!currentRoles.includes(roleIdToAdd)) { updatedUnits[key] = [...currentRoles, roleIdToAdd]; setSaveButton(false); + setValidation({ ...validation, role: true }); } return updatedUnits; }); @@ -680,6 +724,7 @@ function UserAddModify() { (roleId) => roleId !== roleIdToRemove, ); setSaveButton(false); + setValidation({ ...validation, removeSelected: true }); } return updatedUnits; }); @@ -1295,6 +1340,7 @@ function UserAddModify() { [key]: updatedRoles, })); setSaveButton(false); + setValidation({ ...validation, selectedLab: true }); }} />