diff --git a/package-lock.json b/package-lock.json index f6cdde231..97ed94497 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,8 +10,8 @@ "license": "AGPL-3.0", "dependencies": { "@edx/brand": "npm:@edx/brand-openedx@1.2.0", - "@edx/frontend-component-footer": "12.2.1", - "@edx/frontend-component-header": "4.6.1", + "@edx/frontend-component-footer": "12.3.0", + "@edx/frontend-component-header": "4.7.1", "@edx/frontend-platform": "5.4.0", "@edx/paragon": "^20.44.0", "@fortawesome/fontawesome-svg-core": "1.2.36", @@ -30,6 +30,7 @@ "prop-types": "15.8.1", "react": "17.0.2", "react-dom": "17.0.2", + "react-error-boundary": "^4.0.11", "react-helmet": "6.1.0", "react-redux": "7.2.9", "react-router": "6.16.0", @@ -53,7 +54,7 @@ "@wojtekmaj/enzyme-adapter-react-17": "0.8.0", "codecov": "3.8.3", "enzyme": "3.11.0", - "glob": "10.3.7", + "glob": "10.3.10", "react-test-renderer": "17.0.2", "reactifex": "1.1.1", "redux-mock-store": "1.5.4" @@ -2514,15 +2515,17 @@ } }, "node_modules/@edx/frontend-component-footer": { - "version": "12.2.1", - "resolved": "https://registry.npmjs.org/@edx/frontend-component-footer/-/frontend-component-footer-12.2.1.tgz", - "integrity": "sha512-0ZeuFsnToS7h7qI4yXo6FKVz+c4vDyqP2nhPMR3xm3xgPOmHvf8KNL6ES/YGb+ptPYb64ZxT2iNBP6DY0wF3uQ==", + "version": "12.3.0", + "resolved": "https://registry.npmjs.org/@edx/frontend-component-footer/-/frontend-component-footer-12.3.0.tgz", + "integrity": "sha512-ivCtioyP4SceYM4/ugVtif4c41Y+epA0NM7sSB/x6s9A/RTQXb2TY3fDc9lB3ah/0+pRwGVJJEVYkPAZ4JdC/g==", "dependencies": { + "@edx/paragon": "^21.3.1", "@fortawesome/fontawesome-svg-core": "6.4.2", "@fortawesome/free-brands-svg-icons": "6.4.2", "@fortawesome/free-regular-svg-icons": "6.4.2", "@fortawesome/free-solid-svg-icons": "6.4.2", - "@fortawesome/react-fontawesome": "0.2.0" + "@fortawesome/react-fontawesome": "0.2.0", + "lodash": "^4.17.21" }, "peerDependencies": { "@edx/frontend-platform": "^4.0.0 || ^5.0.0", @@ -2531,6 +2534,61 @@ "react-dom": "^16.9.0 || ^17.0.0" } }, + "node_modules/@edx/frontend-component-footer/node_modules/@edx/paragon": { + "version": "21.3.1", + "resolved": "https://registry.npmjs.org/@edx/paragon/-/paragon-21.3.1.tgz", + "integrity": "sha512-bXTUaOEmT8XLnDQzYS8QLMvWK5K2BN4jHlx25lO8N0XWRQeDiQTdbx8OrEbv8QOPTlrv0an5MZc+qjlleJFObg==", + "dependencies": { + "@fortawesome/fontawesome-svg-core": "^6.1.1", + "@fortawesome/react-fontawesome": "^0.1.18", + "@popperjs/core": "^2.11.4", + "bootstrap": "^4.6.2", + "chalk": "^4.1.2", + "child_process": "^1.0.2", + "classnames": "^2.3.1", + "email-prop-type": "^3.0.0", + "file-selector": "^0.6.0", + "font-awesome": "^4.7.0", + "glob": "^8.0.3", + "inquirer": "^8.2.5", + "lodash.uniqby": "^4.7.0", + "mailto-link": "^2.0.0", + "prop-types": "^15.8.1", + "react-bootstrap": "^1.6.5", + "react-colorful": "^5.6.1", + "react-dropzone": "^14.2.1", + "react-focus-on": "^3.5.4", + "react-loading-skeleton": "^3.1.0", + "react-popper": "^2.2.5", + "react-proptype-conditional-require": "^1.0.4", + "react-responsive": "^8.2.0", + "react-table": "^7.7.0", + "react-transition-group": "^4.4.2", + "tabbable": "^5.3.3", + "uncontrollable": "^7.2.1", + "uuid": "^9.0.0" + }, + "bin": { + "paragon": "bin/paragon-scripts.js" + }, + "peerDependencies": { + "react": "^16.8.6 || ^17.0.0", + "react-dom": "^16.8.6 || ^17.0.0", + "react-intl": "^5.25.1 || ^6.4.0" + } + }, + "node_modules/@edx/frontend-component-footer/node_modules/@edx/paragon/node_modules/@fortawesome/react-fontawesome": { + "version": "0.1.19", + "resolved": "https://registry.npmjs.org/@fortawesome/react-fontawesome/-/react-fontawesome-0.1.19.tgz", + "integrity": "sha512-Hyb+lB8T18cvLNX0S3llz7PcSOAJMLwiVKBuuzwM/nI5uoBw+gQjnf9il0fR1C3DKOI5Kc79pkJ4/xB0Uw9aFQ==", + "dependencies": { + "prop-types": "^15.8.1" + }, + "peerDependencies": { + "@fortawesome/fontawesome-svg-core": "~1 || ~6", + "react": ">=16.x" + } + }, "node_modules/@edx/frontend-component-footer/node_modules/@fortawesome/fontawesome-common-types": { "version": "6.4.2", "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.4.2.tgz", @@ -2588,12 +2646,49 @@ "node": ">=6" } }, + "node_modules/@edx/frontend-component-footer/node_modules/brace-expansion": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz", + "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==", + "dependencies": { + "balanced-match": "^1.0.0" + } + }, + "node_modules/@edx/frontend-component-footer/node_modules/glob": { + "version": "8.1.0", + "resolved": "https://registry.npmjs.org/glob/-/glob-8.1.0.tgz", + "integrity": "sha512-r8hpEjiQEYlF2QU0df3dS+nxxSIreXQS1qRhMJM0Q5NDdR386C7jb7Hwwod8Fgiuex+k0GFjgft18yvxm5XoCQ==", + "dependencies": { + "fs.realpath": "^1.0.0", + "inflight": "^1.0.4", + "inherits": "2", + "minimatch": "^5.0.1", + "once": "^1.3.0" + }, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, + "node_modules/@edx/frontend-component-footer/node_modules/minimatch": { + "version": "5.1.6", + "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-5.1.6.tgz", + "integrity": "sha512-lKwV/1brpG6mBUFHtb7NUmtABCb2WZZmm2wNiOA5hAb8VdCS4B3dtMWyvcoViccwAW/COERjXLt0zP1zXUN26g==", + "dependencies": { + "brace-expansion": "^2.0.1" + }, + "engines": { + "node": ">=10" + } + }, "node_modules/@edx/frontend-component-header": { - "version": "4.6.1", - "resolved": "https://registry.npmjs.org/@edx/frontend-component-header/-/frontend-component-header-4.6.1.tgz", - "integrity": "sha512-DE19gbiV+fjeLiTAVaf+qDqsRrDpGXuwho1xne7qutdrrcDaX9DKJBV/iNRhr/PS4kpzQu4jPtr6Fdr3gWzu6g==", + "version": "4.7.1", + "resolved": "https://registry.npmjs.org/@edx/frontend-component-header/-/frontend-component-header-4.7.1.tgz", + "integrity": "sha512-Fs4KXXgLBLjI6fH+AxpCyS2ItoGAtbWQ6J1GqK9MeoUsEFHBzL4//fBTbU2HwCJSpn7W8p63CYtk2EOy3eY1Og==", "dependencies": { - "@edx/paragon": "21.1.10", + "@edx/paragon": "21.3.1", "@fortawesome/fontawesome-svg-core": "6.4.2", "@fortawesome/free-brands-svg-icons": "6.4.2", "@fortawesome/free-regular-svg-icons": "6.4.2", @@ -2612,9 +2707,9 @@ } }, "node_modules/@edx/frontend-component-header/node_modules/@edx/paragon": { - "version": "21.1.10", - "resolved": "https://registry.npmjs.org/@edx/paragon/-/paragon-21.1.10.tgz", - "integrity": "sha512-5U8tUaL20gDiKfEDr/tuRXrl7fJsN+KgAIn5bWkTtS5Us7r+H+m3LkD58HY7Ntwj8bCrSEtW7YuK3PMabXcMRA==", + "version": "21.3.1", + "resolved": "https://registry.npmjs.org/@edx/paragon/-/paragon-21.3.1.tgz", + "integrity": "sha512-bXTUaOEmT8XLnDQzYS8QLMvWK5K2BN4jHlx25lO8N0XWRQeDiQTdbx8OrEbv8QOPTlrv0an5MZc+qjlleJFObg==", "dependencies": { "@fortawesome/fontawesome-svg-core": "^6.1.1", "@fortawesome/react-fontawesome": "^0.1.18", @@ -2887,21 +2982,21 @@ } }, "node_modules/@edx/paragon/node_modules/@fortawesome/fontawesome-common-types": { - "version": "6.4.0", - "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.4.0.tgz", - "integrity": "sha512-HNii132xfomg5QVZw0HwXXpN22s7VBHQBv9CeOu9tfJnhsWQNd2lmTNi8CSrnw5B+5YOmzu1UoPAyxaXsJ6RgQ==", + "version": "6.4.2", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.4.2.tgz", + "integrity": "sha512-1DgP7f+XQIJbLFCTX1V2QnxVmpLdKdzzo2k8EmvDOePfchaIGQ9eCHj2up3/jNEbZuBqel5OxiaOJf37TWauRA==", "hasInstallScript": true, "engines": { "node": ">=6" } }, "node_modules/@edx/paragon/node_modules/@fortawesome/fontawesome-svg-core": { - "version": "6.4.0", - "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.4.0.tgz", - "integrity": "sha512-Bertv8xOiVELz5raB2FlXDPKt+m94MQ3JgDfsVbrqNpLU9+UE2E18GKjLKw+d3XbeYPqg1pzyQKGsrzbw+pPaw==", + "version": "6.4.2", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.4.2.tgz", + "integrity": "sha512-gjYDSKv3TrM2sLTOKBc5rH9ckje8Wrwgx1CxAPbN5N3Fm4prfi7NsJVWd1jklp7i5uSCVwhZS5qlhMXqLrpAIg==", "hasInstallScript": true, "dependencies": { - "@fortawesome/fontawesome-common-types": "6.4.0" + "@fortawesome/fontawesome-common-types": "6.4.2" }, "engines": { "node": ">=6" @@ -4912,11 +5007,11 @@ } }, "node_modules/@restart/hooks": { - "version": "0.4.9", - "resolved": "https://registry.npmjs.org/@restart/hooks/-/hooks-0.4.9.tgz", - "integrity": "sha512-3BekqcwB6Umeya+16XPooARn4qEPW6vNvwYnlofIYe6h9qG1/VeD7UvShCWx11eFz5ELYmwIEshz+MkPX3wjcQ==", + "version": "0.4.11", + "resolved": "https://registry.npmjs.org/@restart/hooks/-/hooks-0.4.11.tgz", + "integrity": "sha512-Ft/ncTULZN6ldGHiF/k5qt72O8JyRMOeg0tApvCni8LkoiEahO+z3TNxfXIVGy890YtWVDvJAl662dVJSJXvMw==", "dependencies": { - "dequal": "^2.0.2" + "dequal": "^2.0.3" }, "peerDependencies": { "react": ">=16.8.0" @@ -5550,9 +5645,9 @@ } }, "node_modules/@types/react-transition-group": { - "version": "4.4.6", - "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.6.tgz", - "integrity": "sha512-VnCdSxfcm08KjsJVQcfBmhEQAPnLB8G08hAxn39azX1qYBQ/5RVQuoHuKIcfKOdncuaUvEpFKFzEvbtIMsfVew==", + "version": "4.4.7", + "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.7.tgz", + "integrity": "sha512-ICCyBl5mvyqYp8Qeq9B5G/fyBSRC0zx3XM3sCC6KkcMsNeAHqXBKkmat4GqdJET5jtYUpZXrxI5flve5qhi2Eg==", "dependencies": { "@types/react": "*" } @@ -5616,9 +5711,9 @@ "integrity": "sha512-Hl219/BT5fLAaz6NDkSuhzasy49dwQS/DSdu4MdggFB8zcXv7vflBI3xp7FEmkmdDkBUI2bPUNeMttp2knYdxw==" }, "node_modules/@types/warning": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/@types/warning/-/warning-3.0.0.tgz", - "integrity": "sha512-t/Tvs5qR47OLOr+4E9ckN8AmP2Tf16gWq+/qA4iUGS/OOyHVO8wv2vjJuX8SNOUTJyWb+2t7wJm6cXILFnOROA==" + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/@types/warning/-/warning-3.0.1.tgz", + "integrity": "sha512-ywJmriP+nvjBKNBEMaNZgj2irZHoxcKeYcyMLbqhYKbDVn8yCIULy2Ol/tvIb37O3IBeZj3RU4tXqQTtGwoAMg==" }, "node_modules/@types/ws": { "version": "8.5.5", @@ -7185,9 +7280,9 @@ } }, "node_modules/caniuse-lite": { - "version": "1.0.30001538", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001538.tgz", - "integrity": "sha512-HWJnhnID+0YMtGlzcp3T9drmBJUVDchPJ08tpUGFLs9CYlwWPH2uLgpHn8fND5pCgXVtnGS3H4QR9XLMHVNkHw==", + "version": "1.0.30001546", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001546.tgz", + "integrity": "sha512-zvtSJwuQFpewSyRrI3AsftF6rM0X80mZkChIt1spBGEvRglCrjTniXvinc8JKRoqTwXAgvqTImaN9igfSMtUBw==", "funding": [ { "type": "opencollective", @@ -10198,6 +10293,14 @@ "node": ">=8" } }, + "node_modules/filter-obj": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/filter-obj/-/filter-obj-1.1.0.tgz", + "integrity": "sha512-8rXg1ZnX7xzy2NGDVkBVaAy+lSlPNwad13BtgSlLuxfIslyt5Vg64U7tFcCt4WS1R0hvtnQybT/IyCkGZ3DpXQ==", + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/finalhandler": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.2.0.tgz", @@ -10867,13 +10970,13 @@ "integrity": "sha512-SyHy3T1v2NUXn29OsWdxmK6RwHD+vkj3v8en8AOBZ1wBQ/hCAQ5bAQTD02kW4W9tUp/3Qh6J8r9EvntiyCmOOw==" }, "node_modules/glob": { - "version": "10.3.7", - "resolved": "https://registry.npmjs.org/glob/-/glob-10.3.7.tgz", - "integrity": "sha512-wCMbE1m9Nx5yD9LYtgsVWq5VhHlk5WzJirw594qZR6AIvQYuHrdDtIktUVjQItalD53y7dqoedu9xP0u0WaxIQ==", + "version": "10.3.10", + "resolved": "https://registry.npmjs.org/glob/-/glob-10.3.10.tgz", + "integrity": "sha512-fa46+tv1Ak0UPK1TOy/pZrIybNNt4HCv7SDzwyfiOZkvZLEbjsZkJBPtDHVshZjbecAoAGSC20MjLDG/qr679g==", "dev": true, "dependencies": { "foreground-child": "^3.1.0", - "jackspeak": "^2.0.3", + "jackspeak": "^2.3.5", "minimatch": "^9.0.1", "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0", "path-scurry": "^1.10.1" @@ -12593,9 +12696,9 @@ "integrity": "sha512-QZ9qOMdF+QLHxy1QIpUHUU1D5pS2CG2P69LF6L6CPjPYA/XMOmKV3PZpawHoAjHNyB0swdVTRxdYT4tbBbxqwg==" }, "node_modules/jackspeak": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-2.2.1.tgz", - "integrity": "sha512-MXbxovZ/Pm42f6cDIDkl3xpwv1AGwObKwfmjs2nQePiy85tP3fatofl3FC1aBsOtP/6fq5SbtgHwWcMsLP+bDw==", + "version": "2.3.6", + "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-2.3.6.tgz", + "integrity": "sha512-N3yCS/NegsOBokc8GAdM8UcmfsKiSS8cipheD/nivzr700H+nsMOxJjQnvwOcRYVuFkdH0wGUvW2WbXGmrZGbQ==", "dev": true, "dependencies": { "@isaacs/cliui": "^8.0.2" @@ -14469,9 +14572,9 @@ } }, "node_modules/jquery": { - "version": "3.7.0", - "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.7.0.tgz", - "integrity": "sha512-umpJ0/k8X0MvD1ds0P9SfowREz2LenHsQaxSohMZ5OMNEU2r0tf8pdeEFTHMFxWVxKNyU9rTtK3CWzUCTKJUeQ==", + "version": "3.7.1", + "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.7.1.tgz", + "integrity": "sha512-m4avr8yL8kmFN8psrbFFFmB/If14iN5o9nw/NgnnM+kybDJpRsAynV2BsfpTYrTRysYUdADVD7CkUUizgkpLfg==", "peer": true }, "node_modules/js-base64": { @@ -14990,39 +15093,6 @@ "node": ">= 12" } }, - "node_modules/mailto-link/node_modules/filter-obj": { - "version": "1.1.0", - "resolved": "https://registry.npmjs.org/filter-obj/-/filter-obj-1.1.0.tgz", - "integrity": "sha512-8rXg1ZnX7xzy2NGDVkBVaAy+lSlPNwad13BtgSlLuxfIslyt5Vg64U7tFcCt4WS1R0hvtnQybT/IyCkGZ3DpXQ==", - "engines": { - "node": ">=0.10.0" - } - }, - "node_modules/mailto-link/node_modules/query-string": { - "version": "7.0.1", - "resolved": "https://registry.npmjs.org/query-string/-/query-string-7.0.1.tgz", - "integrity": "sha512-uIw3iRvHnk9to1blJCG3BTc+Ro56CBowJXKmNNAm3RulvPBzWLRqKSiiDk+IplJhsydwtuNMHi8UGQFcCLVfkA==", - "dependencies": { - "decode-uri-component": "^0.2.0", - "filter-obj": "^1.1.0", - "split-on-first": "^1.0.0", - "strict-uri-encode": "^2.0.0" - }, - "engines": { - "node": ">=6" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, - "node_modules/mailto-link/node_modules/split-on-first": { - "version": "1.1.0", - "resolved": "https://registry.npmjs.org/split-on-first/-/split-on-first-1.1.0.tgz", - "integrity": "sha512-43ZssAJaMusuKWL8sKUBQXHWOpq8d6CfN/u1p4gUzfJkM05C8rxTmYrkIPTXapZpORA6LkkzcUulJ8FqA7Uudw==", - "engines": { - "node": ">=6" - } - }, "node_modules/make-dir": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-2.1.0.tgz", @@ -15697,9 +15767,9 @@ } }, "node_modules/object-code": { - "version": "1.2.4", - "resolved": "https://registry.npmjs.org/object-code/-/object-code-1.2.4.tgz", - "integrity": "sha512-uGq4ETUuWe+GA586NXEriiaozNuff+YNFXlpD8cVrM1GoiuTZpCABP+bZCWDrvQDoCiSTyiWAFHD/HF/iwhb2w==" + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/object-code/-/object-code-1.3.0.tgz", + "integrity": "sha512-PLplgvzuFhSPBuTX/mtaXEnU3c6g7qKflVVQbV9VWEnV/34iKeAX1jeDNCKq1OgGlsnkA/NjldCzTbHxa7Wj4A==" }, "node_modules/object-copy": { "version": "0.1.0", @@ -17414,6 +17484,23 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/query-string": { + "version": "7.0.1", + "resolved": "https://registry.npmjs.org/query-string/-/query-string-7.0.1.tgz", + "integrity": "sha512-uIw3iRvHnk9to1blJCG3BTc+Ro56CBowJXKmNNAm3RulvPBzWLRqKSiiDk+IplJhsydwtuNMHi8UGQFcCLVfkA==", + "dependencies": { + "decode-uri-component": "^0.2.0", + "filter-obj": "^1.1.0", + "split-on-first": "^1.0.0", + "strict-uri-encode": "^2.0.0" + }, + "engines": { + "node": ">=6" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/querystringify": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.2.0.tgz", @@ -17731,6 +17818,17 @@ "react": ">= 16.8 || 18.0.0" } }, + "node_modules/react-error-boundary": { + "version": "4.0.11", + "resolved": "https://registry.npmjs.org/react-error-boundary/-/react-error-boundary-4.0.11.tgz", + "integrity": "sha512-U13ul67aP5DOSPNSCWQ/eO0AQEYzEFkVljULQIjMV0KlffTAhxuDoBKdO0pb/JZ8mDhMKFZ9NZi0BmLGUiNphw==", + "dependencies": { + "@babel/runtime": "^7.12.5" + }, + "peerDependencies": { + "react": ">=16.13.1" + } + }, "node_modules/react-error-overlay": { "version": "6.0.11", "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.11.tgz", @@ -17742,9 +17840,9 @@ "integrity": "sha512-nsO+KSNgo1SbJqJEYRE9ERzo7YtYbou/OqjSQKxV7jcKox7+usiUVZOAC+XnDOABXggQTno0Y1CpVnuWEc1boQ==" }, "node_modules/react-focus-lock": { - "version": "2.9.4", - "resolved": "https://registry.npmjs.org/react-focus-lock/-/react-focus-lock-2.9.4.tgz", - "integrity": "sha512-7pEdXyMseqm3kVjhdVH18sovparAzLg5h6WvIx7/Ck3ekjhrrDMEegHSa3swwC8wgfdd7DIdUVRGeiHT9/7Sgg==", + "version": "2.9.5", + "resolved": "https://registry.npmjs.org/react-focus-lock/-/react-focus-lock-2.9.5.tgz", + "integrity": "sha512-h6vrdgUbsH2HeD5I7I3Cx1PPrmwGuKYICS+kB9m+32X/9xHRrAbxgvaBpG7BFBN9h3tO+C3qX1QAVESmi4CiIA==", "dependencies": { "@babel/runtime": "^7.0.0", "focus-lock": "^0.11.6", @@ -17764,12 +17862,12 @@ } }, "node_modules/react-focus-on": { - "version": "3.8.1", - "resolved": "https://registry.npmjs.org/react-focus-on/-/react-focus-on-3.8.1.tgz", - "integrity": "sha512-fQcBx+SZMgXoRL+69r5+ic4bdVgqaCeKeoFPra8yhcSuL/3unWavfdirEFBGgH71K+RiocMTS6DETHcX0SlOZg==", + "version": "3.9.1", + "resolved": "https://registry.npmjs.org/react-focus-on/-/react-focus-on-3.9.1.tgz", + "integrity": "sha512-IYo2j4mgNpZEJNv+/XzZs3S3xhJbR+AFop092h4OMW7sbFpIMVWxp/Z61V/gfpsgOi7VnoSFXP2bfOWWkjjtOw==", "dependencies": { "aria-hidden": "^1.2.2", - "react-focus-lock": "^2.9.2", + "react-focus-lock": "^2.9.4", "react-remove-scroll": "^2.5.6", "react-style-singleton": "^2.2.0", "tslib": "^2.3.1", @@ -20022,6 +20120,14 @@ "wbuf": "^1.7.3" } }, + "node_modules/split-on-first": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/split-on-first/-/split-on-first-1.1.0.tgz", + "integrity": "sha512-43ZssAJaMusuKWL8sKUBQXHWOpq8d6CfN/u1p4gUzfJkM05C8rxTmYrkIPTXapZpORA6LkkzcUulJ8FqA7Uudw==", + "engines": { + "node": ">=6" + } + }, "node_modules/split-string": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/split-string/-/split-string-3.1.0.tgz", @@ -21469,9 +21575,13 @@ } }, "node_modules/uuid": { - "version": "9.0.0", - "resolved": "https://registry.npmjs.org/uuid/-/uuid-9.0.0.tgz", - "integrity": "sha512-MXcSTerfPa4uqyzStbRoTgt5XIe3x5+42+q1sDuy3R5MDk66URdLMOZe5aPX/SQd+kuYAh0FdP/pO28IkQyTeg==", + "version": "9.0.1", + "resolved": "https://registry.npmjs.org/uuid/-/uuid-9.0.1.tgz", + "integrity": "sha512-b+1eJOlsR9K8HJpow9Ok3fiWOWSIcIzXodvv0rQjVoOVNpWMpxf1wZNpt4y9h10odCNrqnYp1OBzRktckBe3sA==", + "funding": [ + "https://github.com/sponsors/broofa", + "https://github.com/sponsors/ctavan" + ], "bin": { "uuid": "dist/bin/uuid" } diff --git a/package.json b/package.json index b96b0d2fb..ee7e04394 100644 --- a/package.json +++ b/package.json @@ -29,8 +29,8 @@ ], "dependencies": { "@edx/brand": "npm:@edx/brand-openedx@1.2.0", - "@edx/frontend-component-footer": "12.2.1", - "@edx/frontend-component-header": "4.6.1", + "@edx/frontend-component-footer": "12.3.0", + "@edx/frontend-component-header": "4.7.1", "@edx/frontend-platform": "5.4.0", "@edx/paragon": "^20.44.0", "@fortawesome/fontawesome-svg-core": "1.2.36", @@ -49,6 +49,7 @@ "prop-types": "15.8.1", "react": "17.0.2", "react-dom": "17.0.2", + "react-error-boundary": "^4.0.11", "react-helmet": "6.1.0", "react-redux": "7.2.9", "react-router": "6.16.0", @@ -72,7 +73,7 @@ "@wojtekmaj/enzyme-adapter-react-17": "0.8.0", "codecov": "3.8.3", "enzyme": "3.11.0", - "glob": "10.3.7", + "glob": "10.3.10", "react-test-renderer": "17.0.2", "reactifex": "1.1.1", "redux-mock-store": "1.5.4" diff --git a/plugins/Plugin.jsx b/plugins/Plugin.jsx new file mode 100644 index 000000000..624ed46f3 --- /dev/null +++ b/plugins/Plugin.jsx @@ -0,0 +1,92 @@ +'use client'; + +import React, { + useEffect, useMemo, useState, +} from 'react'; +import PropTypes from 'prop-types'; +import { ErrorBoundary } from 'react-error-boundary'; +import { logError } from '@edx/frontend-platform/logging'; +import { + dispatchMountedEvent, dispatchReadyEvent, dispatchUnmountedEvent, useHostEvent, +} from './data/hooks'; +import { PLUGIN_RESIZE } from './data/constants'; + +// see example-plugin-app/src/PluginOne.jsx for example of customizing errorFallback +function errorFallbackDefault() { + return ( +
+

