diff --git a/package-lock.json b/package-lock.json
index c95c8d8f6..2450a7e7b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -7,12 +7,12 @@
"": {
"name": "@edx/frontend-app-learner-dashboard",
"version": "0.0.1",
- "hasInstallScript": true,
"license": "AGPL-3.0",
"dependencies": {
"@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.1",
"@edx/frontend-enterprise-hotjar": "3.0.0",
"@edx/frontend-platform": "7.1.4",
"@edx/openedx-atlas": "^0.6.0",
@@ -2133,18 +2133,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",
@@ -2797,22 +2785,23 @@
}
},
"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==",
+ "version": "5.3.1",
+ "resolved": "https://registry.npmjs.org/@edx/frontend-component-header/-/frontend-component-header-5.3.1.tgz",
+ "integrity": "sha512-hhraVbtmdaXSgaZZJOuEPeQNi5YXJwOfmoCdLsmh6WiTdGG5BusiFoF4SRyKKiTZuayhPFKGFFC8D0AwRxmKhg==",
"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/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",
+ "@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",
@@ -2820,50 +2809,428 @@
}
},
"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==",
+ "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.1",
- "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.5.1.tgz",
- "integrity": "sha512-MfRCYlQPXoLlpem+egxjfkEuP9UQswTrlCOsknus/NcMoblTH2g0jPrapbcIb04KGA7E2GZxbAccGZfWoYgsrQ==",
+ "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.1"
+ "@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.1",
- "resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-6.5.1.tgz",
- "integrity": "sha512-093l7DAkx0aEtBq66Sf19MgoZewv1zeY9/4C7vSKPO4qMwEsW/2VYTUTpBtLwfb9T2R73tXaRDPmE4UqLCYHfg==",
+ "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.1"
+ "@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.1",
- "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.5.1.tgz",
- "integrity": "sha512-S1PPfU3mIJa59biTtXJz1oI0+KAXW6bkAb31XKhxdxtuXDiUIFsih4JR1v5BbxY7hVHsD1RKq+jRkVRaf773NQ==",
+ "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.1"
+ "@fortawesome/fontawesome-common-types": "6.5.2"
},
"engines": {
"node": ">=6"
}
},
+ "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/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": ">=v12.22.7"
+ }
+ },
+ "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==",
+ "dependencies": {
+ "has-flag": "^4.0.0"
+ },
+ "engines": {
+ "node": ">=8"
+ }
+ },
+ "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==",
+ "dependencies": {
+ "punycode": "^2.1.1"
+ },
+ "engines": {
+ "node": ">=12"
+ }
+ },
+ "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==",
+ "dependencies": {
+ "xml-name-validator": "^4.0.0"
+ },
+ "engines": {
+ "node": ">=14"
+ }
+ },
+ "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==",
+ "engines": {
+ "node": ">=12"
+ }
+ },
+ "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==",
+ "dependencies": {
+ "iconv-lite": "0.6.3"
+ },
+ "engines": {
+ "node": ">=12"
+ }
+ },
+ "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==",
+ "engines": {
+ "node": ">=12"
+ }
+ },
+ "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==",
+ "dependencies": {
+ "tr46": "^3.0.0",
+ "webidl-conversions": "^7.0.0"
+ },
+ "engines": {
+ "node": ">=12"
+ }
+ },
+ "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"
+ },
+ "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-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==",
+ "engines": {
+ "node": ">=12"
+ }
+ },
"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 +4120,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 +7530,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 001354029..6d1e5f1a5 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.1",
"@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 eed6b145a..2292f72e7 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 82de5aaf5..000000000
--- 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 2af8ae7e6..000000000
--- 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 c8cc4de83..000000000
--- 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 2a1dc7bc4..000000000
--- 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 5cf9762bc..000000000
--- 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 c21e98ccd..000000000
--- 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 e0751bb38..000000000
--- 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 e7452d355..000000000
--- 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 eafdef3ce..000000000
--- 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 44e08f166..000000000
--- 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 f257cbc57..000000000
--- 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 3b96a1dbf..000000000
--- 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 000000000..64b8d287a
--- /dev/null
+++ b/src/containers/LearnerDashboardHeader/LearnerDashboardMenu.jsx
@@ -0,0 +1,114 @@
+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,
+ exploreCoursesClick,
+) => ({
+ 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),
+ onClick: (e) => {
+ exploreCoursesClick(e);
+ },
+ },
+ ],
+ 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 87ec64c7d..430ef18d5 100644
--- a/src/containers/LearnerDashboardHeader/__snapshots__/index.test.jsx.snap
+++ b/src/containers/LearnerDashboardHeader/__snapshots__/index.test.jsx.snap
@@ -3,8 +3,67 @@
exports[`LearnerDashboardHeader render 1`] = `
-
-
+
`;
diff --git a/src/containers/LearnerDashboardHeader/hooks.js b/src/containers/LearnerDashboardHeader/hooks.js
index 7eee8437d..7455e64aa 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, exploreCoursesClick,
+}) => {
+ const { formatMessage } = useIntl();
+ return getLearnerHeaderMenu(formatMessage, courseSearchUrl, authenticatedUser, dashboard, exploreCoursesClick);
+};
+
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 72349f6e2..71a96c7fa 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 dfa8dbfb0..f462b0e84 100644
--- a/src/containers/LearnerDashboardHeader/index.jsx
+++ b/src/containers/LearnerDashboardHeader/index.jsx
@@ -1,21 +1,45 @@
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 urls from 'data/services/lms/urls';
+
import ConfirmEmailBanner from './ConfirmEmailBanner';
-import CollapsedHeader from './CollapsedHeader';
-import ExpandedHeader from './ExpandedHeader';
+import { useLearnerDashboardHeaderMenu, findCoursesNavClicked } 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 exploreCoursesClick = findCoursesNavClicked(
+ urls.baseAppUrl(courseSearchUrl),
+ );
+
+ const learnerHomeHeaderMenu = useLearnerDashboardHeaderMenu({
+ courseSearchUrl,
+ authenticatedUser,
+ dashboard,
+ exploreCoursesClick,
+ });
+
+ return (
+ <>
+
+
+
+
+ );
+};
LearnerDashboardHeader.propTypes = {};
diff --git a/src/containers/LearnerDashboardHeader/index.test.jsx b/src/containers/LearnerDashboardHeader/index.test.jsx
index a7335565e..298fa43ad 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);
});
});