From a8274a87ed6466e580a5506b8f5c59407268ba37 Mon Sep 17 00:00:00 2001 From: Ahtesham Quraish Date: Thu, 25 Apr 2024 15:37:27 +0500 Subject: [PATCH] fix: replace the header with openedx header Description: Replace the header with openedx header van-1914 --- package-lock.json | 825 ++++++++++++++---- package.json | 1 + src/App.scss | 1 + .../CollapsedHeader/CollapseMenuBody.jsx | 104 --- .../CollapsedHeader/CollapseMenuBody.test.jsx | 48 - .../CollapseMenuBody.test.jsx.snap | 105 --- .../__snapshots__/index.test.jsx.snap | 48 - .../CollapsedHeader/index.jsx | 47 - .../CollapsedHeader/index.test.jsx | 38 - .../AuthenticatedUserDropdown.jsx | 78 -- .../AuthenticatedUserDropdown.test.jsx | 81 -- .../AuthenticatedUserDropdown.test.jsx.snap | 139 --- .../__snapshots__/index.test.jsx.snap | 52 -- .../ExpandedHeader/index.jsx | 76 -- .../ExpandedHeader/index.test.jsx | 41 - .../LearnerDashboardMenu.jsx | 105 +++ .../__snapshots__/index.test.jsx.snap | 62 +- .../LearnerDashboardHeader/hooks.js | 11 + .../LearnerDashboardHeader/hooks.test.js | 15 + .../LearnerDashboardHeader/index.jsx | 34 +- .../LearnerDashboardHeader/index.test.jsx | 4 - 21 files changed, 867 insertions(+), 1048 deletions(-) delete mode 100644 src/containers/LearnerDashboardHeader/CollapsedHeader/CollapseMenuBody.jsx delete mode 100644 src/containers/LearnerDashboardHeader/CollapsedHeader/CollapseMenuBody.test.jsx delete mode 100644 src/containers/LearnerDashboardHeader/CollapsedHeader/__snapshots__/CollapseMenuBody.test.jsx.snap delete mode 100644 src/containers/LearnerDashboardHeader/CollapsedHeader/__snapshots__/index.test.jsx.snap delete mode 100644 src/containers/LearnerDashboardHeader/CollapsedHeader/index.jsx delete mode 100644 src/containers/LearnerDashboardHeader/CollapsedHeader/index.test.jsx delete mode 100644 src/containers/LearnerDashboardHeader/ExpandedHeader/AuthenticatedUserDropdown.jsx delete mode 100644 src/containers/LearnerDashboardHeader/ExpandedHeader/AuthenticatedUserDropdown.test.jsx delete mode 100644 src/containers/LearnerDashboardHeader/ExpandedHeader/__snapshots__/AuthenticatedUserDropdown.test.jsx.snap delete mode 100644 src/containers/LearnerDashboardHeader/ExpandedHeader/__snapshots__/index.test.jsx.snap delete mode 100644 src/containers/LearnerDashboardHeader/ExpandedHeader/index.jsx delete mode 100644 src/containers/LearnerDashboardHeader/ExpandedHeader/index.test.jsx create mode 100644 src/containers/LearnerDashboardHeader/LearnerDashboardMenu.jsx diff --git a/package-lock.json b/package-lock.json index c95c8d8f..22082710 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13,6 +13,7 @@ "@edx/brand": "npm:@openedx/brand-openedx@^1.2.2", "@edx/browserslist-config": "^1.1.0", "@edx/frontend-component-footer": "13.1.0", + "@edx/frontend-component-header": "^5.3.0", "@edx/frontend-enterprise-hotjar": "3.0.0", "@edx/frontend-platform": "7.1.4", "@edx/openedx-atlas": "^0.6.0", @@ -2133,18 +2134,6 @@ "node": ">=6" } }, - "node_modules/@edx/frontend-component-footer/node_modules/@fortawesome/free-regular-svg-icons": { - "version": "6.5.2", - "resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.5.2.tgz", - "integrity": "sha512-iabw/f5f8Uy2nTRtJ13XZTS1O5+t+anvlamJ3zJGLEVE2pKsAWhPv2lq01uQlfgCX7VaveT3EVs515cCN9jRbw==", - "hasInstallScript": true, - "dependencies": { - "@fortawesome/fontawesome-common-types": "6.5.2" - }, - "engines": { - "node": ">=6" - } - }, "node_modules/@edx/frontend-component-footer/node_modules/@fortawesome/free-solid-svg-icons": { "version": "6.5.2", "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.5.2.tgz", @@ -2617,17 +2606,560 @@ "node": ">=10" } }, - "node_modules/@edx/frontend-component-footer/node_modules/slash": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz", - "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==", - "optional": true, - "peer": true, + "node_modules/@edx/frontend-component-footer/node_modules/slash": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz", + "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==", + "optional": true, + "peer": true, + "engines": { + "node": ">=8" + } + }, + "node_modules/@edx/frontend-component-footer/node_modules/supports-color": { + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", + "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", + "dependencies": { + "has-flag": "^4.0.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/@edx/frontend-component-footer/node_modules/tr46": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/tr46/-/tr46-3.0.0.tgz", + "integrity": "sha512-l7FvfAHlcmulp8kr+flpQZmVwtu7nfRV7NZujtN0OqES8EL4O4e0qqzL0DC5gAvx/ZC/9lk6rhcUwYvkBnBnYA==", + "dependencies": { + "punycode": "^2.1.1" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/@edx/frontend-component-footer/node_modules/ts-jest": { + "version": "29.1.2", + "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-29.1.2.tgz", + "integrity": "sha512-br6GJoH/WUX4pu7FbZXuWGKGNDuU7b8Uj77g/Sp7puZV6EXzuByl6JrECvm0MzVzSTkSHWTihsXt+5XYER5b+g==", + "dependencies": { + "bs-logger": "0.x", + "fast-json-stable-stringify": "2.x", + "jest-util": "^29.0.0", + "json5": "^2.2.3", + "lodash.memoize": "4.x", + "make-error": "1.x", + "semver": "^7.5.3", + "yargs-parser": "^21.0.1" + }, + "bin": { + "ts-jest": "cli.js" + }, + "engines": { + "node": "^16.10.0 || ^18.0.0 || >=20.0.0" + }, + "peerDependencies": { + "@babel/core": ">=7.0.0-beta.0 <8", + "@jest/types": "^29.0.0", + "babel-jest": "^29.0.0", + "jest": "^29.0.0", + "typescript": ">=4.3 <6" + }, + "peerDependenciesMeta": { + "@babel/core": { + "optional": true + }, + "@jest/types": { + "optional": true + }, + "babel-jest": { + "optional": true + }, + "esbuild": { + "optional": true + } + } + }, + "node_modules/@edx/frontend-component-footer/node_modules/w3c-xmlserializer": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-4.0.0.tgz", + "integrity": "sha512-d+BFHzbiCx6zGfz0HyQ6Rg69w9k19nviJspaj4yNscGjrHu94sVP+aRm75yEbCh+r2/yR+7q6hux9LVtbuTGBw==", + "dependencies": { + "xml-name-validator": "^4.0.0" + }, + "engines": { + "node": ">=14" + } + }, + "node_modules/@edx/frontend-component-footer/node_modules/webidl-conversions": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-7.0.0.tgz", + "integrity": "sha512-VwddBukDzu71offAQR975unBIGqfKZpM+8ZX6ySk8nYhVoo5CYaZyzt3YBvYtRtO+aoGlqxPg/B87NGVZ/fu6g==", + "engines": { + "node": ">=12" + } + }, + "node_modules/@edx/frontend-component-footer/node_modules/whatwg-encoding": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-2.0.0.tgz", + "integrity": "sha512-p41ogyeMUrw3jWclHWTQg1k05DSVXPLcVxRTYsXUk+ZooOCZLcoYgPZ/HL/D/N+uQPOtcp1me1WhBEaX02mhWg==", + "dependencies": { + "iconv-lite": "0.6.3" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/@edx/frontend-component-footer/node_modules/whatwg-mimetype": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-3.0.0.tgz", + "integrity": "sha512-nt+N2dzIutVRxARx1nghPKGv1xHikU7HKdfafKkLNLindmPU/ch3U31NOCGGA/dmPcmb1VlofO0vnKAcsm0o/Q==", + "engines": { + "node": ">=12" + } + }, + "node_modules/@edx/frontend-component-footer/node_modules/whatwg-url": { + "version": "11.0.0", + "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-11.0.0.tgz", + "integrity": "sha512-RKT8HExMpoYx4igMiVMY83lN6UeITKJlBQ+vR/8ZJ8OCdSiN3RwCq+9gH0+Xzj0+5IrM6i4j/6LuvzbZIQgEcQ==", + "dependencies": { + "tr46": "^3.0.0", + "webidl-conversions": "^7.0.0" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/@edx/frontend-component-footer/node_modules/write-file-atomic": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-4.0.2.tgz", + "integrity": "sha512-7KxauUdBmSdWnmpaGFg+ppNjKF8uNLry8LyzjauQDOVONfFLNKrKvQOxZ/VuTIcS/gge/YNahf5RIIQWTSarlg==", + "optional": true, + "peer": true, + "dependencies": { + "imurmurhash": "^0.1.4", + "signal-exit": "^3.0.7" + }, + "engines": { + "node": "^12.13.0 || ^14.15.0 || >=16.0.0" + } + }, + "node_modules/@edx/frontend-component-footer/node_modules/ws": { + "version": "8.17.0", + "resolved": "https://registry.npmjs.org/ws/-/ws-8.17.0.tgz", + "integrity": "sha512-uJq6108EgZMAl20KagGkzCKfMEjxmKvZHG7Tlq0Z6nOky7YF7aq4mOx6xK8TJ/i1LeK4Qus7INktacctDgY8Ow==", + "engines": { + "node": ">=10.0.0" + }, + "peerDependencies": { + "bufferutil": "^4.0.1", + "utf-8-validate": ">=5.0.2" + }, + "peerDependenciesMeta": { + "bufferutil": { + "optional": true + }, + "utf-8-validate": { + "optional": true + } + } + }, + "node_modules/@edx/frontend-component-footer/node_modules/xml-name-validator": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-4.0.0.tgz", + "integrity": "sha512-ICP2e+jsHvAj2E2lIHxa5tjXRlKDJo4IdvPvCXbXQGdzSfmSpNVyIKMvoZHjDY9DP0zV17iI85o90vRFXNccRw==", + "engines": { + "node": ">=12" + } + }, + "node_modules/@edx/frontend-component-footer/node_modules/yallist": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz", + "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==" + }, + "node_modules/@edx/frontend-component-footer/node_modules/yargs-parser": { + "version": "21.1.1", + "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz", + "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==", + "engines": { + "node": ">=12" + } + }, + "node_modules/@edx/frontend-component-header": { + "version": "5.3.0", + "resolved": "https://registry.npmjs.org/@edx/frontend-component-header/-/frontend-component-header-5.3.0.tgz", + "integrity": "sha512-xBtZDWx54Wa2WEwY175wzirnsHgrr7T8TGDZfsMXuKVYbFosjSYSFyrOkxgHb8AOAykjlUEaWLJorsppyLb4YA==", + "dependencies": { + "@fortawesome/fontawesome-svg-core": "6.5.2", + "@fortawesome/free-brands-svg-icons": "6.5.2", + "@fortawesome/free-regular-svg-icons": "6.5.2", + "@fortawesome/free-solid-svg-icons": "6.5.2", + "@fortawesome/react-fontawesome": "^0.2.0", + "axios-mock-adapter": "1.22.0", + "babel-polyfill": "6.26.0", + "jest-environment-jsdom": "^29.7.0", + "react-responsive": "8.2.0", + "react-transition-group": "4.4.5" + }, + "peerDependencies": { + "@edx/frontend-platform": "^7.0.0 || ^8.0.0", + "@openedx/paragon": ">= 21.5.7 < 23.0.0", + "prop-types": "^15.5.10", + "react": "^16.9.0 || ^17.0.0", + "react-dom": "^16.9.0 || ^17.0.0" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/@fortawesome/fontawesome-common-types": { + "version": "6.5.2", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.5.2.tgz", + "integrity": "sha512-gBxPg3aVO6J0kpfHNILc+NMhXnqHumFxOmjYCFfOiLZfwhnnfhtsdA2hfJlDnj+8PjAs6kKQPenOTKj3Rf7zHw==", + "hasInstallScript": true, + "engines": { + "node": ">=6" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/@fortawesome/fontawesome-svg-core": { + "version": "6.5.2", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.5.2.tgz", + "integrity": "sha512-5CdaCBGl8Rh9ohNdxeeTMxIj8oc3KNBgIeLMvJosBMdslK/UnEB8rzyDRrbKdL1kDweqBPo4GT9wvnakHWucZw==", + "hasInstallScript": true, + "dependencies": { + "@fortawesome/fontawesome-common-types": "6.5.2" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/@fortawesome/free-brands-svg-icons": { + "version": "6.5.2", + "resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-6.5.2.tgz", + "integrity": "sha512-zi5FNYdmKLnEc0jc0uuHH17kz/hfYTg4Uei0wMGzcoCL/4d3WM3u1VMc0iGGa31HuhV5i7ZK8ZlTCQrHqRHSGQ==", + "hasInstallScript": true, + "dependencies": { + "@fortawesome/fontawesome-common-types": "6.5.2" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/@fortawesome/free-solid-svg-icons": { + "version": "6.5.2", + "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.5.2.tgz", + "integrity": "sha512-QWFZYXFE7O1Gr1dTIp+D6UcFUF0qElOnZptpi7PBUMylJh+vFmIedVe1Ir6RM1t2tEQLLSV1k7bR4o92M+uqlw==", + "hasInstallScript": true, + "dependencies": { + "@fortawesome/fontawesome-common-types": "6.5.2" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/@fortawesome/react-fontawesome": { + "version": "0.2.0", + "resolved": "https://registry.npmjs.org/@fortawesome/react-fontawesome/-/react-fontawesome-0.2.0.tgz", + "integrity": "sha512-uHg75Rb/XORTtVt7OS9WoK8uM276Ufi7gCzshVWkUJbHhh3svsUUeqXerrM96Wm7fRiDzfKRwSoahhMIkGAYHw==", + "dependencies": { + "prop-types": "^15.8.1" + }, + "peerDependencies": { + "@fortawesome/fontawesome-svg-core": "~1 || ~6", + "react": ">=16.3" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/@fortawesome/react-fontawesome/node_modules/prop-types": { + "version": "15.8.1", + "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz", + "integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==", + "dependencies": { + "loose-envify": "^1.4.0", + "object-assign": "^4.1.1", + "react-is": "^16.13.1" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/@jest/types": { + "version": "29.6.3", + "resolved": "https://registry.npmjs.org/@jest/types/-/types-29.6.3.tgz", + "integrity": "sha512-u3UPsIilWKOM3F9CXtrG8LEJmNxwoCQC/XVj4IKYXvvpx7QIi/Kg1LI5uDmDpKlac62NUtX7eLjRh+jVZcLOzw==", + "dependencies": { + "@jest/schemas": "^29.6.3", + "@types/istanbul-lib-coverage": "^2.0.0", + "@types/istanbul-reports": "^3.0.0", + "@types/node": "*", + "@types/yargs": "^17.0.8", + "chalk": "^4.0.0" + }, + "engines": { + "node": "^14.15.0 || ^16.10.0 || >=18.0.0" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/@tootallnate/once": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/@tootallnate/once/-/once-2.0.0.tgz", + "integrity": "sha512-XCuKFP5PS55gnMVu3dty8KPatLqUoy/ZYzDzAGCQ8JNFCkLXzmI7vNHCR+XpbZaMWQK/vQubr7PkYq8g470J/A==", + "engines": { + "node": ">= 10" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/@types/yargs": { + "version": "17.0.32", + "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-17.0.32.tgz", + "integrity": "sha512-xQ67Yc/laOG5uMfX/093MRlGGCIBzZMarVa+gfNKJxWAIgykYpVGkBdbqEzGDDfCrVUj6Hiff4mTZ5BA6TmAog==", + "dependencies": { + "@types/yargs-parser": "*" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/acorn-globals": { + "version": "7.0.1", + "resolved": "https://registry.npmjs.org/acorn-globals/-/acorn-globals-7.0.1.tgz", + "integrity": "sha512-umOSDSDrfHbTNPuNpC2NSnnA3LUrqpevPb4T9jRx4MagXNS0rs+gwiTcAvqCRmsD6utzsrzNt+ebm00SNWiC3Q==", + "dependencies": { + "acorn": "^8.1.0", + "acorn-walk": "^8.0.2" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/acorn-walk": { + "version": "8.3.2", + "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.2.tgz", + "integrity": "sha512-cjkyv4OtNCIeqhHrfS81QWXoCBPExR/J62oyEqepVw8WaQeSqpW2uhuLPh1m9eWhDuOo/jUXVTlifvesOWp/4A==", + "engines": { + "node": ">=0.4.0" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/ansi-styles": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", + "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", + "dependencies": { + "color-convert": "^2.0.1" + }, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/chalk/ansi-styles?sponsor=1" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/chalk": { + "version": "4.1.2", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", + "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", + "dependencies": { + "ansi-styles": "^4.1.0", + "supports-color": "^7.1.0" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/chalk/chalk?sponsor=1" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/ci-info": { + "version": "3.9.0", + "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-3.9.0.tgz", + "integrity": "sha512-NIxF55hv4nSqQswkAeiOi1r83xy8JldOFDTWiug55KBu9Jnblncd2U6ViHmYgHf01TPZS77NJBhBMKdWj9HQMQ==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/sibiraj-s" + } + ], + "engines": { + "node": ">=8" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/color-convert": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", + "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", + "dependencies": { + "color-name": "~1.1.4" + }, + "engines": { + "node": ">=7.0.0" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/color-name": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", + "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==" + }, + "node_modules/@edx/frontend-component-header/node_modules/cssom": { + "version": "0.5.0", + "resolved": "https://registry.npmjs.org/cssom/-/cssom-0.5.0.tgz", + "integrity": "sha512-iKuQcq+NdHqlAcwUY0o/HL69XQrUaQdMjmStJ8JFmUaiiQErlhrmuigkg/CU4E2J0IyUKUrMAgl36TvN67MqTw==" + }, + "node_modules/@edx/frontend-component-header/node_modules/data-urls": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/data-urls/-/data-urls-3.0.2.tgz", + "integrity": "sha512-Jy/tj3ldjZJo63sVAvg6LHt2mHvl4V6AgRAmNDtLdm7faqtsx+aJG42rsyCo9JCoRVKwPFzKlIPx3DIibwSIaQ==", + "dependencies": { + "abab": "^2.0.6", + "whatwg-mimetype": "^3.0.0", + "whatwg-url": "^11.0.0" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/domexception": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/domexception/-/domexception-4.0.0.tgz", + "integrity": "sha512-A2is4PLG+eeSfoTMA95/s4pvAoSo2mKtiM5jlHkAVewmiO8ISFTFKZjH7UAM1Atli/OT/7JHOrJRJiMKUZKYBw==", + "deprecated": "Use your platform's native DOMException instead", + "dependencies": { + "webidl-conversions": "^7.0.0" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/has-flag": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", + "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", + "engines": { + "node": ">=8" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/html-encoding-sniffer": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-3.0.0.tgz", + "integrity": "sha512-oWv4T4yJ52iKrufjnyZPkrN0CH3QnrUqdB6In1g5Fe1mia8GmF36gnfNySxoZtxD5+NmYw1EElVXiBk93UeskA==", + "dependencies": { + "whatwg-encoding": "^2.0.0" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/http-proxy-agent": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-5.0.0.tgz", + "integrity": "sha512-n2hY8YdoRE1i7r6M0w9DIw5GgZN0G25P8zLCRQ8rjXtTU3vsNFBI/vWK/UIeE6g5MUUz6avwAPXmL6Fy9D/90w==", + "dependencies": { + "@tootallnate/once": "2", + "agent-base": "6", + "debug": "4" + }, + "engines": { + "node": ">= 6" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/jest-environment-jsdom": { + "version": "29.7.0", + "resolved": "https://registry.npmjs.org/jest-environment-jsdom/-/jest-environment-jsdom-29.7.0.tgz", + "integrity": "sha512-k9iQbsf9OyOfdzWH8HDmrRT0gSIcX+FLNW7IQq94tFX0gynPwqDTW0Ho6iMVNjGz/nb+l/vW3dWM2bbLLpkbXA==", + "dependencies": { + "@jest/environment": "^29.7.0", + "@jest/fake-timers": "^29.7.0", + "@jest/types": "^29.6.3", + "@types/jsdom": "^20.0.0", + "@types/node": "*", + "jest-mock": "^29.7.0", + "jest-util": "^29.7.0", + "jsdom": "^20.0.0" + }, + "engines": { + "node": "^14.15.0 || ^16.10.0 || >=18.0.0" + }, + "peerDependencies": { + "canvas": "^2.5.0" + }, + "peerDependenciesMeta": { + "canvas": { + "optional": true + } + } + }, + "node_modules/@edx/frontend-component-header/node_modules/jest-util": { + "version": "29.7.0", + "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-29.7.0.tgz", + "integrity": "sha512-z6EbKajIpqGKU56y5KBUgy1dt1ihhQJgWzUlZHArA/+X2ad7Cb5iF+AK1EWVL/Bo7Rz9uurpqw6SiBCefUbCGA==", + "dependencies": { + "@jest/types": "^29.6.3", + "@types/node": "*", + "chalk": "^4.0.0", + "ci-info": "^3.2.0", + "graceful-fs": "^4.2.9", + "picomatch": "^2.2.3" + }, + "engines": { + "node": "^14.15.0 || ^16.10.0 || >=18.0.0" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/jsdom": { + "version": "20.0.3", + "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-20.0.3.tgz", + "integrity": "sha512-SYhBvTh89tTfCD/CRdSOm13mOBa42iTaTyfyEWBdKcGdPxPtLFBXuHR8XHb33YNYaP+lLbmSvBTsnoesCNJEsQ==", + "dependencies": { + "abab": "^2.0.6", + "acorn": "^8.8.1", + "acorn-globals": "^7.0.0", + "cssom": "^0.5.0", + "cssstyle": "^2.3.0", + "data-urls": "^3.0.2", + "decimal.js": "^10.4.2", + "domexception": "^4.0.0", + "escodegen": "^2.0.0", + "form-data": "^4.0.0", + "html-encoding-sniffer": "^3.0.0", + "http-proxy-agent": "^5.0.0", + "https-proxy-agent": "^5.0.1", + "is-potential-custom-element-name": "^1.0.1", + "nwsapi": "^2.2.2", + "parse5": "^7.1.1", + "saxes": "^6.0.0", + "symbol-tree": "^3.2.4", + "tough-cookie": "^4.1.2", + "w3c-xmlserializer": "^4.0.0", + "webidl-conversions": "^7.0.0", + "whatwg-encoding": "^2.0.0", + "whatwg-mimetype": "^3.0.0", + "whatwg-url": "^11.0.0", + "ws": "^8.11.0", + "xml-name-validator": "^4.0.0" + }, + "engines": { + "node": ">=14" + }, + "peerDependencies": { + "canvas": "^2.5.0" + }, + "peerDependenciesMeta": { + "canvas": { + "optional": true + } + } + }, + "node_modules/@edx/frontend-component-header/node_modules/parse5": { + "version": "7.1.2", + "resolved": "https://registry.npmjs.org/parse5/-/parse5-7.1.2.tgz", + "integrity": "sha512-Czj1WaSVpaoj0wbhMzLmWD69anp2WH7FXMB9n1Sy8/ZFF9jolSQVMu1Ij5WIyGmcBmhk7EOndpO4mIpihVqAXw==", + "dependencies": { + "entities": "^4.4.0" + }, + "funding": { + "url": "https://github.com/inikulin/parse5?sponsor=1" + } + }, + "node_modules/@edx/frontend-component-header/node_modules/react-is": { + "version": "16.13.1", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", + "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" + }, + "node_modules/@edx/frontend-component-header/node_modules/saxes": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/saxes/-/saxes-6.0.0.tgz", + "integrity": "sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==", + "dependencies": { + "xmlchars": "^2.2.0" + }, "engines": { - "node": ">=8" + "node": ">=v12.22.7" } }, - "node_modules/@edx/frontend-component-footer/node_modules/supports-color": { + "node_modules/@edx/frontend-component-header/node_modules/supports-color": { "version": "7.2.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", @@ -2638,7 +3170,7 @@ "node": ">=8" } }, - "node_modules/@edx/frontend-component-footer/node_modules/tr46": { + "node_modules/@edx/frontend-component-header/node_modules/tr46": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/tr46/-/tr46-3.0.0.tgz", "integrity": "sha512-l7FvfAHlcmulp8kr+flpQZmVwtu7nfRV7NZujtN0OqES8EL4O4e0qqzL0DC5gAvx/ZC/9lk6rhcUwYvkBnBnYA==", @@ -2649,49 +3181,7 @@ "node": ">=12" } }, - "node_modules/@edx/frontend-component-footer/node_modules/ts-jest": { - "version": "29.1.2", - "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-29.1.2.tgz", - "integrity": "sha512-br6GJoH/WUX4pu7FbZXuWGKGNDuU7b8Uj77g/Sp7puZV6EXzuByl6JrECvm0MzVzSTkSHWTihsXt+5XYER5b+g==", - "dependencies": { - "bs-logger": "0.x", - "fast-json-stable-stringify": "2.x", - "jest-util": "^29.0.0", - "json5": "^2.2.3", - "lodash.memoize": "4.x", - "make-error": "1.x", - "semver": "^7.5.3", - "yargs-parser": "^21.0.1" - }, - "bin": { - "ts-jest": "cli.js" - }, - "engines": { - "node": "^16.10.0 || ^18.0.0 || >=20.0.0" - }, - "peerDependencies": { - "@babel/core": ">=7.0.0-beta.0 <8", - "@jest/types": "^29.0.0", - "babel-jest": "^29.0.0", - "jest": "^29.0.0", - "typescript": ">=4.3 <6" - }, - "peerDependenciesMeta": { - "@babel/core": { - "optional": true - }, - "@jest/types": { - "optional": true - }, - "babel-jest": { - "optional": true - }, - "esbuild": { - "optional": true - } - } - }, - "node_modules/@edx/frontend-component-footer/node_modules/w3c-xmlserializer": { + "node_modules/@edx/frontend-component-header/node_modules/w3c-xmlserializer": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-4.0.0.tgz", "integrity": "sha512-d+BFHzbiCx6zGfz0HyQ6Rg69w9k19nviJspaj4yNscGjrHu94sVP+aRm75yEbCh+r2/yR+7q6hux9LVtbuTGBw==", @@ -2702,7 +3192,7 @@ "node": ">=14" } }, - "node_modules/@edx/frontend-component-footer/node_modules/webidl-conversions": { + "node_modules/@edx/frontend-component-header/node_modules/webidl-conversions": { "version": "7.0.0", "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-7.0.0.tgz", "integrity": "sha512-VwddBukDzu71offAQR975unBIGqfKZpM+8ZX6ySk8nYhVoo5CYaZyzt3YBvYtRtO+aoGlqxPg/B87NGVZ/fu6g==", @@ -2710,7 +3200,7 @@ "node": ">=12" } }, - "node_modules/@edx/frontend-component-footer/node_modules/whatwg-encoding": { + "node_modules/@edx/frontend-component-header/node_modules/whatwg-encoding": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-2.0.0.tgz", "integrity": "sha512-p41ogyeMUrw3jWclHWTQg1k05DSVXPLcVxRTYsXUk+ZooOCZLcoYgPZ/HL/D/N+uQPOtcp1me1WhBEaX02mhWg==", @@ -2721,7 +3211,7 @@ "node": ">=12" } }, - "node_modules/@edx/frontend-component-footer/node_modules/whatwg-mimetype": { + "node_modules/@edx/frontend-component-header/node_modules/whatwg-mimetype": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-3.0.0.tgz", "integrity": "sha512-nt+N2dzIutVRxARx1nghPKGv1xHikU7HKdfafKkLNLindmPU/ch3U31NOCGGA/dmPcmb1VlofO0vnKAcsm0o/Q==", @@ -2729,7 +3219,7 @@ "node": ">=12" } }, - "node_modules/@edx/frontend-component-footer/node_modules/whatwg-url": { + "node_modules/@edx/frontend-component-header/node_modules/whatwg-url": { "version": "11.0.0", "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-11.0.0.tgz", "integrity": "sha512-RKT8HExMpoYx4igMiVMY83lN6UeITKJlBQ+vR/8ZJ8OCdSiN3RwCq+9gH0+Xzj0+5IrM6i4j/6LuvzbZIQgEcQ==", @@ -2741,24 +3231,10 @@ "node": ">=12" } }, - "node_modules/@edx/frontend-component-footer/node_modules/write-file-atomic": { - "version": "4.0.2", - "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-4.0.2.tgz", - "integrity": "sha512-7KxauUdBmSdWnmpaGFg+ppNjKF8uNLry8LyzjauQDOVONfFLNKrKvQOxZ/VuTIcS/gge/YNahf5RIIQWTSarlg==", - "optional": true, - "peer": true, - "dependencies": { - "imurmurhash": "^0.1.4", - "signal-exit": "^3.0.7" - }, - "engines": { - "node": "^12.13.0 || ^14.15.0 || >=16.0.0" - } - }, - "node_modules/@edx/frontend-component-footer/node_modules/ws": { - "version": "8.17.0", - "resolved": "https://registry.npmjs.org/ws/-/ws-8.17.0.tgz", - "integrity": "sha512-uJq6108EgZMAl20KagGkzCKfMEjxmKvZHG7Tlq0Z6nOky7YF7aq4mOx6xK8TJ/i1LeK4Qus7INktacctDgY8Ow==", + "node_modules/@edx/frontend-component-header/node_modules/ws": { + "version": "8.16.0", + "resolved": "https://registry.npmjs.org/ws/-/ws-8.16.0.tgz", + "integrity": "sha512-HS0c//TP7Ina87TfiPUz1rQzMhHrl/SG2guqRcTOIUYD2q8uhUdNHZYJUaQ8aTGPzCh+c6oawMKW35nFl1dxyQ==", "engines": { "node": ">=10.0.0" }, @@ -2775,7 +3251,7 @@ } } }, - "node_modules/@edx/frontend-component-footer/node_modules/xml-name-validator": { + "node_modules/@edx/frontend-component-header/node_modules/xml-name-validator": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-4.0.0.tgz", "integrity": "sha512-ICP2e+jsHvAj2E2lIHxa5tjXRlKDJo4IdvPvCXbXQGdzSfmSpNVyIKMvoZHjDY9DP0zV17iI85o90vRFXNccRw==", @@ -2783,87 +3259,6 @@ "node": ">=12" } }, - "node_modules/@edx/frontend-component-footer/node_modules/yallist": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz", - "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==" - }, - "node_modules/@edx/frontend-component-footer/node_modules/yargs-parser": { - "version": "21.1.1", - "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz", - "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==", - "engines": { - "node": ">=12" - } - }, - "node_modules/@edx/frontend-component-header": { - "version": "5.0.2", - "resolved": "https://registry.npmjs.org/@edx/frontend-component-header/-/frontend-component-header-5.0.2.tgz", - "integrity": "sha512-73fNNc1X/tevb3/hw7+s22T+nPGlW1yXA7zsT9eRzdH7rBxONfp0Jz7yEdeBvTax9a96PaOht45DA6GX9eG4KA==", - "dependencies": { - "@fortawesome/fontawesome-svg-core": "6.5.1", - "@fortawesome/free-brands-svg-icons": "6.5.1", - "@fortawesome/free-regular-svg-icons": "6.5.1", - "@fortawesome/free-solid-svg-icons": "6.5.1", - "@fortawesome/react-fontawesome": "^0.2.0", - "axios-mock-adapter": "1.22.0", - "babel-polyfill": "6.26.0", - "react-responsive": "8.2.0", - "react-transition-group": "4.4.5" - }, - "peerDependencies": { - "@edx/frontend-platform": "^7.0.0", - "@openedx/paragon": ">= 21.5.7 < 23.0.0", - "prop-types": "^15.5.10", - "react": "^16.9.0 || ^17.0.0", - "react-dom": "^16.9.0 || ^17.0.0" - } - }, - "node_modules/@edx/frontend-component-header/node_modules/@fortawesome/fontawesome-common-types": { - "version": "6.5.1", - "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.5.1.tgz", - "integrity": "sha512-GkWzv+L6d2bI5f/Vk6ikJ9xtl7dfXtoRu3YGE6nq0p/FFqA1ebMOAWg3XgRyb0I6LYyYkiAo+3/KrwuBp8xG7A==", - "hasInstallScript": true, - "engines": { - "node": ">=6" - } - }, - "node_modules/@edx/frontend-component-header/node_modules/@fortawesome/fontawesome-svg-core": { - "version": "6.5.1", - "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.5.1.tgz", - "integrity": "sha512-MfRCYlQPXoLlpem+egxjfkEuP9UQswTrlCOsknus/NcMoblTH2g0jPrapbcIb04KGA7E2GZxbAccGZfWoYgsrQ==", - "hasInstallScript": true, - "dependencies": { - "@fortawesome/fontawesome-common-types": "6.5.1" - }, - "engines": { - "node": ">=6" - } - }, - "node_modules/@edx/frontend-component-header/node_modules/@fortawesome/free-brands-svg-icons": { - "version": "6.5.1", - "resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-6.5.1.tgz", - "integrity": "sha512-093l7DAkx0aEtBq66Sf19MgoZewv1zeY9/4C7vSKPO4qMwEsW/2VYTUTpBtLwfb9T2R73tXaRDPmE4UqLCYHfg==", - "hasInstallScript": true, - "dependencies": { - "@fortawesome/fontawesome-common-types": "6.5.1" - }, - "engines": { - "node": ">=6" - } - }, - "node_modules/@edx/frontend-component-header/node_modules/@fortawesome/free-solid-svg-icons": { - "version": "6.5.1", - "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.5.1.tgz", - "integrity": "sha512-S1PPfU3mIJa59biTtXJz1oI0+KAXW6bkAb31XKhxdxtuXDiUIFsih4JR1v5BbxY7hVHsD1RKq+jRkVRaf773NQ==", - "hasInstallScript": true, - "dependencies": { - "@fortawesome/fontawesome-common-types": "6.5.1" - }, - "engines": { - "node": ">=6" - } - }, "node_modules/@edx/frontend-enterprise-hotjar": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/@edx/frontend-enterprise-hotjar/-/frontend-enterprise-hotjar-3.0.0.tgz", @@ -3753,21 +4148,21 @@ } }, "node_modules/@fortawesome/free-regular-svg-icons": { - "version": "6.5.1", - "resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.5.1.tgz", - "integrity": "sha512-m6ShXn+wvqEU69wSP84coxLbNl7sGVZb+Ca+XZq6k30SzuP3X4TfPqtycgUh9ASwlNh5OfQCd8pDIWxl+O+LlQ==", + "version": "6.5.2", + "resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.5.2.tgz", + "integrity": "sha512-iabw/f5f8Uy2nTRtJ13XZTS1O5+t+anvlamJ3zJGLEVE2pKsAWhPv2lq01uQlfgCX7VaveT3EVs515cCN9jRbw==", "hasInstallScript": true, "dependencies": { - "@fortawesome/fontawesome-common-types": "6.5.1" + "@fortawesome/fontawesome-common-types": "6.5.2" }, "engines": { "node": ">=6" } }, "node_modules/@fortawesome/free-regular-svg-icons/node_modules/@fortawesome/fontawesome-common-types": { - "version": "6.5.1", - "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.5.1.tgz", - "integrity": "sha512-GkWzv+L6d2bI5f/Vk6ikJ9xtl7dfXtoRu3YGE6nq0p/FFqA1ebMOAWg3XgRyb0I6LYyYkiAo+3/KrwuBp8xG7A==", + "version": "6.5.2", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.5.2.tgz", + "integrity": "sha512-gBxPg3aVO6J0kpfHNILc+NMhXnqHumFxOmjYCFfOiLZfwhnnfhtsdA2hfJlDnj+8PjAs6kKQPenOTKj3Rf7zHw==", "hasInstallScript": true, "engines": { "node": ">=6" @@ -7163,6 +7558,86 @@ "node": ">=6" } }, + "node_modules/@openedx/frontend-plugin-framework/node_modules/@edx/frontend-component-header": { + "version": "5.0.2", + "resolved": "https://registry.npmjs.org/@edx/frontend-component-header/-/frontend-component-header-5.0.2.tgz", + "integrity": "sha512-73fNNc1X/tevb3/hw7+s22T+nPGlW1yXA7zsT9eRzdH7rBxONfp0Jz7yEdeBvTax9a96PaOht45DA6GX9eG4KA==", + "dependencies": { + "@fortawesome/fontawesome-svg-core": "6.5.1", + "@fortawesome/free-brands-svg-icons": "6.5.1", + "@fortawesome/free-regular-svg-icons": "6.5.1", + "@fortawesome/free-solid-svg-icons": "6.5.1", + "@fortawesome/react-fontawesome": "^0.2.0", + "axios-mock-adapter": "1.22.0", + "babel-polyfill": "6.26.0", + "react-responsive": "8.2.0", + "react-transition-group": "4.4.5" + }, + "peerDependencies": { + "@edx/frontend-platform": "^7.0.0", + "@openedx/paragon": ">= 21.5.7 < 23.0.0", + "prop-types": "^15.5.10", + "react": "^16.9.0 || ^17.0.0", + "react-dom": "^16.9.0 || ^17.0.0" + } + }, + "node_modules/@openedx/frontend-plugin-framework/node_modules/@edx/frontend-component-header/node_modules/@fortawesome/fontawesome-common-types": { + "version": "6.5.1", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.5.1.tgz", + "integrity": "sha512-GkWzv+L6d2bI5f/Vk6ikJ9xtl7dfXtoRu3YGE6nq0p/FFqA1ebMOAWg3XgRyb0I6LYyYkiAo+3/KrwuBp8xG7A==", + "hasInstallScript": true, + "engines": { + "node": ">=6" + } + }, + "node_modules/@openedx/frontend-plugin-framework/node_modules/@edx/frontend-component-header/node_modules/@fortawesome/fontawesome-svg-core": { + "version": "6.5.1", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.5.1.tgz", + "integrity": "sha512-MfRCYlQPXoLlpem+egxjfkEuP9UQswTrlCOsknus/NcMoblTH2g0jPrapbcIb04KGA7E2GZxbAccGZfWoYgsrQ==", + "hasInstallScript": true, + "dependencies": { + "@fortawesome/fontawesome-common-types": "6.5.1" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/@openedx/frontend-plugin-framework/node_modules/@edx/frontend-component-header/node_modules/@fortawesome/free-brands-svg-icons": { + "version": "6.5.1", + "resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-6.5.1.tgz", + "integrity": "sha512-093l7DAkx0aEtBq66Sf19MgoZewv1zeY9/4C7vSKPO4qMwEsW/2VYTUTpBtLwfb9T2R73tXaRDPmE4UqLCYHfg==", + "hasInstallScript": true, + "dependencies": { + "@fortawesome/fontawesome-common-types": "6.5.1" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/@openedx/frontend-plugin-framework/node_modules/@edx/frontend-component-header/node_modules/@fortawesome/free-regular-svg-icons": { + "version": "6.5.1", + "resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.5.1.tgz", + "integrity": "sha512-m6ShXn+wvqEU69wSP84coxLbNl7sGVZb+Ca+XZq6k30SzuP3X4TfPqtycgUh9ASwlNh5OfQCd8pDIWxl+O+LlQ==", + "hasInstallScript": true, + "dependencies": { + "@fortawesome/fontawesome-common-types": "6.5.1" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/@openedx/frontend-plugin-framework/node_modules/@edx/frontend-component-header/node_modules/@fortawesome/free-solid-svg-icons": { + "version": "6.5.1", + "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.5.1.tgz", + "integrity": "sha512-S1PPfU3mIJa59biTtXJz1oI0+KAXW6bkAb31XKhxdxtuXDiUIFsih4JR1v5BbxY7hVHsD1RKq+jRkVRaf773NQ==", + "hasInstallScript": true, + "dependencies": { + "@fortawesome/fontawesome-common-types": "6.5.1" + }, + "engines": { + "node": ">=6" + } + }, "node_modules/@openedx/frontend-plugin-framework/node_modules/@fortawesome/free-regular-svg-icons": { "version": "5.15.4", "resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-5.15.4.tgz", diff --git a/package.json b/package.json index 00135402..c5b499cf 100755 --- a/package.json +++ b/package.json @@ -29,6 +29,7 @@ "@edx/brand": "npm:@openedx/brand-openedx@^1.2.2", "@edx/browserslist-config": "^1.1.0", "@edx/frontend-component-footer": "13.1.0", + "@edx/frontend-component-header": "^5.3.0", "@edx/frontend-enterprise-hotjar": "3.0.0", "@edx/frontend-platform": "7.1.4", "@edx/openedx-atlas": "^0.6.0", diff --git a/src/App.scss b/src/App.scss index eed6b145..2292f72e 100755 --- a/src/App.scss +++ b/src/App.scss @@ -9,6 +9,7 @@ $fa-font-path: "~font-awesome/fonts"; $input-focus-box-shadow: $input-box-shadow; // hack to get upgrade to paragon 4.0.0 to work +@import "~@edx/frontend-component-header/dist/index"; @import "~@edx/frontend-component-footer/dist/_footer"; .text-ellipsis { diff --git a/src/containers/LearnerDashboardHeader/CollapsedHeader/CollapseMenuBody.jsx b/src/containers/LearnerDashboardHeader/CollapsedHeader/CollapseMenuBody.jsx deleted file mode 100644 index 82de5aaf..00000000 --- a/src/containers/LearnerDashboardHeader/CollapsedHeader/CollapseMenuBody.jsx +++ /dev/null @@ -1,104 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; - -import { getConfig } from '@edx/frontend-platform'; -import { useIntl } from '@edx/frontend-platform/i18n'; -import { AppContext } from '@edx/frontend-platform/react'; -import { Button, Badge } from '@openedx/paragon'; - -import urls from 'data/services/lms/urls'; -import { reduxHooks } from 'hooks'; - -import { findCoursesNavDropdownClicked } from '../hooks'; -import messages from '../messages'; - -export const CollapseMenuBody = ({ isOpen }) => { - const { formatMessage } = useIntl(); - const { authenticatedUser } = React.useContext(AppContext); - - const dashboard = reduxHooks.useEnterpriseDashboardData(); - const { courseSearchUrl } = reduxHooks.usePlatformSettingsData(); - - const exploreCoursesClick = findCoursesNavDropdownClicked( - urls.baseAppUrl(courseSearchUrl), - ); - - if (!isOpen) { - return null; - } - - return ( -
- - - - - {authenticatedUser && ( - <> - {!!dashboard && ( - - )} - {!dashboard && getConfig().CAREER_LINK_URL && ( - - )} - - - {getConfig().ORDER_HISTORY_URL && ( - - )} - - - )} -
- ); -}; - -CollapseMenuBody.propTypes = { - isOpen: PropTypes.bool.isRequired, -}; - -export default CollapseMenuBody; diff --git a/src/containers/LearnerDashboardHeader/CollapsedHeader/CollapseMenuBody.test.jsx b/src/containers/LearnerDashboardHeader/CollapsedHeader/CollapseMenuBody.test.jsx deleted file mode 100644 index 2af8ae7e..00000000 --- a/src/containers/LearnerDashboardHeader/CollapsedHeader/CollapseMenuBody.test.jsx +++ /dev/null @@ -1,48 +0,0 @@ -import { shallow } from '@edx/react-unit-test-utils'; -import { AppContext } from '@edx/frontend-platform/react'; - -import CollapseMenuBody from './CollapseMenuBody'; - -jest.mock('@edx/frontend-platform/react', () => ({ - AppContext: { - authenticatedUser: { - username: 'username', - }, - }, -})); - -jest.mock('hooks', () => ({ - reduxHooks: { - useEnterpriseDashboardData: () => ({ - url: 'url', - }), - usePlatformSettingsData: () => ({ - courseSearchUrl: '/courseSearchUrl', - }), - }, -})); - -jest.mock('../hooks', () => ({ - findCoursesNavDropdownClicked: (url) => jest.fn().mockName(`findCoursesNavDropdownClicked("${url}")`), -})); - -describe('CollapseMenuBody', () => { - test('render', () => { - const wrapper = shallow(); - expect(wrapper.snapshot).toMatchSnapshot(); - }); - - test('render empty if not open', () => { - const wrapper = shallow(); - expect(wrapper.snapshot).toMatchSnapshot(); - expect(wrapper.isEmptyRender()).toBe(true); - }); - - test('render unauthenticated', () => { - const { authenticatedUser } = AppContext; - AppContext.authenticatedUser = null; - const wrapper = shallow(); - expect(wrapper.snapshot).toMatchSnapshot(); - AppContext.authenticatedUser = authenticatedUser; - }); -}); diff --git a/src/containers/LearnerDashboardHeader/CollapsedHeader/__snapshots__/CollapseMenuBody.test.jsx.snap b/src/containers/LearnerDashboardHeader/CollapsedHeader/__snapshots__/CollapseMenuBody.test.jsx.snap deleted file mode 100644 index c8cc4de8..00000000 --- a/src/containers/LearnerDashboardHeader/CollapsedHeader/__snapshots__/CollapseMenuBody.test.jsx.snap +++ /dev/null @@ -1,105 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`CollapseMenuBody render 1`] = ` -
- - - - - - - - - - -
-`; - -exports[`CollapseMenuBody render empty if not open 1`] = `null`; - -exports[`CollapseMenuBody render unauthenticated 1`] = ` -
- - - - -
-`; diff --git a/src/containers/LearnerDashboardHeader/CollapsedHeader/__snapshots__/index.test.jsx.snap b/src/containers/LearnerDashboardHeader/CollapsedHeader/__snapshots__/index.test.jsx.snap deleted file mode 100644 index 2a1dc7bc..00000000 --- a/src/containers/LearnerDashboardHeader/CollapsedHeader/__snapshots__/index.test.jsx.snap +++ /dev/null @@ -1,48 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`CollapsedHeader render nothing if not collapsed 1`] = `false`; - -exports[`CollapsedHeader renders 1`] = ` - -
- - -
- - -`; - -exports[`CollapsedHeader renders with isOpen true 1`] = ` - -
- - -
- - -`; diff --git a/src/containers/LearnerDashboardHeader/CollapsedHeader/index.jsx b/src/containers/LearnerDashboardHeader/CollapsedHeader/index.jsx deleted file mode 100644 index 5cf9762b..00000000 --- a/src/containers/LearnerDashboardHeader/CollapsedHeader/index.jsx +++ /dev/null @@ -1,47 +0,0 @@ -import React from 'react'; - -import { useIntl } from '@edx/frontend-platform/i18n'; -import { MenuIcon, Close } from '@openedx/paragon/icons'; -import { IconButton, Icon } from '@openedx/paragon'; - -import { useLearnerDashboardHeaderData, useIsCollapsed } from '../hooks'; - -import CollapseMenuBody from './CollapseMenuBody'; -import BrandLogo from '../BrandLogo'; - -import messages from '../messages'; - -export const CollapsedHeader = () => { - const { formatMessage } = useIntl(); - const isCollapsed = useIsCollapsed(); - const { isOpen, toggleIsOpen } = useLearnerDashboardHeaderData(); - - return ( - isCollapsed && ( - <> -
- - -
- - - ) - ); -}; - -CollapsedHeader.propTypes = {}; - -export default CollapsedHeader; diff --git a/src/containers/LearnerDashboardHeader/CollapsedHeader/index.test.jsx b/src/containers/LearnerDashboardHeader/CollapsedHeader/index.test.jsx deleted file mode 100644 index c21e98cc..00000000 --- a/src/containers/LearnerDashboardHeader/CollapsedHeader/index.test.jsx +++ /dev/null @@ -1,38 +0,0 @@ -import { shallow } from '@edx/react-unit-test-utils'; - -import CollapsedHeader from '.'; - -import { useLearnerDashboardHeaderData, useIsCollapsed } from '../hooks'; - -jest.mock('../BrandLogo', () => jest.fn(() => 'BrandLogo')); -jest.mock('./CollapseMenuBody', () => jest.fn(() => 'CollapseMenuBody')); - -jest.mock('../hooks', () => ({ - useIsCollapsed: jest.fn(() => true), - useLearnerDashboardHeaderData: jest.fn(() => ({ - isOpen: false, - toggleIsOpen: jest.fn().mockName('toggleIsOpen'), - })), -})); - -describe('CollapsedHeader', () => { - it('renders', () => { - const wrapper = shallow(); - expect(wrapper.snapshot).toMatchSnapshot(); - }); - - it('render nothing if not collapsed', () => { - useIsCollapsed.mockReturnValueOnce(false); - const wrapper = shallow(); - expect(wrapper.snapshot).toMatchSnapshot(); - }); - - it('renders with isOpen true', () => { - useLearnerDashboardHeaderData.mockReturnValueOnce({ - isOpen: true, - toggleIsOpen: jest.fn().mockName('toggleIsOpen'), - }); - const wrapper = shallow(); - expect(wrapper.snapshot).toMatchSnapshot(); - }); -}); diff --git a/src/containers/LearnerDashboardHeader/ExpandedHeader/AuthenticatedUserDropdown.jsx b/src/containers/LearnerDashboardHeader/ExpandedHeader/AuthenticatedUserDropdown.jsx deleted file mode 100644 index e0751bb3..00000000 --- a/src/containers/LearnerDashboardHeader/ExpandedHeader/AuthenticatedUserDropdown.jsx +++ /dev/null @@ -1,78 +0,0 @@ -import React from 'react'; - -import { getConfig } from '@edx/frontend-platform'; -import { useIntl } from '@edx/frontend-platform/i18n'; -import { AppContext } from '@edx/frontend-platform/react'; -import { AvatarButton, Dropdown, Badge } from '@openedx/paragon'; - -import { reduxHooks } from 'hooks'; - -import messages from '../messages'; - -export const AuthenticatedUserDropdown = () => { - const { formatMessage } = useIntl(); - const { authenticatedUser } = React.useContext(AppContext); - const dashboard = reduxHooks.useEnterpriseDashboardData(); - - return ( - authenticatedUser && ( - - - - {authenticatedUser.username} - - - - { getConfig().ENABLE_EDX_PERSONAL_DASHBOARD && ( - <> - {formatMessage(messages.dashboardSwitch)} - - {formatMessage(messages.dashboardPersonal)} - - {!!dashboard && ( - - {dashboard.label} {formatMessage(messages.dashboard)} - - )} - - - )} - - {!dashboard && getConfig().CAREER_LINK_URL && ( - - {formatMessage(messages.career)} - - {formatMessage(messages.newAlert)} - - - )} - - {formatMessage(messages.profile)} - - - {formatMessage(messages.account)} - - {getConfig().ORDER_HISTORY_URL && ( - - {formatMessage(messages.orderHistory)} - - )} - - - {formatMessage(messages.signOut)} - - - - ) - ); -}; - -AuthenticatedUserDropdown.propTypes = {}; - -export default AuthenticatedUserDropdown; diff --git a/src/containers/LearnerDashboardHeader/ExpandedHeader/AuthenticatedUserDropdown.test.jsx b/src/containers/LearnerDashboardHeader/ExpandedHeader/AuthenticatedUserDropdown.test.jsx deleted file mode 100644 index e7452d35..00000000 --- a/src/containers/LearnerDashboardHeader/ExpandedHeader/AuthenticatedUserDropdown.test.jsx +++ /dev/null @@ -1,81 +0,0 @@ -import { shallow } from '@edx/react-unit-test-utils'; - -import { reduxHooks } from 'hooks'; -import { getConfig } from '@edx/frontend-platform'; -import { AppContext } from '@edx/frontend-platform/react'; -import { AuthenticatedUserDropdown } from './AuthenticatedUserDropdown'; -import { useIsCollapsed } from '../hooks'; - -jest.mock('@edx/frontend-platform', () => ({ - getConfig: jest.fn(), -})); - -jest.mock('@edx/frontend-platform/react', () => ({ - AppContext: { - authenticatedUser: { - profileImage: 'profileImage', - username: 'username', - }, - }, -})); -const COURSE_SEARCH_URL = 'test-course-search-url'; - -jest.mock('hooks', () => ({ - reduxHooks: { - useEnterpriseDashboardData: jest.fn(), - usePlatformSettingsData: jest.fn(() => ({ - courseSearchUrl: COURSE_SEARCH_URL, - })), - }, -})); -jest.mock('../hooks', () => ({ - useIsCollapsed: jest.fn(), - findCoursesNavDropdownClicked: (href) => jest.fn().mockName(`findCoursesNavDropdownClicked('${href}')`), -})); - -jest.mock('data/services/lms/urls', () => ({ - baseAppUrl: (url) => (url), - programsUrl: 'http://localhost:18000/dashboard/programs', -})); - -const config = { - ACCOUNT_PROFILE_URL: 'http://account-profile-url.test', - ACCOUNT_SETTINGS_URL: 'http://account-settings-url.test', - LOGOUT_URL: 'http://logout-url.test', - ORDER_HISTORY_URL: 'http://order-history-url.test', - SUPPORT_URL: 'http://localhost:18000/support', - CAREER_LINK_URL: 'http://localhost:18000/career', - LMS_BASE_URL: 'http:/localhost:18000', - ENABLE_EDX_PERSONAL_DASHBOARD: true, -}; -getConfig.mockReturnValue(config); - -describe('AuthenticatedUserDropdown', () => { - const defaultDashboardData = { - label: 'label', - url: 'url', - }; - - describe('snapshots', () => { - test('no auth render empty', () => { - const { authenticatedUser } = AppContext; - AppContext.authenticatedUser = null; - const wrapper = shallow(); - expect(wrapper.snapshot).toMatchSnapshot(); - expect(wrapper.isEmptyRender()).toBe(true); - AppContext.authenticatedUser = authenticatedUser; - }); - test('with enterprise dashboard', () => { - reduxHooks.useEnterpriseDashboardData.mockReturnValueOnce(defaultDashboardData); - useIsCollapsed.mockReturnValueOnce(true); - const wrapper = shallow(); - expect(wrapper.snapshot).toMatchSnapshot(); - }); - test('without enterprise dashboard and expanded', () => { - reduxHooks.useEnterpriseDashboardData.mockReturnValueOnce(null); - useIsCollapsed.mockReturnValueOnce(false); - const wrapper = shallow(); - expect(wrapper.snapshot).toMatchSnapshot(); - }); - }); -}); diff --git a/src/containers/LearnerDashboardHeader/ExpandedHeader/__snapshots__/AuthenticatedUserDropdown.test.jsx.snap b/src/containers/LearnerDashboardHeader/ExpandedHeader/__snapshots__/AuthenticatedUserDropdown.test.jsx.snap deleted file mode 100644 index eafdef3c..00000000 --- a/src/containers/LearnerDashboardHeader/ExpandedHeader/__snapshots__/AuthenticatedUserDropdown.test.jsx.snap +++ /dev/null @@ -1,139 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`AuthenticatedUserDropdown snapshots no auth render empty 1`] = `null`; - -exports[`AuthenticatedUserDropdown snapshots with enterprise dashboard 1`] = ` - - - - username - - - - - - SWITCH DASHBOARD - - - Personal - - - label - - Dashboard - - - - - Profile - - - Account - - - Order History - - - - Sign Out - - - -`; - -exports[`AuthenticatedUserDropdown snapshots without enterprise dashboard and expanded 1`] = ` - - - - username - - - - - - SWITCH DASHBOARD - - - Personal - - - - - Career - - New - - - - Profile - - - Account - - - Order History - - - - Sign Out - - - -`; diff --git a/src/containers/LearnerDashboardHeader/ExpandedHeader/__snapshots__/index.test.jsx.snap b/src/containers/LearnerDashboardHeader/ExpandedHeader/__snapshots__/index.test.jsx.snap deleted file mode 100644 index 44e08f16..00000000 --- a/src/containers/LearnerDashboardHeader/ExpandedHeader/__snapshots__/index.test.jsx.snap +++ /dev/null @@ -1,52 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`ExpandedHeader render 1`] = ` -
-
- - - - - - -
- -
-`; - -exports[`ExpandedHeader render empty if collapsed 1`] = `null`; diff --git a/src/containers/LearnerDashboardHeader/ExpandedHeader/index.jsx b/src/containers/LearnerDashboardHeader/ExpandedHeader/index.jsx deleted file mode 100644 index f257cbc5..00000000 --- a/src/containers/LearnerDashboardHeader/ExpandedHeader/index.jsx +++ /dev/null @@ -1,76 +0,0 @@ -import React from 'react'; - -import { getConfig } from '@edx/frontend-platform'; -import { useIntl } from '@edx/frontend-platform/i18n'; -import { Button } from '@openedx/paragon'; - -import urls from 'data/services/lms/urls'; -import { reduxHooks } from 'hooks'; - -import AuthenticatedUserDropdown from './AuthenticatedUserDropdown'; -import { useIsCollapsed, findCoursesNavClicked } from '../hooks'; -import messages from '../messages'; -import BrandLogo from '../BrandLogo'; - -export const ExpandedHeader = () => { - const { formatMessage } = useIntl(); - const { courseSearchUrl } = reduxHooks.usePlatformSettingsData(); - const isCollapsed = useIsCollapsed(); - - const exploreCoursesClick = findCoursesNavClicked( - urls.baseAppUrl(courseSearchUrl), - ); - - if (isCollapsed) { - return null; - } - - return ( -
-
- - - - - - - -
- - -
- ); -}; - -ExpandedHeader.propTypes = {}; - -export default ExpandedHeader; diff --git a/src/containers/LearnerDashboardHeader/ExpandedHeader/index.test.jsx b/src/containers/LearnerDashboardHeader/ExpandedHeader/index.test.jsx deleted file mode 100644 index 3b96a1db..00000000 --- a/src/containers/LearnerDashboardHeader/ExpandedHeader/index.test.jsx +++ /dev/null @@ -1,41 +0,0 @@ -import { shallow } from '@edx/react-unit-test-utils'; - -import ExpandedHeader from '.'; - -import { useIsCollapsed } from '../hooks'; - -jest.mock('data/services/lms/urls', () => ({ - programsUrl: () => 'programsUrl', - baseAppUrl: url => (`http://localhost:18000${url}`), -})); - -jest.mock('hooks', () => ({ - reduxHooks: { - usePlatformSettingsData: () => ({ - courseSearchUrl: '/courseSearchUrl', - }), - }, -})); - -jest.mock('../hooks', () => ({ - useIsCollapsed: jest.fn(), - findCoursesNavClicked: (url) => jest.fn().mockName(`findCoursesNavClicked("${url}")`), -})); - -jest.mock('./AuthenticatedUserDropdown', () => 'AuthenticatedUserDropdown'); -jest.mock('../BrandLogo', () => 'BrandLogo'); - -describe('ExpandedHeader', () => { - test('render', () => { - useIsCollapsed.mockReturnValueOnce(false); - const wrapper = shallow(); - expect(wrapper.snapshot).toMatchSnapshot(); - }); - - test('render empty if collapsed', () => { - useIsCollapsed.mockReturnValueOnce(true); - const wrapper = shallow(); - expect(wrapper.snapshot).toMatchSnapshot(); - expect(wrapper.isEmptyRender()).toBe(true); - }); -}); diff --git a/src/containers/LearnerDashboardHeader/LearnerDashboardMenu.jsx b/src/containers/LearnerDashboardHeader/LearnerDashboardMenu.jsx new file mode 100644 index 00000000..a98da17d --- /dev/null +++ b/src/containers/LearnerDashboardHeader/LearnerDashboardMenu.jsx @@ -0,0 +1,105 @@ +import { sendTrackEvent } from '@edx/frontend-platform/analytics'; +import { getConfig } from '@edx/frontend-platform'; +import { Badge } from '@openedx/paragon'; +import _ from 'lodash'; + +import urls from 'data/services/lms/urls'; + +import messages from './messages'; + +const getLearnerHeaderMenu = (formatMessage, courseSearchUrl, authenticatedUser, dashboard) => ({ + mainMenu: [ + { + type: 'item', + href: '/', + content: formatMessage(messages.course), + isActive: true, + }, + { + type: 'item', + href: `${urls.programsUrl()}`, + content: formatMessage(messages.program), + }, + { + type: 'item', + href: `${urls.baseAppUrl(courseSearchUrl)}`, + content: formatMessage(messages.discoverNew), + }, + ], + secondaryMenu: [ + { + type: 'item', + href: `${getConfig().SUPPORT_URL}`, + content: formatMessage(messages.help), + }, + ], + userMenu: [ + ...(getConfig().ENABLE_EDX_PERSONAL_DASHBOARD ? [ + { + heading: formatMessage(messages.dashboardSwitch), + items: [ + { + type: 'item', + href: '/edx-dashboard', + content: formatMessage(messages.dashboardPersonal), + isActive: true, + }, + ...(!_.isEmpty(dashboard) ? [{ + type: 'item', + href: `${dashboard.url}`, + content: `${dashboard.label} ${formatMessage(messages.dashboard)}`, + }] : []), + ], + }, + ] : []), + { + heading: '', + items: [ + ...(!dashboard && getConfig().CAREER_LINK_URL ? [{ + type: 'item', + href: `${getConfig().CAREER_LINK_URL}`, + content: + <> + {formatMessage(messages.career)} + + {formatMessage(messages.newAlert)} + + , + onClick: () => { + sendTrackEvent( + 'edx.bi.user.menu.career.clicked', + { category: 'header', label: 'header' }, + ); + }, + }] : []), + { + type: 'item', + href: `${getConfig().ACCOUNT_PROFILE_URL}/u/${authenticatedUser?.username}`, + content: formatMessage(messages.profile), + }, + { + type: 'item', + href: `${getConfig().ACCOUNT_SETTINGS_URL}`, + content: formatMessage(messages.account), + }, + ...(getConfig().ORDER_HISTORY_URL ? [{ + type: 'item', + href: getConfig().ORDER_HISTORY_URL, + content: formatMessage(messages.orderHistory), + }] : []), + ], + }, + { + heading: '', + items: [ + { + type: 'item', + href: `${getConfig().LOGOUT_URL}`, + content: formatMessage(messages.signOut), + }, + ], + }, + ], +}); + +export default getLearnerHeaderMenu; diff --git a/src/containers/LearnerDashboardHeader/__snapshots__/index.test.jsx.snap b/src/containers/LearnerDashboardHeader/__snapshots__/index.test.jsx.snap index 87ec64c7..a3e53df4 100644 --- a/src/containers/LearnerDashboardHeader/__snapshots__/index.test.jsx.snap +++ b/src/containers/LearnerDashboardHeader/__snapshots__/index.test.jsx.snap @@ -3,8 +3,66 @@ exports[`LearnerDashboardHeader render 1`] = ` - - + `; diff --git a/src/containers/LearnerDashboardHeader/hooks.js b/src/containers/LearnerDashboardHeader/hooks.js index 7eee8437..4fcbfbe0 100644 --- a/src/containers/LearnerDashboardHeader/hooks.js +++ b/src/containers/LearnerDashboardHeader/hooks.js @@ -1,9 +1,12 @@ import React from 'react'; import { useWindowSize, breakpoints } from '@openedx/paragon'; +import { useIntl } from '@edx/frontend-platform/i18n'; import track from 'tracking'; import { StrictDict } from 'utils'; import { linkNames } from 'tracking/constants'; +import getLearnerHeaderMenu from './LearnerDashboardMenu'; + import * as module from './hooks'; export const state = StrictDict({ @@ -24,6 +27,13 @@ export const findCoursesNavDropdownClicked = (href) => track.findCourses.findCou linkName: linkNames.learnerHomeNavDropdownExplore, }); +export const useLearnerDashboardHeaderMenu = ({ + courseSearchUrl, authenticatedUser, dashboard, +}) => { + const { formatMessage } = useIntl(); + return getLearnerHeaderMenu(formatMessage, courseSearchUrl, authenticatedUser, dashboard); +}; + export const useLearnerDashboardHeaderData = () => { const [isOpen, setIsOpen] = module.state.isOpen(false); const toggleIsOpen = () => setIsOpen(!isOpen); @@ -39,4 +49,5 @@ export default { findCoursesNavClicked, findCoursesNavDropdownClicked, useLearnerDashboardHeaderData, + useLearnerDashboardHeaderMenu, }; diff --git a/src/containers/LearnerDashboardHeader/hooks.test.js b/src/containers/LearnerDashboardHeader/hooks.test.js index 72349f6e..71a96c7f 100644 --- a/src/containers/LearnerDashboardHeader/hooks.test.js +++ b/src/containers/LearnerDashboardHeader/hooks.test.js @@ -13,6 +13,7 @@ const { findCoursesNavClicked, findCoursesNavDropdownClicked, useLearnerDashboardHeaderData, + useLearnerDashboardHeaderMenu, } = hooks; jest.mock('tracking', () => ({ @@ -48,6 +49,20 @@ describe('LearnerDashboardHeader hooks', () => { }); }); + describe('getLearnerDashboardHeaderMenu', () => { + test('calls header menu data hook', () => { + const courseSearchUrl = '/courses'; + const authenticatedUser = { + username: 'test', + }; + const dashboard = { + label: 'Test', + }; + const learnerHomeHeaderMenu = useLearnerDashboardHeaderMenu({ courseSearchUrl, authenticatedUser, dashboard }); + expect(learnerHomeHeaderMenu.mainMenu.length).toBe(3); + }); + }); + describe('findCoursesNavDropdownClicked', () => { test('calls tracking with dropdown link name', () => { findCoursesNavDropdownClicked(url); diff --git a/src/containers/LearnerDashboardHeader/index.jsx b/src/containers/LearnerDashboardHeader/index.jsx index dfa8dbfb..83de2847 100644 --- a/src/containers/LearnerDashboardHeader/index.jsx +++ b/src/containers/LearnerDashboardHeader/index.jsx @@ -1,21 +1,35 @@ import React from 'react'; import MasqueradeBar from 'containers/MasqueradeBar'; +import { AppContext } from '@edx/frontend-platform/react'; +import Header from '@edx/frontend-component-header'; +import { reduxHooks } from 'hooks'; + import ConfirmEmailBanner from './ConfirmEmailBanner'; -import CollapsedHeader from './CollapsedHeader'; -import ExpandedHeader from './ExpandedHeader'; +import { useLearnerDashboardHeaderMenu } from './hooks'; import './index.scss'; -export const LearnerDashboardHeader = () => ( - <> - - - - - -); +export const LearnerDashboardHeader = () => { + const { authenticatedUser } = React.useContext(AppContext); + const { courseSearchUrl } = reduxHooks.usePlatformSettingsData(); + const dashboard = reduxHooks.useEnterpriseDashboardData(); + + const learnerHomeHeaderMenu = useLearnerDashboardHeaderMenu({ courseSearchUrl, authenticatedUser, dashboard }); + + return ( + <> + +
+ + + ); +}; LearnerDashboardHeader.propTypes = {}; diff --git a/src/containers/LearnerDashboardHeader/index.test.jsx b/src/containers/LearnerDashboardHeader/index.test.jsx index a7335565..298fa43a 100644 --- a/src/containers/LearnerDashboardHeader/index.test.jsx +++ b/src/containers/LearnerDashboardHeader/index.test.jsx @@ -2,9 +2,7 @@ import { shallow } from '@edx/react-unit-test-utils'; import LearnerDashboardHeader from '.'; jest.mock('containers/MasqueradeBar', () => 'MasqueradeBar'); -jest.mock('./CollapsedHeader', () => 'CollapsedHeader'); jest.mock('./ConfirmEmailBanner', () => 'ConfirmEmailBanner'); -jest.mock('./ExpandedHeader', () => 'ExpandedHeader'); describe('LearnerDashboardHeader', () => { test('render', () => { @@ -12,7 +10,5 @@ describe('LearnerDashboardHeader', () => { expect(wrapper.snapshot).toMatchSnapshot(); expect(wrapper.instance.findByType('ConfirmEmailBanner')).toHaveLength(1); expect(wrapper.instance.findByType('MasqueradeBar')).toHaveLength(1); - expect(wrapper.instance.findByType('CollapsedHeader')).toHaveLength(1); - expect(wrapper.instance.findByType('ExpandedHeader')).toHaveLength(1); }); });