+ Oops! An error occurred. Please refresh the screen to try again. +

+
+ ); +} + +export default function Plugin({ + children, className, style, ready, errorFallbackProp, +}) { + const [dimensions, setDimensions] = useState({ + width: null, + height: null, + }); + + const finalStyle = useMemo(() => ({ + ...dimensions, + ...style, + }), [dimensions, style]); + + const errorFallback = errorFallbackProp || errorFallbackDefault; + + // Error logging function + // Need to confirm: When an error is caught here, the logging will be sent to the child MFE's logging service + const logErrorToService = (error, info) => { + logError(error, { stack: info.componentStack }); + }; + + useHostEvent(PLUGIN_RESIZE, ({ payload }) => { + setDimensions({ + width: payload.width, + height: payload.height, + }); + }); + + useEffect(() => { + dispatchMountedEvent(); + + return () => { + dispatchUnmountedEvent(); + }; + }, []); + + useEffect(() => { + if (ready) { + dispatchReadyEvent(); + } + }, [ready]); + + return ( +
+ + {children} + +
+ ); +} + +Plugin.propTypes = { + children: PropTypes.node.isRequired, + className: PropTypes.string, + errorFallbackProp: PropTypes.func, + ready: PropTypes.bool, + style: PropTypes.object, // eslint-disable-line +}; + +Plugin.defaultProps = { + className: null, + errorFallbackProp: null, + style: {}, + ready: true, +}; diff --git a/plugins/PluginContainer.jsx b/plugins/PluginContainer.jsx new file mode 100644 index 000000000..4d889d7ec --- /dev/null +++ b/plugins/PluginContainer.jsx @@ -0,0 +1,41 @@ +'use client'; + +import React from 'react'; + +// eslint-disable-next-line import/no-extraneous-dependencies +import PluginContainerIframe from './PluginContainerIframe'; + +import { + IFRAME_PLUGIN, +} from './data/constants'; +import { pluginConfigShape } from './data/shapes'; + +export default function PluginContainer({ config, ...props }) { + if (config === null) { + return null; + } + + // this will allow for future plugin types to be inserted in the PluginErrorBoundary + let renderer = null; + switch (config.type) { + case IFRAME_PLUGIN: + renderer = ( + + ); + break; + // istanbul ignore next: default isn't meaningful, just satisfying linter + default: + } + + return ( + renderer + ); +} + +PluginContainer.propTypes = { + config: pluginConfigShape, +}; + +PluginContainer.defaultProps = { + config: null, +}; diff --git a/plugins/PluginContainerIframe.jsx b/plugins/PluginContainerIframe.jsx new file mode 100644 index 000000000..6ebfcadec --- /dev/null +++ b/plugins/PluginContainerIframe.jsx @@ -0,0 +1,98 @@ +import React, { + useEffect, useState, +} from 'react'; +import PropTypes from 'prop-types'; +import classNames from 'classnames'; + +import { + PLUGIN_MOUNTED, + PLUGIN_READY, + PLUGIN_RESIZE, +} from './data/constants'; +import { + dispatchPluginEvent, + useElementSize, + usePluginEvent, +} from './data/hooks'; +import { pluginConfigShape } from './data/shapes'; + +/** + * Feature policy for iframe, allowing access to certain courseware-related media. + * + * We must use the wildcard (*) origin for each feature, as courseware content + * may be embedded in external iframes. Notably, xblock-lti-consumer is a popular + * block that iframes external course content. + + * This policy was selected in conference with the edX Security Working Group. + * Changes to it should be vetted by them (security@edx.org). + */ +export const IFRAME_FEATURE_POLICY = ( + 'fullscreen; microphone *; camera *; midi *; geolocation *; encrypted-media *' +); + +export default function PluginContainerIframe({ + config, fallback, className, ...props +}) { + const { url } = config; + const { title, scrolling } = props; + const [mounted, setMounted] = useState(false); + const [ready, setReady] = useState(false); + + const [iframeRef, iframeElement, width, height] = useElementSize(); + + useEffect(() => { + if (mounted) { + dispatchPluginEvent(iframeElement, { + type: PLUGIN_RESIZE, + payload: { + width, + height, + }, + }, url); + } + }, [iframeElement, mounted, width, height, url]); + + usePluginEvent(iframeElement, PLUGIN_MOUNTED, () => { + setMounted(true); + }); + + usePluginEvent(iframeElement, PLUGIN_READY, () => { + setReady(true); + }); + + return ( + <> +