feat: added browser logging

refactor: added datadog logging
2024-04-18 17:44:37 +05:00 · 2024-04-04 14:58:13 +05:00
131 changed files with 4225 additions and 5967 deletions
--- a/.env
+++ b/.env
@@ -4,6 +4,7 @@
 NODE_ENV='production'

 ACCESS_TOKEN_COOKIE_NAME=''
+AI_TRANSLATIONS_URL=''
 BASE_URL=''
 CONTACT_URL=''
 CREDENTIALS_BASE_URL=''
@@ -13,6 +14,7 @@ DISCOVERY_API_BASE_URL=''
 DISCUSSIONS_MFE_BASE_URL=''
 ECOMMERCE_BASE_URL=''
 ENABLE_JUMPNAV='true'
+ENABLE_NEW_SIDEBAR=''
 ENABLE_NOTICES=''
 ENTERPRISE_LEARNER_PORTAL_HOSTNAME=''
 EXAMS_BASE_URL=''
--- a/.env.development
+++ b/.env.development
@@ -4,6 +4,7 @@
 NODE_ENV='development'

 ACCESS_TOKEN_COOKIE_NAME='edx-jwt-cookie-header-payload'
+AI_TRANSLATIONS_URL='http://localhost:18760'
 BASE_URL='http://localhost:2000'
 CONTACT_URL='http://localhost:18000/contact'
 CREDENTIALS_BASE_URL='http://localhost:18150'
@@ -13,6 +14,7 @@ DISCOVERY_API_BASE_URL='http://localhost:18381'
 DISCUSSIONS_MFE_BASE_URL='http://localhost:2002'
 ECOMMERCE_BASE_URL='http://localhost:18130'
 ENABLE_JUMPNAV='true'
+ENABLE_NEW_SIDEBAR=''
 ENABLE_NOTICES=''
 ENTERPRISE_LEARNER_PORTAL_HOSTNAME='localhost:8734'
 EXAMS_BASE_URL=''
--- a/.env.test
+++ b/.env.test
@@ -4,6 +4,7 @@
 NODE_ENV='test'

 ACCESS_TOKEN_COOKIE_NAME='edx-jwt-cookie-header-payload'
+AI_TRANSLATIONS_URL='http://localhost:18760'
 BASE_URL='http://localhost:2000'
 CONTACT_URL='http://localhost:18000/contact'
 CREDENTIALS_BASE_URL='http://localhost:18150'
@@ -13,6 +14,7 @@ DISCOVERY_API_BASE_URL='http://localhost:18381'
 DISCUSSIONS_MFE_BASE_URL='http://localhost:2002'
 ECOMMERCE_BASE_URL='http://localhost:18130'
 ENABLE_JUMPNAV='true'
+ENABLE_NEW_SIDEBAR=''
 ENABLE_NOTICES=''
 ENTERPRISE_LEARNER_PORTAL_HOSTNAME='localhost:8734'
 EXAMS_BASE_URL='http://localhost:18740'
--- a/.eslintignore
+++ b/.eslintignore
@@ -3,5 +3,3 @@ dist/
 packages/
 node_modules/
 jest.config.js
-env.config.jsx
-example.env.config.jsx
--- a/.github/workflows/validate.yml
+++ b/.github/workflows/validate.yml
@@ -18,7 +18,6 @@ jobs:
        node-version: ${{ env.NODE_VER }}
    - run: make validate.ci
    - name: Upload coverage
-      uses: codecov/codecov-action@v4
+      uses: codecov/codecov-action@v3
      with:
        fail_ci_if_error: true
-        token: ${{ secrets.CODECOV_TOKEN }}
--- a/README.rst
+++ b/README.rst
@@ -1,20 +1,25 @@
+#####################
 frontend-app-learning
 #####################

 |codecov| |license|

+********
 Purpose
-*******
+********

 This is the Learning MFE (micro-frontend application), which renders all
 learner-facing course pages (like the course outline, the progress page,
 actual course content, etc).

+Please tag **@edx/engage-squad** on any PRs or issues.  Thanks.
+
 .. |codecov| image:: https://codecov.io/gh/edx/frontend-app-learning/branch/master/graph/badge.svg?token=3z7XvuzTq3
   :target: https://codecov.io/gh/edx/frontend-app-learning
 .. |license| image:: https://img.shields.io/badge/license-AGPL-informational
   :target: https://github.com/openedx/frontend-app-account/blob/master/LICENSE

+***************
 Getting Started
 ***************

@@ -41,38 +46,32 @@ To use this application, `devstack <https://github.com/openedx/devstack>`__ must
 Cloning and Startup
 ===================

-1. Clone your new repo:
+.. code-block::

-.. code-block:: bash
+  1. Clone your new repo:

-    git clone https://github.com/openedx/frontend-app-learning.git
+    ``git clone https://github.com/openedx/frontend-app-learning.git``

-2. Use node v18.x.
+  2. Use node v18.x.

-  The current version of the micro-frontend build scripts supports node 18.
-  Using other major versions of node *may* work, but this is unsupported.  For
-  convenience, this repository includes an ``.nvmrc`` file to help in setting the
-  correct node version via `nvm <https://github.com/nvm-sh/nvm>`_.
+    The current version of the micro-frontend build scripts support node 18.
+    Using other major versions of node *may* work, but this is unsupported.  For
+    convenience, this repository includes an .nvmrc file to help in setting the
+    correct node version via `nvm <https://github.com/nvm-sh/nvm>`_.

-3. Install npm dependencies:
+  3. Install npm dependencies:

-.. code-block:: bash
+    ``cd frontend-app-learning && npm ci``

-  cd frontend-app-learning && npm ci
+  4. Start the dev server:

-4. Start the dev server:
-
-.. code-block:: bash
-
-  npm start
+    ``npm start``

 Local module development
 =========================

 To develop locally on modules that are installed into this app, you'll need to create a ``module.config.js``
-file (which is git-ignored) that defines where to find your local modules, for instance:
-
-.. code-block:: js
+file (which is git-ignored) that defines where to find your local modules, for instance::

   module.exports = {
     /*
@@ -101,14 +100,8 @@ The Learning MFE is similar to all the other Open edX MFEs. Read the Open
 edX Developer Guide's section on
 `MFE applications <https://edx.readthedocs.io/projects/edx-developer-docs/en/latest/developers_guide/micro_frontends_in_open_edx.html>`_.

-Plugins
-=======
-This MFE can be customized using `Frontend Plugin Framework <https://github.com/openedx/frontend-plugin-framework>`_.
-
-The parts of this MFE that can be customized in that manner are documented `here </src/plugin-slots>`_.
-
 Environment Variables
-=====================
+======================

 This MFE is configured via environment variables supplied at build time.
 All micro-frontends have a shared set of required environment variables,
@@ -134,7 +127,7 @@ SOCIAL_UTM_MILESTONE_CAMPAIGN

 SUPPORT_URL_CALCULATOR_MATH
  A link that explains how to use the in-course calculator. You can use the
-  one in the example below if you don't want to have your own branded version.
+  one in the example below, if you don't want to have your own branded version.

  Example: https://support.edx.org/hc/en-us/articles/360000038428-Entering-math-expressions-in-assignments-or-the-calculator

@@ -147,7 +140,7 @@ SUPPORT_URL_ID_VERIFICATION

 SUPPORT_URL_VERIFIED_CERTIFICATE
  A link that explains what a verified certificate is.  You can use the
-  one in the example below if you don't want to have your own branded version.
+  one in the example below, if you don't want to have your own branded version.
  Optional.

  Example: https://support.edx.org/hc/en-us/articles/206502008-What-is-a-verified-certificate
@@ -163,13 +156,13 @@ TWITTER_URL
  A link to your Twitter account. The Twitter social-share link won't appear
  unless this is set. Optional.

-  Example: https://twitter.com/openedx
+  Example: https://twitter.com/edXOnline

 Getting Help
-============
+===========

-If you're having trouble, we have `discussion forums`_
-where you can connect with others in the community.
+If you're having trouble, we have discussion forums at
+https://discuss.openedx.org where you can connect with others in the community.

 Our real-time conversations are on Slack. You can request a `Slack
 invitation`_, then join our `community Slack workspace`_.  Because this is a
@@ -187,18 +180,17 @@ For more information about these options, see the `Getting Help`_ page.
 .. _community Slack workspace: https://openedx.slack.com/
 .. _#wg-frontend channel: https://openedx.slack.com/archives/C04BM6YC7A6
 .. _Getting Help: https://openedx.org/community/connect
-.. _discussion forums: https://discuss.openedx.org

 Contributing
 ============

-Contributions are very welcome. Please read `How To Contribute`_ for details.
+Contributions are very welcome.  Please read `How To Contribute`_ for details.

 .. _How To Contribute: https://openedx.org/r/how-to-contribute

 This project is currently accepting all types of contributions, bug fixes,
 security fixes, maintenance work, or new features.  However, please make sure
-to discuss your new feature idea with the maintainers before
+to have a discussion about your new feature idea with the maintainers prior to
 beginning development to maximize the chances of your change being accepted.
 You can start a conversation by creating a new issue on this repo summarizing
 your idea.
--- a/example.env.config.jsx
+++ b/example.env.config.jsx
@@ -1,4 +1,4 @@
-import UnitTranslationPlugin from '@edx/unit-translation-selector-plugin';
+import UnitTranslationPlugin from '@plugins/UnitTranslationPlugin';
 import { PLUGIN_OPERATIONS, DIRECT_PLUGIN } from '@openedx/frontend-plugin-framework';

 // Load environment variables from .env file
--- a/jest.config.js
+++ b/jest.config.js
@@ -15,6 +15,7 @@ const config = createConfig('jest', {
    // See https://stackoverflow.com/questions/72382316/jest-encountered-an-unexpected-token-react-markdown
    'react-markdown': '<rootDir>/node_modules/react-markdown/react-markdown.min.js',
    '@src/(.*)': '<rootDir>/src/$1',
+    '@plugins/(.*)': '<rootDir>/plugins/$1',
  },
  testTimeout: 30000,
  globalSetup: "./global-setup.js",
--- a/package-lock.json
+++ b/package-lock.json
@@ -14,24 +14,25 @@
    "": {
      "name": "@edx/frontend-app-learning",
      "version": "1.0.0-semantically-released",
-      "hasInstallScript": true,
      "license": "AGPL-3.0",
      "dependencies": {
+        "@datadog/browser-logs": "^5.14.0",
+        "@datadog/browser-rum": "^5.14.0",
        "@edx/brand": "npm:@openedx/brand-openedx@^1.2.2",
+        "@edx/frontend-component-footer": "^13.0.4",
        "@edx/frontend-component-header": "^5.0.2",
-        "@edx/frontend-lib-learning-assistant": "^2.2.2",
-        "@edx/frontend-lib-special-exams": "^3.1.3",
+        "@edx/frontend-lib-learning-assistant": "^2.0.0",
+        "@edx/frontend-lib-special-exams": "^3.0.0",
        "@edx/frontend-platform": "^7.1.2",
        "@edx/openedx-atlas": "^0.6.0",
-        "@edx/react-unit-test-utils": "2.0.0",
+        "@edx/react-unit-test-utils": "^2.0.0",
        "@fortawesome/fontawesome-svg-core": "1.3.0",
        "@fortawesome/free-brands-svg-icons": "5.15.4",
        "@fortawesome/free-regular-svg-icons": "5.15.4",
        "@fortawesome/free-solid-svg-icons": "5.15.4",
        "@fortawesome/react-fontawesome": "^0.1.4",
-        "@openedx/frontend-plugin-framework": "^1.1.2",
-        "@openedx/frontend-slot-footer": "^1.0.2",
-        "@openedx/paragon": "^22.3.0",
+        "@openedx/frontend-plugin-framework": "^1.0.2",
+        "@openedx/paragon": "^22.1.1",
        "@popperjs/core": "2.11.8",
        "@reduxjs/toolkit": "1.8.1",
        "classnames": "2.3.2",
@@ -58,7 +59,7 @@
      "devDependencies": {
        "@edx/browserslist-config": "1.2.0",
        "@edx/reactifex": "2.2.0",
-        "@openedx/frontend-build": "13.1.4",
+        "@openedx/frontend-build": "13.0.30",
        "@pact-foundation/pact": "^11.0.2",
        "@testing-library/jest-dom": "5.16.5",
        "@testing-library/react": "12.1.5",
@@ -72,7 +73,6 @@
        "jest": "^26.6.3",
        "jest-console-group-reporter": "^1.0.1",
        "jest-when": "^3.6.0",
-        "patch-package": "^8.0.0",
        "postcss-loader": "^8.1.1",
        "rosie": "2.1.1",
        "sass": "^1.72.0",
@@ -2070,9 +2070,9 @@
      }
    },
    "node_modules/@csstools/cascade-layer-name-parser": {
-      "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/@csstools/cascade-layer-name-parser/-/cascade-layer-name-parser-1.0.9.tgz",
-      "integrity": "sha512-RRqNjxTZDUhx7pxYOBG/AkCVmPS3zYzfE47GEhIGkFuWFTQGJBgWOUUkKNo5MfxIfjDz5/1L3F3rF1oIsYaIpw==",
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/@csstools/cascade-layer-name-parser/-/cascade-layer-name-parser-1.0.6.tgz",
+      "integrity": "sha512-HkxRNs6ZIV0VjLFw6k5G8K35vd9r+O8B1Vr+QVD8M5Y44eQxyHtc42BdF74FQatXACPnitOR1+sRx2oWdnKTQw==",
      "funding": [
        {
          "type": "github",
@@ -2087,14 +2087,14 @@
        "node": "^14 || ^16 || >=18"
      },
      "peerDependencies": {
-        "@csstools/css-parser-algorithms": "^2.6.1",
-        "@csstools/css-tokenizer": "^2.2.4"
+        "@csstools/css-parser-algorithms": "^2.4.0",
+        "@csstools/css-tokenizer": "^2.2.2"
      }
    },
    "node_modules/@csstools/css-parser-algorithms": {
-      "version": "2.6.1",
-      "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-2.6.1.tgz",
-      "integrity": "sha512-ubEkAaTfVZa+WwGhs5jbo5Xfqpeaybr/RvWzvFxRs4jfq16wH8l8Ty/QEEpINxll4xhuGfdMbipRyz5QZh9+FA==",
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-2.4.0.tgz",
+      "integrity": "sha512-/PPLr2g5PAUCKAPEbfyk6/baZA+WJHQtUhPkoCQMpyRE8I0lXrG1QFRN8e5s3ZYxM8d/g5BZc6lH3s8Op7/VEg==",
      "funding": [
        {
          "type": "github",
@@ -2109,13 +2109,13 @@
        "node": "^14 || ^16 || >=18"
      },
      "peerDependencies": {
-        "@csstools/css-tokenizer": "^2.2.4"
+        "@csstools/css-tokenizer": "^2.2.2"
      }
    },
    "node_modules/@csstools/css-tokenizer": {
-      "version": "2.2.4",
-      "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-2.2.4.tgz",
-      "integrity": "sha512-PuWRAewQLbDhGeTvFuq2oClaSCKPIBmHyIobCV39JHRYN0byDcUWJl5baPeNUcqrjtdMNqFooE0FGl31I3JOqw==",
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-2.2.2.tgz",
+      "integrity": "sha512-wCDUe/MAw7npAHFLyW3QjSyLA66S5QFaV1jIXlNQvdJ8RzXDSgALa49eWcUO6P55ARQaz0TsDdAgdRgkXFYY8g==",
      "funding": [
        {
          "type": "github",
@@ -2131,9 +2131,9 @@
      }
    },
    "node_modules/@csstools/media-query-list-parser": {
-      "version": "2.1.9",
-      "resolved": "https://registry.npmjs.org/@csstools/media-query-list-parser/-/media-query-list-parser-2.1.9.tgz",
-      "integrity": "sha512-qqGuFfbn4rUmyOB0u8CVISIp5FfJ5GAR3mBrZ9/TKndHakdnm6pY0L/fbLcpPnrzwCyyTEZl1nUcXAYHEWneTA==",
+      "version": "2.1.6",
+      "resolved": "https://registry.npmjs.org/@csstools/media-query-list-parser/-/media-query-list-parser-2.1.6.tgz",
+      "integrity": "sha512-R6AKl9vaU0It7D7TR2lQn0pre5aQfdeqHRePlaRCY8rHL3l9eVlNRpsEVDKFi/zAjzv68CxH2M5kqbhPFPKjvw==",
      "funding": [
        {
          "type": "github",
@@ -2148,8 +2148,8 @@
        "node": "^14 || ^16 || >=18"
      },
      "peerDependencies": {
-        "@csstools/css-parser-algorithms": "^2.6.1",
-        "@csstools/css-tokenizer": "^2.2.4"
+        "@csstools/css-parser-algorithms": "^2.4.0",
+        "@csstools/css-tokenizer": "^2.2.2"
      }
    },
    "node_modules/@dabh/diagnostics": {
@@ -2163,6 +2163,52 @@
        "kuler": "^2.0.0"
      }
    },
+    "node_modules/@datadog/browser-core": {
+      "version": "5.14.0",
+      "resolved": "https://registry.npmjs.org/@datadog/browser-core/-/browser-core-5.14.0.tgz",
+      "integrity": "sha512-sr02NfURpidS+FW9JaIDwqG8JfeqNy2GjPhzxZ7q3IITktX0wNxEq+IhwJDfB+2G/2iT9t7WgFBshx/e3Rb0Ow=="
+    },
+    "node_modules/@datadog/browser-logs": {
+      "version": "5.14.0",
+      "resolved": "https://registry.npmjs.org/@datadog/browser-logs/-/browser-logs-5.14.0.tgz",
+      "integrity": "sha512-ZHTpl/c62OA9iy2HCfJD/1hKwgZPg7/xvKVSNbqF21SniTtxT8hs7InFU8YP9knwrhIkg2RC5TE4hBZCe99D3g==",
+      "dependencies": {
+        "@datadog/browser-core": "5.14.0"
+      },
+      "peerDependencies": {
+        "@datadog/browser-rum": "5.14.0"
+      },
+      "peerDependenciesMeta": {
+        "@datadog/browser-rum": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@datadog/browser-rum": {
+      "version": "5.14.0",
+      "resolved": "https://registry.npmjs.org/@datadog/browser-rum/-/browser-rum-5.14.0.tgz",
+      "integrity": "sha512-IijqDr1zDWJdNcbasjOMoriXDSf4ILbtt9DJF6+UMidQ32CNoCr524IK0d+9Qoea1uhEDIxIsA5lDN+v8zb6sg==",
+      "dependencies": {
+        "@datadog/browser-core": "5.14.0",
+        "@datadog/browser-rum-core": "5.14.0"
+      },
+      "peerDependencies": {
+        "@datadog/browser-logs": "5.14.0"
+      },
+      "peerDependenciesMeta": {
+        "@datadog/browser-logs": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@datadog/browser-rum-core": {
+      "version": "5.14.0",
+      "resolved": "https://registry.npmjs.org/@datadog/browser-rum-core/-/browser-rum-core-5.14.0.tgz",
+      "integrity": "sha512-DwpHwU+7LhuDwUKnOuQczM/QlsgCZofQyPOTEih2Rj9yrVpf6Z1lNQg9TCPNqGLAKs+Q1HqP1fJYa+tBCmgbhw==",
+      "dependencies": {
+        "@datadog/browser-core": "5.14.0"
+      }
+    },
    "node_modules/@discoveryjs/json-ext": {
      "version": "0.5.7",
      "resolved": "https://registry.npmjs.org/@discoveryjs/json-ext/-/json-ext-0.5.7.tgz",
@@ -2196,22 +2242,19 @@
      }
    },
    "node_modules/@edx/frontend-component-footer": {
-      "version": "14.0.0",
-      "resolved": "https://registry.npmjs.org/@edx/frontend-component-footer/-/frontend-component-footer-14.0.0.tgz",
-      "integrity": "sha512-3Riz6ippBnPz1oq6gZgFBx27bJkNL+rwwKrv0uCuHV/5MscS1aYeKx1ZAMuUsxkKcGX6uhyU6PwM6agvnhKfNQ==",
-      "peer": true,
+      "version": "13.0.4",
+      "resolved": "https://registry.npmjs.org/@edx/frontend-component-footer/-/frontend-component-footer-13.0.4.tgz",
+      "integrity": "sha512-E7KvzCXBmeH7bI6CHrZs/V4ARTAKsvX4tcFROtx9S9F35OvwvkZLxfyuuYgPfgNTTZtYqpoUcef1B7LQUlxLbw==",
      "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/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",
-        "jest-environment-jsdom": "^29.7.0",
-        "lodash": "^4.17.21",
-        "ts-jest": "^29.1.2"
+        "lodash": "^4.17.21"
      },
      "peerDependencies": {
-        "@edx/frontend-platform": "^7.0.0 || ^8.0.0",
+        "@edx/frontend-platform": "^7.0.0",
        "@openedx/paragon": ">= 21.11.3 < 23.0.0",
        "prop-types": "^15.5.10",
        "react": "^16.9.0 || ^17.0.0",
@@ -2219,62 +2262,57 @@
      }
    },
    "node_modules/@edx/frontend-component-footer/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==",
+      "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,
-      "peer": true,
      "engines": {
        "node": ">=6"
      }
    },
    "node_modules/@edx/frontend-component-footer/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==",
+      "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,
-      "peer": true,
      "dependencies": {
-        "@fortawesome/fontawesome-common-types": "6.5.2"
+        "@fortawesome/fontawesome-common-types": "6.5.1"
      },
      "engines": {
        "node": ">=6"
      }
    },
    "node_modules/@edx/frontend-component-footer/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==",
+      "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,
-      "peer": true,
      "dependencies": {
-        "@fortawesome/fontawesome-common-types": "6.5.2"
+        "@fortawesome/fontawesome-common-types": "6.5.1"
      },
      "engines": {
        "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==",
+      "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,
-      "peer": true,
      "dependencies": {
-        "@fortawesome/fontawesome-common-types": "6.5.2"
+        "@fortawesome/fontawesome-common-types": "6.5.1"
      },
      "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",
-      "integrity": "sha512-QWFZYXFE7O1Gr1dTIp+D6UcFUF0qElOnZptpi7PBUMylJh+vFmIedVe1Ir6RM1t2tEQLLSV1k7bR4o92M+uqlw==",
+      "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,
-      "peer": true,
      "dependencies": {
-        "@fortawesome/fontawesome-common-types": "6.5.2"
+        "@fortawesome/fontawesome-common-types": "6.5.1"
      },
      "engines": {
        "node": ">=6"
@@ -2284,7 +2322,6 @@
      "version": "0.2.0",
      "resolved": "https://registry.npmjs.org/@fortawesome/react-fontawesome/-/react-fontawesome-0.2.0.tgz",
      "integrity": "sha512-uHg75Rb/XORTtVt7OS9WoK8uM276Ufi7gCzshVWkUJbHhh3svsUUeqXerrM96Wm7fRiDzfKRwSoahhMIkGAYHw==",
-      "peer": true,
      "dependencies": {
        "prop-types": "^15.8.1"
      },
@@ -2293,1076 +2330,6 @@
        "react": ">=16.3"
      }
    },
-    "node_modules/@edx/frontend-component-footer/node_modules/@jest/core": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/@jest/core/-/core-29.7.0.tgz",
-      "integrity": "sha512-n7aeXWKMnGtDA48y8TLWJPJmLmmZ642Ceo78cYWEpiD7FzDgmNDV/GCVRorPABdXLJZ/9wzzgZAlHjXjxDHGsg==",
-      "peer": true,
-      "dependencies": {
-        "@jest/console": "^29.7.0",
-        "@jest/reporters": "^29.7.0",
-        "@jest/test-result": "^29.7.0",
-        "@jest/transform": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "@types/node": "*",
-        "ansi-escapes": "^4.2.1",
-        "chalk": "^4.0.0",
-        "ci-info": "^3.2.0",
-        "exit": "^0.1.2",
-        "graceful-fs": "^4.2.9",
-        "jest-changed-files": "^29.7.0",
-        "jest-config": "^29.7.0",
-        "jest-haste-map": "^29.7.0",
-        "jest-message-util": "^29.7.0",
-        "jest-regex-util": "^29.6.3",
-        "jest-resolve": "^29.7.0",
-        "jest-resolve-dependencies": "^29.7.0",
-        "jest-runner": "^29.7.0",
-        "jest-runtime": "^29.7.0",
-        "jest-snapshot": "^29.7.0",
-        "jest-util": "^29.7.0",
-        "jest-validate": "^29.7.0",
-        "jest-watcher": "^29.7.0",
-        "micromatch": "^4.0.4",
-        "pretty-format": "^29.7.0",
-        "slash": "^3.0.0",
-        "strip-ansi": "^6.0.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      },
-      "peerDependencies": {
-        "node-notifier": "^8.0.1 || ^9.0.0 || ^10.0.0"
-      },
-      "peerDependenciesMeta": {
-        "node-notifier": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/@jest/environment": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/@jest/environment/-/environment-29.7.0.tgz",
-      "integrity": "sha512-aQIfHDq33ExsN4jP1NWGXhxgQ/wixs60gDiKO+XVMd8Mn0NWPWgc34ZQDTb2jKaUWQ7MuwoitXAsN2XVXNMpAw==",
-      "peer": true,
-      "dependencies": {
-        "@jest/fake-timers": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "@types/node": "*",
-        "jest-mock": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/@jest/fake-timers": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/@jest/fake-timers/-/fake-timers-29.7.0.tgz",
-      "integrity": "sha512-q4DH1Ha4TTFPdxLsqDXK1d3+ioSL7yL5oCMJZgDYm6i+6CygW5E5xVr/D1HdsGxjt1ZWSfUAs9OxSB/BNelWrQ==",
-      "peer": true,
-      "dependencies": {
-        "@jest/types": "^29.6.3",
-        "@sinonjs/fake-timers": "^10.0.2",
-        "@types/node": "*",
-        "jest-message-util": "^29.7.0",
-        "jest-mock": "^29.7.0",
-        "jest-util": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/@jest/globals": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/@jest/globals/-/globals-29.7.0.tgz",
-      "integrity": "sha512-mpiz3dutLbkW2MNFubUGUEVLkTGiqW6yLVTA+JbP6fI6J5iL9Y0Nlg8k95pcF8ctKwCS7WVxteBs29hhfAotzQ==",
-      "peer": true,
-      "dependencies": {
-        "@jest/environment": "^29.7.0",
-        "@jest/expect": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "jest-mock": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/@jest/source-map": {
-      "version": "29.6.3",
-      "resolved": "https://registry.npmjs.org/@jest/source-map/-/source-map-29.6.3.tgz",
-      "integrity": "sha512-MHjT95QuipcPrpLM+8JMSzFx6eHp5Bm+4XeFDJlwsvVBjmKNiIAvasGK2fxz2WbGRlnvqehFbh07MMa7n3YJnw==",
-      "peer": true,
-      "dependencies": {
-        "@jridgewell/trace-mapping": "^0.3.18",
-        "callsites": "^3.0.0",
-        "graceful-fs": "^4.2.9"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/@jest/test-sequencer": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/@jest/test-sequencer/-/test-sequencer-29.7.0.tgz",
-      "integrity": "sha512-GQwJ5WZVrKnOJuiYiAF52UNUJXgTZx1NHjFSEB0qEMmSZKAkdMoIzw/Cj6x6NF4AvV23AUqDpFzQkN/eYCYTxw==",
-      "peer": true,
-      "dependencies": {
-        "@jest/test-result": "^29.7.0",
-        "graceful-fs": "^4.2.9",
-        "jest-haste-map": "^29.7.0",
-        "slash": "^3.0.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/@jest/transform": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/@jest/transform/-/transform-29.7.0.tgz",
-      "integrity": "sha512-ok/BTPFzFKVMwO5eOHRrvnBVHdRy9IrsrW1GpMaQ9MCnilNLXQKmAX8s1YXDFaai9xJpac2ySzV0YeRRECr2Vw==",
-      "peer": true,
-      "dependencies": {
-        "@babel/core": "^7.11.6",
-        "@jest/types": "^29.6.3",
-        "@jridgewell/trace-mapping": "^0.3.18",
-        "babel-plugin-istanbul": "^6.1.1",
-        "chalk": "^4.0.0",
-        "convert-source-map": "^2.0.0",
-        "fast-json-stable-stringify": "^2.1.0",
-        "graceful-fs": "^4.2.9",
-        "jest-haste-map": "^29.7.0",
-        "jest-regex-util": "^29.6.3",
-        "jest-util": "^29.7.0",
-        "micromatch": "^4.0.4",
-        "pirates": "^4.0.4",
-        "slash": "^3.0.0",
-        "write-file-atomic": "^4.0.2"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/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==",
-      "peer": true,
-      "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-footer/node_modules/@sinonjs/commons": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/@sinonjs/commons/-/commons-3.0.1.tgz",
-      "integrity": "sha512-K3mCHKQ9sVh8o1C9cxkwxaOmXoAMlDxC1mYyHrjqOWEcBjYr76t96zL2zlj5dUGZ3HSw240X1qgH3Mjf1yJWpQ==",
-      "peer": true,
-      "dependencies": {
-        "type-detect": "4.0.8"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/@sinonjs/fake-timers": {
-      "version": "10.3.0",
-      "resolved": "https://registry.npmjs.org/@sinonjs/fake-timers/-/fake-timers-10.3.0.tgz",
-      "integrity": "sha512-V4BG07kuYSUkTCSBHG8G8TNhM+F19jXFWnQtzj+we8DrkpSBCee9Z3Ms8yiGer/dlmhe35/Xdgyo3/0rQKg7YA==",
-      "peer": true,
-      "dependencies": {
-        "@sinonjs/commons": "^3.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/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==",
-      "peer": true,
-      "engines": {
-        "node": ">= 10"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/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==",
-      "peer": true,
-      "dependencies": {
-        "@types/yargs-parser": "*"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/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==",
-      "peer": true,
-      "dependencies": {
-        "acorn": "^8.1.0",
-        "acorn-walk": "^8.0.2"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/ansi-styles": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
-      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
-      "peer": true,
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/babel-jest": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-29.7.0.tgz",
-      "integrity": "sha512-BrvGY3xZSwEcCzKvKsCi2GgHqDqsYkOP4/by5xCgIwGXQxIEh+8ew3gmrE1y7XRR6LHZIj6yLYnUi/mm2KXKBg==",
-      "peer": true,
-      "dependencies": {
-        "@jest/transform": "^29.7.0",
-        "@types/babel__core": "^7.1.14",
-        "babel-plugin-istanbul": "^6.1.1",
-        "babel-preset-jest": "^29.6.3",
-        "chalk": "^4.0.0",
-        "graceful-fs": "^4.2.9",
-        "slash": "^3.0.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.8.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/babel-plugin-jest-hoist": {
-      "version": "29.6.3",
-      "resolved": "https://registry.npmjs.org/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-29.6.3.tgz",
-      "integrity": "sha512-ESAc/RJvGTFEzRwOTT4+lNDk/GNHMkKbNzsvT0qKRfDyyYTskxB5rnU2njIDYVxXCBHHEI1c0YwHob3WaYujOg==",
-      "peer": true,
-      "dependencies": {
-        "@babel/template": "^7.3.3",
-        "@babel/types": "^7.3.3",
-        "@types/babel__core": "^7.1.14",
-        "@types/babel__traverse": "^7.0.6"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/babel-preset-jest": {
-      "version": "29.6.3",
-      "resolved": "https://registry.npmjs.org/babel-preset-jest/-/babel-preset-jest-29.6.3.tgz",
-      "integrity": "sha512-0B3bhxR6snWXJZtR/RliHTDPRgn1sNHOR0yVtq/IiQFyuOVjFS+wuio/R4gSNkyYmKmJB4wGZv2NZanmKmTnNA==",
-      "peer": true,
-      "dependencies": {
-        "babel-plugin-jest-hoist": "^29.6.3",
-        "babel-preset-current-node-syntax": "^1.0.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/cjs-module-lexer": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/cjs-module-lexer/-/cjs-module-lexer-1.3.1.tgz",
-      "integrity": "sha512-a3KdPAANPbNE4ZUv9h6LckSl9zLsYOP4MBmhIPkRaeyybt+r4UghLvq+xw/YwUcC1gqylCkL4rdVs3Lwupjm4Q==",
-      "peer": true
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/convert-source-map": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
-      "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
-      "peer": true
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/cssom": {
-      "version": "0.5.0",
-      "resolved": "https://registry.npmjs.org/cssom/-/cssom-0.5.0.tgz",
-      "integrity": "sha512-iKuQcq+NdHqlAcwUY0o/HL69XQrUaQdMjmStJ8JFmUaiiQErlhrmuigkg/CU4E2J0IyUKUrMAgl36TvN67MqTw==",
-      "peer": true
-    },
-    "node_modules/@edx/frontend-component-footer/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==",
-      "peer": true,
-      "dependencies": {
-        "abab": "^2.0.6",
-        "whatwg-mimetype": "^3.0.0",
-        "whatwg-url": "^11.0.0"
-      },
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/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",
-      "peer": true,
-      "dependencies": {
-        "webidl-conversions": "^7.0.0"
-      },
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/emittery": {
-      "version": "0.13.1",
-      "resolved": "https://registry.npmjs.org/emittery/-/emittery-0.13.1.tgz",
-      "integrity": "sha512-DeWwawk6r5yR9jFgnDKYt4sLS0LmHJJi3ZOnb5/JdbYwj3nW+FxQnHIjhBKz8YLC7oRNPVM9NQ47I3CVx34eqQ==",
-      "peer": true,
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "url": "https://github.com/sindresorhus/emittery?sponsor=1"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/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==",
-      "peer": true,
-      "dependencies": {
-        "whatwg-encoding": "^2.0.0"
-      },
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/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==",
-      "peer": true,
-      "dependencies": {
-        "@tootallnate/once": "2",
-        "agent-base": "6",
-        "debug": "4"
-      },
-      "engines": {
-        "node": ">= 6"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/iconv-lite": {
-      "version": "0.6.3",
-      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
-      "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
-      "peer": true,
-      "dependencies": {
-        "safer-buffer": ">= 2.1.2 < 3.0.0"
-      },
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/jest": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest/-/jest-29.7.0.tgz",
-      "integrity": "sha512-NIy3oAFp9shda19hy4HK0HRTWKtPJmGdnvywu01nOqNC2vZg+Z+fvJDxpMQA88eb2I9EcafcdjYgsDthnYTvGw==",
-      "peer": true,
-      "dependencies": {
-        "@jest/core": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "import-local": "^3.0.2",
-        "jest-cli": "^29.7.0"
-      },
-      "bin": {
-        "jest": "bin/jest.js"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      },
-      "peerDependencies": {
-        "node-notifier": "^8.0.1 || ^9.0.0 || ^10.0.0"
-      },
-      "peerDependenciesMeta": {
-        "node-notifier": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/jest-changed-files": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-changed-files/-/jest-changed-files-29.7.0.tgz",
-      "integrity": "sha512-fEArFiwf1BpQ+4bXSprcDc3/x4HSzL4al2tozwVpDFpsxALjLYdyiIK4e5Vz66GQJIbXJ82+35PtysofptNX2w==",
-      "peer": true,
-      "dependencies": {
-        "execa": "^5.0.0",
-        "jest-util": "^29.7.0",
-        "p-limit": "^3.1.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/jest-cli": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-cli/-/jest-cli-29.7.0.tgz",
-      "integrity": "sha512-OVVobw2IubN/GSYsxETi+gOe7Ka59EFMR/twOU3Jb2GnKKeMGJB5SGUUrEz3SFVmJASUdZUzy83sLNNQ2gZslg==",
-      "peer": true,
-      "dependencies": {
-        "@jest/core": "^29.7.0",
-        "@jest/test-result": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "chalk": "^4.0.0",
-        "create-jest": "^29.7.0",
-        "exit": "^0.1.2",
-        "import-local": "^3.0.2",
-        "jest-config": "^29.7.0",
-        "jest-util": "^29.7.0",
-        "jest-validate": "^29.7.0",
-        "yargs": "^17.3.1"
-      },
-      "bin": {
-        "jest": "bin/jest.js"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      },
-      "peerDependencies": {
-        "node-notifier": "^8.0.1 || ^9.0.0 || ^10.0.0"
-      },
-      "peerDependenciesMeta": {
-        "node-notifier": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/jest-config": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-config/-/jest-config-29.7.0.tgz",
-      "integrity": "sha512-uXbpfeQ7R6TZBqI3/TxCU4q4ttk3u0PJeC+E0zbfSoSjq6bJ7buBPxzQPL0ifrkY4DNu4JUdk0ImlBUYi840eQ==",
-      "peer": true,
-      "dependencies": {
-        "@babel/core": "^7.11.6",
-        "@jest/test-sequencer": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "babel-jest": "^29.7.0",
-        "chalk": "^4.0.0",
-        "ci-info": "^3.2.0",
-        "deepmerge": "^4.2.2",
-        "glob": "^7.1.3",
-        "graceful-fs": "^4.2.9",
-        "jest-circus": "^29.7.0",
-        "jest-environment-node": "^29.7.0",
-        "jest-get-type": "^29.6.3",
-        "jest-regex-util": "^29.6.3",
-        "jest-resolve": "^29.7.0",
-        "jest-runner": "^29.7.0",
-        "jest-util": "^29.7.0",
-        "jest-validate": "^29.7.0",
-        "micromatch": "^4.0.4",
-        "parse-json": "^5.2.0",
-        "pretty-format": "^29.7.0",
-        "slash": "^3.0.0",
-        "strip-json-comments": "^3.1.1"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      },
-      "peerDependencies": {
-        "@types/node": "*",
-        "ts-node": ">=9.0.0"
-      },
-      "peerDependenciesMeta": {
-        "@types/node": {
-          "optional": true
-        },
-        "ts-node": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/jest-docblock": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-docblock/-/jest-docblock-29.7.0.tgz",
-      "integrity": "sha512-q617Auw3A612guyaFgsbFeYpNP5t2aoUNLwBUbc/0kD1R4t9ixDbyFTHd1nok4epoVFpr7PmeWHrhvuV3XaJ4g==",
-      "peer": true,
-      "dependencies": {
-        "detect-newline": "^3.0.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/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==",
-      "peer": true,
-      "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-footer/node_modules/jest-environment-node": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-environment-node/-/jest-environment-node-29.7.0.tgz",
-      "integrity": "sha512-DOSwCRqXirTOyheM+4d5YZOrWcdu0LNZ87ewUoywbcb2XR4wKgqiG8vNeYwhjFMbEkfju7wx2GYH0P2gevGvFw==",
-      "peer": true,
-      "dependencies": {
-        "@jest/environment": "^29.7.0",
-        "@jest/fake-timers": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "@types/node": "*",
-        "jest-mock": "^29.7.0",
-        "jest-util": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/jest-haste-map": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-haste-map/-/jest-haste-map-29.7.0.tgz",
-      "integrity": "sha512-fP8u2pyfqx0K1rGn1R9pyE0/KTn+G7PxktWidOBTqFPLYX0b9ksaMFkhK5vrS3DVun09pckLdlx90QthlW7AmA==",
-      "peer": true,
-      "dependencies": {
-        "@jest/types": "^29.6.3",
-        "@types/graceful-fs": "^4.1.3",
-        "@types/node": "*",
-        "anymatch": "^3.0.3",
-        "fb-watchman": "^2.0.0",
-        "graceful-fs": "^4.2.9",
-        "jest-regex-util": "^29.6.3",
-        "jest-util": "^29.7.0",
-        "jest-worker": "^29.7.0",
-        "micromatch": "^4.0.4",
-        "walker": "^1.0.8"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      },
-      "optionalDependencies": {
-        "fsevents": "^2.3.2"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/jest-leak-detector": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-leak-detector/-/jest-leak-detector-29.7.0.tgz",
-      "integrity": "sha512-kYA8IJcSYtST2BY9I+SMC32nDpBT3J2NvWJx8+JCuCdl/CR1I4EKUJROiP8XtCcxqgTTBGJNdbB1A8XRKbTetw==",
-      "peer": true,
-      "dependencies": {
-        "jest-get-type": "^29.6.3",
-        "pretty-format": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/jest-mock": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-mock/-/jest-mock-29.7.0.tgz",
-      "integrity": "sha512-ITOMZn+UkYS4ZFh83xYAOzWStloNzJFO2s8DWrE4lhtGD+AorgnbkiKERe4wQVBydIGPx059g6riW5Btp6Llnw==",
-      "peer": true,
-      "dependencies": {
-        "@jest/types": "^29.6.3",
-        "@types/node": "*",
-        "jest-util": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/jest-regex-util": {
-      "version": "29.6.3",
-      "resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-29.6.3.tgz",
-      "integrity": "sha512-KJJBsRCyyLNWCNBOvZyRDnAIfUiRJ8v+hOBQYGn8gDyF3UegwiP4gwRR3/SDa42g1YbVycTidUF3rKjyLFDWbg==",
-      "peer": true,
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/jest-resolve": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-resolve/-/jest-resolve-29.7.0.tgz",
-      "integrity": "sha512-IOVhZSrg+UvVAshDSDtHyFCCBUl/Q3AAJv8iZ6ZjnZ74xzvwuzLXid9IIIPgTnY62SJjfuupMKZsZQRsCvxEgA==",
-      "peer": true,
-      "dependencies": {
-        "chalk": "^4.0.0",
-        "graceful-fs": "^4.2.9",
-        "jest-haste-map": "^29.7.0",
-        "jest-pnp-resolver": "^1.2.2",
-        "jest-util": "^29.7.0",
-        "jest-validate": "^29.7.0",
-        "resolve": "^1.20.0",
-        "resolve.exports": "^2.0.0",
-        "slash": "^3.0.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/jest-resolve-dependencies": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-resolve-dependencies/-/jest-resolve-dependencies-29.7.0.tgz",
-      "integrity": "sha512-un0zD/6qxJ+S0et7WxeI3H5XSe9lTBBR7bOHCHXkKR6luG5mwDDlIzVQ0V5cZCuoTgEdcdwzTghYkTWfubi+nA==",
-      "peer": true,
-      "dependencies": {
-        "jest-regex-util": "^29.6.3",
-        "jest-snapshot": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/jest-runner": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-runner/-/jest-runner-29.7.0.tgz",
-      "integrity": "sha512-fsc4N6cPCAahybGBfTRcq5wFR6fpLznMg47sY5aDpsoejOcVYFb07AHuSnR0liMcPTgBsA3ZJL6kFOjPdoNipQ==",
-      "peer": true,
-      "dependencies": {
-        "@jest/console": "^29.7.0",
-        "@jest/environment": "^29.7.0",
-        "@jest/test-result": "^29.7.0",
-        "@jest/transform": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "@types/node": "*",
-        "chalk": "^4.0.0",
-        "emittery": "^0.13.1",
-        "graceful-fs": "^4.2.9",
-        "jest-docblock": "^29.7.0",
-        "jest-environment-node": "^29.7.0",
-        "jest-haste-map": "^29.7.0",
-        "jest-leak-detector": "^29.7.0",
-        "jest-message-util": "^29.7.0",
-        "jest-resolve": "^29.7.0",
-        "jest-runtime": "^29.7.0",
-        "jest-util": "^29.7.0",
-        "jest-watcher": "^29.7.0",
-        "jest-worker": "^29.7.0",
-        "p-limit": "^3.1.0",
-        "source-map-support": "0.5.13"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/jest-runtime": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-runtime/-/jest-runtime-29.7.0.tgz",
-      "integrity": "sha512-gUnLjgwdGqW7B4LvOIkbKs9WGbn+QLqRQQ9juC6HndeDiezIwhDP+mhMwHWCEcfQ5RUXa6OPnFF8BJh5xegwwQ==",
-      "peer": true,
-      "dependencies": {
-        "@jest/environment": "^29.7.0",
-        "@jest/fake-timers": "^29.7.0",
-        "@jest/globals": "^29.7.0",
-        "@jest/source-map": "^29.6.3",
-        "@jest/test-result": "^29.7.0",
-        "@jest/transform": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "@types/node": "*",
-        "chalk": "^4.0.0",
-        "cjs-module-lexer": "^1.0.0",
-        "collect-v8-coverage": "^1.0.0",
-        "glob": "^7.1.3",
-        "graceful-fs": "^4.2.9",
-        "jest-haste-map": "^29.7.0",
-        "jest-message-util": "^29.7.0",
-        "jest-mock": "^29.7.0",
-        "jest-regex-util": "^29.6.3",
-        "jest-resolve": "^29.7.0",
-        "jest-snapshot": "^29.7.0",
-        "jest-util": "^29.7.0",
-        "slash": "^3.0.0",
-        "strip-bom": "^4.0.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/jest-snapshot": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-snapshot/-/jest-snapshot-29.7.0.tgz",
-      "integrity": "sha512-Rm0BMWtxBcioHr1/OX5YCP8Uov4riHvKPknOGs804Zg9JGZgmIBkbtlxJC/7Z4msKYVbIJtfU+tKb8xlYNfdkw==",
-      "peer": true,
-      "dependencies": {
-        "@babel/core": "^7.11.6",
-        "@babel/generator": "^7.7.2",
-        "@babel/plugin-syntax-jsx": "^7.7.2",
-        "@babel/plugin-syntax-typescript": "^7.7.2",
-        "@babel/types": "^7.3.3",
-        "@jest/expect-utils": "^29.7.0",
-        "@jest/transform": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "babel-preset-current-node-syntax": "^1.0.0",
-        "chalk": "^4.0.0",
-        "expect": "^29.7.0",
-        "graceful-fs": "^4.2.9",
-        "jest-diff": "^29.7.0",
-        "jest-get-type": "^29.6.3",
-        "jest-matcher-utils": "^29.7.0",
-        "jest-message-util": "^29.7.0",
-        "jest-util": "^29.7.0",
-        "natural-compare": "^1.4.0",
-        "pretty-format": "^29.7.0",
-        "semver": "^7.5.3"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/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==",
-      "peer": true,
-      "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-footer/node_modules/jest-validate": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-validate/-/jest-validate-29.7.0.tgz",
-      "integrity": "sha512-ZB7wHqaRGVw/9hST/OuFUReG7M8vKeq0/J2egIGLdvjHCmYqGARhzXmtgi+gVeZ5uXFF219aOc3Ls2yLg27tkw==",
-      "peer": true,
-      "dependencies": {
-        "@jest/types": "^29.6.3",
-        "camelcase": "^6.2.0",
-        "chalk": "^4.0.0",
-        "jest-get-type": "^29.6.3",
-        "leven": "^3.1.0",
-        "pretty-format": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/jest-watcher": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-watcher/-/jest-watcher-29.7.0.tgz",
-      "integrity": "sha512-49Fg7WXkU3Vl2h6LbLtMQ/HyB6rXSIX7SqvBLQmssRBGN9I0PNvPmAmCWSOY6SOvrjhI/F7/bGAv9RtnsPA03g==",
-      "peer": true,
-      "dependencies": {
-        "@jest/test-result": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "@types/node": "*",
-        "ansi-escapes": "^4.2.1",
-        "chalk": "^4.0.0",
-        "emittery": "^0.13.1",
-        "jest-util": "^29.7.0",
-        "string-length": "^4.0.1"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/jsdom": {
-      "version": "20.0.3",
-      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-20.0.3.tgz",
-      "integrity": "sha512-SYhBvTh89tTfCD/CRdSOm13mOBa42iTaTyfyEWBdKcGdPxPtLFBXuHR8XHb33YNYaP+lLbmSvBTsnoesCNJEsQ==",
-      "peer": true,
-      "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-footer/node_modules/parse5": {
-      "version": "7.1.2",
-      "resolved": "https://registry.npmjs.org/parse5/-/parse5-7.1.2.tgz",
-      "integrity": "sha512-Czj1WaSVpaoj0wbhMzLmWD69anp2WH7FXMB9n1Sy8/ZFF9jolSQVMu1Ij5WIyGmcBmhk7EOndpO4mIpihVqAXw==",
-      "peer": true,
-      "dependencies": {
-        "entities": "^4.4.0"
-      },
-      "funding": {
-        "url": "https://github.com/inikulin/parse5?sponsor=1"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/pretty-format": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.7.0.tgz",
-      "integrity": "sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==",
-      "peer": true,
-      "dependencies": {
-        "@jest/schemas": "^29.6.3",
-        "ansi-styles": "^5.0.0",
-        "react-is": "^18.0.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/react-is": {
-      "version": "18.3.1",
-      "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
-      "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
-      "peer": true
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/saxes": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/saxes/-/saxes-6.0.0.tgz",
-      "integrity": "sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==",
-      "peer": true,
-      "dependencies": {
-        "xmlchars": "^2.2.0"
-      },
-      "engines": {
-        "node": ">=v12.22.7"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/semver": {
-      "version": "7.6.2",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz",
-      "integrity": "sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==",
-      "peer": true,
-      "bin": {
-        "semver": "bin/semver.js"
-      },
-      "engines": {
-        "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==",
-      "peer": true,
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/source-map": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
-      "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-      "peer": true,
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
-    "node_modules/@edx/frontend-component-footer/node_modules/source-map-support": {
-      "version": "0.5.13",
-      "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.13.tgz",
-      "integrity": "sha512-SHSKFHadjVA5oR4PPqhtAVdcBWwRYVd6g6cAXnIbRiIwc2EhPrTuKUBdSLvlEKyIP3GCf89fltvcZiP9MMFA1w==",
-      "peer": true,
-      "dependencies": {
-        "buffer-from": "^1.0.0",
-        "source-map": "^0.6.0"
-      }
-    },
-    "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==",
-      "peer": true,
-      "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==",
-      "peer": true,
-      "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==",
-      "peer": true,
-      "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==",
-      "peer": true,
-      "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==",
-      "peer": true,
-      "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==",
-      "peer": true,
-      "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==",
-      "peer": true,
-      "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==",
-      "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==",
-      "peer": true,
-      "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==",
-      "peer": true,
-      "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",
@@ -3468,9 +2435,9 @@
      }
    },
    "node_modules/@edx/frontend-lib-learning-assistant": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/@edx/frontend-lib-learning-assistant/-/frontend-lib-learning-assistant-2.2.2.tgz",
-      "integrity": "sha512-Iy8W9Oz7k6kPp6wvhHgWQOne6I0tJY+/JMLlBhnrSsRZQfYV20IH9oXSDhzBAb4g/SDWvU/hu9fNWwd0l9lTkQ==",
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@edx/frontend-lib-learning-assistant/-/frontend-lib-learning-assistant-2.0.0.tgz",
+      "integrity": "sha512-7W5/5Rm2h1BjgdEvM8wa4yUuw3+N/6/cZZdvGiuIl3RDSisU/EpT95JMQyuqsBCSHClakIJ3TD7RHsj2eDQcSQ==",
      "dependencies": {
        "@edx/brand": "npm:@edx/brand-openedx@1.2.0",
        "@fortawesome/fontawesome-svg-core": "1.2.36",
@@ -3485,7 +2452,7 @@
        "uuid": "9.0.0"
      },
      "peerDependencies": {
-        "@edx/frontend-platform": "^7.0.0 || ^8.0.0",
+        "@edx/frontend-platform": "^7.0.0",
        "@openedx/paragon": "^22.0.0",
        "@reduxjs/toolkit": "1.8.1",
        "react": "16.14.0 || ^17.0.0",
@@ -3547,9 +2514,9 @@
      }
    },
    "node_modules/@edx/frontend-lib-special-exams": {
-      "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/@edx/frontend-lib-special-exams/-/frontend-lib-special-exams-3.1.3.tgz",
-      "integrity": "sha512-qkcnjPybt/eEE5txl8srUGTAVRiT92SFkjvPJEx9xuoUWuKTt0AmE0z3CVM2KypmcklBLlUZHVqZQVmgHlbtdA==",
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/@edx/frontend-lib-special-exams/-/frontend-lib-special-exams-3.0.0.tgz",
+      "integrity": "sha512-3uUuFfiiuLJyRjOpH12qIGT1LtUiN6GIRKbGGmDPv4ZVdQaRxI1oEXDArQ7bcuBD4VHw3rI/JcO31k9pkWScLA==",
      "dependencies": {
        "@fortawesome/fontawesome-svg-core": "1.2.34",
        "@fortawesome/free-brands-svg-icons": "5.11.2",
@@ -3560,7 +2527,7 @@
        "eventemitter3": "^4.0.7"
      },
      "peerDependencies": {
-        "@edx/frontend-platform": "^7.0.0 || ^8.0.0",
+        "@edx/frontend-platform": "^7.0.0",
        "@openedx/paragon": "^22.0.0",
        "@reduxjs/toolkit": "^1.5.1",
        "prop-types": "^15.7.2",
@@ -4340,6 +3307,7 @@
      "version": "29.7.0",
      "resolved": "https://registry.npmjs.org/@jest/console/-/console-29.7.0.tgz",
      "integrity": "sha512-5Ni4CU7XHQi32IJ398EEP4RrB8eV09sXP2ROqD4bksHrnTree52PsxvX8tpL8LvTZ3pFzXyPbNQReSN41CAhOg==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "@jest/types": "^29.6.3",
@@ -4357,6 +3325,7 @@
      "version": "29.6.3",
      "resolved": "https://registry.npmjs.org/@jest/types/-/types-29.6.3.tgz",
      "integrity": "sha512-u3UPsIilWKOM3F9CXtrG8LEJmNxwoCQC/XVj4IKYXvvpx7QIi/Kg1LI5uDmDpKlac62NUtX7eLjRh+jVZcLOzw==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "@jest/schemas": "^29.6.3",
@@ -4374,6 +3343,7 @@
      "version": "17.0.32",
      "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-17.0.32.tgz",
      "integrity": "sha512-xQ67Yc/laOG5uMfX/093MRlGGCIBzZMarVa+gfNKJxWAIgykYpVGkBdbqEzGDDfCrVUj6Hiff4mTZ5BA6TmAog==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "@types/yargs-parser": "*"
@@ -4383,6 +3353,7 @@
      "version": "29.7.0",
      "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-29.7.0.tgz",
      "integrity": "sha512-z6EbKajIpqGKU56y5KBUgy1dt1ihhQJgWzUlZHArA/+X2ad7Cb5iF+AK1EWVL/Bo7Rz9uurpqw6SiBCefUbCGA==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "@jest/types": "^29.6.3",
@@ -4400,6 +3371,7 @@
      "version": "3.0.0",
      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
+      "dev": true,
      "peer": true,
      "engines": {
        "node": ">=8"
@@ -4635,23 +3607,10 @@
        "node": ">= 10.14.2"
      }
    },
-    "node_modules/@jest/expect": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/@jest/expect/-/expect-29.7.0.tgz",
-      "integrity": "sha512-8uMeAMycttpva3P1lBHB8VciS9V0XAr3GymPpipdyQXbBcuhkLQOSe8E/p92RyAdToS6ZD1tFkX+CkhoECE0dQ==",
-      "peer": true,
-      "dependencies": {
-        "expect": "^29.7.0",
-        "jest-snapshot": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
    "node_modules/@jest/expect-utils": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/@jest/expect-utils/-/expect-utils-29.7.0.tgz",
-      "integrity": "sha512-GlsNBWiFQFCVi9QVSx7f5AgMeLxe9YCCs5PuP2O2LdjDAA8Jh9eX7lA1Jq/xdXw3Wb3hyvlFNfZIfcRetSzYcA==",
+      "version": "29.6.4",
+      "resolved": "https://registry.npmjs.org/@jest/expect-utils/-/expect-utils-29.6.4.tgz",
+      "integrity": "sha512-FEhkJhqtvBwgSpiTrocquJCdXPsyvNKcl/n7A3u7X4pVoF4bswm11c9d4AV+kfq2Gpv/mM8x7E7DsRvH+djkrg==",
      "dependencies": {
        "jest-get-type": "^29.6.3"
      },
@@ -4659,212 +3618,6 @@
        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
      }
    },
-    "node_modules/@jest/expect/node_modules/@jest/transform": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/@jest/transform/-/transform-29.7.0.tgz",
-      "integrity": "sha512-ok/BTPFzFKVMwO5eOHRrvnBVHdRy9IrsrW1GpMaQ9MCnilNLXQKmAX8s1YXDFaai9xJpac2ySzV0YeRRECr2Vw==",
-      "peer": true,
-      "dependencies": {
-        "@babel/core": "^7.11.6",
-        "@jest/types": "^29.6.3",
-        "@jridgewell/trace-mapping": "^0.3.18",
-        "babel-plugin-istanbul": "^6.1.1",
-        "chalk": "^4.0.0",
-        "convert-source-map": "^2.0.0",
-        "fast-json-stable-stringify": "^2.1.0",
-        "graceful-fs": "^4.2.9",
-        "jest-haste-map": "^29.7.0",
-        "jest-regex-util": "^29.6.3",
-        "jest-util": "^29.7.0",
-        "micromatch": "^4.0.4",
-        "pirates": "^4.0.4",
-        "slash": "^3.0.0",
-        "write-file-atomic": "^4.0.2"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@jest/expect/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==",
-      "peer": true,
-      "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/@jest/expect/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==",
-      "peer": true,
-      "dependencies": {
-        "@types/yargs-parser": "*"
-      }
-    },
-    "node_modules/@jest/expect/node_modules/ansi-styles": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
-      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
-      "peer": true,
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
-      }
-    },
-    "node_modules/@jest/expect/node_modules/convert-source-map": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
-      "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
-      "peer": true
-    },
-    "node_modules/@jest/expect/node_modules/jest-haste-map": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-haste-map/-/jest-haste-map-29.7.0.tgz",
-      "integrity": "sha512-fP8u2pyfqx0K1rGn1R9pyE0/KTn+G7PxktWidOBTqFPLYX0b9ksaMFkhK5vrS3DVun09pckLdlx90QthlW7AmA==",
-      "peer": true,
-      "dependencies": {
-        "@jest/types": "^29.6.3",
-        "@types/graceful-fs": "^4.1.3",
-        "@types/node": "*",
-        "anymatch": "^3.0.3",
-        "fb-watchman": "^2.0.0",
-        "graceful-fs": "^4.2.9",
-        "jest-regex-util": "^29.6.3",
-        "jest-util": "^29.7.0",
-        "jest-worker": "^29.7.0",
-        "micromatch": "^4.0.4",
-        "walker": "^1.0.8"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      },
-      "optionalDependencies": {
-        "fsevents": "^2.3.2"
-      }
-    },
-    "node_modules/@jest/expect/node_modules/jest-regex-util": {
-      "version": "29.6.3",
-      "resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-29.6.3.tgz",
-      "integrity": "sha512-KJJBsRCyyLNWCNBOvZyRDnAIfUiRJ8v+hOBQYGn8gDyF3UegwiP4gwRR3/SDa42g1YbVycTidUF3rKjyLFDWbg==",
-      "peer": true,
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@jest/expect/node_modules/jest-snapshot": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-snapshot/-/jest-snapshot-29.7.0.tgz",
-      "integrity": "sha512-Rm0BMWtxBcioHr1/OX5YCP8Uov4riHvKPknOGs804Zg9JGZgmIBkbtlxJC/7Z4msKYVbIJtfU+tKb8xlYNfdkw==",
-      "peer": true,
-      "dependencies": {
-        "@babel/core": "^7.11.6",
-        "@babel/generator": "^7.7.2",
-        "@babel/plugin-syntax-jsx": "^7.7.2",
-        "@babel/plugin-syntax-typescript": "^7.7.2",
-        "@babel/types": "^7.3.3",
-        "@jest/expect-utils": "^29.7.0",
-        "@jest/transform": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "babel-preset-current-node-syntax": "^1.0.0",
-        "chalk": "^4.0.0",
-        "expect": "^29.7.0",
-        "graceful-fs": "^4.2.9",
-        "jest-diff": "^29.7.0",
-        "jest-get-type": "^29.6.3",
-        "jest-matcher-utils": "^29.7.0",
-        "jest-message-util": "^29.7.0",
-        "jest-util": "^29.7.0",
-        "natural-compare": "^1.4.0",
-        "pretty-format": "^29.7.0",
-        "semver": "^7.5.3"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@jest/expect/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==",
-      "peer": true,
-      "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/@jest/expect/node_modules/pretty-format": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.7.0.tgz",
-      "integrity": "sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==",
-      "peer": true,
-      "dependencies": {
-        "@jest/schemas": "^29.6.3",
-        "ansi-styles": "^5.0.0",
-        "react-is": "^18.0.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/@jest/expect/node_modules/react-is": {
-      "version": "18.3.1",
-      "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
-      "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
-      "peer": true
-    },
-    "node_modules/@jest/expect/node_modules/semver": {
-      "version": "7.6.2",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz",
-      "integrity": "sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==",
-      "peer": true,
-      "bin": {
-        "semver": "bin/semver.js"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/@jest/expect/node_modules/slash": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
-      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
-      "peer": true,
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/@jest/expect/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==",
-      "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/@jest/fake-timers": {
      "version": "26.6.2",
      "resolved": "https://registry.npmjs.org/@jest/fake-timers/-/fake-timers-26.6.2.tgz",
@@ -5040,6 +3793,7 @@
      "version": "29.7.0",
      "resolved": "https://registry.npmjs.org/@jest/reporters/-/reporters-29.7.0.tgz",
      "integrity": "sha512-DApq0KJbJOEzAFYjHADNNxAE3KbhxQB1y5Kplb5Waqw6zVbuWatSnMjE5gs8FUgEPmNsnZA3NCWl9NG0ia04Pg==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "@bcoe/v8-coverage": "^0.2.3",
@@ -5083,6 +3837,7 @@
      "version": "7.24.3",
      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.24.3.tgz",
      "integrity": "sha512-5FcvN1JHw2sHJChotgx8Ek0lyuh4kCKelgMTTqhYJJtloNvUfpAFMeNQUtdlIaktwrSV9LtCdqwk48wL2wBacQ==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "@ampproject/remapping": "^2.2.0",
@@ -5113,6 +3868,7 @@
      "version": "29.7.0",
      "resolved": "https://registry.npmjs.org/@jest/transform/-/transform-29.7.0.tgz",
      "integrity": "sha512-ok/BTPFzFKVMwO5eOHRrvnBVHdRy9IrsrW1GpMaQ9MCnilNLXQKmAX8s1YXDFaai9xJpac2ySzV0YeRRECr2Vw==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "@babel/core": "^7.11.6",
@@ -5139,6 +3895,7 @@
      "version": "29.6.3",
      "resolved": "https://registry.npmjs.org/@jest/types/-/types-29.6.3.tgz",
      "integrity": "sha512-u3UPsIilWKOM3F9CXtrG8LEJmNxwoCQC/XVj4IKYXvvpx7QIi/Kg1LI5uDmDpKlac62NUtX7eLjRh+jVZcLOzw==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "@jest/schemas": "^29.6.3",
@@ -5156,6 +3913,7 @@
      "version": "17.0.32",
      "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-17.0.32.tgz",
      "integrity": "sha512-xQ67Yc/laOG5uMfX/093MRlGGCIBzZMarVa+gfNKJxWAIgykYpVGkBdbqEzGDDfCrVUj6Hiff4mTZ5BA6TmAog==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "@types/yargs-parser": "*"
@@ -5165,12 +3923,14 @@
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
      "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
+      "dev": true,
      "peer": true
    },
    "node_modules/@jest/reporters/node_modules/istanbul-lib-instrument": {
      "version": "6.0.2",
      "resolved": "https://registry.npmjs.org/istanbul-lib-instrument/-/istanbul-lib-instrument-6.0.2.tgz",
      "integrity": "sha512-1WUsZ9R1lA0HtBSohTkm39WTPlNKSJ5iFk7UwqXkBLoHQT+hfqPsfsTDVuZdKGaBwn7din9bS7SsnoAr943hvw==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "@babel/core": "^7.23.9",
@@ -5187,6 +3947,7 @@
      "version": "7.6.0",
      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "lru-cache": "^6.0.0"
@@ -5202,6 +3963,7 @@
      "version": "29.7.0",
      "resolved": "https://registry.npmjs.org/jest-haste-map/-/jest-haste-map-29.7.0.tgz",
      "integrity": "sha512-fP8u2pyfqx0K1rGn1R9pyE0/KTn+G7PxktWidOBTqFPLYX0b9ksaMFkhK5vrS3DVun09pckLdlx90QthlW7AmA==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "@jest/types": "^29.6.3",
@@ -5227,6 +3989,7 @@
      "version": "29.6.3",
      "resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-29.6.3.tgz",
      "integrity": "sha512-KJJBsRCyyLNWCNBOvZyRDnAIfUiRJ8v+hOBQYGn8gDyF3UegwiP4gwRR3/SDa42g1YbVycTidUF3rKjyLFDWbg==",
+      "dev": true,
      "peer": true,
      "engines": {
        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
@@ -5236,6 +3999,7 @@
      "version": "29.7.0",
      "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-29.7.0.tgz",
      "integrity": "sha512-z6EbKajIpqGKU56y5KBUgy1dt1ihhQJgWzUlZHArA/+X2ad7Cb5iF+AK1EWVL/Bo7Rz9uurpqw6SiBCefUbCGA==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "@jest/types": "^29.6.3",
@@ -5253,6 +4017,7 @@
      "version": "6.0.0",
      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "yallist": "^4.0.0"
@@ -5265,6 +4030,7 @@
      "version": "3.0.0",
      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
+      "dev": true,
      "peer": true,
      "engines": {
        "node": ">=8"
@@ -5274,6 +4040,7 @@
      "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==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "imurmurhash": "^0.1.4",
@@ -5287,6 +4054,7 @@
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
+      "dev": true,
      "peer": true
    },
    "node_modules/@jest/schemas": {
@@ -5325,6 +4093,7 @@
      "version": "29.7.0",
      "resolved": "https://registry.npmjs.org/@jest/test-result/-/test-result-29.7.0.tgz",
      "integrity": "sha512-Fdx+tv6x1zlkJPcWXmMDAG2HBnaR9XPSd5aDWQVsfrZmLVT3lU1cwyxLgRmXR9yrq4NBoEm9BMsfgFzTQAbJYA==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "@jest/console": "^29.7.0",
@@ -5340,6 +4109,7 @@
      "version": "29.6.3",
      "resolved": "https://registry.npmjs.org/@jest/types/-/types-29.6.3.tgz",
      "integrity": "sha512-u3UPsIilWKOM3F9CXtrG8LEJmNxwoCQC/XVj4IKYXvvpx7QIi/Kg1LI5uDmDpKlac62NUtX7eLjRh+jVZcLOzw==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "@jest/schemas": "^29.6.3",
@@ -5357,6 +4127,7 @@
      "version": "17.0.32",
      "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-17.0.32.tgz",
      "integrity": "sha512-xQ67Yc/laOG5uMfX/093MRlGGCIBzZMarVa+gfNKJxWAIgykYpVGkBdbqEzGDDfCrVUj6Hiff4mTZ5BA6TmAog==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "@types/yargs-parser": "*"
@@ -5699,9 +4470,9 @@
      }
    },
    "node_modules/@openedx/frontend-build": {
-      "version": "13.1.4",
-      "resolved": "https://registry.npmjs.org/@openedx/frontend-build/-/frontend-build-13.1.4.tgz",
-      "integrity": "sha512-YqXU6KgFnmDD/vGLvq/A9NP6R8lHfaEx64ajQC50ebFMlF3J7HWUruct4PuroeTupq9UAfRZUilzQHYQZjV08A==",
+      "version": "13.0.30",
+      "resolved": "https://registry.npmjs.org/@openedx/frontend-build/-/frontend-build-13.0.30.tgz",
+      "integrity": "sha512-IwoUMMyyjETqnnt0gXXGFz5zHh1pdVrggGmiwGQ+4x/LfJr7FCLR1M+Q837Il2N9FTdsVCUoI4fnZqMJZb/vVg==",
      "dependencies": {
        "@babel/cli": "7.22.5",
        "@babel/core": "7.22.5",
@@ -5717,7 +4488,7 @@
        "@fullhuman/postcss-purgecss": "5.0.0",
        "@pmmmwh/react-refresh-webpack-plugin": "0.5.11",
        "@svgr/webpack": "8.1.0",
-        "autoprefixer": "10.4.19",
+        "autoprefixer": "10.4.16",
        "babel-jest": "26.6.3",
        "babel-loader": "9.1.3",
        "babel-plugin-formatjs": "^10.4.0",
@@ -5731,7 +4502,6 @@
        "dotenv-webpack": "8.0.1",
        "eslint": "8.44.0",
        "eslint-config-airbnb": "19.0.4",
-        "eslint-plugin-formatjs": "^4.12.2",
        "eslint-plugin-import": "2.27.5",
        "eslint-plugin-jsx-a11y": "6.7.1",
        "eslint-plugin-react": "7.32.2",
@@ -5743,8 +4513,8 @@
        "image-minimizer-webpack-plugin": "3.8.3",
        "jest": "26.6.3",
        "mini-css-extract-plugin": "1.6.2",
-        "postcss": "8.4.38",
-        "postcss-custom-media": "10.0.4",
+        "postcss": "8.4.33",
+        "postcss-custom-media": "10.0.2",
        "postcss-loader": "7.3.4",
        "postcss-rtlcss": "5.1.0",
        "react-dev-utils": "12.0.1",
@@ -5903,24 +4673,278 @@
      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
    },
    "node_modules/@openedx/frontend-plugin-framework": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/@openedx/frontend-plugin-framework/-/frontend-plugin-framework-1.1.2.tgz",
-      "integrity": "sha512-DzhkZTbmxX09xXE6yyWs9xSq40cO+CgFF80nq1M7pJAeY0mtv7TWlQT8/YnhmjHS3Kj1u9GdqpRpYu8vHuRurA==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/@openedx/frontend-plugin-framework/-/frontend-plugin-framework-1.0.2.tgz",
+      "integrity": "sha512-9KVFtVp14foXuZVzIN7EyXMha9fhbu4SwXBle81HFzuHEpm46+qxtiIOktH6b4TYh74SMzuSphgP30MCHr1P8Q==",
      "dependencies": {
        "@edx/brand": "npm:@openedx/brand-openedx@^1.2.2",
+        "@edx/frontend-component-footer": "13.0.3",
+        "@edx/frontend-component-header": "5.0.2",
+        "@edx/frontend-platform": "^7.1.0",
+        "@fortawesome/fontawesome-svg-core": "1.2.36",
+        "@fortawesome/free-brands-svg-icons": "5.15.4",
+        "@fortawesome/free-regular-svg-icons": "5.15.4",
+        "@fortawesome/free-solid-svg-icons": "5.15.4",
+        "@fortawesome/react-fontawesome": "0.2.0",
+        "@openedx/paragon": "^21.0.0",
        "classnames": "^2.3.2",
        "core-js": "3.36.0",
+        "prop-types": "15.8.1",
+        "react": "17.0.2",
+        "react-dom": "17.0.2",
+        "react-error-boundary": "^4.0.11",
        "react-redux": "7.2.9",
+        "react-router": "6.22.2",
+        "react-router-dom": "6.22.2",
        "redux": "4.2.1",
        "regenerator-runtime": "0.14.1"
+      }
+    },
+    "node_modules/@openedx/frontend-plugin-framework/node_modules/@edx/frontend-component-footer": {
+      "version": "13.0.3",
+      "resolved": "https://registry.npmjs.org/@edx/frontend-component-footer/-/frontend-component-footer-13.0.3.tgz",
+      "integrity": "sha512-09vX6qC7AcDwG02qhBzKr4x58hpe9FXZrA9ui2cJnsG53pKaNL+wvOSRtDUBNexCf+y/iPg+8RgR+4alkzhZhw==",
+      "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",
+        "lodash": "^4.17.21"
      },
      "peerDependencies": {
-        "@edx/frontend-platform": "^7.0.0 || ^8.0.0",
-        "@openedx/paragon": "^21.0.0 || ^22.0.0",
-        "prop-types": "^15.8.0",
-        "react": "^17.0.0",
-        "react-dom": "^17.0.0",
-        "react-error-boundary": "^4.0.11"
+        "@edx/frontend-platform": "^7.0.0",
+        "@openedx/paragon": ">= 21.11.3 < 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-footer/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-footer/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-footer/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-footer/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-footer/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/fontawesome-common-types": {
+      "version": "0.2.36",
+      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-0.2.36.tgz",
+      "integrity": "sha512-a/7BiSgobHAgBWeN7N0w+lAhInrGxksn13uK7231n2m8EDPE3BMCl9NZLTGrj9ZXfCmC6LM0QLqXidIizVQ6yg==",
+      "hasInstallScript": true,
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@openedx/frontend-plugin-framework/node_modules/@fortawesome/fontawesome-svg-core": {
+      "version": "1.2.36",
+      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-1.2.36.tgz",
+      "integrity": "sha512-YUcsLQKYb6DmaJjIHdDWpBIGCcyE/W+p/LMGvjQem55Mm2XWVAP5kWTMKWLv9lwpCVjpLxPyOMOyUocP1GxrtA==",
+      "hasInstallScript": true,
+      "dependencies": {
+        "@fortawesome/fontawesome-common-types": "^0.2.36"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@openedx/frontend-plugin-framework/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/@openedx/frontend-plugin-framework/node_modules/@openedx/paragon": {
+      "version": "21.13.1",
+      "resolved": "https://registry.npmjs.org/@openedx/paragon/-/paragon-21.13.1.tgz",
+      "integrity": "sha512-sLL+Z3ZWIRM6x+OrKZV0S7/SQpEcSeRcDm7E3FzhsnAWudsJCTELvSW+84uy/8dwV7mJhttsBPqQEtNafbCyYA==",
+      "workspaces": [
+        "example",
+        "component-generator",
+        "www",
+        "icons",
+        "dependent-usage-analyzer"
+      ],
+      "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-imask": "^7.1.3",
+        "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/@openedx/frontend-plugin-framework/node_modules/@openedx/paragon/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/@openedx/paragon/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/@openedx/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/@openedx/frontend-plugin-framework/node_modules/@openedx/paragon/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/@openedx/frontend-plugin-framework/node_modules/@remix-run/router": {
+      "version": "1.15.2",
+      "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.15.2.tgz",
+      "integrity": "sha512-+Rnav+CaoTE5QJc4Jcwh5toUpnVLKYbpU6Ys0zqbakqbaLQHeglLVHPfxOiQqdNmUy5C2lXz5dwC6tQNX2JW2Q==",
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/@openedx/frontend-plugin-framework/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/@openedx/frontend-plugin-framework/node_modules/cli-cursor": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-3.1.0.tgz",
+      "integrity": "sha512-I/zHAwsKf9FqGoXM4WWRACob9+SNukZTd94DWF57E4toouRulbCxcUh6RKUEOQlYTHJnzkPMySvPNaaSLNfLZw==",
+      "dependencies": {
+        "restore-cursor": "^3.1.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@openedx/frontend-plugin-framework/node_modules/cli-width": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-3.0.0.tgz",
+      "integrity": "sha512-FxqpkPPwu1HjuN93Omfm4h8uIanXofW0RxVEW3k5RKx+mJJYSthzNhp32Kzxxy3YAEZ/Dc/EWN1vZRY0+kOhbw==",
+      "engines": {
+        "node": ">= 10"
      }
    },
    "node_modules/@openedx/frontend-plugin-framework/node_modules/core-js": {
@@ -5933,6 +4957,123 @@
        "url": "https://opencollective.com/core-js"
      }
    },
+    "node_modules/@openedx/frontend-plugin-framework/node_modules/emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="
+    },
+    "node_modules/@openedx/frontend-plugin-framework/node_modules/escape-string-regexp": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
+      "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==",
+      "engines": {
+        "node": ">=0.8.0"
+      }
+    },
+    "node_modules/@openedx/frontend-plugin-framework/node_modules/figures": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/figures/-/figures-3.2.0.tgz",
+      "integrity": "sha512-yaduQFRKLXYOGgEn6AZau90j3ggSOyiqXU0F9JZfeXYhNa+Jk4X+s45A2zg5jns87GAFa34BBm2kXw4XpNcbdg==",
+      "dependencies": {
+        "escape-string-regexp": "^1.0.5"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@openedx/frontend-plugin-framework/node_modules/inquirer": {
+      "version": "8.2.6",
+      "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-8.2.6.tgz",
+      "integrity": "sha512-M1WuAmb7pn9zdFRtQYk26ZBoY043Sse0wVDdk4Bppr+JOXyQYybdtvK+l9wUibhtjdjvtoiNy8tk+EgsYIUqKg==",
+      "dependencies": {
+        "ansi-escapes": "^4.2.1",
+        "chalk": "^4.1.1",
+        "cli-cursor": "^3.1.0",
+        "cli-width": "^3.0.0",
+        "external-editor": "^3.0.3",
+        "figures": "^3.0.0",
+        "lodash": "^4.17.21",
+        "mute-stream": "0.0.8",
+        "ora": "^5.4.1",
+        "run-async": "^2.4.0",
+        "rxjs": "^7.5.5",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0",
+        "through": "^2.3.6",
+        "wrap-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=12.0.0"
+      }
+    },
+    "node_modules/@openedx/frontend-plugin-framework/node_modules/is-fullwidth-code-point": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@openedx/frontend-plugin-framework/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/@openedx/frontend-plugin-framework/node_modules/mute-stream": {
+      "version": "0.0.8",
+      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.8.tgz",
+      "integrity": "sha512-nnbWWOkoWyUsTjKrhgD0dcz22mdkSnpYqbEjIm2nhwhuxlSkpywJmBo8h0ZqJdkp73mb90SssHkN4rsRaBAfAA=="
+    },
+    "node_modules/@openedx/frontend-plugin-framework/node_modules/react-error-boundary": {
+      "version": "4.0.13",
+      "resolved": "https://registry.npmjs.org/react-error-boundary/-/react-error-boundary-4.0.13.tgz",
+      "integrity": "sha512-b6PwbdSv8XeOSYvjt8LpgpKrZ0yGdtZokYwkwV2wlcZbxgopHX/hgPl5VgpnoVOWd868n1hktM8Qm4b+02MiLQ==",
+      "dependencies": {
+        "@babel/runtime": "^7.12.5"
+      },
+      "peerDependencies": {
+        "react": ">=16.13.1"
+      }
+    },
+    "node_modules/@openedx/frontend-plugin-framework/node_modules/react-router": {
+      "version": "6.22.2",
+      "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.22.2.tgz",
+      "integrity": "sha512-YD3Dzprzpcq+tBMHBS822tCjnWD3iIZbTeSXMY9LPSG541EfoBGyZ3bS25KEnaZjLcmQpw2AVLkFyfgXY8uvcw==",
+      "dependencies": {
+        "@remix-run/router": "1.15.2"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      },
+      "peerDependencies": {
+        "react": ">=16.8"
+      }
+    },
+    "node_modules/@openedx/frontend-plugin-framework/node_modules/react-router-dom": {
+      "version": "6.22.2",
+      "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.22.2.tgz",
+      "integrity": "sha512-WgqxD2qySEIBPZ3w0sHH+PUAiamDeszls9tzqMPBDA1YYVucTBXLU7+gtRfcSnhe92A3glPnvSxK2dhNoAVOIQ==",
+      "dependencies": {
+        "@remix-run/router": "1.15.2",
+        "react-router": "6.22.2"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      },
+      "peerDependencies": {
+        "react": ">=16.8",
+        "react-dom": ">=16.8"
+      }
+    },
    "node_modules/@openedx/frontend-plugin-framework/node_modules/redux": {
      "version": "4.2.1",
      "resolved": "https://registry.npmjs.org/redux/-/redux-4.2.1.tgz",
@@ -5946,22 +5087,50 @@
      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz",
      "integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw=="
    },
-    "node_modules/@openedx/frontend-slot-footer": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@openedx/frontend-slot-footer/-/frontend-slot-footer-1.0.2.tgz",
-      "integrity": "sha512-Wmx/Das4wr3jYQ1/wk9ctYcM9ztfpY5fm6d5UKFSnKK1DbUbjliaPC3mdGR4wVRnH4MAf1OnNGZ8oj/bTDPGHg==",
+    "node_modules/@openedx/frontend-plugin-framework/node_modules/restore-cursor": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-3.1.0.tgz",
+      "integrity": "sha512-l+sSefzHpj5qimhFSE5a8nufZYAM3sBSVMAPtYkmC+4EH2anSGaEMXSD0izRQbu9nfyQ9y5JrVmp7E8oZrUjvA==",
      "dependencies": {
-        "@openedx/frontend-plugin-framework": "^1.1.2"
+        "onetime": "^5.1.0",
+        "signal-exit": "^3.0.2"
      },
-      "peerDependencies": {
-        "@edx/frontend-component-footer": "*",
-        "react": "^17.0.0"
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@openedx/frontend-plugin-framework/node_modules/rxjs": {
+      "version": "7.8.1",
+      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.1.tgz",
+      "integrity": "sha512-AA3TVj+0A2iuIoQkWEK/tqFjBq2j+6PO6Y0zJcvzLAFhEFIO3HL0vls9hWLncZbAAbK0mar7oZ4V079I/qPMxg==",
+      "dependencies": {
+        "tslib": "^2.1.0"
+      }
+    },
+    "node_modules/@openedx/frontend-plugin-framework/node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
      }
    },
    "node_modules/@openedx/paragon": {
-      "version": "22.3.0",
-      "resolved": "https://registry.npmjs.org/@openedx/paragon/-/paragon-22.3.0.tgz",
-      "integrity": "sha512-tyPD14nNHfNPUzlbtspiBYFoGtrYa5+ANAVLA5ZXV1Oqunw4Etf8VMTj0DMII+BlZixBpc3gFuVHNbQBNd42Pw==",
+      "version": "22.2.1",
+      "resolved": "https://registry.npmjs.org/@openedx/paragon/-/paragon-22.2.1.tgz",
+      "integrity": "sha512-Dd7PzvHwNnUokqbFkuOpugJZ9dHaUBOcYwqAA2aMoN7tgi4xEZWsfDFyP1+se2UPuR7NvNGammEesLAwGQ0Ylw==",
+      "workspaces": [
+        "example",
+        "component-generator",
+        "www",
+        "icons",
+        "dependent-usage-analyzer"
+      ],
      "dependencies": {
        "@fortawesome/fontawesome-svg-core": "^6.1.1",
        "@fortawesome/react-fontawesome": "^0.1.18",
@@ -6878,21 +6047,6 @@
        }
      }
    },
-    "node_modules/@testing-library/react-hooks/node_modules/react-error-boundary": {
-      "version": "3.1.4",
-      "resolved": "https://registry.npmjs.org/react-error-boundary/-/react-error-boundary-3.1.4.tgz",
-      "integrity": "sha512-uM9uPzZJTF6wRQORmSrvOIgt4lJ9MC1sNgEOj2XGsDTRE4kmpWxg7ENK9EWNKJRMAOY9z0MuF4yIfl6gp4sotA==",
-      "dependencies": {
-        "@babel/runtime": "^7.12.5"
-      },
-      "engines": {
-        "node": ">=10",
-        "npm": ">=6"
-      },
-      "peerDependencies": {
-        "react": ">=16.13.1"
-      }
-    },
    "node_modules/@testing-library/user-event": {
      "version": "13.5.0",
      "resolved": "https://registry.npmjs.org/@testing-library/user-event/-/user-event-13.5.0.tgz",
@@ -7191,29 +6345,6 @@
      "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz",
      "integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w=="
    },
-    "node_modules/@types/jsdom": {
-      "version": "20.0.1",
-      "resolved": "https://registry.npmjs.org/@types/jsdom/-/jsdom-20.0.1.tgz",
-      "integrity": "sha512-d0r18sZPmMQr1eG35u12FZfhIXNrnsPU/g5wvRKCUf/tOGilKKwYMYGqh33BNR6ba+2gkHw1EUiHoN3mn7E5IQ==",
-      "peer": true,
-      "dependencies": {
-        "@types/node": "*",
-        "@types/tough-cookie": "*",
-        "parse5": "^7.0.0"
-      }
-    },
-    "node_modules/@types/jsdom/node_modules/parse5": {
-      "version": "7.1.2",
-      "resolved": "https://registry.npmjs.org/parse5/-/parse5-7.1.2.tgz",
-      "integrity": "sha512-Czj1WaSVpaoj0wbhMzLmWD69anp2WH7FXMB9n1Sy8/ZFF9jolSQVMu1Ij5WIyGmcBmhk7EOndpO4mIpihVqAXw==",
-      "peer": true,
-      "dependencies": {
-        "entities": "^4.4.0"
-      },
-      "funding": {
-        "url": "https://github.com/inikulin/parse5?sponsor=1"
-      }
-    },
    "node_modules/@types/json-schema": {
      "version": "7.0.12",
      "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.12.tgz",
@@ -7273,11 +6404,6 @@
      "resolved": "https://registry.npmjs.org/@types/parse-json/-/parse-json-4.0.0.tgz",
      "integrity": "sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA=="
    },
-    "node_modules/@types/picomatch": {
-      "version": "2.3.3",
-      "resolved": "https://registry.npmjs.org/@types/picomatch/-/picomatch-2.3.3.tgz",
-      "integrity": "sha512-Yll76ZHikRFCyz/pffKGjrCwe/le2CDwOP5F210KQo27kpRE46U2rDnzikNlVn6/ezH3Mhn46bJMTfeVTtcYMg=="
-    },
    "node_modules/@types/prettier": {
      "version": "2.7.3",
      "resolved": "https://registry.npmjs.org/@types/prettier/-/prettier-2.7.3.tgz",
@@ -7345,11 +6471,6 @@
      "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.3.tgz",
      "integrity": "sha512-5cJ8CB4yAx7BH1oMvdU0Jh9lrEXyPkar6F9G/ERswkCuvP4KQZfZkSjcMbAICCpQTN4OuZn8tz0HiKv9TGZgrQ=="
    },
-    "node_modules/@types/semver": {
-      "version": "7.5.8",
-      "resolved": "https://registry.npmjs.org/@types/semver/-/semver-7.5.8.tgz",
-      "integrity": "sha512-I8EUhyrgfLrcTkzV3TSsGyl1tSuPrEDzr0yd5m90UgNxQkyDXULk3b6MlQqTCpZpNtWe1K0hzclnZkTcLBe2UQ=="
-    },
    "node_modules/@types/send": {
      "version": "0.17.1",
      "resolved": "https://registry.npmjs.org/@types/send/-/send-0.17.1.tgz",
@@ -7413,12 +6534,6 @@
        "@types/jest": "*"
      }
    },
-    "node_modules/@types/tough-cookie": {
-      "version": "4.0.5",
-      "resolved": "https://registry.npmjs.org/@types/tough-cookie/-/tough-cookie-4.0.5.tgz",
-      "integrity": "sha512-/Ad8+nIOV7Rl++6f1BdKxFSMgmoqEoYbHRpPcx3JEfv8VRsQe9Z4mCXeJBzxs7mbHY/XOZZuXlRNfhpVPbs6ZA==",
-      "peer": true
-    },
    "node_modules/@types/triple-beam": {
      "version": "1.3.2",
      "resolved": "https://registry.npmjs.org/@types/triple-beam/-/triple-beam-1.3.2.tgz",
@@ -7462,229 +6577,6 @@
      "resolved": "https://registry.npmjs.org/@types/yargs-parser/-/yargs-parser-21.0.0.tgz",
      "integrity": "sha512-iO9ZQHkZxHn4mSakYV0vFHAVDyEOIJQrV2uZ06HxEPcx+mt8swXoZHIbaaJ2crJYFfErySgktuTZ3BeLz+XmFA=="
    },
-    "node_modules/@typescript-eslint/scope-manager": {
-      "version": "6.21.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-6.21.0.tgz",
-      "integrity": "sha512-OwLUIWZJry80O99zvqXVEioyniJMa+d2GrqpUTqi5/v5D5rOrppJVBPa0yKCblcigC0/aYAzxxqQ1B+DS2RYsg==",
-      "dependencies": {
-        "@typescript-eslint/types": "6.21.0",
-        "@typescript-eslint/visitor-keys": "6.21.0"
-      },
-      "engines": {
-        "node": "^16.0.0 || >=18.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/typescript-eslint"
-      }
-    },
-    "node_modules/@typescript-eslint/types": {
-      "version": "6.21.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-6.21.0.tgz",
-      "integrity": "sha512-1kFmZ1rOm5epu9NZEZm1kckCDGj5UJEf7P1kliH4LKu/RkwpsfqqGmY2OOcUs18lSlQBKLDYBOGxRVtrMN5lpg==",
-      "engines": {
-        "node": "^16.0.0 || >=18.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/typescript-eslint"
-      }
-    },
-    "node_modules/@typescript-eslint/typescript-estree": {
-      "version": "6.21.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-6.21.0.tgz",
-      "integrity": "sha512-6npJTkZcO+y2/kr+z0hc4HwNfrrP4kNYh57ek7yCNlrBjWQ1Y0OS7jiZTkgumrvkX5HkEKXFZkkdFNkaW2wmUQ==",
-      "dependencies": {
-        "@typescript-eslint/types": "6.21.0",
-        "@typescript-eslint/visitor-keys": "6.21.0",
-        "debug": "^4.3.4",
-        "globby": "^11.1.0",
-        "is-glob": "^4.0.3",
-        "minimatch": "9.0.3",
-        "semver": "^7.5.4",
-        "ts-api-utils": "^1.0.1"
-      },
-      "engines": {
-        "node": "^16.0.0 || >=18.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/typescript-eslint"
-      },
-      "peerDependenciesMeta": {
-        "typescript": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/@typescript-eslint/typescript-estree/node_modules/array-union": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz",
-      "integrity": "sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==",
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/@typescript-eslint/typescript-estree/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/@typescript-eslint/typescript-estree/node_modules/globby": {
-      "version": "11.1.0",
-      "resolved": "https://registry.npmjs.org/globby/-/globby-11.1.0.tgz",
-      "integrity": "sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==",
-      "dependencies": {
-        "array-union": "^2.1.0",
-        "dir-glob": "^3.0.1",
-        "fast-glob": "^3.2.9",
-        "ignore": "^5.2.0",
-        "merge2": "^1.4.1",
-        "slash": "^3.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
-    "node_modules/@typescript-eslint/typescript-estree/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-      "dependencies": {
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/@typescript-eslint/typescript-estree/node_modules/minimatch": {
-      "version": "9.0.3",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz",
-      "integrity": "sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==",
-      "dependencies": {
-        "brace-expansion": "^2.0.1"
-      },
-      "engines": {
-        "node": ">=16 || 14 >=14.17"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
-    "node_modules/@typescript-eslint/typescript-estree/node_modules/semver": {
-      "version": "7.6.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
-      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
-      "bin": {
-        "semver": "bin/semver.js"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/@typescript-eslint/typescript-estree/node_modules/slash": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
-      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/@typescript-eslint/typescript-estree/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/@typescript-eslint/utils": {
-      "version": "6.21.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-6.21.0.tgz",
-      "integrity": "sha512-NfWVaC8HP9T8cbKQxHcsJBY5YE1O33+jpMwN45qzWWaPDZgLIbo12toGMWnmhvCpd3sIxkpDw3Wv1B3dYrbDQQ==",
-      "dependencies": {
-        "@eslint-community/eslint-utils": "^4.4.0",
-        "@types/json-schema": "^7.0.12",
-        "@types/semver": "^7.5.0",
-        "@typescript-eslint/scope-manager": "6.21.0",
-        "@typescript-eslint/types": "6.21.0",
-        "@typescript-eslint/typescript-estree": "6.21.0",
-        "semver": "^7.5.4"
-      },
-      "engines": {
-        "node": "^16.0.0 || >=18.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/typescript-eslint"
-      },
-      "peerDependencies": {
-        "eslint": "^7.0.0 || ^8.0.0"
-      }
-    },
-    "node_modules/@typescript-eslint/utils/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-      "dependencies": {
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/@typescript-eslint/utils/node_modules/semver": {
-      "version": "7.6.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
-      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
-      "bin": {
-        "semver": "bin/semver.js"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/@typescript-eslint/utils/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/@typescript-eslint/visitor-keys": {
-      "version": "6.21.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-6.21.0.tgz",
-      "integrity": "sha512-JJtkDduxLi9bivAB+cYOVMtbkqdPOhZ+ZI5LC47MIRrDV4Yn2o+ZnW10Nkmr28xRpSpdJ6Sm42Hjf2+REYXm0A==",
-      "dependencies": {
-        "@typescript-eslint/types": "6.21.0",
-        "eslint-visitor-keys": "^3.4.1"
-      },
-      "engines": {
-        "node": "^16.0.0 || >=18.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/typescript-eslint"
-      }
-    },
-    "node_modules/@typescript-eslint/visitor-keys/node_modules/eslint-visitor-keys": {
-      "version": "3.4.3",
-      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz",
-      "integrity": "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==",
-      "engines": {
-        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/eslint"
-      }
-    },
    "node_modules/@webassemblyjs/ast": {
      "version": "1.11.6",
      "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.11.6.tgz",
@@ -7867,12 +6759,6 @@
      "resolved": "https://registry.npmjs.org/@xtuc/long/-/long-4.2.2.tgz",
      "integrity": "sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ=="
    },
-    "node_modules/@yarnpkg/lockfile": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@yarnpkg/lockfile/-/lockfile-1.1.0.tgz",
-      "integrity": "sha512-GpSwvyXOcOOlV70vbnzjj4fW5xW/FdUF6nQEt1ENy7m4ZCczi1+/buVUPAqmGfqznsORNFzUMjctTIp8a9tuCQ==",
-      "dev": true
-    },
    "node_modules/abab": {
      "version": "2.0.6",
      "resolved": "https://registry.npmjs.org/abab/-/abab-2.0.6.tgz",
@@ -8382,9 +7268,9 @@
      }
    },
    "node_modules/autoprefixer": {
-      "version": "10.4.19",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.19.tgz",
-      "integrity": "sha512-BaENR2+zBZ8xXhM4pUaKUxlVdxZ0EZhjvbopwnXmxRUfqDmwSpC2lAi/QXvx7NRdPCo1WKEcEF6mV64si1z4Ew==",
+      "version": "10.4.16",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.16.tgz",
+      "integrity": "sha512-7vd3UC6xKp0HLfua5IjZlcXvGAGy7cBAXTg2lyQ/8WpNhd6SiZ8Be+xm3FyBSYJx5GKcpRCzBh7RH4/0dnY+uQ==",
      "funding": [
        {
          "type": "opencollective",
@@ -8400,9 +7286,9 @@
        }
      ],
      "dependencies": {
-        "browserslist": "^4.23.0",
-        "caniuse-lite": "^1.0.30001599",
-        "fraction.js": "^4.3.7",
+        "browserslist": "^4.21.10",
+        "caniuse-lite": "^1.0.30001538",
+        "fraction.js": "^4.3.6",
        "normalize-range": "^0.1.2",
        "picocolors": "^1.0.0",
        "postcss-value-parser": "^4.2.0"
@@ -8662,6 +7548,18 @@
      "resolved": "https://registry.npmjs.org/@types/node/-/node-17.0.45.tgz",
      "integrity": "sha512-w+tIMs3rq2afQdsPJlODhoUEKzFP1ayaoyl1CcnwtIlsVe7K7bA1NGm4s3PraqTLlXnbIN84zuBlxBWo1u9BLw=="
    },
+    "node_modules/babel-plugin-formatjs/node_modules/typescript": {
+      "version": "5.4.3",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.3.tgz",
+      "integrity": "sha512-KrPd3PKaCLr78MalgiwJnA25Nm8HAmdwN3mYUYZgG/wizIo9EainNVQI9/yDavtVFRN2h3k8uf3GLHuhDMgEHg==",
+      "bin": {
+        "tsc": "bin/tsc",
+        "tsserver": "bin/tsserver"
+      },
+      "engines": {
+        "node": ">=14.17"
+      }
+    },
    "node_modules/babel-plugin-istanbul": {
      "version": "6.1.1",
      "resolved": "https://registry.npmjs.org/babel-plugin-istanbul/-/babel-plugin-istanbul-6.1.1.tgz",
@@ -9088,18 +7986,6 @@
        "node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7"
      }
    },
-    "node_modules/bs-logger": {
-      "version": "0.2.6",
-      "resolved": "https://registry.npmjs.org/bs-logger/-/bs-logger-0.2.6.tgz",
-      "integrity": "sha512-pd8DCoxmbgc7hyPKOvxtqNcjYoOsABPQdcCUjGp3d42VR2CX1ORhk2A87oqqu5R1kk+76nsxZupkmyd+MVtCog==",
-      "peer": true,
-      "dependencies": {
-        "fast-json-stable-stringify": "2.x"
-      },
-      "engines": {
-        "node": ">= 6"
-      }
-    },
    "node_modules/bser": {
      "version": "2.1.1",
      "resolved": "https://registry.npmjs.org/bser/-/bser-2.1.1.tgz",
@@ -9222,9 +8108,9 @@
      }
    },
    "node_modules/caniuse-lite": {
-      "version": "1.0.30001610",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001610.tgz",
-      "integrity": "sha512-QFutAY4NgaelojVMjY63o6XlZyORPaLfyMnsl3HgnWdJUcX6K0oaJymHjH8PT5Gk7sTm8rvC/c5COUQKXqmOMA==",
+      "version": "1.0.30001591",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001591.tgz",
+      "integrity": "sha512-PCzRMei/vXjJyL5mJtzNiUCKP59dm8Apqc3PH8gJkMnMXZGox93RbE76jHsmLwmIo6/3nsYIpJtx0O7u5PqFuQ==",
      "funding": [
        {
          "type": "opencollective",
@@ -9666,6 +8552,7 @@
      "version": "8.0.1",
      "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz",
      "integrity": "sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==",
+      "dev": true,
      "dependencies": {
        "string-width": "^4.2.0",
        "strip-ansi": "^6.0.1",
@@ -9678,12 +8565,14 @@
    "node_modules/cliui/node_modules/emoji-regex": {
      "version": "8.0.0",
      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
-      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+      "dev": true
    },
    "node_modules/cliui/node_modules/is-fullwidth-code-point": {
      "version": "3.0.0",
      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+      "dev": true,
      "engines": {
        "node": ">=8"
      }
@@ -9692,6 +8581,7 @@
      "version": "4.2.3",
      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
      "dependencies": {
        "emoji-regex": "^8.0.0",
        "is-fullwidth-code-point": "^3.0.0",
@@ -9705,6 +8595,7 @@
      "version": "7.0.0",
      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+      "dev": true,
      "dependencies": {
        "ansi-styles": "^4.0.0",
        "string-width": "^4.1.0",
@@ -10174,638 +9065,6 @@
        "js-yaml": "bin/js-yaml.js"
      }
    },
-    "node_modules/create-jest": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/create-jest/-/create-jest-29.7.0.tgz",
-      "integrity": "sha512-Adz2bdH0Vq3F53KEMJOoftQFutWCukm6J24wbPWRO4k1kMY7gS7ds/uoJkNuV8wDCtWWnuwGcJwpWcih+zEW1Q==",
-      "peer": true,
-      "dependencies": {
-        "@jest/types": "^29.6.3",
-        "chalk": "^4.0.0",
-        "exit": "^0.1.2",
-        "graceful-fs": "^4.2.9",
-        "jest-config": "^29.7.0",
-        "jest-util": "^29.7.0",
-        "prompts": "^2.0.1"
-      },
-      "bin": {
-        "create-jest": "bin/create-jest.js"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/create-jest/node_modules/@jest/environment": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/@jest/environment/-/environment-29.7.0.tgz",
-      "integrity": "sha512-aQIfHDq33ExsN4jP1NWGXhxgQ/wixs60gDiKO+XVMd8Mn0NWPWgc34ZQDTb2jKaUWQ7MuwoitXAsN2XVXNMpAw==",
-      "peer": true,
-      "dependencies": {
-        "@jest/fake-timers": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "@types/node": "*",
-        "jest-mock": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/create-jest/node_modules/@jest/fake-timers": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/@jest/fake-timers/-/fake-timers-29.7.0.tgz",
-      "integrity": "sha512-q4DH1Ha4TTFPdxLsqDXK1d3+ioSL7yL5oCMJZgDYm6i+6CygW5E5xVr/D1HdsGxjt1ZWSfUAs9OxSB/BNelWrQ==",
-      "peer": true,
-      "dependencies": {
-        "@jest/types": "^29.6.3",
-        "@sinonjs/fake-timers": "^10.0.2",
-        "@types/node": "*",
-        "jest-message-util": "^29.7.0",
-        "jest-mock": "^29.7.0",
-        "jest-util": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/create-jest/node_modules/@jest/globals": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/@jest/globals/-/globals-29.7.0.tgz",
-      "integrity": "sha512-mpiz3dutLbkW2MNFubUGUEVLkTGiqW6yLVTA+JbP6fI6J5iL9Y0Nlg8k95pcF8ctKwCS7WVxteBs29hhfAotzQ==",
-      "peer": true,
-      "dependencies": {
-        "@jest/environment": "^29.7.0",
-        "@jest/expect": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "jest-mock": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/create-jest/node_modules/@jest/source-map": {
-      "version": "29.6.3",
-      "resolved": "https://registry.npmjs.org/@jest/source-map/-/source-map-29.6.3.tgz",
-      "integrity": "sha512-MHjT95QuipcPrpLM+8JMSzFx6eHp5Bm+4XeFDJlwsvVBjmKNiIAvasGK2fxz2WbGRlnvqehFbh07MMa7n3YJnw==",
-      "peer": true,
-      "dependencies": {
-        "@jridgewell/trace-mapping": "^0.3.18",
-        "callsites": "^3.0.0",
-        "graceful-fs": "^4.2.9"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/create-jest/node_modules/@jest/test-sequencer": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/@jest/test-sequencer/-/test-sequencer-29.7.0.tgz",
-      "integrity": "sha512-GQwJ5WZVrKnOJuiYiAF52UNUJXgTZx1NHjFSEB0qEMmSZKAkdMoIzw/Cj6x6NF4AvV23AUqDpFzQkN/eYCYTxw==",
-      "peer": true,
-      "dependencies": {
-        "@jest/test-result": "^29.7.0",
-        "graceful-fs": "^4.2.9",
-        "jest-haste-map": "^29.7.0",
-        "slash": "^3.0.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/create-jest/node_modules/@jest/transform": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/@jest/transform/-/transform-29.7.0.tgz",
-      "integrity": "sha512-ok/BTPFzFKVMwO5eOHRrvnBVHdRy9IrsrW1GpMaQ9MCnilNLXQKmAX8s1YXDFaai9xJpac2ySzV0YeRRECr2Vw==",
-      "peer": true,
-      "dependencies": {
-        "@babel/core": "^7.11.6",
-        "@jest/types": "^29.6.3",
-        "@jridgewell/trace-mapping": "^0.3.18",
-        "babel-plugin-istanbul": "^6.1.1",
-        "chalk": "^4.0.0",
-        "convert-source-map": "^2.0.0",
-        "fast-json-stable-stringify": "^2.1.0",
-        "graceful-fs": "^4.2.9",
-        "jest-haste-map": "^29.7.0",
-        "jest-regex-util": "^29.6.3",
-        "jest-util": "^29.7.0",
-        "micromatch": "^4.0.4",
-        "pirates": "^4.0.4",
-        "slash": "^3.0.0",
-        "write-file-atomic": "^4.0.2"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/create-jest/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==",
-      "peer": true,
-      "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/create-jest/node_modules/@sinonjs/commons": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/@sinonjs/commons/-/commons-3.0.1.tgz",
-      "integrity": "sha512-K3mCHKQ9sVh8o1C9cxkwxaOmXoAMlDxC1mYyHrjqOWEcBjYr76t96zL2zlj5dUGZ3HSw240X1qgH3Mjf1yJWpQ==",
-      "peer": true,
-      "dependencies": {
-        "type-detect": "4.0.8"
-      }
-    },
-    "node_modules/create-jest/node_modules/@sinonjs/fake-timers": {
-      "version": "10.3.0",
-      "resolved": "https://registry.npmjs.org/@sinonjs/fake-timers/-/fake-timers-10.3.0.tgz",
-      "integrity": "sha512-V4BG07kuYSUkTCSBHG8G8TNhM+F19jXFWnQtzj+we8DrkpSBCee9Z3Ms8yiGer/dlmhe35/Xdgyo3/0rQKg7YA==",
-      "peer": true,
-      "dependencies": {
-        "@sinonjs/commons": "^3.0.0"
-      }
-    },
-    "node_modules/create-jest/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==",
-      "peer": true,
-      "dependencies": {
-        "@types/yargs-parser": "*"
-      }
-    },
-    "node_modules/create-jest/node_modules/ansi-styles": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
-      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
-      "peer": true,
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
-      }
-    },
-    "node_modules/create-jest/node_modules/babel-jest": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-29.7.0.tgz",
-      "integrity": "sha512-BrvGY3xZSwEcCzKvKsCi2GgHqDqsYkOP4/by5xCgIwGXQxIEh+8ew3gmrE1y7XRR6LHZIj6yLYnUi/mm2KXKBg==",
-      "peer": true,
-      "dependencies": {
-        "@jest/transform": "^29.7.0",
-        "@types/babel__core": "^7.1.14",
-        "babel-plugin-istanbul": "^6.1.1",
-        "babel-preset-jest": "^29.6.3",
-        "chalk": "^4.0.0",
-        "graceful-fs": "^4.2.9",
-        "slash": "^3.0.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.8.0"
-      }
-    },
-    "node_modules/create-jest/node_modules/babel-plugin-jest-hoist": {
-      "version": "29.6.3",
-      "resolved": "https://registry.npmjs.org/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-29.6.3.tgz",
-      "integrity": "sha512-ESAc/RJvGTFEzRwOTT4+lNDk/GNHMkKbNzsvT0qKRfDyyYTskxB5rnU2njIDYVxXCBHHEI1c0YwHob3WaYujOg==",
-      "peer": true,
-      "dependencies": {
-        "@babel/template": "^7.3.3",
-        "@babel/types": "^7.3.3",
-        "@types/babel__core": "^7.1.14",
-        "@types/babel__traverse": "^7.0.6"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/create-jest/node_modules/babel-preset-jest": {
-      "version": "29.6.3",
-      "resolved": "https://registry.npmjs.org/babel-preset-jest/-/babel-preset-jest-29.6.3.tgz",
-      "integrity": "sha512-0B3bhxR6snWXJZtR/RliHTDPRgn1sNHOR0yVtq/IiQFyuOVjFS+wuio/R4gSNkyYmKmJB4wGZv2NZanmKmTnNA==",
-      "peer": true,
-      "dependencies": {
-        "babel-plugin-jest-hoist": "^29.6.3",
-        "babel-preset-current-node-syntax": "^1.0.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0"
-      }
-    },
-    "node_modules/create-jest/node_modules/cjs-module-lexer": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/cjs-module-lexer/-/cjs-module-lexer-1.3.1.tgz",
-      "integrity": "sha512-a3KdPAANPbNE4ZUv9h6LckSl9zLsYOP4MBmhIPkRaeyybt+r4UghLvq+xw/YwUcC1gqylCkL4rdVs3Lwupjm4Q==",
-      "peer": true
-    },
-    "node_modules/create-jest/node_modules/convert-source-map": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
-      "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
-      "peer": true
-    },
-    "node_modules/create-jest/node_modules/emittery": {
-      "version": "0.13.1",
-      "resolved": "https://registry.npmjs.org/emittery/-/emittery-0.13.1.tgz",
-      "integrity": "sha512-DeWwawk6r5yR9jFgnDKYt4sLS0LmHJJi3ZOnb5/JdbYwj3nW+FxQnHIjhBKz8YLC7oRNPVM9NQ47I3CVx34eqQ==",
-      "peer": true,
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "url": "https://github.com/sindresorhus/emittery?sponsor=1"
-      }
-    },
-    "node_modules/create-jest/node_modules/jest-config": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-config/-/jest-config-29.7.0.tgz",
-      "integrity": "sha512-uXbpfeQ7R6TZBqI3/TxCU4q4ttk3u0PJeC+E0zbfSoSjq6bJ7buBPxzQPL0ifrkY4DNu4JUdk0ImlBUYi840eQ==",
-      "peer": true,
-      "dependencies": {
-        "@babel/core": "^7.11.6",
-        "@jest/test-sequencer": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "babel-jest": "^29.7.0",
-        "chalk": "^4.0.0",
-        "ci-info": "^3.2.0",
-        "deepmerge": "^4.2.2",
-        "glob": "^7.1.3",
-        "graceful-fs": "^4.2.9",
-        "jest-circus": "^29.7.0",
-        "jest-environment-node": "^29.7.0",
-        "jest-get-type": "^29.6.3",
-        "jest-regex-util": "^29.6.3",
-        "jest-resolve": "^29.7.0",
-        "jest-runner": "^29.7.0",
-        "jest-util": "^29.7.0",
-        "jest-validate": "^29.7.0",
-        "micromatch": "^4.0.4",
-        "parse-json": "^5.2.0",
-        "pretty-format": "^29.7.0",
-        "slash": "^3.0.0",
-        "strip-json-comments": "^3.1.1"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      },
-      "peerDependencies": {
-        "@types/node": "*",
-        "ts-node": ">=9.0.0"
-      },
-      "peerDependenciesMeta": {
-        "@types/node": {
-          "optional": true
-        },
-        "ts-node": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/create-jest/node_modules/jest-docblock": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-docblock/-/jest-docblock-29.7.0.tgz",
-      "integrity": "sha512-q617Auw3A612guyaFgsbFeYpNP5t2aoUNLwBUbc/0kD1R4t9ixDbyFTHd1nok4epoVFpr7PmeWHrhvuV3XaJ4g==",
-      "peer": true,
-      "dependencies": {
-        "detect-newline": "^3.0.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/create-jest/node_modules/jest-environment-node": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-environment-node/-/jest-environment-node-29.7.0.tgz",
-      "integrity": "sha512-DOSwCRqXirTOyheM+4d5YZOrWcdu0LNZ87ewUoywbcb2XR4wKgqiG8vNeYwhjFMbEkfju7wx2GYH0P2gevGvFw==",
-      "peer": true,
-      "dependencies": {
-        "@jest/environment": "^29.7.0",
-        "@jest/fake-timers": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "@types/node": "*",
-        "jest-mock": "^29.7.0",
-        "jest-util": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/create-jest/node_modules/jest-haste-map": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-haste-map/-/jest-haste-map-29.7.0.tgz",
-      "integrity": "sha512-fP8u2pyfqx0K1rGn1R9pyE0/KTn+G7PxktWidOBTqFPLYX0b9ksaMFkhK5vrS3DVun09pckLdlx90QthlW7AmA==",
-      "peer": true,
-      "dependencies": {
-        "@jest/types": "^29.6.3",
-        "@types/graceful-fs": "^4.1.3",
-        "@types/node": "*",
-        "anymatch": "^3.0.3",
-        "fb-watchman": "^2.0.0",
-        "graceful-fs": "^4.2.9",
-        "jest-regex-util": "^29.6.3",
-        "jest-util": "^29.7.0",
-        "jest-worker": "^29.7.0",
-        "micromatch": "^4.0.4",
-        "walker": "^1.0.8"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      },
-      "optionalDependencies": {
-        "fsevents": "^2.3.2"
-      }
-    },
-    "node_modules/create-jest/node_modules/jest-leak-detector": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-leak-detector/-/jest-leak-detector-29.7.0.tgz",
-      "integrity": "sha512-kYA8IJcSYtST2BY9I+SMC32nDpBT3J2NvWJx8+JCuCdl/CR1I4EKUJROiP8XtCcxqgTTBGJNdbB1A8XRKbTetw==",
-      "peer": true,
-      "dependencies": {
-        "jest-get-type": "^29.6.3",
-        "pretty-format": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/create-jest/node_modules/jest-mock": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-mock/-/jest-mock-29.7.0.tgz",
-      "integrity": "sha512-ITOMZn+UkYS4ZFh83xYAOzWStloNzJFO2s8DWrE4lhtGD+AorgnbkiKERe4wQVBydIGPx059g6riW5Btp6Llnw==",
-      "peer": true,
-      "dependencies": {
-        "@jest/types": "^29.6.3",
-        "@types/node": "*",
-        "jest-util": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/create-jest/node_modules/jest-regex-util": {
-      "version": "29.6.3",
-      "resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-29.6.3.tgz",
-      "integrity": "sha512-KJJBsRCyyLNWCNBOvZyRDnAIfUiRJ8v+hOBQYGn8gDyF3UegwiP4gwRR3/SDa42g1YbVycTidUF3rKjyLFDWbg==",
-      "peer": true,
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/create-jest/node_modules/jest-resolve": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-resolve/-/jest-resolve-29.7.0.tgz",
-      "integrity": "sha512-IOVhZSrg+UvVAshDSDtHyFCCBUl/Q3AAJv8iZ6ZjnZ74xzvwuzLXid9IIIPgTnY62SJjfuupMKZsZQRsCvxEgA==",
-      "peer": true,
-      "dependencies": {
-        "chalk": "^4.0.0",
-        "graceful-fs": "^4.2.9",
-        "jest-haste-map": "^29.7.0",
-        "jest-pnp-resolver": "^1.2.2",
-        "jest-util": "^29.7.0",
-        "jest-validate": "^29.7.0",
-        "resolve": "^1.20.0",
-        "resolve.exports": "^2.0.0",
-        "slash": "^3.0.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/create-jest/node_modules/jest-runner": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-runner/-/jest-runner-29.7.0.tgz",
-      "integrity": "sha512-fsc4N6cPCAahybGBfTRcq5wFR6fpLznMg47sY5aDpsoejOcVYFb07AHuSnR0liMcPTgBsA3ZJL6kFOjPdoNipQ==",
-      "peer": true,
-      "dependencies": {
-        "@jest/console": "^29.7.0",
-        "@jest/environment": "^29.7.0",
-        "@jest/test-result": "^29.7.0",
-        "@jest/transform": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "@types/node": "*",
-        "chalk": "^4.0.0",
-        "emittery": "^0.13.1",
-        "graceful-fs": "^4.2.9",
-        "jest-docblock": "^29.7.0",
-        "jest-environment-node": "^29.7.0",
-        "jest-haste-map": "^29.7.0",
-        "jest-leak-detector": "^29.7.0",
-        "jest-message-util": "^29.7.0",
-        "jest-resolve": "^29.7.0",
-        "jest-runtime": "^29.7.0",
-        "jest-util": "^29.7.0",
-        "jest-watcher": "^29.7.0",
-        "jest-worker": "^29.7.0",
-        "p-limit": "^3.1.0",
-        "source-map-support": "0.5.13"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/create-jest/node_modules/jest-runtime": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-runtime/-/jest-runtime-29.7.0.tgz",
-      "integrity": "sha512-gUnLjgwdGqW7B4LvOIkbKs9WGbn+QLqRQQ9juC6HndeDiezIwhDP+mhMwHWCEcfQ5RUXa6OPnFF8BJh5xegwwQ==",
-      "peer": true,
-      "dependencies": {
-        "@jest/environment": "^29.7.0",
-        "@jest/fake-timers": "^29.7.0",
-        "@jest/globals": "^29.7.0",
-        "@jest/source-map": "^29.6.3",
-        "@jest/test-result": "^29.7.0",
-        "@jest/transform": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "@types/node": "*",
-        "chalk": "^4.0.0",
-        "cjs-module-lexer": "^1.0.0",
-        "collect-v8-coverage": "^1.0.0",
-        "glob": "^7.1.3",
-        "graceful-fs": "^4.2.9",
-        "jest-haste-map": "^29.7.0",
-        "jest-message-util": "^29.7.0",
-        "jest-mock": "^29.7.0",
-        "jest-regex-util": "^29.6.3",
-        "jest-resolve": "^29.7.0",
-        "jest-snapshot": "^29.7.0",
-        "jest-util": "^29.7.0",
-        "slash": "^3.0.0",
-        "strip-bom": "^4.0.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/create-jest/node_modules/jest-snapshot": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-snapshot/-/jest-snapshot-29.7.0.tgz",
-      "integrity": "sha512-Rm0BMWtxBcioHr1/OX5YCP8Uov4riHvKPknOGs804Zg9JGZgmIBkbtlxJC/7Z4msKYVbIJtfU+tKb8xlYNfdkw==",
-      "peer": true,
-      "dependencies": {
-        "@babel/core": "^7.11.6",
-        "@babel/generator": "^7.7.2",
-        "@babel/plugin-syntax-jsx": "^7.7.2",
-        "@babel/plugin-syntax-typescript": "^7.7.2",
-        "@babel/types": "^7.3.3",
-        "@jest/expect-utils": "^29.7.0",
-        "@jest/transform": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "babel-preset-current-node-syntax": "^1.0.0",
-        "chalk": "^4.0.0",
-        "expect": "^29.7.0",
-        "graceful-fs": "^4.2.9",
-        "jest-diff": "^29.7.0",
-        "jest-get-type": "^29.6.3",
-        "jest-matcher-utils": "^29.7.0",
-        "jest-message-util": "^29.7.0",
-        "jest-util": "^29.7.0",
-        "natural-compare": "^1.4.0",
-        "pretty-format": "^29.7.0",
-        "semver": "^7.5.3"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/create-jest/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==",
-      "peer": true,
-      "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/create-jest/node_modules/jest-validate": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-validate/-/jest-validate-29.7.0.tgz",
-      "integrity": "sha512-ZB7wHqaRGVw/9hST/OuFUReG7M8vKeq0/J2egIGLdvjHCmYqGARhzXmtgi+gVeZ5uXFF219aOc3Ls2yLg27tkw==",
-      "peer": true,
-      "dependencies": {
-        "@jest/types": "^29.6.3",
-        "camelcase": "^6.2.0",
-        "chalk": "^4.0.0",
-        "jest-get-type": "^29.6.3",
-        "leven": "^3.1.0",
-        "pretty-format": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/create-jest/node_modules/jest-watcher": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-watcher/-/jest-watcher-29.7.0.tgz",
-      "integrity": "sha512-49Fg7WXkU3Vl2h6LbLtMQ/HyB6rXSIX7SqvBLQmssRBGN9I0PNvPmAmCWSOY6SOvrjhI/F7/bGAv9RtnsPA03g==",
-      "peer": true,
-      "dependencies": {
-        "@jest/test-result": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "@types/node": "*",
-        "ansi-escapes": "^4.2.1",
-        "chalk": "^4.0.0",
-        "emittery": "^0.13.1",
-        "jest-util": "^29.7.0",
-        "string-length": "^4.0.1"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/create-jest/node_modules/pretty-format": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.7.0.tgz",
-      "integrity": "sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==",
-      "peer": true,
-      "dependencies": {
-        "@jest/schemas": "^29.6.3",
-        "ansi-styles": "^5.0.0",
-        "react-is": "^18.0.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/create-jest/node_modules/react-is": {
-      "version": "18.3.1",
-      "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
-      "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
-      "peer": true
-    },
-    "node_modules/create-jest/node_modules/semver": {
-      "version": "7.6.2",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz",
-      "integrity": "sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==",
-      "peer": true,
-      "bin": {
-        "semver": "bin/semver.js"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/create-jest/node_modules/slash": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
-      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
-      "peer": true,
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/create-jest/node_modules/source-map": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
-      "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-      "peer": true,
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
-    "node_modules/create-jest/node_modules/source-map-support": {
-      "version": "0.5.13",
-      "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.13.tgz",
-      "integrity": "sha512-SHSKFHadjVA5oR4PPqhtAVdcBWwRYVd6g6cAXnIbRiIwc2EhPrTuKUBdSLvlEKyIP3GCf89fltvcZiP9MMFA1w==",
-      "peer": true,
-      "dependencies": {
-        "buffer-from": "^1.0.0",
-        "source-map": "^0.6.0"
-      }
-    },
-    "node_modules/create-jest/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==",
-      "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/cross-spawn": {
      "version": "7.0.3",
      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",
@@ -11179,20 +9438,6 @@
        "url": "https://github.com/sponsors/sindresorhus"
      }
    },
-    "node_modules/dedent": {
-      "version": "1.5.3",
-      "resolved": "https://registry.npmjs.org/dedent/-/dedent-1.5.3.tgz",
-      "integrity": "sha512-NHQtfOOW68WD8lgypbLA5oT+Bt0xXJhiYvoR6SmmNXZfpzOGXwdKWmcwG8N7PwVVWV3eF/68nmD9BaJSsTBhyQ==",
-      "peer": true,
-      "peerDependencies": {
-        "babel-plugin-macros": "^3.1.0"
-      },
-      "peerDependenciesMeta": {
-        "babel-plugin-macros": {
-          "optional": true
-        }
-      }
-    },
    "node_modules/deep-equal": {
      "version": "2.2.1",
      "resolved": "https://registry.npmjs.org/deep-equal/-/deep-equal-2.2.1.tgz",
@@ -12260,59 +10505,6 @@
        "ms": "^2.1.1"
      }
    },
-    "node_modules/eslint-plugin-formatjs": {
-      "version": "4.13.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-formatjs/-/eslint-plugin-formatjs-4.13.0.tgz",
-      "integrity": "sha512-sxgHQNyVclNRO7aydGwxohwxYR03/oRDW0uUXFWayNMPTlnb9sET3LCovBjvQF7qAHDGFDcLwg4ECSyui4nG8A==",
-      "dependencies": {
-        "@formatjs/icu-messageformat-parser": "2.7.6",
-        "@formatjs/ts-transformer": "3.13.12",
-        "@types/eslint": "7 || 8",
-        "@types/picomatch": "^2.3.0",
-        "@typescript-eslint/utils": "^6.18.1",
-        "emoji-regex": "^10.2.1",
-        "magic-string": "^0.30.0",
-        "picomatch": "^2.3.1",
-        "tslib": "2.6.2",
-        "typescript": "5",
-        "unicode-emoji-utils": "^1.2.0"
-      },
-      "peerDependencies": {
-        "eslint": "7 || 8"
-      }
-    },
-    "node_modules/eslint-plugin-formatjs/node_modules/@formatjs/ts-transformer": {
-      "version": "3.13.12",
-      "resolved": "https://registry.npmjs.org/@formatjs/ts-transformer/-/ts-transformer-3.13.12.tgz",
-      "integrity": "sha512-uf1+DgbsCrzHAg7uIf0QlzpIkHYxRSRig5iJa9FaoUNIDZzNEE2oW/uLLLq7I9Z2FLIPhbmgq8hbW40FoQv+Fg==",
-      "dependencies": {
-        "@formatjs/icu-messageformat-parser": "2.7.6",
-        "@types/json-stable-stringify": "^1.0.32",
-        "@types/node": "14 || 16 || 17",
-        "chalk": "^4.0.0",
-        "json-stable-stringify": "^1.0.1",
-        "tslib": "^2.4.0",
-        "typescript": "5"
-      },
-      "peerDependencies": {
-        "ts-jest": ">=27"
-      },
-      "peerDependenciesMeta": {
-        "ts-jest": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/eslint-plugin-formatjs/node_modules/@types/node": {
-      "version": "17.0.45",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-17.0.45.tgz",
-      "integrity": "sha512-w+tIMs3rq2afQdsPJlODhoUEKzFP1ayaoyl1CcnwtIlsVe7K7bA1NGm4s3PraqTLlXnbIN84zuBlxBWo1u9BLw=="
-    },
-    "node_modules/eslint-plugin-formatjs/node_modules/emoji-regex": {
-      "version": "10.3.0",
-      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.3.0.tgz",
-      "integrity": "sha512-QpLs9D9v9kArv4lfDEgg1X/gN5XLnf/A6l9cs8SPZLRZR3ZkY9+kwIQTxm+fsSej5UMYGE8fdoaZVIBlqG0XTw=="
-    },
    "node_modules/eslint-plugin-import": {
      "version": "2.27.5",
      "resolved": "https://registry.npmjs.org/eslint-plugin-import/-/eslint-plugin-import-2.27.5.tgz",
@@ -12852,15 +11044,15 @@
      }
    },
    "node_modules/expect": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/expect/-/expect-29.7.0.tgz",
-      "integrity": "sha512-2Zks0hf1VLFYI1kbh0I5jP3KHHyCHpkfyHBzsSXRFgl/Bg9mWYfMW8oD+PdMPlEwy5HNsR9JutYy6pMeOh61nw==",
+      "version": "29.6.4",
+      "resolved": "https://registry.npmjs.org/expect/-/expect-29.6.4.tgz",
+      "integrity": "sha512-F2W2UyQ8XYyftHT57dtfg8Ue3X5qLgm2sSug0ivvLRH/VKNRL/pDxg/TH7zVzbQB0tu80clNFy6LU7OS/VSEKA==",
      "dependencies": {
-        "@jest/expect-utils": "^29.7.0",
+        "@jest/expect-utils": "^29.6.4",
        "jest-get-type": "^29.6.3",
-        "jest-matcher-utils": "^29.7.0",
-        "jest-message-util": "^29.7.0",
-        "jest-util": "^29.7.0"
+        "jest-matcher-utils": "^29.6.4",
+        "jest-message-util": "^29.6.3",
+        "jest-util": "^29.6.3"
      },
      "engines": {
        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
@@ -12883,17 +11075,17 @@
      }
    },
    "node_modules/expect/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==",
+      "version": "17.0.24",
+      "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-17.0.24.tgz",
+      "integrity": "sha512-6i0aC7jV6QzQB8ne1joVZ0eSFIstHsCrobmOtghM11yGlH0j43FKL2UhWdELkyps0zuf7qVTUVCCR+tgSlyLLw==",
      "dependencies": {
        "@types/yargs-parser": "*"
      }
    },
    "node_modules/expect/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==",
+      "version": "29.6.3",
+      "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-29.6.3.tgz",
+      "integrity": "sha512-QUjna/xSy4B32fzcKTSz1w7YYzgiHrjjJjevdRf61HYk998R5vVMMNmrHESYZVDS5DSWs+1srPLPKxXPkeSDOA==",
      "dependencies": {
        "@jest/types": "^29.6.3",
        "@types/node": "*",
@@ -13353,15 +11545,6 @@
        "url": "https://github.com/sponsors/sindresorhus"
      }
    },
-    "node_modules/find-yarn-workspace-root": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/find-yarn-workspace-root/-/find-yarn-workspace-root-2.0.0.tgz",
-      "integrity": "sha512-1IMnbjt4KzsQfnhnzNd8wUEgXZ44IzZaZmnLYx7D5FZlaHt2gW20Cri8Q+E/t5tIj4+epTBub+2Zxu/vNILzqQ==",
-      "dev": true,
-      "dependencies": {
-        "micromatch": "^4.0.2"
-      }
-    },
    "node_modules/flat": {
      "version": "5.0.2",
      "resolved": "https://registry.npmjs.org/flat/-/flat-5.0.2.tgz",
@@ -13606,9 +11789,9 @@
      }
    },
    "node_modules/fraction.js": {
-      "version": "4.3.7",
-      "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.3.7.tgz",
-      "integrity": "sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew==",
+      "version": "4.3.6",
+      "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.3.6.tgz",
+      "integrity": "sha512-n2aZ9tNfYDwaHhvFTkhFErqOMIb8uyzSQ+vGJBjZyanAKZVbGUQ1sngfk9FdkBw7G26O7AgNjLcecLffD1c7eg==",
      "engines": {
        "node": "*"
      },
@@ -15875,428 +14058,6 @@
        "node": ">=8.12.0"
      }
    },
-    "node_modules/jest-circus": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-circus/-/jest-circus-29.7.0.tgz",
-      "integrity": "sha512-3E1nCMgipcTkCocFwM90XXQab9bS+GMsjdpmPrlelaxwD93Ad8iVEjX/vvHPdLPnFf+L40u+5+iutRdA1N9myw==",
-      "peer": true,
-      "dependencies": {
-        "@jest/environment": "^29.7.0",
-        "@jest/expect": "^29.7.0",
-        "@jest/test-result": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "@types/node": "*",
-        "chalk": "^4.0.0",
-        "co": "^4.6.0",
-        "dedent": "^1.0.0",
-        "is-generator-fn": "^2.0.0",
-        "jest-each": "^29.7.0",
-        "jest-matcher-utils": "^29.7.0",
-        "jest-message-util": "^29.7.0",
-        "jest-runtime": "^29.7.0",
-        "jest-snapshot": "^29.7.0",
-        "jest-util": "^29.7.0",
-        "p-limit": "^3.1.0",
-        "pretty-format": "^29.7.0",
-        "pure-rand": "^6.0.0",
-        "slash": "^3.0.0",
-        "stack-utils": "^2.0.3"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/jest-circus/node_modules/@jest/environment": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/@jest/environment/-/environment-29.7.0.tgz",
-      "integrity": "sha512-aQIfHDq33ExsN4jP1NWGXhxgQ/wixs60gDiKO+XVMd8Mn0NWPWgc34ZQDTb2jKaUWQ7MuwoitXAsN2XVXNMpAw==",
-      "peer": true,
-      "dependencies": {
-        "@jest/fake-timers": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "@types/node": "*",
-        "jest-mock": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/jest-circus/node_modules/@jest/fake-timers": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/@jest/fake-timers/-/fake-timers-29.7.0.tgz",
-      "integrity": "sha512-q4DH1Ha4TTFPdxLsqDXK1d3+ioSL7yL5oCMJZgDYm6i+6CygW5E5xVr/D1HdsGxjt1ZWSfUAs9OxSB/BNelWrQ==",
-      "peer": true,
-      "dependencies": {
-        "@jest/types": "^29.6.3",
-        "@sinonjs/fake-timers": "^10.0.2",
-        "@types/node": "*",
-        "jest-message-util": "^29.7.0",
-        "jest-mock": "^29.7.0",
-        "jest-util": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/jest-circus/node_modules/@jest/globals": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/@jest/globals/-/globals-29.7.0.tgz",
-      "integrity": "sha512-mpiz3dutLbkW2MNFubUGUEVLkTGiqW6yLVTA+JbP6fI6J5iL9Y0Nlg8k95pcF8ctKwCS7WVxteBs29hhfAotzQ==",
-      "peer": true,
-      "dependencies": {
-        "@jest/environment": "^29.7.0",
-        "@jest/expect": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "jest-mock": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/jest-circus/node_modules/@jest/source-map": {
-      "version": "29.6.3",
-      "resolved": "https://registry.npmjs.org/@jest/source-map/-/source-map-29.6.3.tgz",
-      "integrity": "sha512-MHjT95QuipcPrpLM+8JMSzFx6eHp5Bm+4XeFDJlwsvVBjmKNiIAvasGK2fxz2WbGRlnvqehFbh07MMa7n3YJnw==",
-      "peer": true,
-      "dependencies": {
-        "@jridgewell/trace-mapping": "^0.3.18",
-        "callsites": "^3.0.0",
-        "graceful-fs": "^4.2.9"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/jest-circus/node_modules/@jest/transform": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/@jest/transform/-/transform-29.7.0.tgz",
-      "integrity": "sha512-ok/BTPFzFKVMwO5eOHRrvnBVHdRy9IrsrW1GpMaQ9MCnilNLXQKmAX8s1YXDFaai9xJpac2ySzV0YeRRECr2Vw==",
-      "peer": true,
-      "dependencies": {
-        "@babel/core": "^7.11.6",
-        "@jest/types": "^29.6.3",
-        "@jridgewell/trace-mapping": "^0.3.18",
-        "babel-plugin-istanbul": "^6.1.1",
-        "chalk": "^4.0.0",
-        "convert-source-map": "^2.0.0",
-        "fast-json-stable-stringify": "^2.1.0",
-        "graceful-fs": "^4.2.9",
-        "jest-haste-map": "^29.7.0",
-        "jest-regex-util": "^29.6.3",
-        "jest-util": "^29.7.0",
-        "micromatch": "^4.0.4",
-        "pirates": "^4.0.4",
-        "slash": "^3.0.0",
-        "write-file-atomic": "^4.0.2"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/jest-circus/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==",
-      "peer": true,
-      "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/jest-circus/node_modules/@sinonjs/commons": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/@sinonjs/commons/-/commons-3.0.1.tgz",
-      "integrity": "sha512-K3mCHKQ9sVh8o1C9cxkwxaOmXoAMlDxC1mYyHrjqOWEcBjYr76t96zL2zlj5dUGZ3HSw240X1qgH3Mjf1yJWpQ==",
-      "peer": true,
-      "dependencies": {
-        "type-detect": "4.0.8"
-      }
-    },
-    "node_modules/jest-circus/node_modules/@sinonjs/fake-timers": {
-      "version": "10.3.0",
-      "resolved": "https://registry.npmjs.org/@sinonjs/fake-timers/-/fake-timers-10.3.0.tgz",
-      "integrity": "sha512-V4BG07kuYSUkTCSBHG8G8TNhM+F19jXFWnQtzj+we8DrkpSBCee9Z3Ms8yiGer/dlmhe35/Xdgyo3/0rQKg7YA==",
-      "peer": true,
-      "dependencies": {
-        "@sinonjs/commons": "^3.0.0"
-      }
-    },
-    "node_modules/jest-circus/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==",
-      "peer": true,
-      "dependencies": {
-        "@types/yargs-parser": "*"
-      }
-    },
-    "node_modules/jest-circus/node_modules/ansi-styles": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
-      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
-      "peer": true,
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
-      }
-    },
-    "node_modules/jest-circus/node_modules/cjs-module-lexer": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/cjs-module-lexer/-/cjs-module-lexer-1.3.1.tgz",
-      "integrity": "sha512-a3KdPAANPbNE4ZUv9h6LckSl9zLsYOP4MBmhIPkRaeyybt+r4UghLvq+xw/YwUcC1gqylCkL4rdVs3Lwupjm4Q==",
-      "peer": true
-    },
-    "node_modules/jest-circus/node_modules/convert-source-map": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
-      "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
-      "peer": true
-    },
-    "node_modules/jest-circus/node_modules/jest-each": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-each/-/jest-each-29.7.0.tgz",
-      "integrity": "sha512-gns+Er14+ZrEoC5fhOfYCY1LOHHr0TI+rQUHZS8Ttw2l7gl+80eHc/gFf2Ktkw0+SIACDTeWvpFcv3B04VembQ==",
-      "peer": true,
-      "dependencies": {
-        "@jest/types": "^29.6.3",
-        "chalk": "^4.0.0",
-        "jest-get-type": "^29.6.3",
-        "jest-util": "^29.7.0",
-        "pretty-format": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/jest-circus/node_modules/jest-haste-map": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-haste-map/-/jest-haste-map-29.7.0.tgz",
-      "integrity": "sha512-fP8u2pyfqx0K1rGn1R9pyE0/KTn+G7PxktWidOBTqFPLYX0b9ksaMFkhK5vrS3DVun09pckLdlx90QthlW7AmA==",
-      "peer": true,
-      "dependencies": {
-        "@jest/types": "^29.6.3",
-        "@types/graceful-fs": "^4.1.3",
-        "@types/node": "*",
-        "anymatch": "^3.0.3",
-        "fb-watchman": "^2.0.0",
-        "graceful-fs": "^4.2.9",
-        "jest-regex-util": "^29.6.3",
-        "jest-util": "^29.7.0",
-        "jest-worker": "^29.7.0",
-        "micromatch": "^4.0.4",
-        "walker": "^1.0.8"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      },
-      "optionalDependencies": {
-        "fsevents": "^2.3.2"
-      }
-    },
-    "node_modules/jest-circus/node_modules/jest-mock": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-mock/-/jest-mock-29.7.0.tgz",
-      "integrity": "sha512-ITOMZn+UkYS4ZFh83xYAOzWStloNzJFO2s8DWrE4lhtGD+AorgnbkiKERe4wQVBydIGPx059g6riW5Btp6Llnw==",
-      "peer": true,
-      "dependencies": {
-        "@jest/types": "^29.6.3",
-        "@types/node": "*",
-        "jest-util": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/jest-circus/node_modules/jest-regex-util": {
-      "version": "29.6.3",
-      "resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-29.6.3.tgz",
-      "integrity": "sha512-KJJBsRCyyLNWCNBOvZyRDnAIfUiRJ8v+hOBQYGn8gDyF3UegwiP4gwRR3/SDa42g1YbVycTidUF3rKjyLFDWbg==",
-      "peer": true,
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/jest-circus/node_modules/jest-resolve": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-resolve/-/jest-resolve-29.7.0.tgz",
-      "integrity": "sha512-IOVhZSrg+UvVAshDSDtHyFCCBUl/Q3AAJv8iZ6ZjnZ74xzvwuzLXid9IIIPgTnY62SJjfuupMKZsZQRsCvxEgA==",
-      "peer": true,
-      "dependencies": {
-        "chalk": "^4.0.0",
-        "graceful-fs": "^4.2.9",
-        "jest-haste-map": "^29.7.0",
-        "jest-pnp-resolver": "^1.2.2",
-        "jest-util": "^29.7.0",
-        "jest-validate": "^29.7.0",
-        "resolve": "^1.20.0",
-        "resolve.exports": "^2.0.0",
-        "slash": "^3.0.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/jest-circus/node_modules/jest-runtime": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-runtime/-/jest-runtime-29.7.0.tgz",
-      "integrity": "sha512-gUnLjgwdGqW7B4LvOIkbKs9WGbn+QLqRQQ9juC6HndeDiezIwhDP+mhMwHWCEcfQ5RUXa6OPnFF8BJh5xegwwQ==",
-      "peer": true,
-      "dependencies": {
-        "@jest/environment": "^29.7.0",
-        "@jest/fake-timers": "^29.7.0",
-        "@jest/globals": "^29.7.0",
-        "@jest/source-map": "^29.6.3",
-        "@jest/test-result": "^29.7.0",
-        "@jest/transform": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "@types/node": "*",
-        "chalk": "^4.0.0",
-        "cjs-module-lexer": "^1.0.0",
-        "collect-v8-coverage": "^1.0.0",
-        "glob": "^7.1.3",
-        "graceful-fs": "^4.2.9",
-        "jest-haste-map": "^29.7.0",
-        "jest-message-util": "^29.7.0",
-        "jest-mock": "^29.7.0",
-        "jest-regex-util": "^29.6.3",
-        "jest-resolve": "^29.7.0",
-        "jest-snapshot": "^29.7.0",
-        "jest-util": "^29.7.0",
-        "slash": "^3.0.0",
-        "strip-bom": "^4.0.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/jest-circus/node_modules/jest-snapshot": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-snapshot/-/jest-snapshot-29.7.0.tgz",
-      "integrity": "sha512-Rm0BMWtxBcioHr1/OX5YCP8Uov4riHvKPknOGs804Zg9JGZgmIBkbtlxJC/7Z4msKYVbIJtfU+tKb8xlYNfdkw==",
-      "peer": true,
-      "dependencies": {
-        "@babel/core": "^7.11.6",
-        "@babel/generator": "^7.7.2",
-        "@babel/plugin-syntax-jsx": "^7.7.2",
-        "@babel/plugin-syntax-typescript": "^7.7.2",
-        "@babel/types": "^7.3.3",
-        "@jest/expect-utils": "^29.7.0",
-        "@jest/transform": "^29.7.0",
-        "@jest/types": "^29.6.3",
-        "babel-preset-current-node-syntax": "^1.0.0",
-        "chalk": "^4.0.0",
-        "expect": "^29.7.0",
-        "graceful-fs": "^4.2.9",
-        "jest-diff": "^29.7.0",
-        "jest-get-type": "^29.6.3",
-        "jest-matcher-utils": "^29.7.0",
-        "jest-message-util": "^29.7.0",
-        "jest-util": "^29.7.0",
-        "natural-compare": "^1.4.0",
-        "pretty-format": "^29.7.0",
-        "semver": "^7.5.3"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/jest-circus/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==",
-      "peer": true,
-      "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/jest-circus/node_modules/jest-validate": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-validate/-/jest-validate-29.7.0.tgz",
-      "integrity": "sha512-ZB7wHqaRGVw/9hST/OuFUReG7M8vKeq0/J2egIGLdvjHCmYqGARhzXmtgi+gVeZ5uXFF219aOc3Ls2yLg27tkw==",
-      "peer": true,
-      "dependencies": {
-        "@jest/types": "^29.6.3",
-        "camelcase": "^6.2.0",
-        "chalk": "^4.0.0",
-        "jest-get-type": "^29.6.3",
-        "leven": "^3.1.0",
-        "pretty-format": "^29.7.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/jest-circus/node_modules/pretty-format": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.7.0.tgz",
-      "integrity": "sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==",
-      "peer": true,
-      "dependencies": {
-        "@jest/schemas": "^29.6.3",
-        "ansi-styles": "^5.0.0",
-        "react-is": "^18.0.0"
-      },
-      "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
-      }
-    },
-    "node_modules/jest-circus/node_modules/react-is": {
-      "version": "18.3.1",
-      "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
-      "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
-      "peer": true
-    },
-    "node_modules/jest-circus/node_modules/semver": {
-      "version": "7.6.2",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz",
-      "integrity": "sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==",
-      "peer": true,
-      "bin": {
-        "semver": "bin/semver.js"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/jest-circus/node_modules/slash": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
-      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
-      "peer": true,
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/jest-circus/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==",
-      "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/jest-cli": {
      "version": "26.6.3",
      "resolved": "https://registry.npmjs.org/jest-cli/-/jest-cli-26.6.3.tgz",
@@ -16597,14 +14358,14 @@
      }
    },
    "node_modules/jest-diff": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-29.7.0.tgz",
-      "integrity": "sha512-LMIgiIrhigmPrs03JHpxUh2yISK3vLFPkAodPeo0+BuF7wA2FoQbkEg1u8gBYBThncu7e1oEDUfIXVuTqLRUjw==",
+      "version": "29.6.4",
+      "resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-29.6.4.tgz",
+      "integrity": "sha512-9F48UxR9e4XOEZvoUXEHSWY4qC4zERJaOfrbBg9JpbJOO43R1vN76REt/aMGZoY6GD5g84nnJiBIVlscegefpw==",
      "dependencies": {
        "chalk": "^4.0.0",
        "diff-sequences": "^29.6.3",
        "jest-get-type": "^29.6.3",
-        "pretty-format": "^29.7.0"
+        "pretty-format": "^29.6.3"
      },
      "engines": {
        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
@@ -16622,9 +14383,9 @@
      }
    },
    "node_modules/jest-diff/node_modules/pretty-format": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.7.0.tgz",
-      "integrity": "sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==",
+      "version": "29.6.3",
+      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.6.3.tgz",
+      "integrity": "sha512-ZsBgjVhFAj5KeK+nHfF1305/By3lechHQSMWCTl8iHSbfOm2TN5nHEtFc/+W7fAyUeCs2n5iow72gld4gW0xDw==",
      "dependencies": {
        "@jest/schemas": "^29.6.3",
        "ansi-styles": "^5.0.0",
@@ -16635,9 +14396,9 @@
      }
    },
    "node_modules/jest-diff/node_modules/react-is": {
-      "version": "18.3.1",
-      "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
-      "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg=="
+      "version": "18.2.0",
+      "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz",
+      "integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w=="
    },
    "node_modules/jest-docblock": {
      "version": "26.0.0",
@@ -16961,14 +14722,14 @@
      }
    },
    "node_modules/jest-matcher-utils": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-29.7.0.tgz",
-      "integrity": "sha512-sBkD+Xi9DtcChsI3L3u0+N0opgPYnCRPtGcQYrgXmR+hmt/fYfWAL0xRXYU8eWOdfuLgBe0YCW3AFtnRLagq/g==",
+      "version": "29.6.4",
+      "resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-29.6.4.tgz",
+      "integrity": "sha512-KSzwyzGvK4HcfnserYqJHYi7sZVqdREJ9DMPAKVbS98JsIAvumihaNUbjrWw0St7p9IY7A9UskCW5MYlGmBQFQ==",
      "dependencies": {
        "chalk": "^4.0.0",
-        "jest-diff": "^29.7.0",
+        "jest-diff": "^29.6.4",
        "jest-get-type": "^29.6.3",
-        "pretty-format": "^29.7.0"
+        "pretty-format": "^29.6.3"
      },
      "engines": {
        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
@@ -16986,9 +14747,9 @@
      }
    },
    "node_modules/jest-matcher-utils/node_modules/pretty-format": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.7.0.tgz",
-      "integrity": "sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==",
+      "version": "29.6.3",
+      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.6.3.tgz",
+      "integrity": "sha512-ZsBgjVhFAj5KeK+nHfF1305/By3lechHQSMWCTl8iHSbfOm2TN5nHEtFc/+W7fAyUeCs2n5iow72gld4gW0xDw==",
      "dependencies": {
        "@jest/schemas": "^29.6.3",
        "ansi-styles": "^5.0.0",
@@ -16999,9 +14760,9 @@
      }
    },
    "node_modules/jest-matcher-utils/node_modules/react-is": {
-      "version": "18.3.1",
-      "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
-      "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg=="
+      "version": "18.2.0",
+      "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz",
+      "integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w=="
    },
    "node_modules/jest-message-util": {
      "version": "29.7.0",
@@ -17837,6 +15598,7 @@
      "version": "29.7.0",
      "resolved": "https://registry.npmjs.org/jest-worker/-/jest-worker-29.7.0.tgz",
      "integrity": "sha512-eIz2msL/EzL9UFTFFx7jBTkeZfku0yUAyZZZmJ93H2TYEiroIx2PQjEXcwYtYl8zXCxb+PAmA2hLIt/6ZEkPHw==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "@types/node": "*",
@@ -17852,6 +15614,7 @@
      "version": "29.6.3",
      "resolved": "https://registry.npmjs.org/@jest/types/-/types-29.6.3.tgz",
      "integrity": "sha512-u3UPsIilWKOM3F9CXtrG8LEJmNxwoCQC/XVj4IKYXvvpx7QIi/Kg1LI5uDmDpKlac62NUtX7eLjRh+jVZcLOzw==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "@jest/schemas": "^29.6.3",
@@ -17869,6 +15632,7 @@
      "version": "17.0.32",
      "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-17.0.32.tgz",
      "integrity": "sha512-xQ67Yc/laOG5uMfX/093MRlGGCIBzZMarVa+gfNKJxWAIgykYpVGkBdbqEzGDDfCrVUj6Hiff4mTZ5BA6TmAog==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "@types/yargs-parser": "*"
@@ -17878,6 +15642,7 @@
      "version": "29.7.0",
      "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-29.7.0.tgz",
      "integrity": "sha512-z6EbKajIpqGKU56y5KBUgy1dt1ihhQJgWzUlZHArA/+X2ad7Cb5iF+AK1EWVL/Bo7Rz9uurpqw6SiBCefUbCGA==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "@jest/types": "^29.6.3",
@@ -17895,6 +15660,7 @@
      "version": "8.1.1",
      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz",
      "integrity": "sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "has-flag": "^4.0.0"
@@ -18168,15 +15934,6 @@
        "node": ">=0.10.0"
      }
    },
-    "node_modules/klaw-sync": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/klaw-sync/-/klaw-sync-6.0.0.tgz",
-      "integrity": "sha512-nIeuVSzdCCs6TDPTqI8w1Yre34sSq7AkZ4B3sfOBbI2CgVSB4Du4aLQijFU2+lhAFCwt9+42Hel6lQNIv6AntQ==",
-      "dev": true,
-      "dependencies": {
-        "graceful-fs": "^4.1.11"
-      }
-    },
    "node_modules/kleur": {
      "version": "3.0.3",
      "resolved": "https://registry.npmjs.org/kleur/-/kleur-3.0.3.tgz",
@@ -18505,17 +16262,6 @@
        "lz-string": "bin/bin.js"
      }
    },
-    "node_modules/magic-string": {
-      "version": "0.30.9",
-      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.9.tgz",
-      "integrity": "sha512-S1+hd+dIrC8EZqKyT9DstTH/0Z+f76kmmvZnkfQVmOpDEF9iVgdYif3Q/pIWHmCoo59bQVGW0kVL3e2nl+9+Sw==",
-      "dependencies": {
-        "@jridgewell/sourcemap-codec": "^1.4.15"
-      },
-      "engines": {
-        "node": ">=12"
-      }
-    },
    "node_modules/mailto-link": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/mailto-link/-/mailto-link-2.0.0.tgz",
@@ -18567,12 +16313,6 @@
        "semver": "bin/semver"
      }
    },
-    "node_modules/make-error": {
-      "version": "1.3.6",
-      "resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.6.tgz",
-      "integrity": "sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==",
-      "peer": true
-    },
    "node_modules/makeerror": {
      "version": "1.0.12",
      "resolved": "https://registry.npmjs.org/makeerror/-/makeerror-1.0.12.tgz",
@@ -20184,109 +17924,6 @@
        "node": ">=0.10.0"
      }
    },
-    "node_modules/patch-package": {
-      "version": "8.0.0",
-      "resolved": "https://registry.npmjs.org/patch-package/-/patch-package-8.0.0.tgz",
-      "integrity": "sha512-da8BVIhzjtgScwDJ2TtKsfT5JFWz1hYoBl9rUQ1f38MC2HwnEIkK8VN3dKMKcP7P7bvvgzNDbfNHtx3MsQb5vA==",
-      "dev": true,
-      "dependencies": {
-        "@yarnpkg/lockfile": "^1.1.0",
-        "chalk": "^4.1.2",
-        "ci-info": "^3.7.0",
-        "cross-spawn": "^7.0.3",
-        "find-yarn-workspace-root": "^2.0.0",
-        "fs-extra": "^9.0.0",
-        "json-stable-stringify": "^1.0.2",
-        "klaw-sync": "^6.0.0",
-        "minimist": "^1.2.6",
-        "open": "^7.4.2",
-        "rimraf": "^2.6.3",
-        "semver": "^7.5.3",
-        "slash": "^2.0.0",
-        "tmp": "^0.0.33",
-        "yaml": "^2.2.2"
-      },
-      "bin": {
-        "patch-package": "index.js"
-      },
-      "engines": {
-        "node": ">=14",
-        "npm": ">5"
-      }
-    },
-    "node_modules/patch-package/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-      "dev": true,
-      "dependencies": {
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/patch-package/node_modules/open": {
-      "version": "7.4.2",
-      "resolved": "https://registry.npmjs.org/open/-/open-7.4.2.tgz",
-      "integrity": "sha512-MVHddDVweXZF3awtlAS+6pgKLlm/JgxZ90+/NBurBoQctVOOB/zDdVjcyPzQ+0laDGbsWgrRkflI65sQeOgT9Q==",
-      "dev": true,
-      "dependencies": {
-        "is-docker": "^2.0.0",
-        "is-wsl": "^2.1.1"
-      },
-      "engines": {
-        "node": ">=8"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
-    "node_modules/patch-package/node_modules/rimraf": {
-      "version": "2.7.1",
-      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
-      "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
-      "dev": true,
-      "dependencies": {
-        "glob": "^7.1.3"
-      },
-      "bin": {
-        "rimraf": "bin.js"
-      }
-    },
-    "node_modules/patch-package/node_modules/semver": {
-      "version": "7.6.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
-      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
-      "dev": true,
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
-      "bin": {
-        "semver": "bin/semver.js"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/patch-package/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "dev": true
-    },
-    "node_modules/patch-package/node_modules/yaml": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.4.1.tgz",
-      "integrity": "sha512-pIXzoImaqmfOrL7teGUBt/T7ZDnyeGBWyXQBvOVhLkWLN37GXv8NMLK406UY6dS51JfcQHsmcW5cJ441bHg6Lg==",
-      "dev": true,
-      "bin": {
-        "yaml": "bin.mjs"
-      },
-      "engines": {
-        "node": ">= 14"
-      }
-    },
    "node_modules/path-exists": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
@@ -20634,9 +18271,9 @@
      }
    },
    "node_modules/postcss": {
-      "version": "8.4.38",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.38.tgz",
-      "integrity": "sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A==",
+      "version": "8.4.33",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.33.tgz",
+      "integrity": "sha512-Kkpbhhdjw2qQs2O2DGX+8m5OVqEcbB9HRBvuYM9pgrjEFUg30A9LmXNlTAUj4S9kgtGyrMbTzVjH7E+s5Re2yg==",
      "funding": [
        {
          "type": "opencollective",
@@ -20654,7 +18291,7 @@
      "dependencies": {
        "nanoid": "^3.3.7",
        "picocolors": "^1.0.0",
-        "source-map-js": "^1.2.0"
+        "source-map-js": "^1.0.2"
      },
      "engines": {
        "node": "^10 || ^12 || >=14"
@@ -20708,9 +18345,9 @@
      }
    },
    "node_modules/postcss-custom-media": {
-      "version": "10.0.4",
-      "resolved": "https://registry.npmjs.org/postcss-custom-media/-/postcss-custom-media-10.0.4.tgz",
-      "integrity": "sha512-Ubs7O3wj2prghaKRa68VHBvuy3KnTQ0zbGwqDYY1mntxJD0QL2AeiAy+AMfl3HBedTCVr2IcFNktwty9YpSskA==",
+      "version": "10.0.2",
+      "resolved": "https://registry.npmjs.org/postcss-custom-media/-/postcss-custom-media-10.0.2.tgz",
+      "integrity": "sha512-zcEFNRmDm2fZvTPdI1pIW3W//UruMcLosmMiCdpQnrCsTRzWlKQPYMa1ud9auL0BmrryKK1+JjIGn19K0UjO/w==",
      "funding": [
        {
          "type": "github",
@@ -20722,10 +18359,10 @@
        }
      ],
      "dependencies": {
-        "@csstools/cascade-layer-name-parser": "^1.0.9",
-        "@csstools/css-parser-algorithms": "^2.6.1",
-        "@csstools/css-tokenizer": "^2.2.4",
-        "@csstools/media-query-list-parser": "^2.1.9"
+        "@csstools/cascade-layer-name-parser": "^1.0.5",
+        "@csstools/css-parser-algorithms": "^2.3.2",
+        "@csstools/css-tokenizer": "^2.2.1",
+        "@csstools/media-query-list-parser": "^2.1.5"
      },
      "engines": {
        "node": "^14 || ^16 || >=18"
@@ -21489,22 +19126,6 @@
        "node": ">=6"
      }
    },
-    "node_modules/pure-rand": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/pure-rand/-/pure-rand-6.1.0.tgz",
-      "integrity": "sha512-bVWawvoZoBYpp6yIoQtQXHZjmz35RSVHnUOTefl8Vcjr8snTPY1wnpSPMWekcFwbxI6gtmT7rSYPFvz71ldiOA==",
-      "funding": [
-        {
-          "type": "individual",
-          "url": "https://github.com/sponsors/dubzzz"
-        },
-        {
-          "type": "opencollective",
-          "url": "https://opencollective.com/fast-check"
-        }
-      ],
-      "peer": true
-    },
    "node_modules/purgecss": {
      "version": "5.0.0",
      "resolved": "https://registry.npmjs.org/purgecss/-/purgecss-5.0.0.tgz",
@@ -21873,13 +19494,16 @@
      }
    },
    "node_modules/react-error-boundary": {
-      "version": "4.0.13",
-      "resolved": "https://registry.npmjs.org/react-error-boundary/-/react-error-boundary-4.0.13.tgz",
-      "integrity": "sha512-b6PwbdSv8XeOSYvjt8LpgpKrZ0yGdtZokYwkwV2wlcZbxgopHX/hgPl5VgpnoVOWd868n1hktM8Qm4b+02MiLQ==",
-      "peer": true,
+      "version": "3.1.4",
+      "resolved": "https://registry.npmjs.org/react-error-boundary/-/react-error-boundary-3.1.4.tgz",
+      "integrity": "sha512-uM9uPzZJTF6wRQORmSrvOIgt4lJ9MC1sNgEOj2XGsDTRE4kmpWxg7ENK9EWNKJRMAOY9z0MuF4yIfl6gp4sotA==",
      "dependencies": {
        "@babel/runtime": "^7.12.5"
      },
+      "engines": {
+        "node": ">=10",
+        "npm": ">=6"
+      },
      "peerDependencies": {
        "react": ">=16.13.1"
      }
@@ -22772,15 +20396,6 @@
        "node": ">=0.10.0"
      }
    },
-    "node_modules/resolve.exports": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/resolve.exports/-/resolve.exports-2.0.2.tgz",
-      "integrity": "sha512-X2UW6Nw3n/aMgDVy+0rSqgHlv39WZAlZrXCdnbyEiKm17DSqHX4MmQMaST3FbeWR5FTuRcUwYAziZajji0Y7mg==",
-      "peer": true,
-      "engines": {
-        "node": ">=10"
-      }
-    },
    "node_modules/restore-cursor": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-2.0.0.tgz",
@@ -24109,9 +21724,9 @@
      }
    },
    "node_modules/source-map-js": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz",
-      "integrity": "sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz",
+      "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==",
      "engines": {
        "node": ">=0.10.0"
      }
@@ -25277,17 +22892,6 @@
        "cheerio": "0.22.0"
      }
    },
-    "node_modules/ts-api-utils": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-1.3.0.tgz",
-      "integrity": "sha512-UQMIo7pb8WRomKR1/+MFVLTroIvDVtMX3K6OUir8ynLyzB8Jeriont2bTAtmNPa1ekAgN7YPDyf6V+ygrdU+eQ==",
-      "engines": {
-        "node": ">=16"
-      },
-      "peerDependencies": {
-        "typescript": ">=4.2.0"
-      }
-    },
    "node_modules/tsconfig-paths": {
      "version": "3.14.2",
      "resolved": "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-3.14.2.tgz",
@@ -25319,9 +22923,9 @@
      }
    },
    "node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+      "version": "2.5.3",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.3.tgz",
+      "integrity": "sha512-mSxlJJwl3BMEQCUNnxXBU9jP4JBktcEGhURcPR6VQVlnP0FdDEsIaz0C35dXNGLyRfrATNofF0F5p2KPxQgB+w=="
    },
    "node_modules/tunnel-agent": {
      "version": "0.6.0",
@@ -25452,15 +23056,16 @@
      }
    },
    "node_modules/typescript": {
-      "version": "5.4.5",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.5.tgz",
-      "integrity": "sha512-vcI4UpRgg81oIRUFwR0WSIHKt11nJ7SAVlYNIu+QpqeyXP+gpQJy/Z4+F0aGxSE4MqwjyXvW/TzgkLAx2AGHwQ==",
+      "version": "4.9.5",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.5.tgz",
+      "integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==",
+      "peer": true,
      "bin": {
        "tsc": "bin/tsc",
        "tsserver": "bin/tsserver"
      },
      "engines": {
-        "node": ">=14.17"
+        "node": ">=4.2.0"
      }
    },
    "node_modules/unbox-primitive": {
@@ -25505,19 +23110,6 @@
        "node": ">=4"
      }
    },
-    "node_modules/unicode-emoji-utils": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/unicode-emoji-utils/-/unicode-emoji-utils-1.2.0.tgz",
-      "integrity": "sha512-djUB91p/6oYpgps4W5K/MAvM+UspoAANHSUW495BrxeLRoned3iNPEDQgrKx9LbLq93VhNz0NWvI61vcfrwYoA==",
-      "dependencies": {
-        "emoji-regex": "10.3.0"
-      }
-    },
-    "node_modules/unicode-emoji-utils/node_modules/emoji-regex": {
-      "version": "10.3.0",
-      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.3.0.tgz",
-      "integrity": "sha512-QpLs9D9v9kArv4lfDEgg1X/gN5XLnf/A6l9cs8SPZLRZR3ZkY9+kwIQTxm+fsSej5UMYGE8fdoaZVIBlqG0XTw=="
-    },
    "node_modules/unicode-match-property-ecmascript": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/unicode-match-property-ecmascript/-/unicode-match-property-ecmascript-2.0.0.tgz",
@@ -25974,6 +23566,7 @@
      "version": "9.2.0",
      "resolved": "https://registry.npmjs.org/v8-to-istanbul/-/v8-to-istanbul-9.2.0.tgz",
      "integrity": "sha512-/EH/sDgxU2eGxajKdwLCDmQ4FWq+kpi3uCmBGpw1xJtnAxEjlD8j8PEiGWpCIMIs3ciNAgH0d3TTJiUkYzyZjA==",
+      "dev": true,
      "peer": true,
      "dependencies": {
        "@jridgewell/trace-mapping": "^0.3.12",
@@ -25988,6 +23581,7 @@
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
      "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
+      "dev": true,
      "peer": true
    },
    "node_modules/validate-npm-package-license": {
@@ -26802,6 +24396,7 @@
      "version": "17.7.2",
      "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz",
      "integrity": "sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==",
+      "dev": true,
      "dependencies": {
        "cliui": "^8.0.1",
        "escalade": "^3.1.1",
@@ -26819,6 +24414,7 @@
      "version": "21.1.1",
      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz",
      "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==",
+      "dev": true,
      "engines": {
        "node": ">=12"
      }
@@ -26826,12 +24422,14 @@
    "node_modules/yargs/node_modules/emoji-regex": {
      "version": "8.0.0",
      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
-      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+      "dev": true
    },
    "node_modules/yargs/node_modules/is-fullwidth-code-point": {
      "version": "3.0.0",
      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+      "dev": true,
      "engines": {
        "node": ">=8"
      }
@@ -26840,6 +24438,7 @@
      "version": "4.2.3",
      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
      "dependencies": {
        "emoji-regex": "^8.0.0",
        "is-fullwidth-code-point": "^3.0.0",
--- a/package.json
+++ b/package.json
@@ -15,7 +15,6 @@
    "lint": "fedx-scripts eslint --ext .js --ext .jsx .",
    "lint:fix": "fedx-scripts eslint --fix --ext .js --ext .jsx .",
    "prepare": "husky install",
-    "postinstall": "patch-package",
    "snapshot": "fedx-scripts jest --updateSnapshot",
    "start": "fedx-scripts webpack-dev-server --progress",
    "test": "fedx-scripts jest --coverage --passWithNoTests"
@@ -30,21 +29,23 @@
    "url": "https://github.com/openedx/frontend-app-learning/issues"
  },
  "dependencies": {
+    "@datadog/browser-logs": "^5.14.0",
+    "@datadog/browser-rum": "^5.14.0",
    "@edx/brand": "npm:@openedx/brand-openedx@^1.2.2",
+    "@edx/frontend-component-footer": "^13.0.4",
    "@edx/frontend-component-header": "^5.0.2",
-    "@edx/frontend-lib-learning-assistant": "^2.2.2",
-    "@edx/frontend-lib-special-exams": "^3.1.3",
+    "@edx/frontend-lib-learning-assistant": "^2.0.0",
+    "@edx/frontend-lib-special-exams": "^3.0.0",
    "@edx/frontend-platform": "^7.1.2",
    "@edx/openedx-atlas": "^0.6.0",
-    "@edx/react-unit-test-utils": "2.0.0",
+    "@edx/react-unit-test-utils": "^2.0.0",
    "@fortawesome/fontawesome-svg-core": "1.3.0",
    "@fortawesome/free-brands-svg-icons": "5.15.4",
    "@fortawesome/free-regular-svg-icons": "5.15.4",
    "@fortawesome/free-solid-svg-icons": "5.15.4",
    "@fortawesome/react-fontawesome": "^0.1.4",
-    "@openedx/frontend-plugin-framework": "^1.1.2",
-    "@openedx/frontend-slot-footer": "^1.0.2",
-    "@openedx/paragon": "^22.3.0",
+    "@openedx/frontend-plugin-framework": "^1.0.2",
+    "@openedx/paragon": "^22.1.1",
    "@popperjs/core": "2.11.8",
    "@reduxjs/toolkit": "1.8.1",
    "classnames": "2.3.2",
@@ -71,7 +72,7 @@
  "devDependencies": {
    "@edx/browserslist-config": "1.2.0",
    "@edx/reactifex": "2.2.0",
-    "@openedx/frontend-build": "13.1.4",
+    "@openedx/frontend-build": "13.0.30",
    "@pact-foundation/pact": "^11.0.2",
    "@testing-library/jest-dom": "5.16.5",
    "@testing-library/react": "12.1.5",
@@ -85,7 +86,6 @@
    "jest": "^26.6.3",
    "jest-console-group-reporter": "^1.0.1",
    "jest-when": "^3.6.0",
-    "patch-package": "^8.0.0",
    "postcss-loader": "^8.1.1",
    "rosie": "2.1.1",
    "sass": "^1.72.0",
--- a/patches/@openedx+frontend-build+13.0.30.patch
+++ b/patches/@openedx+frontend-build+13.0.30.patch
@@ -1,36 +0,0 @@
-diff --git a/node_modules/@openedx/frontend-build/config/webpack.prod.config.js b/node_modules/@openedx/frontend-build/config/webpack.prod.config.js
-index 2879dd9..9efd0fc 100644
--- a/node_modules/@openedx/frontend-build/config/webpack.prod.config.js
-+++ b/node_modules/@openedx/frontend-build/config/webpack.prod.config.js
-@@ -12,6 +12,7 @@ const NewRelicSourceMapPlugin = require('@edx/new-relic-source-map-webpack-plugi
- const HtmlWebpackPlugin = require('html-webpack-plugin');
- const MiniCssExtractPlugin = require('mini-css-extract-plugin');
- const path = require('path');
-+const fs = require('fs');
- const PostCssAutoprefixerPlugin = require('autoprefixer');
- const PostCssRTLCSS = require('postcss-rtlcss');
- const PostCssCustomMediaCSS = require('postcss-custom-media');
-@@ -23,6 +24,23 @@ const HtmlWebpackNewRelicPlugin = require('../lib/plugins/html-webpack-new-relic
- const commonConfig = require('./webpack.common.config');
- const presets = require('../lib/presets');
- 
-+/**
-+ * This condition confirms whether the configuration for the MFE has switched to a JS-based configuration
-+ * as previously implemented in frontend-build and frontend-platform. If the environment variable JS_CONFIG_FILEPATH
-+ * exists, then an env.config.js(x) file will be copied from the location referenced by the environment variable to the
-+ * root directory. Its env variables can be accessed with getConfig().
-+ *
-+ * https://github.com/openedx/frontend-build/blob/master/docs/0002-js-environment-config.md
-+ * https://github.com/openedx/frontend-platform/blob/master/docs/decisions/0007-javascript-file-configuration.rst
-+ */
-+
-+const envConfigPath = process.env.JS_CONFIG_FILEPATH;
-+
-+if (envConfigPath) {
-+  const envConfigFilename = envConfigPath.slice(envConfigPath.indexOf('env.config'));
-+  fs.copyFileSync(envConfigPath, envConfigFilename);
-+}
-+
- // Add process env vars. Currently used only for setting the PUBLIC_PATH.
- dotenv.config({
-   path: path.resolve(process.cwd(), '.env'),
--- a/plugins/README.md
+++ b/plugins/README.md
@@ -0,0 +1,17 @@
+## How to develop plugin
+
+You can define plugin in `env.config.jsx` see `example.env.config.jsx` as example.
+
+## Current caveat
+
+- The way for how I deal with override method is still wonky
+  - The redux still require middleware to ignore the plugin's action from serializing
+  - I am not sure how it behave with useCallback, useMemo, ...etc
+  - There are still open question on how to write it properly
+
+## Current work that should consider core part and extendable for the future plugin framework
+
+- `usePluingsCallback` is the callback supose to be some level of equality to be using `React.useCallback`. It would try to execute the function, then any plugin that try `registerOverrideMethod`. The order of the it being run isn't the determined. There are a couple things I want to add:
+  - I might consider testing it with `zustand` library to make sure it is portable and not rely on `redux`. I tried to do this with provider, but it seems to run into infinite loop of trigger changed.
+
+- `registerOverrideMethod` is working like a way to register callback that behave like a middleware. It ran the default one, then pass the result of the default one to the plugin. Any plugin that register the override can update the value. Alternatively, we can override the function completely instead applying each affect. Or we can support both. But it requires a bit more thought out architecture.
--- a/plugins/UnitTranslationPlugin/snapshots/index.test.jsx.snap
+++ b/plugins/UnitTranslationPlugin/snapshots/index.test.jsx.snap
@@ -0,0 +1,15 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<UnitTranslationPlugin /> render TranslationSelection when translation is enabled and language is available 1`] = `
+<TranslationSelection
+  availableLanguages={
+    Array [
+      "en",
+    ]
+  }
+  courseId="courseId"
+  id="id"
+  language="en"
+  unitId="unitId"
+/>
+`;
--- a/plugins/UnitTranslationPlugin/data/api.js
+++ b/plugins/UnitTranslationPlugin/data/api.js
@@ -0,0 +1,90 @@
+import { getConfig, camelCaseObject } from '@edx/frontend-platform';
+import { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';
+import { logError } from '@edx/frontend-platform/logging';
+import { stringify } from 'query-string';
+
+export const fetchTranslationConfig = async (courseId) => {
+  const url = `${
+    getConfig().LMS_BASE_URL
+  }/api/translatable_xblocks/config/?course_id=${encodeURIComponent(courseId)}`;
+  try {
+    const { data } = await getAuthenticatedHttpClient().get(url);
+    return {
+      enabled: data.feature_enabled,
+      availableLanguages: data.available_translation_languages || [
+        {
+          code: 'en',
+          label: 'English',
+        },
+        {
+          code: 'es',
+          label: 'Spanish',
+        },
+      ],
+    };
+  } catch (error) {
+    logError(`Translation plugin fail to fetch from ${url}`, error);
+    return {
+      enabled: false,
+      availableLanguages: [],
+    };
+  }
+};
+
+export async function getTranslationFeedback({
+  courseId,
+  translationLanguage,
+  unitId,
+  userId,
+}) {
+  const params = stringify({
+    translation_language: translationLanguage,
+    course_id: encodeURIComponent(courseId),
+    unit_id: encodeURIComponent(unitId),
+    user_id: userId,
+  });
+  const fetchFeedbackUrl = `${
+    getConfig().AI_TRANSLATIONS_URL
+  }/api/v1/whole-course-translation-feedback?${params}`;
+  try {
+    const { data } = await getAuthenticatedHttpClient().get(fetchFeedbackUrl);
+    return camelCaseObject(data);
+  } catch (error) {
+    logError(
+      `Translation plugin fail to fetch from ${fetchFeedbackUrl}`,
+      error,
+    );
+    return {};
+  }
+}
+
+export async function createTranslationFeedback({
+  courseId,
+  feedbackValue,
+  translationLanguage,
+  unitId,
+  userId,
+}) {
+  const createFeedbackUrl = `${
+    getConfig().AI_TRANSLATIONS_URL
+  }/api/v1/whole-course-translation-feedback/`;
+  try {
+    const { data } = await getAuthenticatedHttpClient().post(
+      createFeedbackUrl,
+      {
+        course_id: courseId,
+        feedback_value: feedbackValue,
+        translation_language: translationLanguage,
+        unit_id: unitId,
+        user_id: userId,
+      },
+    );
+    return camelCaseObject(data);
+  } catch (error) {
+    logError(
+      `Translation plugin fail to create feedback from ${createFeedbackUrl}`,
+      error,
+    );
+    return {};
+  }
+}
--- a/plugins/UnitTranslationPlugin/data/api.test.js
+++ b/plugins/UnitTranslationPlugin/data/api.test.js
@@ -0,0 +1,125 @@
+import { camelCaseObject } from '@edx/frontend-platform';
+import { logError } from '@edx/frontend-platform/logging';
+import { stringify } from 'query-string';
+
+import {
+  fetchTranslationConfig,
+  getTranslationFeedback,
+  createTranslationFeedback,
+} from './api';
+
+const mockGetMethod = jest.fn();
+const mockPostMethod = jest.fn();
+jest.mock('@edx/frontend-platform/auth', () => ({
+  getAuthenticatedHttpClient: () => ({
+    get: mockGetMethod,
+    post: mockPostMethod,
+  }),
+}));
+jest.mock('@edx/frontend-platform/logging', () => ({
+  logError: jest.fn(),
+}));
+
+describe('UnitTranslation api', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+  describe('fetchTranslationConfig', () => {
+    const courseId = 'course-v1:edX+DemoX+Demo_Course';
+    const expectedResponse = {
+      feature_enabled: true,
+      available_translation_languages: [
+        {
+          code: 'en',
+          label: 'English',
+        },
+        {
+          code: 'es',
+          label: 'Spanish',
+        },
+      ],
+    };
+    it('should fetch translation config', async () => {
+      const expectedUrl = `http://localhost:18000/api/translatable_xblocks/config/?course_id=${encodeURIComponent(
+        courseId,
+      )}`;
+      mockGetMethod.mockResolvedValueOnce({ data: expectedResponse });
+      const result = await fetchTranslationConfig(courseId);
+      expect(result).toEqual({
+        enabled: true,
+        availableLanguages: expectedResponse.available_translation_languages,
+      });
+      expect(mockGetMethod).toHaveBeenCalledWith(expectedUrl);
+    });
+
+    it('should return disabled and unavailable languages on error', async () => {
+      mockGetMethod.mockRejectedValueOnce(new Error('error'));
+      const result = await fetchTranslationConfig(courseId);
+      expect(result).toEqual({
+        enabled: false,
+        availableLanguages: [],
+      });
+      expect(logError).toHaveBeenCalled();
+    });
+  });
+
+  describe('getTranslationFeedback', () => {
+    const props = {
+      courseId: 'course-v1:edX+DemoX+Demo_Course',
+      translationLanguage: 'es',
+      unitId: 'unit-v1:edX+DemoX+Demo_Course+type@video+block@video',
+      userId: 'test_user',
+    };
+    const expectedResponse = {
+      feedback: 'good',
+    };
+    it('should fetch translation feedback', async () => {
+      const params = stringify({
+        translation_language: props.translationLanguage,
+        course_id: encodeURIComponent(props.courseId),
+        unit_id: encodeURIComponent(props.unitId),
+        user_id: props.userId,
+      });
+      const expectedUrl = `http://localhost:18760/api/v1/whole-course-translation-feedback?${params}`;
+      mockGetMethod.mockResolvedValueOnce({ data: expectedResponse });
+      const result = await getTranslationFeedback(props);
+      expect(result).toEqual(camelCaseObject(expectedResponse));
+      expect(mockGetMethod).toHaveBeenCalledWith(expectedUrl);
+    });
+
+    it('should return empty object on error', async () => {
+      mockGetMethod.mockRejectedValueOnce(new Error('error'));
+      const result = await getTranslationFeedback(props);
+      expect(result).toEqual({});
+      expect(logError).toHaveBeenCalled();
+    });
+  });
+
+  describe('createTranslationFeedback', () => {
+    const props = {
+      courseId: 'course-v1:edX+DemoX+Demo_Course',
+      feedbackValue: 'good',
+      translationLanguage: 'es',
+      unitId: 'unit-v1:edX+DemoX+Demo_Course+type@video+block@video',
+      userId: 'test_user',
+    };
+    it('should create translation feedback', async () => {
+      const expectedUrl = 'http://localhost:18760/api/v1/whole-course-translation-feedback/';
+      mockPostMethod.mockResolvedValueOnce({});
+      await createTranslationFeedback(props);
+      expect(mockPostMethod).toHaveBeenCalledWith(expectedUrl, {
+        course_id: props.courseId,
+        feedback_value: props.feedbackValue,
+        translation_language: props.translationLanguage,
+        unit_id: props.unitId,
+        user_id: props.userId,
+      });
+    });
+
+    it('should log error on failure', async () => {
+      mockPostMethod.mockRejectedValueOnce(new Error('error'));
+      await createTranslationFeedback(props);
+      expect(logError).toHaveBeenCalled();
+    });
+  });
+});
--- a/plugins/UnitTranslationPlugin/feedback-widget/snapshots/index.test.jsx.snap
+++ b/plugins/UnitTranslationPlugin/feedback-widget/snapshots/index.test.jsx.snap
@@ -0,0 +1,204 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<FeedbackWidget /> render feedback widget 1`] = `
+<div
+  className="d-none"
+>
+  <div
+    className="sequence w-100"
+  >
+    <div
+      className="ml-4 mr-2"
+    >
+      <ActionRow>
+        Rate this page translation
+        <Spacer />
+        <div>
+          <IconButton
+            alt="positive-feedback"
+            className="m-1"
+            iconAs="Icon"
+            id="positive-feedback-button"
+            onClick={[MockFunction onThumbsUpClick]}
+            src="ThumbUpOutline"
+            variant="secondary"
+          />
+          <IconButton
+            alt="negative-feedback"
+            className="mr-2"
+            iconAs="Icon"
+            id="negative-feedback-button"
+            onClick={[MockFunction onThumbsDownClick]}
+            src="ThumbDownOffAlt"
+            variant="secondary"
+          />
+        </div>
+        <div
+          className="mb-1 text-light action-row-divider"
+        >
+          |
+        </div>
+        <div>
+          <IconButton
+            alt="close-feedback"
+            className="ml-1 mr-2 float-right"
+            iconAs="Icon"
+            id="close-feedback-button"
+            onClick={[MockFunction closeFeedbackWidget]}
+            src="Close"
+            variant="secondary"
+          />
+        </div>
+      </ActionRow>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`<FeedbackWidget /> render gratitude text 1`] = `
+<div
+  className="d-none"
+>
+  <div
+    className="sequence w-100"
+  >
+    <div
+      className="ml-4 mr-4"
+    >
+      <ActionRow
+        className="m-2 justify-content-center"
+      >
+        Thank you! Your feedback matters.
+      </ActionRow>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`<FeedbackWidget /> renders hidden by default 1`] = `
+<div
+  className="d-none"
+>
+  <div
+    className="sequence w-100"
+  >
+    <div
+      className="ml-4 mr-2"
+    >
+      <ActionRow>
+        Rate this page translation
+        <Spacer />
+        <div>
+          <IconButton
+            alt="positive-feedback"
+            className="m-1"
+            iconAs="Icon"
+            id="positive-feedback-button"
+            onClick={[MockFunction onThumbsUpClick]}
+            src="ThumbUpOutline"
+            variant="secondary"
+          />
+          <IconButton
+            alt="negative-feedback"
+            className="mr-2"
+            iconAs="Icon"
+            id="negative-feedback-button"
+            onClick={[MockFunction onThumbsDownClick]}
+            src="ThumbDownOffAlt"
+            variant="secondary"
+          />
+        </div>
+        <div
+          className="mb-1 text-light action-row-divider"
+        >
+          |
+        </div>
+        <div>
+          <IconButton
+            alt="close-feedback"
+            className="ml-1 mr-2 float-right"
+            iconAs="Icon"
+            id="close-feedback-button"
+            onClick={[MockFunction closeFeedbackWidget]}
+            src="Close"
+            variant="secondary"
+          />
+        </div>
+      </ActionRow>
+    </div>
+    <div
+      className="ml-4 mr-4"
+    >
+      <ActionRow
+        className="m-2 justify-content-center"
+      >
+        Thank you! Your feedback matters.
+      </ActionRow>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`<FeedbackWidget /> renders show when elemReady is true 1`] = `
+<div
+  className="sequence-container d-inline-flex flex-row w-100"
+>
+  <div
+    className="sequence w-100"
+  >
+    <div
+      className="ml-4 mr-2"
+    >
+      <ActionRow>
+        Rate this page translation
+        <Spacer />
+        <div>
+          <IconButton
+            alt="positive-feedback"
+            className="m-1"
+            iconAs="Icon"
+            id="positive-feedback-button"
+            onClick={[MockFunction onThumbsUpClick]}
+            src="ThumbUpOutline"
+            variant="secondary"
+          />
+          <IconButton
+            alt="negative-feedback"
+            className="mr-2"
+            iconAs="Icon"
+            id="negative-feedback-button"
+            onClick={[MockFunction onThumbsDownClick]}
+            src="ThumbDownOffAlt"
+            variant="secondary"
+          />
+        </div>
+        <div
+          className="mb-1 text-light action-row-divider"
+        >
+          |
+        </div>
+        <div>
+          <IconButton
+            alt="close-feedback"
+            className="ml-1 mr-2 float-right"
+            iconAs="Icon"
+            id="close-feedback-button"
+            onClick={[MockFunction closeFeedbackWidget]}
+            src="Close"
+            variant="secondary"
+          />
+        </div>
+      </ActionRow>
+    </div>
+    <div
+      className="ml-4 mr-4"
+    >
+      <ActionRow
+        className="m-2 justify-content-center"
+      >
+        Thank you! Your feedback matters.
+      </ActionRow>
+    </div>
+  </div>
+</div>
+`;
--- a/plugins/UnitTranslationPlugin/feedback-widget/index.jsx
+++ b/plugins/UnitTranslationPlugin/feedback-widget/index.jsx
@@ -0,0 +1,116 @@
+import React, {
+  useEffect, useRef, useState,
+} from 'react';
+import PropTypes from 'prop-types';
+
+import { useIntl } from '@edx/frontend-platform/i18n';
+import { ActionRow, IconButton, Icon } from '@openedx/paragon';
+import { Close, ThumbUpOutline, ThumbDownOffAlt } from '@openedx/paragon/icons';
+
+import './index.scss';
+import messages from './messages';
+import useFeedbackWidget from './useFeedbackWidget';
+
+const FeedbackWidget = ({
+  courseId,
+  translationLanguage,
+  unitId,
+  userId,
+}) => {
+  const { formatMessage } = useIntl();
+  const ref = useRef(null);
+  const [elemReady, setElemReady] = useState(false);
+  const {
+    closeFeedbackWidget,
+    showFeedbackWidget,
+    showGratitudeText,
+    onThumbsUpClick,
+    onThumbsDownClick,
+  } = useFeedbackWidget({
+    courseId,
+    translationLanguage,
+    unitId,
+    userId,
+  });
+
+  useEffect(() => {
+    if (ref.current) {
+      const domNode = document.getElementById('whole-course-translation-feedback-widget');
+      domNode.appendChild(ref.current);
+      setElemReady(true);
+    }
+  }, [ref.current]);
+
+  return (
+    <div ref={ref} className={(elemReady) ? 'sequence-container d-inline-flex flex-row w-100' : 'd-none'}>
+      {(showFeedbackWidget || showGratitudeText) ? (
+        <div className="sequence w-100">
+          {
+            showFeedbackWidget && (
+              <div className="ml-4 mr-2">
+                <ActionRow>
+                  {formatMessage(messages.rateTranslationText)}
+                  <ActionRow.Spacer />
+                  <div>
+                    <IconButton
+                      src={ThumbUpOutline}
+                      iconAs={Icon}
+                      alt="positive-feedback"
+                      onClick={onThumbsUpClick}
+                      variant="secondary"
+                      className="m-1"
+                      id="positive-feedback-button"
+                    />
+                    <IconButton
+                      src={ThumbDownOffAlt}
+                      iconAs={Icon}
+                      alt="negative-feedback"
+                      onClick={onThumbsDownClick}
+                      variant="secondary"
+                      className="mr-2"
+                      id="negative-feedback-button"
+                    />
+                  </div>
+                  <div className="mb-1 text-light action-row-divider">
+                    |
+                  </div>
+                  <div>
+                    <IconButton
+                      src={Close}
+                      iconAs={Icon}
+                      alt="close-feedback"
+                      onClick={closeFeedbackWidget}
+                      variant="secondary"
+                      className="ml-1 mr-2 float-right"
+                      id="close-feedback-button"
+                    />
+                  </div>
+                </ActionRow>
+              </div>
+            )
+          }
+          {
+            showGratitudeText && (
+              <div className="ml-4 mr-4">
+                <ActionRow className="m-2 justify-content-center">
+                  {formatMessage(messages.gratitudeText)}
+                </ActionRow>
+              </div>
+            )
+          }
+        </div>
+      ) : null}
+    </div>
+  );
+};
+
+FeedbackWidget.propTypes = {
+  courseId: PropTypes.string.isRequired,
+  translationLanguage: PropTypes.string.isRequired,
+  userId: PropTypes.string.isRequired,
+  unitId: PropTypes.string.isRequired,
+};
+
+FeedbackWidget.defaultProps = {};
+
+export default FeedbackWidget;
--- a/plugins/UnitTranslationPlugin/feedback-widget/index.scss
+++ b/plugins/UnitTranslationPlugin/feedback-widget/index.scss
@@ -0,0 +1,4 @@
+.action-row-divider {
+    font-size: 31px;
+    font-weight: 100;
+}
--- a/plugins/UnitTranslationPlugin/feedback-widget/index.test.jsx
+++ b/plugins/UnitTranslationPlugin/feedback-widget/index.test.jsx
@@ -0,0 +1,107 @@
+import { useState } from 'react';
+import { shallow } from '@edx/react-unit-test-utils';
+
+import FeedbackWidget from './index';
+import useFeedbackWidget from './useFeedbackWidget';
+
+jest.mock('react', () => ({
+  ...jest.requireActual('react'),
+  useState: jest.fn((value) => [value, jest.fn()]),
+}));
+jest.mock('@openedx/paragon', () => jest.requireActual('@edx/react-unit-test-utils').mockComponents({
+  ActionRow: {
+    Spacer: 'Spacer',
+  },
+  IconButton: 'IconButton',
+  Icon: 'Icon',
+}));
+jest.mock('@openedx/paragon/icons', () => ({
+  Close: 'Close',
+  ThumbUpOutline: 'ThumbUpOutline',
+  ThumbDownOffAlt: 'ThumbDownOffAlt',
+}));
+jest.mock('./useFeedbackWidget');
+jest.mock('@edx/frontend-platform/i18n', () => {
+  const i18n = jest.requireActual('@edx/frontend-platform/i18n');
+  const { formatMessage } = jest.requireActual('@edx/react-unit-test-utils');
+  return {
+    ...i18n,
+    useIntl: jest.fn(() => ({
+      formatMessage,
+    })),
+  };
+});
+
+describe('<FeedbackWidget />', () => {
+  const props = {
+    courseId: 'course-v1:edX+DemoX+Demo_Course',
+    translationLanguage: 'es',
+    unitId:
+      'block-v1:edX+DemoX+Demo_Course+type@vertical+block@37b72b3915204b70acb00c55b604b563',
+    userId: '123',
+  };
+
+  const mockUseFeedbackWidget = ({ showFeedbackWidget, showGratitudeText }) => {
+    useFeedbackWidget.mockReturnValueOnce({
+      closeFeedbackWidget: jest.fn().mockName('closeFeedbackWidget'),
+      sendFeedback: jest.fn().mockName('sendFeedback'),
+      onThumbsUpClick: jest.fn().mockName('onThumbsUpClick'),
+      onThumbsDownClick: jest.fn().mockName('onThumbsDownClick'),
+      showFeedbackWidget,
+      showGratitudeText,
+    });
+  };
+
+  it('renders hidden by default', () => {
+    mockUseFeedbackWidget({
+      showFeedbackWidget: true,
+      showGratitudeText: true,
+    });
+    const wrapper = shallow(<FeedbackWidget {...props} />);
+    expect(wrapper.snapshot).toMatchSnapshot();
+    expect(wrapper.instance.findByType('div')[0].props.className).toContain(
+      'd-none',
+    );
+  });
+
+  it('renders show when elemReady is true', () => {
+    mockUseFeedbackWidget({
+      showFeedbackWidget: true,
+      showGratitudeText: true,
+    });
+    useState.mockReturnValueOnce([true, jest.fn()]);
+    const wrapper = shallow(<FeedbackWidget {...props} />);
+    expect(wrapper.snapshot).toMatchSnapshot();
+    expect(wrapper.instance.findByType('div')[0].props.className).not.toContain(
+      'd-none',
+    );
+  });
+
+  it('render empty when showFeedbackWidget and showGratitudeText are false', () => {
+    mockUseFeedbackWidget({
+      showFeedbackWidget: false,
+      showGratitudeText: false,
+    });
+    useState.mockReturnValueOnce([true, jest.fn()]);
+    const wrapper = shallow(<FeedbackWidget {...props} />);
+    expect(wrapper.instance.findByType('div')[0].children.length).toBe(0);
+  });
+
+  it('render feedback widget', () => {
+    mockUseFeedbackWidget({
+      showFeedbackWidget: true,
+      showGratitudeText: false,
+    });
+    const wrapper = shallow(<FeedbackWidget {...props} />);
+    expect(wrapper.snapshot).toMatchSnapshot();
+  });
+
+  it('render gratitude text', () => {
+    mockUseFeedbackWidget({
+      showFeedbackWidget: false,
+      showGratitudeText: true,
+    });
+    const wrapper = shallow(<FeedbackWidget {...props} />);
+    expect(wrapper.snapshot).toMatchSnapshot();
+  });
+});
--- a/plugins/UnitTranslationPlugin/feedback-widget/messages.js
+++ b/plugins/UnitTranslationPlugin/feedback-widget/messages.js
@@ -0,0 +1,16 @@
+import { defineMessages } from '@edx/frontend-platform/i18n';
+
+const messages = defineMessages({
+  rateTranslationText: {
+    id: 'feedbackWidget.rateTranslationText',
+    defaultMessage: 'Rate this page translation',
+    description: 'Title for the feedback widget action row.',
+  },
+  gratitudeText: {
+    id: 'feedbackWidget.gratitudeText',
+    defaultMessage: 'Thank you! Your feedback matters.',
+    description: 'Title for secondary action row.',
+  },
+});
+
+export default messages;
--- a/plugins/UnitTranslationPlugin/feedback-widget/useFeedbackWidget.js
+++ b/plugins/UnitTranslationPlugin/feedback-widget/useFeedbackWidget.js
@@ -0,0 +1,82 @@
+import { useCallback, useEffect, useState } from 'react';
+
+import { createTranslationFeedback, getTranslationFeedback } from '../data/api';
+
+const useFeedbackWidget = ({
+  courseId,
+  translationLanguage,
+  unitId,
+  userId,
+}) => {
+  const [showFeedbackWidget, setShowFeedbackWidget] = useState(false);
+  const [showGratitudeText, setShowGratitudeText] = useState(false);
+
+  const closeFeedbackWidget = useCallback(() => {
+    setShowFeedbackWidget(false);
+  }, [setShowFeedbackWidget]);
+
+  const openFeedbackWidget = useCallback(() => {
+    setShowFeedbackWidget(true);
+  }, [setShowFeedbackWidget]);
+
+  useEffect(async () => {
+    const translationFeedback = await getTranslationFeedback({
+      courseId,
+      translationLanguage,
+      unitId,
+      userId,
+    });
+    setShowFeedbackWidget(!translationFeedback);
+  }, [
+    courseId,
+    translationLanguage,
+    unitId,
+    userId,
+  ]);
+
+  const openGratitudeText = useCallback(() => {
+    setShowGratitudeText(true);
+    setTimeout(() => {
+      setShowGratitudeText(false);
+    }, 3000);
+  }, [setShowGratitudeText]);
+
+  const sendFeedback = useCallback(async (feedbackValue) => {
+    await createTranslationFeedback({
+      courseId,
+      feedbackValue,
+      translationLanguage,
+      unitId,
+      userId,
+    });
+    closeFeedbackWidget();
+    openGratitudeText();
+  }, [
+    courseId,
+    translationLanguage,
+    unitId,
+    userId,
+    closeFeedbackWidget,
+    openGratitudeText,
+  ]);
+
+  const onThumbsUpClick = useCallback(() => {
+    sendFeedback(true);
+  }, [sendFeedback]);
+  const onThumbsDownClick = useCallback(() => {
+    sendFeedback(false);
+  }, [sendFeedback]);
+
+  return {
+    closeFeedbackWidget,
+    openFeedbackWidget,
+    openGratitudeText,
+    sendFeedback,
+    showFeedbackWidget,
+    showGratitudeText,
+    onThumbsUpClick,
+    onThumbsDownClick,
+  };
+};
+
+export default useFeedbackWidget;
--- a/plugins/UnitTranslationPlugin/feedback-widget/useFeedbackWidget.test.js
+++ b/plugins/UnitTranslationPlugin/feedback-widget/useFeedbackWidget.test.js
@@ -0,0 +1,163 @@
+import { renderHook, act } from '@testing-library/react-hooks';
+
+import useFeedbackWidget from './useFeedbackWidget';
+import { createTranslationFeedback, getTranslationFeedback } from '../data/api';
+
+jest.mock('../data/api', () => ({
+  createTranslationFeedback: jest.fn(),
+  getTranslationFeedback: jest.fn(),
+}));
+
+const initialProps = {
+  courseId: 'course-v1:edX+DemoX+Demo_Course',
+  translationLanguage: 'es',
+  unitId: 'block-v1:edX+DemoX+Demo_Course+type@vertical+block@vertical_0270f6de40fc',
+  userId: 3,
+};
+
+const newProps = {
+  courseId: 'course-v1:edX+DemoX+Demo_Course',
+  translationLanguage: 'fr',
+  unitId: 'block-v1:edX+DemoX+Demo_Course+type@vertical+block@vertical_0270f6de40fc',
+  userId: 3,
+};
+
+describe('useFeedbackWidget', () => {
+  beforeEach(async () => {
+    getTranslationFeedback.mockReturnValue('');
+  });
+
+  afterEach(() => {
+    jest.restoreAllMocks();
+  });
+
+  test('closeFeedbackWidget behavior', () => {
+    const { result, waitFor } = renderHook(() => useFeedbackWidget(initialProps));
+    waitFor(() => expect(result.current.showFeedbackWidget.toBe(true)));
+    act(() => {
+      result.current.closeFeedbackWidget();
+    });
+    expect(result.current.showFeedbackWidget).toBe(false);
+  });
+
+  test('openFeedbackWidget behavior', () => {
+    const { result } = renderHook(() => useFeedbackWidget(initialProps));
+    act(() => {
+      result.current.closeFeedbackWidget();
+    });
+    expect(result.current.showFeedbackWidget).toBe(false);
+    act(() => {
+      result.current.openFeedbackWidget();
+    });
+    expect(result.current.showFeedbackWidget).toBe(true);
+  });
+
+  test('openGratitudeText behavior', async () => {
+    const { result, waitFor } = renderHook(() => useFeedbackWidget(initialProps));
+
+    expect(result.current.showGratitudeText).toBe(false);
+    act(() => {
+      result.current.openGratitudeText();
+    });
+    expect(result.current.showGratitudeText).toBe(true);
+    // Wait for 3 seconds to hide the gratitude text
+    waitFor(() => {
+      expect(result.current.showGratitudeText).toBe(false);
+    }, { timeout: 3000 });
+  });
+
+  test('sendFeedback behavior', () => {
+    const { result, waitFor } = renderHook(() => useFeedbackWidget(initialProps));
+    const feedbackValue = true;
+
+    waitFor(() => expect(result.current.showFeedbackWidget.toBe(true)));
+
+    expect(result.current.showGratitudeText).toBe(false);
+    act(() => {
+      result.current.sendFeedback(feedbackValue);
+    });
+
+    waitFor(() => {
+      expect(result.current.showFeedbackWidget).toBe(false);
+      expect(result.current.showGratitudeText).toBe(true);
+    });
+
+    expect(createTranslationFeedback).toHaveBeenCalledWith({
+      courseId: initialProps.courseId,
+      feedbackValue,
+      translationLanguage: initialProps.translationLanguage,
+      unitId: initialProps.unitId,
+      userId: initialProps.userId,
+    });
+
+    // Wait for 3 seconds to hide the gratitude text
+    waitFor(() => {
+      expect(result.current.showGratitudeText).toBe(false);
+    }, { timeout: 3000 });
+  });
+
+  test('onThumbsUpClick behavior', () => {
+    const { result } = renderHook(() => useFeedbackWidget(initialProps));
+
+    act(() => {
+      result.current.onThumbsUpClick();
+    });
+
+    expect(createTranslationFeedback).toHaveBeenCalledWith({
+      courseId: initialProps.courseId,
+      feedbackValue: true,
+      translationLanguage: initialProps.translationLanguage,
+      unitId: initialProps.unitId,
+      userId: initialProps.userId,
+    });
+  });
+
+  test('onThumbsDownClick behavior', () => {
+    const { result } = renderHook(() => useFeedbackWidget(initialProps));
+
+    act(() => {
+      result.current.onThumbsDownClick();
+    });
+
+    expect(createTranslationFeedback).toHaveBeenCalledWith({
+      courseId: initialProps.courseId,
+      feedbackValue: false,
+      translationLanguage: initialProps.translationLanguage,
+      unitId: initialProps.unitId,
+      userId: initialProps.userId,
+    });
+  });
+
+  test('fetch feedback on initialization', () => {
+    const { waitFor } = renderHook(() => useFeedbackWidget(initialProps));
+    waitFor(() => {
+      expect(getTranslationFeedback).toHaveBeenCalledWith({
+        courseId: initialProps.courseId,
+        translationLanguage: initialProps.translationLanguage,
+        unitId: initialProps.unitId,
+        userId: initialProps.userId,
+      });
+    });
+  });
+
+  test('fetch feedback on props update', () => {
+    const { rerender, waitFor } = renderHook(() => useFeedbackWidget(initialProps));
+    waitFor(() => {
+      expect(getTranslationFeedback).toHaveBeenCalledWith({
+        courseId: initialProps.courseId,
+        translationLanguage: initialProps.translationLanguage,
+        unitId: initialProps.unitId,
+        userId: initialProps.userId,
+      });
+    });
+    rerender(newProps);
+    waitFor(() => {
+      expect(getTranslationFeedback).toHaveBeenCalledWith({
+        courseId: newProps.courseId,
+        translationLanguage: newProps.translationLanguage,
+        unitId: newProps.unitId,
+        userId: newProps.userId,
+      });
+    });
+  });
+});
--- a/plugins/UnitTranslationPlugin/index.jsx
+++ b/plugins/UnitTranslationPlugin/index.jsx
@@ -0,0 +1,43 @@
+import React, { useEffect, useState } from 'react';
+import PropTypes from 'prop-types';
+
+import { useModel } from '@src/generic/model-store';
+
+import TranslationSelection from './translation-selection';
+import { fetchTranslationConfig } from './data/api';
+
+const UnitTranslationPlugin = ({ id, courseId, unitId }) => {
+  const { language } = useModel('coursewareMeta', courseId);
+  const [translationConfig, setTranslationConfig] = useState({
+    enabled: false,
+    availableLanguages: [],
+  });
+
+  useEffect(() => {
+    fetchTranslationConfig(courseId).then(setTranslationConfig);
+  }, []);
+
+  const { enabled, availableLanguages } = translationConfig;
+
+  if (!enabled || !language || !availableLanguages.length) {
+    return null;
+  }
+
+  return (
+    <TranslationSelection
+      id={id}
+      courseId={courseId}
+      language={language}
+      availableLanguages={availableLanguages}
+      unitId={unitId}
+    />
+  );
+};
+
+UnitTranslationPlugin.propTypes = {
+  id: PropTypes.string.isRequired,
+  courseId: PropTypes.string.isRequired,
+  unitId: PropTypes.string.isRequired,
+};
+
+export default UnitTranslationPlugin;
--- a/plugins/UnitTranslationPlugin/index.test.jsx
+++ b/plugins/UnitTranslationPlugin/index.test.jsx
@@ -0,0 +1,62 @@
+import { shallow } from '@edx/react-unit-test-utils';
+import { useState } from 'react';
+import { useModel } from '@src/generic/model-store';
+
+import UnitTranslationPlugin from './index';
+
+jest.mock('@src/generic/model-store');
+jest.mock('./data/api', () => ({
+  fetchTranslationConfig: jest.fn(),
+}));
+jest.mock('./translation-selection', () => 'TranslationSelection');
+jest.mock('react', () => ({
+  ...jest.requireActual('react'),
+  useState: jest.fn(),
+}));
+
+describe('<UnitTranslationPlugin />', () => {
+  const props = {
+    id: 'id',
+    courseId: 'courseId',
+    unitId: 'unitId',
+  };
+  const mockInitialState = ({ enabled = true, availableLanguages = ['en'] }) => {
+    useState.mockReturnValue([{ enabled, availableLanguages }, jest.fn()]);
+  };
+  it('render empty when translation is not enabled', () => {
+    useModel.mockReturnValue({ language: 'en' });
+    mockInitialState({ enabled: false });
+
+    const wrapper = shallow(<UnitTranslationPlugin {...props} />);
+
+    expect(wrapper.isEmptyRender()).toBe(true);
+  });
+  it('render empty when available languages is empty', () => {
+    useModel.mockReturnValue({ language: 'fr' });
+    mockInitialState({
+      availableLanguages: [],
+    });
+
+    const wrapper = shallow(<UnitTranslationPlugin {...props} />);
+
+    expect(wrapper.isEmptyRender()).toBe(true);
+  });
+
+  it('render empty when course language has not been set', () => {
+    useModel.mockReturnValue({ language: undefined });
+    mockInitialState({});
+
+    const wrapper = shallow(<UnitTranslationPlugin {...props} />);
+
+    expect(wrapper.isEmptyRender()).toBe(true);
+  });
+
+  it('render TranslationSelection when translation is enabled and language is available', () => {
+    useModel.mockReturnValue({ language: 'en' });
+    mockInitialState({});
+
+    const wrapper = shallow(<UnitTranslationPlugin {...props} />);
+
+    expect(wrapper.snapshot).toMatchSnapshot();
+  });
+});
--- a/plugins/UnitTranslationPlugin/translation-selection/TranslationModal.jsx
+++ b/plugins/UnitTranslationPlugin/translation-selection/TranslationModal.jsx
@@ -0,0 +1,82 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+import { useIntl } from '@edx/frontend-platform/i18n';
+import {
+  StandardModal,
+  ActionRow,
+  Button,
+  Icon,
+  ListBox,
+  ListBoxOption,
+} from '@openedx/paragon';
+import { Check } from '@openedx/paragon/icons';
+
+import useTranslationModal from './useTranslationModal';
+import messages from './messages';
+
+import './TranslationModal.scss';
+
+const TranslationModal = ({
+  isOpen,
+  close,
+  selectedLanguage,
+  setSelectedLanguage,
+  availableLanguages,
+}) => {
+  const { formatMessage } = useIntl();
+  const { selectedIndex, setSelectedIndex, onSubmit } = useTranslationModal({
+    selectedLanguage,
+    setSelectedLanguage,
+    close,
+    availableLanguages,
+  });
+
+  return (
+    <StandardModal
+      title={formatMessage(messages.languageSelectionModalTitle)}
+      isOpen={isOpen}
+      onClose={close}
+      footerNode={(
+        <ActionRow>
+          <ActionRow.Spacer />
+          <Button variant="tertiary" onClick={close}>
+            {formatMessage(messages.cancelButtonText)}
+          </Button>
+          <Button onClick={onSubmit}>
+            {formatMessage(messages.submitButtonText)}
+          </Button>
+        </ActionRow>
+      )}
+    >
+      <ListBox className="listbox-container">
+        {availableLanguages.map(({ code, label }, index) => (
+          <ListBoxOption
+            className="d-flex justify-content-between"
+            key={code}
+            selectedOptionIndex={selectedIndex}
+            onSelect={() => setSelectedIndex(index)}
+          >
+            {label}
+            {selectedIndex === index && <Icon src={Check} />}
+          </ListBoxOption>
+        ))}
+      </ListBox>
+    </StandardModal>
+  );
+};
+
+TranslationModal.propTypes = {
+  isOpen: PropTypes.bool.isRequired,
+  close: PropTypes.func.isRequired,
+  selectedLanguage: PropTypes.string.isRequired,
+  setSelectedLanguage: PropTypes.func.isRequired,
+  availableLanguages: PropTypes.arrayOf(
+    PropTypes.shape({
+      code: PropTypes.string.isRequired,
+      label: PropTypes.string.isRequired,
+    }),
+  ).isRequired,
+};
+
+export default TranslationModal;
--- a/plugins/UnitTranslationPlugin/translation-selection/TranslationModal.scss
+++ b/plugins/UnitTranslationPlugin/translation-selection/TranslationModal.scss
@@ -0,0 +1,7 @@
+.listbox-container {
+  max-height: 400px;
+
+  :last-child {
+    margin-bottom: 5px;
+  }
+}
--- a/plugins/UnitTranslationPlugin/translation-selection/TranslationModal.test.jsx
+++ b/plugins/UnitTranslationPlugin/translation-selection/TranslationModal.test.jsx
@@ -0,0 +1,59 @@
+import { shallow } from '@edx/react-unit-test-utils';
+
+import TranslationModal from './TranslationModal';
+
+jest.mock('./useTranslationModal', () => ({
+  __esModule: true,
+  default: () => ({
+    selectedIndex: 0,
+    setSelectedIndex: jest.fn(),
+    onSubmit: jest.fn().mockName('onSubmit'),
+  }),
+}));
+jest.mock('@openedx/paragon', () => jest.requireActual('@edx/react-unit-test-utils').mockComponents({
+  StandardModal: 'StandardModal',
+  ActionRow: {
+    Spacer: 'Spacer',
+  },
+  Button: 'Button',
+  Icon: 'Icon',
+  ListBox: 'ListBox',
+  ListBoxOption: 'ListBoxOption',
+}));
+jest.mock('@openedx/paragon/icons', () => ({
+  Check: jest.fn().mockName('icons.Check'),
+}));
+jest.mock('@edx/frontend-platform/i18n', () => {
+  const i18n = jest.requireActual('@edx/frontend-platform/i18n');
+  const { formatMessage } = jest.requireActual('@edx/react-unit-test-utils');
+  return {
+    ...i18n,
+    useIntl: jest.fn(() => ({
+      formatMessage,
+    })),
+  };
+});
+
+describe('TranslationModal', () => {
+  const props = {
+    isOpen: true,
+    close: jest.fn().mockName('close'),
+    selectedLanguage: 'en',
+    setSelectedLanguage: jest.fn().mockName('setSelectedLanguage'),
+    availableLanguages: [
+      {
+        code: 'en',
+        label: 'English',
+      },
+      {
+        code: 'es',
+        label: 'Spanish',
+      },
+    ],
+  };
+  it('renders correctly', () => {
+    const wrapper = shallow(<TranslationModal {...props} />);
+    expect(wrapper.snapshot).toMatchSnapshot();
+    expect(wrapper.instance.findByType('ListBoxOption')).toHaveLength(2);
+  });
+});
--- a/plugins/UnitTranslationPlugin/translation-selection/snapshots/TranslationModal.test.jsx.snap
+++ b/plugins/UnitTranslationPlugin/translation-selection/snapshots/TranslationModal.test.jsx.snap
@@ -0,0 +1,49 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`TranslationModal renders correctly 1`] = `
+<StandardModal
+  footerNode={
+    <ActionRow>
+      <Spacer />
+      <Button
+        onClick={[MockFunction close]}
+        variant="tertiary"
+      >
+        Cancel
+      </Button>
+      <Button
+        onClick={[MockFunction onSubmit]}
+      >
+        Submit
+      </Button>
+    </ActionRow>
+  }
+  isOpen={true}
+  onClose={[MockFunction close]}
+  title="Translate this course"
+>
+  <ListBox
+    className="listbox-container"
+  >
+    <ListBoxOption
+      className="d-flex justify-content-between"
+      key="en"
+      onSelect={[Function]}
+      selectedOptionIndex={0}
+    >
+      English
+      <Icon
+        src={[MockFunction icons.Check]}
+      />
+    </ListBoxOption>
+    <ListBoxOption
+      className="d-flex justify-content-between"
+      key="es"
+      onSelect={[Function]}
+      selectedOptionIndex={0}
+    >
+      Spanish
+    </ListBoxOption>
+  </ListBox>
+</StandardModal>
+`;
--- a/plugins/UnitTranslationPlugin/translation-selection/snapshots/index.test.jsx.snap
+++ b/plugins/UnitTranslationPlugin/translation-selection/snapshots/index.test.jsx.snap
@@ -0,0 +1,50 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<TranslationSelection /> renders 1`] = `
+<Fragment>
+  <ProductTour
+    tours={
+      Array [
+        Object {
+          "abitrarily": "defined",
+        },
+      ]
+    }
+  />
+  <IconButton
+    alt="change-language"
+    className="mr-2 mb-2 float-right"
+    iconAs="Icon"
+    id="translation-selection-button"
+    onClick={[MockFunction open]}
+    src="Language"
+    variant="primary"
+  />
+  <TranslationModal
+    availableLanguages={
+      Array [
+        Object {
+          "code": "en",
+          "label": "English",
+        },
+        Object {
+          "code": "es",
+          "label": "Spanish",
+        },
+      ]
+    }
+    close={[MockFunction close]}
+    courseId="course-v1:edX+DemoX+Demo_Course"
+    id="plugin-test-id"
+    isOpen={false}
+    selectedLanguage="en"
+    setSelectedLanguage={[MockFunction setSelectedLanguage]}
+  />
+  <FeedbackWidget
+    courseId="course-v1:edX+DemoX+Demo_Course"
+    translationLanguage="en"
+    unitId="unit-test-id"
+    userId="123"
+  />
+</Fragment>
+`;
--- a/plugins/UnitTranslationPlugin/translation-selection/index.jsx
+++ b/plugins/UnitTranslationPlugin/translation-selection/index.jsx
@@ -0,0 +1,100 @@
+import React, { useContext, useEffect } from 'react';
+import PropTypes from 'prop-types';
+
+import { AppContext } from '@edx/frontend-platform/react';
+import { IconButton, Icon, ProductTour } from '@openedx/paragon';
+import { Language } from '@openedx/paragon/icons';
+import { useDispatch } from 'react-redux';
+import { stringifyUrl } from 'query-string';
+
+import { registerOverrideMethod } from '@src/generic/plugin-store';
+
+import TranslationModal from './TranslationModal';
+import useTranslationTour from './useTranslationTour';
+import useSelectLanguage from './useSelectLanguage';
+import FeedbackWidget from '../feedback-widget';
+
+const TranslationSelection = ({
+  id, courseId, language, availableLanguages, unitId,
+}) => {
+  const {
+    authenticatedUser: { userId },
+  } = useContext(AppContext);
+  const dispatch = useDispatch();
+  const {
+    translationTour, isOpen, open, close,
+  } = useTranslationTour();
+
+  const { selectedLanguage, setSelectedLanguage } = useSelectLanguage({
+    courseId,
+    language,
+  });
+
+  useEffect(() => {
+    dispatch(
+      registerOverrideMethod({
+        pluginName: id,
+        methodName: 'getIFrameUrl',
+        method: (iframeUrl) => {
+          const finalUrl = stringifyUrl({
+            url: iframeUrl,
+            query: {
+              ...(language
+                && selectedLanguage
+                && language !== selectedLanguage && {
+                src_lang: language,
+                dest_lang: selectedLanguage,
+              }),
+            },
+          });
+          return finalUrl;
+        },
+      }),
+    );
+  }, [language, selectedLanguage]);
+
+  return (
+    <>
+      <ProductTour tours={[translationTour]} />
+      <IconButton
+        src={Language}
+        iconAs={Icon}
+        alt="change-language"
+        onClick={open}
+        variant="primary"
+        className="mr-2 mb-2 float-right"
+        id="translation-selection-button"
+      />
+      <TranslationModal
+        isOpen={isOpen}
+        close={close}
+        courseId={courseId}
+        selectedLanguage={selectedLanguage}
+        setSelectedLanguage={setSelectedLanguage}
+        availableLanguages={availableLanguages}
+        id={id}
+      />
+      <FeedbackWidget
+        courseId={courseId}
+        translationLanguage={selectedLanguage}
+        unitId={unitId}
+        userId={userId}
+      />
+    </>
+  );
+};
+
+TranslationSelection.propTypes = {
+  id: PropTypes.string.isRequired,
+  courseId: PropTypes.string.isRequired,
+  unitId: PropTypes.string.isRequired,
+  language: PropTypes.string.isRequired,
+  availableLanguages: PropTypes.arrayOf(PropTypes.shape({
+    code: PropTypes.string.isRequired,
+    label: PropTypes.string.isRequired,
+  })).isRequired,
+};
+
+TranslationSelection.defaultProps = {};
+
+export default TranslationSelection;
--- a/plugins/UnitTranslationPlugin/translation-selection/index.test.jsx
+++ b/plugins/UnitTranslationPlugin/translation-selection/index.test.jsx
@@ -0,0 +1,63 @@
+import { shallow } from '@edx/react-unit-test-utils';
+
+import TranslationSelection from './index';
+
+jest.mock('react', () => ({
+  ...jest.requireActual('react'),
+  useContext: jest.fn().mockName('useContext').mockReturnValue({
+    authenticatedUser: {
+      userId: '123',
+    },
+  }),
+}));
+jest.mock('@openedx/paragon', () => ({
+  IconButton: 'IconButton',
+  Icon: 'Icon',
+  ProductTour: 'ProductTour',
+}));
+jest.mock('@openedx/paragon/icons', () => ({
+  Language: 'Language',
+}));
+jest.mock('./useTranslationTour', () => () => ({
+  translationTour: {
+    abitrarily: 'defined',
+  },
+  isOpen: false,
+  open: jest.fn().mockName('open'),
+  close: jest.fn().mockName('close'),
+}));
+jest.mock('react-redux', () => ({
+  useDispatch: jest.fn().mockName('useDispatch'),
+}));
+jest.mock('@src/generic/plugin-store', () => ({
+  registerOverrideMethod: jest.fn().mockName('registerOverrideMethod'),
+}));
+jest.mock('./TranslationModal', () => 'TranslationModal');
+jest.mock('./useSelectLanguage', () => () => ({
+  selectedLanguage: 'en',
+  setSelectedLanguage: jest.fn().mockName('setSelectedLanguage'),
+}));
+jest.mock('../feedback-widget', () => 'FeedbackWidget');
+
+describe('<TranslationSelection />', () => {
+  const props = {
+    id: 'plugin-test-id',
+    courseId: 'course-v1:edX+DemoX+Demo_Course',
+    language: 'en',
+    availableLanguages: [
+      {
+        code: 'en',
+        label: 'English',
+      },
+      {
+        code: 'es',
+        label: 'Spanish',
+      },
+    ],
+    unitId: 'unit-test-id',
+  };
+  it('renders', () => {
+    const wrapper = shallow(<TranslationSelection {...props} />);
+    expect(wrapper.snapshot).toMatchSnapshot();
+  });
+});
--- a/plugins/UnitTranslationPlugin/translation-selection/messages.js
+++ b/plugins/UnitTranslationPlugin/translation-selection/messages.js
@@ -0,0 +1,41 @@
+import { defineMessages } from '@edx/frontend-platform/i18n';
+
+const messages = defineMessages({
+  translationTourModalTitle: {
+    id: 'translationSelection.translationTourModalTitle',
+    defaultMessage: 'This is a standard modal dialog',
+    description: 'Title for the translation modal.',
+  },
+  translationTourModalBody: {
+    id: 'translationSelection.translationTourModalBody',
+    defaultMessage: 'Now you can easily translate course content.',
+    description: 'Body for the translation modal.',
+  },
+  tryItButtonText: {
+    id: 'translationSelection.tryItButtonText',
+    defaultMessage: 'Try it',
+    description: 'Button text for the translation modal.',
+  },
+  dismissButtonText: {
+    id: 'translationSelection.dismissButtonText',
+    defaultMessage: 'Dismiss',
+    description: 'Button text for the translation modal.',
+  },
+  languageSelectionModalTitle: {
+    id: 'translationSelection.languageSelectionModalTitle',
+    defaultMessage: 'Translate this course',
+    description: 'Title for the translation modal.',
+  },
+  cancelButtonText: {
+    id: 'translationSelection.cancelButtonText',
+    defaultMessage: 'Cancel',
+    description: 'Button text for the translation modal.',
+  },
+  submitButtonText: {
+    id: 'translationSelection.submitButtonText',
+    defaultMessage: 'Submit',
+    description: 'Button text for the translation modal.',
+  },
+});
+
+export default messages;
--- a/plugins/UnitTranslationPlugin/translation-selection/useSelectLanguage.js
+++ b/plugins/UnitTranslationPlugin/translation-selection/useSelectLanguage.js
@@ -0,0 +1,35 @@
+import { useCallback } from 'react';
+import { StrictDict, useKeyedState } from '@edx/react-unit-test-utils';
+import {
+  getLocalStorage,
+  setLocalStorage,
+} from '@src/data/localStorage';
+
+export const selectedLanguageKey = 'selectedLanguages';
+
+export const stateKeys = StrictDict({
+  selectedLanguage: 'selectedLanguage',
+});
+
+const useSelectLanguage = ({ courseId, language }) => {
+  const selectedLanguageItem = getLocalStorage(selectedLanguageKey) || {};
+  const [selectedLanguage, updateSelectedLanguage] = useKeyedState(
+    stateKeys.selectedLanguage,
+    selectedLanguageItem[courseId] || language,
+  );
+
+  const setSelectedLanguage = useCallback((newSelectedLanguage) => {
+    setLocalStorage(selectedLanguageKey, {
+      ...selectedLanguageItem,
+      [courseId]: newSelectedLanguage,
+    });
+    updateSelectedLanguage(newSelectedLanguage);
+  });
+
+  return {
+    selectedLanguage,
+    setSelectedLanguage,
+  };
+};
+
+export default useSelectLanguage;
--- a/plugins/UnitTranslationPlugin/translation-selection/useSelectLanguage.test.js
+++ b/plugins/UnitTranslationPlugin/translation-selection/useSelectLanguage.test.js
@@ -0,0 +1,63 @@
+import { mockUseKeyedState } from '@edx/react-unit-test-utils';
+import {
+  getLocalStorage,
+  setLocalStorage,
+} from '@src/data/localStorage';
+
+import useSelectLanguage, {
+  stateKeys,
+  selectedLanguageKey,
+} from './useSelectLanguage';
+
+const state = mockUseKeyedState(stateKeys);
+
+jest.mock('react', () => ({
+  ...jest.requireActual('react'),
+  useCallback: jest.fn((cb, prereqs) => (...args) => [
+    cb(...args),
+    { cb, prereqs },
+  ]),
+}));
+jest.mock('@src/data/localStorage', () => ({
+  getLocalStorage: jest.fn(),
+  setLocalStorage: jest.fn(),
+}));
+
+describe('useSelectLanguage', () => {
+  const props = {
+    courseId: 'test-course-id',
+    language: 'en',
+  };
+  const languages = [
+    { code: 'en', label: 'English' },
+    { code: 'es', label: 'Spanish' },
+  ];
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+    state.mock();
+  });
+  afterEach(() => {
+    state.resetVals();
+  });
+
+  languages.forEach(({ code, label }) => {
+    it(`initializes selectedLanguage to the selected language (${label})`, () => {
+      getLocalStorage.mockReturnValueOnce({ [props.courseId]: code });
+      const { selectedLanguage } = useSelectLanguage(props);
+
+      state.expectInitializedWith(stateKeys.selectedLanguage, code);
+      expect(selectedLanguage).toBe(code);
+    });
+  });
+
+  test('setSelectedLanguage behavior', () => {
+    const { setSelectedLanguage } = useSelectLanguage(props);
+
+    setSelectedLanguage('es');
+    state.expectSetStateCalledWith(stateKeys.selectedLanguage, 'es');
+    expect(setLocalStorage).toHaveBeenCalledWith(selectedLanguageKey, {
+      [props.courseId]: 'es',
+    });
+  });
+});
--- a/plugins/UnitTranslationPlugin/translation-selection/useTranslationModal.js
+++ b/plugins/UnitTranslationPlugin/translation-selection/useTranslationModal.js
@@ -0,0 +1,29 @@
+import { useCallback } from 'react';
+import { StrictDict, useKeyedState } from '@edx/react-unit-test-utils';
+
+export const stateKeys = StrictDict({
+  selectedIndex: 'selectedIndex',
+});
+
+const useTranslationModal = ({
+  selectedLanguage, setSelectedLanguage, close, availableLanguages,
+}) => {
+  const [selectedIndex, setSelectedIndex] = useKeyedState(
+    stateKeys.selectedIndex,
+    availableLanguages.findIndex((lang) => lang.code === selectedLanguage),
+  );
+
+  const onSubmit = useCallback(() => {
+    const newSelectedLanguage = availableLanguages[selectedIndex].code;
+    setSelectedLanguage(newSelectedLanguage);
+    close();
+  }, [selectedIndex]);
+
+  return {
+    selectedIndex,
+    setSelectedIndex,
+    onSubmit,
+  };
+};
+
+export default useTranslationModal;
--- a/plugins/UnitTranslationPlugin/translation-selection/useTranslationModal.test.js
+++ b/plugins/UnitTranslationPlugin/translation-selection/useTranslationModal.test.js
@@ -0,0 +1,49 @@
+import { mockUseKeyedState } from '@edx/react-unit-test-utils';
+
+import useTranslationModal, { stateKeys } from './useTranslationModal';
+
+const state = mockUseKeyedState(stateKeys);
+
+jest.mock('react', () => ({
+  ...jest.requireActual('react'),
+  useCallback: jest.fn((cb, prereqs) => (...args) => ([
+    cb(...args), { cb, prereqs },
+  ])),
+}));
+
+describe('useTranslationModal', () => {
+  const props = {
+    selectedLanguage: 'en',
+    setSelectedLanguage: jest.fn(),
+    close: jest.fn(),
+    availableLanguages: [
+      { code: 'en', label: 'English' },
+      { code: 'es', label: 'Spanish' },
+    ],
+  };
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+    state.mock();
+  });
+  afterEach(() => {
+    state.resetVals();
+  });
+
+  it('initializes selectedIndex to the index of the selected language', () => {
+    const { selectedIndex } = useTranslationModal(props);
+
+    state.expectInitializedWith(stateKeys.selectedIndex, 0);
+    expect(selectedIndex).toBe(0);
+  });
+
+  it('onSubmit updates the selected language and closes the modal', () => {
+    const { onSubmit } = useTranslationModal({
+      ...props,
+      selectedLanguage: 'es',
+    });
+    onSubmit();
+    expect(props.setSelectedLanguage).toHaveBeenCalledWith('es');
+    expect(props.close).toHaveBeenCalled();
+  });
+});
--- a/plugins/UnitTranslationPlugin/translation-selection/useTranslationTour.js
+++ b/plugins/UnitTranslationPlugin/translation-selection/useTranslationTour.js
@@ -0,0 +1,62 @@
+import { useCallback } from 'react';
+
+import { useIntl } from '@edx/frontend-platform/i18n';
+import { useToggle } from '@openedx/paragon';
+import { StrictDict, useKeyedState } from '@edx/react-unit-test-utils';
+
+import messages from './messages';
+
+const hasSeenTranslationTourKey = 'hasSeenTranslationTour';
+
+export const stateKeys = StrictDict({
+  showTranslationTour: 'showTranslationTour',
+});
+
+const useTranslationTour = () => {
+  const { formatMessage } = useIntl();
+
+  const [isTourEnabled, setIsTourEnabled] = useKeyedState(
+    stateKeys.showTranslationTour,
+    global.localStorage.getItem(hasSeenTranslationTourKey) !== 'true',
+  );
+  const [isOpen, open, close] = useToggle(false);
+
+  const endTour = useCallback(() => {
+    global.localStorage.setItem(hasSeenTranslationTourKey, 'true');
+    setIsTourEnabled(false);
+  }, [isTourEnabled, setIsTourEnabled]);
+
+  const tryIt = useCallback(() => {
+    endTour();
+    open();
+  }, [endTour, open]);
+
+  const translationTour = isTourEnabled
+    ? {
+      tourId: 'translation',
+      enabled: isTourEnabled,
+      onDismiss: endTour,
+      onEnd: tryIt,
+      checkpoints: [
+        {
+          title: formatMessage(messages.translationTourModalTitle),
+          body: formatMessage(messages.translationTourModalBody),
+          placement: 'bottom',
+          target: '#translation-selection-button',
+          showDismissButton: true,
+          endButtonText: formatMessage(messages.tryItButtonText),
+          dismissButtonText: formatMessage(messages.dismissButtonText),
+        },
+      ],
+    }
+    : {};
+
+  return {
+    translationTour,
+    isOpen,
+    open,
+    close,
+  };
+};
+
+export default useTranslationTour;
--- a/plugins/UnitTranslationPlugin/translation-selection/useTranslationTour.test.js
+++ b/plugins/UnitTranslationPlugin/translation-selection/useTranslationTour.test.js
@@ -0,0 +1,95 @@
+import { mockUseKeyedState } from '@edx/react-unit-test-utils';
+import { useToggle } from '@openedx/paragon';
+
+import useTranslationTour, { stateKeys } from './useTranslationTour';
+
+jest.mock('react', () => ({
+  ...jest.requireActual('react'),
+  useCallback: jest.fn((cb, prereqs) => () => {
+    cb();
+    return { useCallback: { cb, prereqs } };
+  }),
+}));
+jest.mock('@openedx/paragon', () => ({
+  useToggle: jest.fn(),
+}));
+jest.mock('@edx/frontend-platform/i18n', () => {
+  const i18n = jest.requireActual('@edx/frontend-platform/i18n');
+  const { formatMessage } = jest.requireActual('@edx/react-unit-test-utils');
+  // this provide consistent for the test on different platform/timezone
+  const formatDate = jest.fn(date => new Date(date).toISOString()).mockName('useIntl.formatDate');
+  return {
+    ...i18n,
+    useIntl: jest.fn(() => ({
+      formatMessage,
+      formatDate,
+    })),
+    defineMessages: m => m,
+    FormattedMessage: () => 'FormattedMessage',
+  };
+});
+jest.mock('@src/data/localStorage', () => ({
+  getLocalStorage: jest.fn(),
+  setLocalStorage: jest.fn(),
+}));
+
+const state = mockUseKeyedState(stateKeys);
+
+describe('useTranslationSelection', () => {
+  const mockLocalStroage = {
+    getItem: jest.fn(),
+    setItem: jest.fn(),
+  };
+
+  const toggleOpen = jest.fn();
+  const toggleClose = jest.fn();
+
+  useToggle.mockReturnValue([false, toggleOpen, toggleClose]);
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+    state.mock();
+    window.localStorage = mockLocalStroage;
+  });
+  afterEach(() => {
+    state.resetVals();
+    delete window.localStorage;
+  });
+
+  it('do not have translation tour if user already seen it', () => {
+    mockLocalStroage.getItem.mockReturnValueOnce('not seen');
+    const { translationTour } = useTranslationTour();
+
+    expect(translationTour.enabled).toBe(true);
+  });
+
+  it('show translation tour if user has not seen it', () => {
+    mockLocalStroage.getItem.mockReturnValueOnce('true');
+    const { translationTour } = useTranslationTour();
+
+    expect(translationTour).toMatchObject({});
+  });
+  test('open and close as pass from useToggle', () => {
+    const { isOpen, open, close } = useTranslationTour();
+    expect(isOpen).toBe(false);
+    expect(toggleOpen).toBe(open);
+    expect(toggleClose).toBe(close);
+  });
+  test('end tour on dismiss button click', () => {
+    mockLocalStroage.getItem.mockReturnValueOnce('not seen');
+    const { translationTour } = useTranslationTour();
+    translationTour.onDismiss();
+    expect(mockLocalStroage.setItem).toHaveBeenCalledWith(
+      'hasSeenTranslationTour',
+      'true',
+    );
+    state.expectSetStateCalledWith(stateKeys.showTranslationTour, false);
+  });
+  test('end tour and open modal on try it button click', () => {
+    mockLocalStroage.getItem.mockReturnValueOnce('not seen');
+    const { translationTour } = useTranslationTour();
+    translationTour.onEnd();
+    state.expectSetStateCalledWith(stateKeys.showTranslationTour, false);
+    expect(toggleOpen).toHaveBeenCalled();
+  });
+});
--- a/src/constants.js
+++ b/src/constants.js
@@ -33,19 +33,3 @@ export const REDIRECT_MODES = {
  HOME_REDIRECT: 'home-redirect',
  SURVEY_REDIRECT: 'survey-redirect',
 };
-
-export const VERIFIED_MODES = [
-  'professional',
-  'verified',
-  'no-id-professional',
-  'credit',
-  'masters',
-  'executive-education',
-  'paid-executive-education',
-  'paid-bootcamp',
-];
-
-export const WIDGETS = {
-  DISCUSSIONS: 'DISCUSSIONS',
-  NOTIFICATIONS: 'NOTIFICATIONS',
-};
--- a/src/course-home/courseware-search/CoursewareSearchToggle.jsx
+++ b/src/course-home/courseware-search/CoursewareSearchToggle.jsx
@@ -1,7 +1,7 @@
 import React, { useEffect } from 'react';
 import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
-import { Button } from '@openedx/paragon';
-import { ManageSearch } from '@openedx/paragon/icons';
+import { Button, Icon } from '@openedx/paragon';
+import { Search } from '@openedx/paragon/icons';
 import { useDispatch } from 'react-redux';
 import messages from './messages';
 import { useCoursewareSearchFeatureFlag, useCoursewareSearchParams } from './hooks';
@@ -25,17 +25,16 @@ const CoursewareSearchToggle = ({
  if (!enabled) { return null; }

  return (
-    <div className="courseware-search-toggle">
+    <div className="courseware-searc-toggle">
      <Button
-        variant="outline-primary"
+        variant="tertiary"
        size="sm"
-        className="p-1 mt-2 mr-2"
+        className="p-1 mt-2 mr-2 rounded-lg"
        aria-label={intl.formatMessage(messages.searchOpenAction)}
        onClick={handleSearchOpenClick}
        data-testid="courseware-search-open-button"
-        iconAfter={ManageSearch}
      >
-        {intl.formatMessage(messages.contentSearchButton)}
+        <Icon src={Search} />
      </Button>
    </div>
  );
--- a/src/course-home/courseware-search/messages.js
+++ b/src/course-home/courseware-search/messages.js
@@ -2,84 +2,79 @@ import { defineMessages } from '@edx/frontend-platform/i18n';

 const messages = defineMessages({
  searchOpenAction: {
-    id: 'learn.coursewareSearch.openAction',
+    id: 'learn.coursewareSerch.openAction',
    defaultMessage: 'Search within this course',
    description: 'Aria-label for a button that will pop up Courseware Search.',
  },
-  contentSearchButton: {
-    id: 'learn.coursewareSearch.contentSearchButton',
-    defaultMessage: 'Content search',
-    description: 'Text for a button that will pop up Courseware Search.',
-  },
  searchSubmitLabel: {
-    id: 'learn.coursewareSearch.submitLabel',
+    id: 'learn.coursewareSerch.submitLabel',
    defaultMessage: 'Search',
    description: 'Button label that will submit Courseware Search.',
  },
  searchClearAction: {
-    id: 'learn.coursewareSearch.clearAction',
+    id: 'learn.coursewareSerch.clearAction',
    defaultMessage: 'Clear search',
    description: 'Button label that will the current Courseware Search input.',
  },
  searchCloseAction: {
-    id: 'learn.coursewareSearch.closeAction',
+    id: 'learn.coursewareSerch.closeAction',
    defaultMessage: 'Close the search form',
    description: 'Aria-label for a button that will close Courseware Search.',
  },
  searchModuleTitle: {
-    id: 'learn.coursewareSearch.searchModuleTitle',
+    id: 'learn.coursewareSerch.searchModuleTitle',
    defaultMessage: 'Search this course',
    description: 'Title for the Courseware Search module.',
  },
  searchBarPlaceholderText: {
-    id: 'learn.coursewareSearch.searchBarPlaceholderText',
+    id: 'learn.coursewareSerch.searchBarPlaceholderText',
    defaultMessage: 'Search',
    description: 'Placeholder text for the Courseware Search input control',
  },
  loading: {
-    id: 'learn.coursewareSearch.loading',
+    id: 'learn.coursewareSerch.loading',
    defaultMessage: 'Searching...',
    description: 'Screen reader text to use on the spinner while the search is performing.',
  },
  searchResultsNone: {
-    id: 'learn.coursewareSearch.searchResultsNone',
+    id: 'learn.coursewareSerch.searchResultsNone',
    defaultMessage: 'No results found.',
    description: 'Text to show when the Courseware Search found no results matching the criteria.',
  },
  searchResultsLabel: {
-    id: 'learn.coursewareSearch.searchResultsLabel',
+    id: 'learn.coursewareSerch.searchResultsLabel',
    defaultMessage: 'Results for "{keyword}":',
    description: 'Text to show above the search results response list.',
  },
  searchResultsError: {
-    id: 'learn.coursewareSearch.searchResultsError',
+    id: 'learn.coursewareSerch.searchResultsError',
    defaultMessage: 'There was an error on the search process. Please try again in a few minutes. If the problem persists, please contact the support team.',
    description: 'Error message to show to the users when there\'s an error with the endpoint or the returned payload format.',
  },

  // These are translations for labeling the filters
  'filter:all': {
-    id: 'learn.coursewareSearch.filter:all',
+    id: 'learn.coursewareSerch.filter:all',
    defaultMessage: 'All content',
    description: 'Label for the search results filter that shows all content (no filter).',
  },
  'filter:text': {
-    id: 'learn.coursewareSearch.filter:text',
+    id: 'learn.coursewareSerch.filter:text',
    defaultMessage: 'Text',
    description: 'Label for the search results filter that shows results with text content.',
  },
  'filter:video': {
-    id: 'learn.coursewareSearch.filter:video',
+    id: 'learn.coursewareSerch.filter:video',
    defaultMessage: 'Video',
    description: 'Label for the search results filter that shows results with video content.',
  },
  'filter:sequence': {
-    id: 'learn.coursewareSearch.filter:sequence',
+    id: 'learn.coursewareSerch.filter:sequence',
    defaultMessage: 'Section',
    description: 'Label for the search results filter that shows results with section content.',
  },
  'filter:other': {
-    id: 'learn.coursewareSearch.filter:other',
+    id: 'learn.coursewareSerch.filter:other',
    defaultMessage: 'Other',
    description: 'Label for the search results filter that shows results with other content.',
  },
--- a/src/course-home/data/factories/courseHomeMetadata.factory.js
+++ b/src/course-home/data/factories/courseHomeMetadata.factory.js
@@ -6,7 +6,6 @@ Factory.define('courseHomeMetadata')
  .option('host', 'http://localhost:18000')
  .attrs({
    title: 'Demonstration Course',
-    is_new_discussion_sidebar_view_enabled: false,
    is_self_paced: false,
    is_enrolled: false,
    is_staff: false,
--- a/src/course-home/data/snapshots/redux.test.js.snap
+++ b/src/course-home/data/snapshots/redux.test.js.snap
@@ -14,11 +14,7 @@ Object {
  },
  "courseware": Object {
    "courseId": null,
-    "courseOutline": Object {},
-    "courseOutlineShouldUpdate": false,
-    "courseOutlineStatus": "loading",
    "courseStatus": "loading",
-    "coursewareOutlineSidebarSettings": Object {},
    "sequenceId": null,
    "sequenceMightBeUnit": false,
    "sequenceStatus": "loading",
@@ -42,7 +38,6 @@ Object {
        "id": "course-v1:edX+DemoX+Demo_Course",
        "isEnrolled": false,
        "isMasquerading": false,
-        "isNewDiscussionSidebarViewEnabled": false,
        "isSelfPaced": false,
        "isStaff": false,
        "number": "DemoX",
@@ -406,11 +401,7 @@ Object {
  },
  "courseware": Object {
    "courseId": null,
-    "courseOutline": Object {},
-    "courseOutlineShouldUpdate": false,
-    "courseOutlineStatus": "loading",
    "courseStatus": "loading",
-    "coursewareOutlineSidebarSettings": Object {},
    "sequenceId": null,
    "sequenceMightBeUnit": false,
    "sequenceStatus": "loading",
@@ -434,7 +425,6 @@ Object {
        "id": "course-v1:edX+DemoX+Demo_Course",
        "isEnrolled": false,
        "isMasquerading": false,
-        "isNewDiscussionSidebarViewEnabled": false,
        "isSelfPaced": false,
        "isStaff": false,
        "number": "DemoX",
@@ -679,11 +669,7 @@ Object {
  },
  "courseware": Object {
    "courseId": null,
-    "courseOutline": Object {},
-    "courseOutlineShouldUpdate": false,
-    "courseOutlineStatus": "loading",
    "courseStatus": "loading",
-    "coursewareOutlineSidebarSettings": Object {},
    "sequenceId": null,
    "sequenceMightBeUnit": false,
    "sequenceStatus": "loading",
@@ -707,7 +693,6 @@ Object {
        "id": "course-v1:edX+DemoX+Demo_Course",
        "isEnrolled": false,
        "isMasquerading": false,
-        "isNewDiscussionSidebarViewEnabled": false,
        "isSelfPaced": false,
        "isStaff": false,
        "number": "DemoX",
--- a/src/course-home/outline-tab/OutlineTab.jsx
+++ b/src/course-home/outline-tab/OutlineTab.jsx
@@ -5,7 +5,6 @@ import { sendTrackEvent } from '@edx/frontend-platform/analytics';
 import { getAuthenticatedUser } from '@edx/frontend-platform/auth';
 import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
 import { Button } from '@openedx/paragon';
-import { PluginSlot } from '@openedx/frontend-plugin-framework';
 import { AlertList } from '../../generic/user-messages';

 import CourseDates from './widgets/CourseDates';
@@ -17,6 +16,7 @@ import { fetchOutlineTab } from '../data';
 import messages from './messages';
 import Section from './Section';
 import ShiftDatesAlert from '../suggested-schedule-messaging/ShiftDatesAlert';
+import UpgradeNotification from '../../generic/upgrade-notification/UpgradeNotification';
 import UpgradeToShiftDatesAlert from '../suggested-schedule-messaging/UpgradeToShiftDatesAlert';
 import useCertificateAvailableAlert from './alerts/certificate-status-alert';
 import useCourseEndAlert from './alerts/course-end-alert';
@@ -38,9 +38,11 @@ const OutlineTab = ({ intl }) => {
    isSelfPaced,
    org,
    title,
+    userTimezone,
  } = useModel('courseHomeMeta', courseId);

  const {
+    accessExpiration,
    courseBlocks: {
      courses,
      sections,
@@ -49,12 +51,20 @@ const OutlineTab = ({ intl }) => {
      selectedGoal,
      weeklyLearningGoalEnabled,
    } = {},
+    datesBannerInfo,
    datesWidget: {
      courseDateBlocks,
    },
    enableProctoredExams,
+    offer,
+    timeOffsetMillis,
+    verifiedMode,
  } = useModel('outline', courseId);

+  const {
+    marketingUrl,
+  } = useModel('coursewareMeta', courseId);
+
  const [expandAll, setExpandAll] = useState(false);
  const navigate = useNavigate();

@@ -184,9 +194,18 @@ const OutlineTab = ({ intl }) => {
              />
            )}
            <CourseTools />
-            <PluginSlot
-              id="outline_tab_notifications_slot"
-              pluginProps={{ courseId }}
+            <UpgradeNotification
+              offer={offer}
+              verifiedMode={verifiedMode}
+              accessExpiration={accessExpiration}
+              contentTypeGatingEnabled={datesBannerInfo.contentTypeGatingEnabled}
+              marketingUrl={marketingUrl}
+              upsellPageName="course_home"
+              userTimezone={userTimezone}
+              shouldDisplayBorder
+              timeOffsetMillis={timeOffsetMillis}
+              courseId={courseId}
+              org={org}
            />
            <CourseDates />
            <CourseHandouts />
--- a/src/course-home/outline-tab/OutlineTab.test.jsx
+++ b/src/course-home/outline-tab/OutlineTab.test.jsx
@@ -5,7 +5,7 @@ import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import { Factory } from 'rosie';
 import { getConfig } from '@edx/frontend-platform';
-import { sendTrackEvent } from '@edx/frontend-platform/analytics';
+import { sendTrackEvent, sendTrackingLogEvent } from '@edx/frontend-platform/analytics';
 import { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';
 import MockAdapter from 'axios-mock-adapter';
 import Cookies from 'js-cookie';
@@ -132,16 +132,6 @@ describe('Outline Tab', () => {
      expect(expandedSectionNode).toHaveAttribute('aria-expanded', 'true');
    });

-    it('includes outline_tab_notifications_slot', async () => {
-      const { courseBlocks } = await buildMinimalCourseBlocks(courseId, 'Title', { resumeBlock: true });
-      setTabData({
-        course_blocks: { blocks: courseBlocks.blocks },
-      });
-      await fetchAndRender();
-
-      expect(screen.getByTestId('outline_tab_notifications_slot')).toBeInTheDocument();
-    });
-
    it('handles expand/collapse all button click', async () => {
      await fetchAndRender();
      // Button renders as "Expand All"
@@ -1176,6 +1166,80 @@ describe('Outline Tab', () => {
    });
  });

+  describe('Upgrade Card', () => {
+    it('renders title when upgrade is available', async () => {
+      await fetchAndRender();
+      expect(screen.queryByRole('heading', { name: 'Pursue a verified certificate' })).toBeInTheDocument();
+    });
+
+    it('displays link to upgrade', async () => {
+      await fetchAndRender();
+      expect(screen.getByRole('link', { name: 'Upgrade for $149' })).toBeInTheDocument();
+    });
+
+    it('viewing upgrade card sends analytics', async () => {
+      sendTrackEvent.mockClear();
+      sendTrackingLogEvent.mockClear();
+      await fetchAndRender();
+
+      expect(sendTrackEvent).toHaveBeenCalledTimes(1);
+      expect(sendTrackEvent).toHaveBeenCalledWith('Promotion Viewed', {
+        org_key: 'edX',
+        courserun_key: courseId,
+        creative: 'sidebarupsell',
+        name: 'In-Course Verification Prompt',
+        position: 'sidebar-message',
+        promotion_id: 'courseware_verified_certificate_upsell',
+      });
+
+      expect(sendTrackingLogEvent).toHaveBeenCalledTimes(1);
+      expect(sendTrackingLogEvent).toHaveBeenCalledWith('edx.bi.course.upgrade.sidebarupsell.displayed', {
+        org_key: 'edX',
+        courserun_key: courseId,
+      });
+    });
+
+    it('clicking upgrade link sends analytics', async () => {
+      await fetchAndRender();
+
+      // Clearing after render to remove any events sent on view (ex. 'Promotion Viewed')
+      sendTrackEvent.mockClear();
+      sendTrackingLogEvent.mockClear();
+      const upgradeButton = screen.getByRole('link', { name: 'Upgrade for $149' });
+
+      fireEvent.click(upgradeButton);
+
+      expect(sendTrackEvent).toHaveBeenCalledTimes(2);
+      expect(sendTrackEvent).toHaveBeenNthCalledWith(1, 'Promotion Clicked', {
+        org_key: 'edX',
+        courserun_key: courseId,
+        creative: 'sidebarupsell',
+        name: 'In-Course Verification Prompt',
+        position: 'sidebar-message',
+        promotion_id: 'courseware_verified_certificate_upsell',
+      });
+      expect(sendTrackEvent).toHaveBeenNthCalledWith(2, 'edx.bi.ecommerce.upsell_links_clicked', {
+        org_key: 'edX',
+        courserun_key: courseId,
+        linkCategory: 'green_upgrade',
+        linkName: 'course_home_green',
+        linkType: 'button',
+        pageName: 'course_home',
+      });
+
+      expect(sendTrackingLogEvent).toHaveBeenCalledTimes(2);
+      expect(sendTrackingLogEvent).toHaveBeenNthCalledWith(1, 'edx.bi.course.upgrade.sidebarupsell.clicked', {
+        org_key: 'edX',
+        courserun_key: courseId,
+      });
+      expect(sendTrackingLogEvent).toHaveBeenNthCalledWith(2, 'edx.course.enrollment.upgrade.clicked', {
+        org_key: 'edX',
+        courserun_key: courseId,
+        location: 'sidebar-message',
+      });
+    });
+  });
+
  describe('Account Activation Alert', () => {
    beforeEach(() => {
      const intersectionObserverMock = () => ({
--- a/src/course-home/outline-tab/SequenceLink.jsx
+++ b/src/course-home/outline-tab/SequenceLink.jsx
@@ -1,3 +1,4 @@
+import React from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import { Link } from 'react-router-dom';
@@ -95,7 +96,7 @@ const SequenceLink = ({
                icon={fasCheckCircle}
                fixedWidth
                className="float-left text-success mt-1"
-                aria-hidden={complete}
+                aria-hidden="true"
                title={intl.formatMessage(messages.completedAssignment)}
              />
            ) : (
@@ -103,7 +104,7 @@ const SequenceLink = ({
                icon={farCheckCircle}
                fixedWidth
                className="float-left text-gray-400 mt-1"
-                aria-hidden={complete}
+                aria-hidden="true"
                title={intl.formatMessage(messages.incompleteAssignment)}
              />
            )}
@@ -117,14 +118,14 @@ const SequenceLink = ({
          </div>
        </div>
        {hideFromTOC && (
-          <div className="row w-100 my-2 mx-4 pl-3">
-            <span className="small d-flex">
-              <Icon className="mr-2" src={Block} data-testid="hide-from-toc-sequence-link-icon" />
-              <span data-testid="hide-from-toc-sequence-link-text">
-                {intl.formatMessage(messages.hiddenSequenceLink)}
-              </span>
+        <div className="row w-100 my-2 mx-4 pl-3">
+          <span className="small d-flex">
+            <Icon className="mr-2" src={Block} data-testid="hide-from-toc-sequence-link-icon" />
+            <span data-testid="hide-from-toc-sequence-link-text">
+              {intl.formatMessage(messages.hiddenSequenceLink)}
            </span>
-          </div>
+          </span>
+        </div>
        )}
        <div className="row w-100 m-0 ml-3 pl-3">
          <small className="text-body pl-2">
--- a/src/course-tabs/CourseTabsNavigation.jsx
+++ b/src/course-tabs/CourseTabsNavigation.jsx
@@ -16,27 +16,23 @@ const CourseTabsNavigation = ({
  return (
    <div id="courseTabsNavigation" className={classNames('course-tabs-navigation', className)}>
      <div className="container-xl">
-        <div className="nav-bar">
-          <div className="nav-menu">
-            <Tabs
-              className="nav-underline-tabs"
-              aria-label={intl.formatMessage(messages.courseMaterial)}
+        <Tabs
+          className="nav-underline-tabs"
+          aria-label={intl.formatMessage(messages.courseMaterial)}
+        >
+          {tabs.map(({ url, title, slug }) => (
+            <a
+              key={slug}
+              className={classNames('nav-item flex-shrink-0 nav-link', { active: slug === activeTabSlug })}
+              href={url}
            >
-              {tabs.map(({ url, title, slug }) => (
-                <a
-                  key={slug}
-                  className={classNames('nav-item flex-shrink-0 nav-link', { active: slug === activeTabSlug })}
-                  href={url}
-                >
-                  {title}
-                </a>
-              ))}
-            </Tabs>
-          </div>
-          <div className="search-toggle">
-            <CoursewareSearchToggle />
-          </div>
-        </div>
+              {title}
+            </a>
+          ))}
+        </Tabs>
+      </div>
+      <div className="course-tabs-navigation__search-toggle">
+        <CoursewareSearchToggle />
      </div>
      {show && <CoursewareSearch />}
    </div>
--- a/src/course-tabs/course-tabs-navigation.scss
+++ b/src/course-tabs/course-tabs-navigation.scss
@@ -16,23 +16,9 @@
    }
  }

-  .nav-bar {
-    display: flex;
-    justify-content: space-between;
-    flex-wrap: wrap;
-    gap: 10px;
+  &__search-toggle {
+    position: absolute;
+    top: .05rem;
+    right: 0;
  }
-
-  .nav-menu {
-    flex: 1;
-  }
-
-  .search-toggle {
-    flex-grow: 0;
-    text-align: right;
-    white-space: nowrap;
-    margin-bottom: 10px;
-  }
-
-
 }
--- a/src/courseware/course/Course.jsx
+++ b/src/courseware/course/Course.jsx
@@ -1,23 +1,24 @@
-import { useEffect, useState } from 'react';
+import React, { useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
 import { Helmet } from 'react-helmet';
-import { useDispatch, useSelector } from 'react-redux';
+import { useDispatch } from 'react-redux';
 import { getConfig } from '@edx/frontend-platform';
 import { breakpoints, useWindowSize } from '@openedx/paragon';

-import { AlertList } from '@src/generic/user-messages';
-import { useModel } from '@src/generic/model-store';
-import { getCoursewareOutlineSidebarSettings } from '../data/selectors';
-import { Trigger as CourseOutlineTrigger } from './sidebar/sidebars/course-outline';
+import { AlertList } from '../../generic/user-messages';
+
+import Sequence from './sequence';
+
+import { CelebrationModal, shouldCelebrateOnSectionLoad, WeeklyGoalCelebrationModal } from './celebration';
 import Chat from './chat/Chat';
+import ContentTools from './content-tools';
+import CourseBreadcrumbs from './CourseBreadcrumbs';
 import SidebarProvider from './sidebar/SidebarContextProvider';
 import SidebarTriggers from './sidebar/SidebarTriggers';
 import NewSidebarProvider from './new-sidebar/SidebarContextProvider';
 import NewSidebarTriggers from './new-sidebar/SidebarTriggers';
-import { CelebrationModal, shouldCelebrateOnSectionLoad, WeeklyGoalCelebrationModal } from './celebration';
-import CourseBreadcrumbs from './CourseBreadcrumbs';
-import ContentTools from './content-tools';
-import Sequence from './sequence';
+
+import { useModel } from '../../generic/model-store';

 const Course = ({
  courseId,
@@ -32,12 +33,11 @@ const Course = ({
  const {
    celebrations,
    isStaff,
-    isNewDiscussionSidebarViewEnabled,
  } = useModel('courseHomeMeta', courseId);
  const sequence = useModel('sequences', sequenceId);
  const section = useModel('sections', sequence ? sequence.sectionId : null);
-  const { enableNavigationSidebar } = useSelector(getCoursewareOutlineSidebarSettings);
-  const navigationDisabled = enableNavigationSidebar || (sequence?.navigationDisabled ?? false);
+  const enableNewSidebar = getConfig().ENABLE_NEW_SIDEBAR;
+  const navigationDisabled = sequence?.navigationDisabled ?? false;

  const pageTitleBreadCrumbs = [
    sequence,
@@ -54,6 +54,7 @@ const Course = ({
  const [weeklyGoalCelebrationOpen, setWeeklyGoalCelebrationOpen] = useState(
    celebrations && !celebrations.streakLengthToCelebrate && celebrations.weeklyGoal,
  );
+  const shouldDisplayTriggers = windowWidth >= breakpoints.small.minWidth;
  const shouldDisplayChat = windowWidth >= breakpoints.medium.minWidth;
  const daysPerWeek = course?.courseGoals?.selectedGoal?.daysPerWeek;

@@ -68,14 +69,14 @@ const Course = ({
    ));
  }, [sequenceId]);

-  const SidebarProviderComponent = isNewDiscussionSidebarViewEnabled ? NewSidebarProvider : SidebarProvider;
+  const SidebarProviderComponent = enableNewSidebar === 'true' ? NewSidebarProvider : SidebarProvider;

  return (
    <SidebarProviderComponent courseId={courseId} unitId={unitId}>
      <Helmet>
        <title>{`${pageTitleBreadCrumbs.join(' | ')} | ${getConfig().SITE_NAME}`}</title>
      </Helmet>
-      <div className="position-relative d-flex align-items-xl-center mb-4 mt-1 flex-column flex-xl-row">
+      <div className="position-relative d-flex align-items-center mb-4 mt-1">
        {navigationDisabled || (
        <>
          <CourseBreadcrumbs
@@ -99,10 +100,11 @@ const Course = ({
            />
          </>
        )}
-        <div className="w-100 d-flex align-items-center">
-          <CourseOutlineTrigger isMobileView />
-          {isNewDiscussionSidebarViewEnabled ? <NewSidebarTriggers /> : <SidebarTriggers /> }
-        </div>
+        {shouldDisplayTriggers && (
+          <>
+            {enableNewSidebar === 'true' ? <NewSidebarTriggers /> : <SidebarTriggers /> }
+          </>
+        )}
      </div>

      <AlertList topic="sequence" />
--- a/src/courseware/course/Course.test.jsx
+++ b/src/courseware/course/Course.test.jsx
@@ -5,7 +5,7 @@ import { Factory } from 'rosie';
 import { breakpoints } from '@openedx/paragon';

 import {
-  fireEvent, getByRole, initializeTestStore, loadUnit, render, screen, waitFor,
+  act, fireEvent, getByRole, initializeTestStore, loadUnit, render, screen, waitFor,
 } from '../../setupTest';
 import * as celebrationUtils from './celebration/utils';
 import { handleNextSectionCelebration } from './celebration';
@@ -59,7 +59,7 @@ describe('Course', () => {

  it('loads learning sequence', async () => {
    render(<Course {...mockData} />, { wrapWithRouter: true });
-    expect(screen.queryByRole('navigation', { name: 'breadcrumb' })).not.toBeInTheDocument();
+    expect(screen.getByRole('navigation', { name: 'breadcrumb' })).toBeInTheDocument();
    expect(await screen.findByText('Loading learning sequence...')).toBeInTheDocument();

    expect(screen.queryByRole('alert')).not.toBeInTheDocument();
@@ -142,32 +142,27 @@ describe('Course', () => {

    const notificationTrigger = screen.getByRole('button', { name: /Show notification tray/i });
    expect(notificationTrigger).toBeInTheDocument();
-    expect(notificationTrigger.parentNode).not.toHaveClass('sidebar-active', { exact: true });
+    expect(notificationTrigger.parentNode).not.toHaveClass('mt-3', { exact: true });
    fireEvent.click(notificationTrigger);
-    expect(notificationTrigger.parentNode).toHaveClass('sidebar-active');
+    expect(notificationTrigger.parentNode).toHaveClass('mt-3');
  });

  it('handles click to open/close discussions sidebar', async () => {
    await setupDiscussionSidebar();
-
-    await waitFor(() => {
-      expect(screen.getByTestId('sidebar-DISCUSSIONS')).toBeInTheDocument();
-      expect(screen.getByTestId('sidebar-DISCUSSIONS')).not.toHaveClass('d-none');
-    });
-
    const discussionsTrigger = await screen.getByRole('button', { name: /Show discussions tray/i });
-    expect(discussionsTrigger).toBeInTheDocument();
-    fireEvent.click(discussionsTrigger);
+    const discussionsSideBar = await waitFor(() => screen.findByTestId('sidebar-DISCUSSIONS'));

-    await waitFor(() => {
-      expect(screen.queryByTestId('sidebar-DISCUSSIONS')).not.toBeInTheDocument();
+    expect(discussionsSideBar).not.toHaveClass('d-none');
+
+    await act(async () => {
+      fireEvent.click(discussionsTrigger);
    });
+    await expect(discussionsSideBar).toHaveClass('d-none');

-    fireEvent.click(discussionsTrigger);
-
-    await waitFor(() => {
-      expect(screen.queryByTestId('sidebar-DISCUSSIONS')).toBeInTheDocument();
+    await act(async () => {
+      fireEvent.click(discussionsTrigger);
    });
+    await expect(discussionsSideBar).not.toHaveClass('d-none');
  });

  it('displays discussions sidebar when unit changes', async () => {
@@ -197,9 +192,8 @@ describe('Course', () => {
  it('handles click to open/close notification tray', async () => {
    await setupDiscussionSidebar();
    const notificationShowButton = await screen.findByRole('button', { name: /Show notification tray/i });
-    expect(screen.queryByRole('region', { name: /notification tray/i })).not.toBeInTheDocument();
+    expect(screen.queryByRole('region', { name: /notification tray/i })).toHaveClass('d-none');
    fireEvent.click(notificationShowButton);
-    expect(screen.queryByRole('region', { name: /notification tray/i })).toBeInTheDocument();
    expect(screen.queryByRole('region', { name: /notification tray/i })).not.toHaveClass('d-none');
  });

@@ -210,9 +204,7 @@ describe('Course', () => {
      { type: 'vertical' },
      { courseId: courseMetadata.id },
    ));
-    const testStore = await initializeTestStore({
-      courseMetadata, unitBlocks, enableNavigationSidebar: { enable_navigation_sidebar: false },
-    }, false);
+    const testStore = await initializeTestStore({ courseMetadata, unitBlocks }, false);
    const { courseware, models } = testStore.getState();
    const { courseId, sequenceId } = courseware;
    const testData = {
--- a/src/courseware/course/CourseBreadcrumbs.jsx
+++ b/src/courseware/course/CourseBreadcrumbs.jsx
@@ -154,7 +154,7 @@ const CourseBreadcrumbs = ({
  }, [courseStatus, sequenceStatus, allSequencesInSections]);

  return (
-    <nav aria-label="breadcrumb" className="d-inline-block col-sm-10 mb-3">
+    <nav aria-label="breadcrumb" className="d-inline-block col-sm-10">
      <ol className="list-unstyled d-flex flex-nowrap align-items-center m-0">
        <li className="list-unstyled col-auto m-0 p-0">
          <Link
--- a/src/courseware/course/chat/Chat.jsx
+++ b/src/courseware/course/chat/Chat.jsx
@@ -5,7 +5,6 @@ import PropTypes from 'prop-types';
 import { Xpert } from '@edx/frontend-lib-learning-assistant';
 import { injectIntl } from '@edx/frontend-platform/i18n';

-import { VERIFIED_MODES } from '@src/constants';
 import { useModel } from '../../../generic/model-store';

 const Chat = ({
@@ -21,10 +20,21 @@ const Chat = ({
  } = useSelector(state => state.specialExams);
  const course = useModel('coursewareMeta', courseId);

+  const VERIFIED_MODES = [
+    'professional',
+    'verified',
+    'no-id-professional',
+    'credit',
+    'masters',
+    'executive-education',
+    'paid-executive-education',
+    'paid-bootcamp',
+  ];
+
  const hasVerifiedEnrollment = (
    enrollmentMode !== null
    && enrollmentMode !== undefined
-    && VERIFIED_MODES.includes(enrollmentMode)
+    && [...VERIFIED_MODES].some(mode => mode === enrollmentMode)
  );

  const validDates = () => {
--- a/src/courseware/course/new-sidebar/SidebarContextProvider.jsx
+++ b/src/courseware/course/new-sidebar/SidebarContextProvider.jsx
@@ -9,7 +9,7 @@ import { breakpoints, useWindowSize } from '@openedx/paragon';

 import { getLocalStorage, setLocalStorage } from '../../../data/localStorage';
 import { useModel } from '../../../generic/model-store';
-import { WIDGETS } from '../../../constants';
+import WIDGETS from './constants';
 import SidebarContext from './SidebarContext';
 import { SIDEBARS } from './sidebars';

@@ -18,20 +18,11 @@ const SidebarProvider = ({
  unitId,
  children,
 }) => {
-  const { verifiedMode } = useModel('courseHomeMeta', courseId);
-  const topic = useModel('discussionTopics', unitId);
  const shouldDisplayFullScreen = useWindowSize().width < breakpoints.large.minWidth;
  const shouldDisplaySidebarOpen = useWindowSize().width > breakpoints.medium.minWidth;
  const query = new URLSearchParams(window.location.search);
-  const isInitiallySidebarOpen = shouldDisplaySidebarOpen || query.get('sidebar') === 'true';
-  const sidebarKey = `sidebar.${courseId}`;
-
-  let initialSidebar = shouldDisplayFullScreen && sidebarKey in localStorage ? getLocalStorage(sidebarKey)
-    : SIDEBARS.DISCUSSIONS_NOTIFICATIONS.ID;
-
-  if (!shouldDisplayFullScreen && isInitiallySidebarOpen) {
-    initialSidebar = SIDEBARS.DISCUSSIONS_NOTIFICATIONS.ID;
-  }
+  const initialSidebar = (shouldDisplaySidebarOpen || query.get('sidebar') === 'true')
+    ? SIDEBARS.DISCUSSIONS_NOTIFICATIONS.ID : null;
  const [currentSidebar, setCurrentSidebar] = useState(initialSidebar);
  const [notificationStatus, setNotificationStatus] = useState(getLocalStorage(`notificationStatus.${courseId}`));
  const [hideDiscussionbar, setHideDiscussionbar] = useState(false);
@@ -39,6 +30,8 @@ const SidebarProvider = ({
  const [upgradeNotificationCurrentState, setUpgradeNotificationCurrentState] = useState(
    getLocalStorage(`upgradeNotificationCurrentState.${courseId}`),
  );
+  const topic = useModel('discussionTopics', unitId);
+  const { verifiedMode } = useModel('courseHomeMeta', courseId);
  const isDiscussionbarAvailable = (topic?.id && topic?.enabledInContext) || false;
  const isNotificationbarAvailable = !isEmpty(verifiedMode);

@@ -50,9 +43,7 @@ const SidebarProvider = ({
  useEffect(() => {
    setHideDiscussionbar(!isDiscussionbarAvailable);
    setHideNotificationbar(!isNotificationbarAvailable);
-    if (initialSidebar && currentSidebar !== initialSidebar) {
-      setCurrentSidebar(SIDEBARS.DISCUSSIONS_NOTIFICATIONS.ID);
-    }
+    setCurrentSidebar(SIDEBARS.DISCUSSIONS_NOTIFICATIONS.ID);
  }, [unitId, topic]);

  useEffect(() => {
@@ -61,35 +52,16 @@ const SidebarProvider = ({
    }
  }, [hideDiscussionbar, hideNotificationbar]);

-  const handleWidgetToggle = useCallback((widgetId, sidebarId) => {
-    setHideDiscussionbar(prevWidgetId => (widgetId === WIDGETS.DISCUSSIONS ? true : prevWidgetId));
-    setHideNotificationbar(prevWidgetId => (widgetId === WIDGETS.NOTIFICATIONS ? true : prevWidgetId));
-    setLocalStorage(sidebarKey, sidebarId);
-  }, []);
-
-  const handleSidebarToggle = useCallback((sidebarId) => {
-    setCurrentSidebar(prevSidebar => (sidebarId === prevSidebar ? null : sidebarId));
-    setHideDiscussionbar(!isDiscussionbarAvailable);
-    setHideNotificationbar(!isNotificationbarAvailable);
-    setLocalStorage(sidebarKey, sidebarId === currentSidebar ? null : sidebarId);
-  }, [currentSidebar, isDiscussionbarAvailable, isNotificationbarAvailable]);
-
-  const clearSidebarKeyIfWidgetsUnavailable = useCallback((widgetId) => {
-    if ((!isNotificationbarAvailable && widgetId === WIDGETS.DISCUSSIONS)
-      || (!isDiscussionbarAvailable && widgetId === WIDGETS.NOTIFICATIONS)) {
-      setLocalStorage(sidebarKey, null);
-    }
-  }, [isDiscussionbarAvailable, isNotificationbarAvailable]);
-
  const toggleSidebar = useCallback((sidebarId = null, widgetId = null) => {
    if (widgetId) {
-      handleWidgetToggle(widgetId, sidebarId);
+      setHideDiscussionbar(prevWidgetId => (widgetId === WIDGETS.DISCUSSIONS ? true : prevWidgetId));
+      setHideNotificationbar(prevWidgetId => (widgetId === WIDGETS.NOTIFICATIONS ? true : prevWidgetId));
    } else {
-      handleSidebarToggle(sidebarId);
+      setCurrentSidebar(prevSidebar => (sidebarId === prevSidebar ? null : sidebarId));
+      setHideDiscussionbar(!isDiscussionbarAvailable);
+      setHideNotificationbar(!isNotificationbarAvailable);
    }
-
-    clearSidebarKeyIfWidgetsUnavailable(widgetId);
-  }, [handleWidgetToggle, handleSidebarToggle, clearSidebarKeyIfWidgetsUnavailable]);
+  }, [isDiscussionbarAvailable, isNotificationbarAvailable]);

  const contextValue = useMemo(() => ({
    toggleSidebar,
--- a/src/courseware/course/new-sidebar/common/SidebarBase.jsx
+++ b/src/courseware/course/new-sidebar/common/SidebarBase.jsx
@@ -8,7 +8,7 @@ import { Icon, IconButton } from '@openedx/paragon';
 import { ArrowBackIos, Close } from '@openedx/paragon/icons';

 import { useEventListener } from '../../../../generic/hooks';
-import { WIDGETS } from '../../../../constants';
+import WIDGETS from '../constants';
 import messages from '../messages';
 import SidebarContext from '../SidebarContext';

@@ -41,7 +41,7 @@ const SidebarBase = ({

  return (
    <section
-      className={classNames('ml-0 ml-lg-4 h-auto align-top zindex-0', {
+      className={classNames('ml-0 ml-lg-4 h-auto align-top', {
        'min-vh-100': !shouldDisplayFullScreen && allowFullHeight,
        'bg-white m-0 border-0 fixed-top vh-100 rounded-0': shouldDisplayFullScreen,
        'd-none': currentSidebar !== sidebarId,
@@ -104,7 +104,7 @@ SidebarBase.propTypes = {

 SidebarBase.defaultProps = {
  title: '',
-  width: '45rem',
+  width: '50rem',
  allowFullHeight: false,
  showTitleBar: true,
  className: '',
--- a/src/courseware/course/new-sidebar/constants.js
+++ b/src/courseware/course/new-sidebar/constants.js
@@ -0,0 +1,6 @@
+const WIDGETS = {
+  DISCUSSIONS: 'DISCUSSIONS',
+  NOTIFICATIONS: 'NOTIFICATIONS',
+};
+
+export default WIDGETS;
--- a/src/courseware/course/new-sidebar/sidebars/discussions-notifications/DiscussionsNotificationsSidebar.jsx
+++ b/src/courseware/course/new-sidebar/sidebars/discussions-notifications/DiscussionsNotificationsSidebar.jsx
@@ -14,17 +14,19 @@ const DiscussionsNotificationsSidebar = () => {
  const { hideNotificationbar } = useContext(SidebarContext);

  return (
-    <SidebarBase
-      ariaLabel={intl.formatMessage(messages.discussionNotificationTray)}
-      sidebarId={ID}
-      className="d-flex flex-column flex-fill"
-      showTitleBar={false}
-      showBorder={false}
-    >
-      <NotificationTray />
-      {!hideNotificationbar && <div className="my-1.5" />}
-      <DiscussionsSidebar />
-    </SidebarBase>
+    <div className="sticky-top vh-100">
+      <SidebarBase
+        ariaLabel={intl.formatMessage(messages.discussionNotificationTray)}
+        sidebarId={ID}
+        className="d-flex flex-column flex-fill"
+        showTitleBar={false}
+        showBorder={false}
+      >
+        <NotificationTray />
+        {!hideNotificationbar && <div className="my-1.5" />}
+        <DiscussionsSidebar />
+      </SidebarBase>
+    </div>
  );
 };

--- a/src/courseware/course/new-sidebar/sidebars/discussions-notifications/notifications/NotificationsWidget.jsx
+++ b/src/courseware/course/new-sidebar/sidebars/discussions-notifications/notifications/NotificationsWidget.jsx
@@ -1,9 +1,9 @@
 import React, { useContext, useEffect, useMemo } from 'react';

 import { sendTrackEvent } from '@edx/frontend-platform/analytics';
-import { PluginSlot } from '@openedx/frontend-plugin-framework';
 import { useModel } from '../../../../../../generic/model-store';
-import { WIDGETS } from '../../../../../../constants';
+import UpgradeNotification from '../../../../../../generic/upgrade-notification/UpgradeNotification';
+import WIDGETS from '../../../constants';
 import SidebarContext from '../../../SidebarContext';

 const NotificationsWidget = () => {
@@ -20,11 +20,17 @@ const NotificationsWidget = () => {
  const course = useModel('coursewareMeta', courseId);

  const {
+    accessExpiration,
+    contentTypeGatingEnabled,
    end,
    enrollmentEnd,
    enrollmentMode,
    enrollmentStart,
+    marketingUrl,
+    offer,
    start,
+    timeOffsetMillis,
+    userTimezone,
    verificationStatus,
  } = course;

@@ -52,10 +58,6 @@ const NotificationsWidget = () => {
    verification_status: verificationStatus,
  };

-  const onToggleSidebar = () => {
-    toggleSidebar(currentSidebar, WIDGETS.NOTIFICATIONS);
-  };
-
  // After three seconds, update notificationSeen (to hide red dot)
  useEffect(() => {
    setTimeout(onNotificationSeen, 3000);
@@ -66,14 +68,21 @@ const NotificationsWidget = () => {

  return (
    <div className="border border-light-400 rounded-sm" data-testid="notification-widget">
-      <PluginSlot
-        id="notification_widget_slot"
-        pluginProps={{
-          courseId,
-          notificationCurrentState: upgradeNotificationCurrentState,
-          setNotificationCurrentState: setUpgradeNotificationCurrentState,
-          toggleSidebar: onToggleSidebar,
-        }}
+      <UpgradeNotification
+        offer={offer}
+        verifiedMode={verifiedMode}
+        accessExpiration={accessExpiration}
+        contentTypeGatingEnabled={contentTypeGatingEnabled}
+        marketingUrl={marketingUrl}
+        upsellPageName="in_course"
+        userTimezone={userTimezone}
+        shouldDisplayBorder={false}
+        timeOffsetMillis={timeOffsetMillis}
+        courseId={courseId}
+        org={org}
+        upgradeNotificationCurrentState={upgradeNotificationCurrentState}
+        setupgradeNotificationCurrentState={setUpgradeNotificationCurrentState}
+        toggleSidebar={() => toggleSidebar(currentSidebar, WIDGETS.NOTIFICATIONS)}
      />
    </div>
  );
--- a/src/courseware/course/new-sidebar/sidebars/discussions-notifications/notifications/NotificationsWidget.test.jsx
+++ b/src/courseware/course/new-sidebar/sidebars/discussions-notifications/notifications/NotificationsWidget.test.jsx
@@ -4,7 +4,7 @@ import React from 'react';
 import MockAdapter from 'axios-mock-adapter';
 import { Factory } from 'rosie';

-import { getConfig } from '@edx/frontend-platform';
+import { mergeConfig, getConfig } from '@edx/frontend-platform';
 import { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';
 import { breakpoints } from '@openedx/paragon';

@@ -18,21 +18,8 @@ import SidebarContext from '../../../SidebarContext';
 import NotificationsWidget from './NotificationsWidget';
 import setupDiscussionSidebar from '../../../../test-utils';

-jest.mock('@edx/frontend-platform/analytics');
-
-/* eslint-disable react/prop-types */
-jest.mock('@openedx/frontend-plugin-framework', () => ({
-  ...jest.requireActual('@openedx/frontend-plugin-framework'),
-  Plugin: () => 'Plugin',
-  PluginSlot: ({ id, pluginProps }) => (
-    <div data-testid={id}>
-      <button type="button" onClick={pluginProps?.toggleSidebar}>Close</button>
-      PluginSlot_{id}
-    </div>
-  ),
-}));
-
 initializeMockApp();
+jest.mock('@edx/frontend-platform/analytics');

 describe('NotificationsWidget', () => {
  let axiosMock;
@@ -62,11 +49,13 @@ describe('NotificationsWidget', () => {
    axiosMock = new MockAdapter(getAuthenticatedHttpClient());
    axiosMock.onGet(courseMetadataUrl).reply(200, defaultMetadata);
    axiosMock.onGet(courseHomeMetadataUrl).reply(200, courseHomeMetadata);
+    mergeConfig({ ENABLE_NEW_SIDEBAR: 'true' }, 'Custom app config');
  });

-  it('successfully Open/Hide sidebar tray', async () => {
+  it('successfully Open/Hide sidebar tray.', async () => {
    const userVerifiedMode = Factory.build('verifiedMode');
-    await setupDiscussionSidebar({ verifiedMode: userVerifiedMode, isNewDiscussionSidebarViewEnabled: true });
+
+    await setupDiscussionSidebar(userVerifiedMode);

    const sidebarButton = await screen.getByRole('button', { name: /Show sidebar tray/i });

@@ -91,7 +80,7 @@ describe('NotificationsWidget', () => {
    });
  });

-  it('includes notification_widget_slot', async () => {
+  it('renders upgrade card', async () => {
    await fetchAndRender(
      <SidebarContext.Provider value={{
        currentSidebar: ID,
@@ -103,7 +92,11 @@ describe('NotificationsWidget', () => {
        <NotificationsWidget />
      </SidebarContext.Provider>,
    );
-    expect(screen.getByTestId('notification_widget_slot')).toBeInTheDocument();
+    const UpgradeNotification = document.querySelector('.upgrade-notification');
+
+    expect(UpgradeNotification).toBeInTheDocument();
+    expect(screen.getByRole('link', { name: 'Upgrade for $149' })).toBeInTheDocument();
+    expect(screen.queryByText('You have no new notifications at this time.')).not.toBeInTheDocument();
  });

  it('renders no notifications bar if no verified mode', async () => {
@@ -136,11 +129,7 @@ describe('NotificationsWidget', () => {
  ])('successfully %s', async ({ enabledInContext, testId }) => {
    const userVerifiedMode = Factory.build('verifiedMode');

-    await setupDiscussionSidebar({
-      verifiedMode: userVerifiedMode,
-      enabledInContext,
-      isNewDiscussionSidebarViewEnabled: true,
-    });
+    await setupDiscussionSidebar(userVerifiedMode, enabledInContext);

    const sidebarButton = screen.getByRole('button', { name: /Show sidebar tray/i });

--- a/src/courseware/course/sequence/Sequence.jsx
+++ b/src/courseware/course/sequence/Sequence.jsx
@@ -1,6 +1,10 @@
 /* eslint-disable no-use-before-define */
-import { useEffect, useState } from 'react';
+import React, {
+  useEffect, useState,
+} from 'react';
+import { getConfig } from '@edx/frontend-platform';
 import PropTypes from 'prop-types';
+import classNames from 'classnames';

 import {
  sendTrackEvent,
@@ -9,21 +13,17 @@ import {
 import { useIntl } from '@edx/frontend-platform/i18n';
 import { useSelector } from 'react-redux';
 import SequenceExamWrapper from '@edx/frontend-lib-special-exams';
-import { useToggle } from '@openedx/paragon';
+import { breakpoints, useWindowSize } from '@openedx/paragon';

-import PageLoading from '@src/generic/PageLoading';
-import { useModel } from '@src/generic/model-store';
-import { useSequenceBannerTextAlert, useSequenceEntranceExamAlert } from '@src/alerts/sequence-alerts/hooks';
-import SequenceContainerSlot from '../../../plugin-slots/SequenceContainerSlot';
+import PageLoading from '../../../generic/PageLoading';
+import { useModel } from '../../../generic/model-store';
+import { useSequenceBannerTextAlert, useSequenceEntranceExamAlert } from '../../../alerts/sequence-alerts/hooks';

-import { getCoursewareOutlineSidebarSettings } from '../../data/selectors';
 import CourseLicense from '../course-license';
 import Sidebar from '../sidebar/Sidebar';
 import NewSidebar from '../new-sidebar/Sidebar';
-import {
-  Trigger as CourseOutlineTrigger,
-  Sidebar as CourseOutlineTray,
-} from '../sidebar/sidebars/course-outline';
+import SidebarTriggers from '../sidebar/SidebarTriggers';
+import NewSidebarTriggers from '../new-sidebar/SidebarTriggers';
 import messages from './messages';
 import HiddenAfterDue from './hidden-after-due';
 import { SequenceNavigation, UnitNavigation } from './sequence-navigation';
@@ -38,7 +38,6 @@ const Sequence = ({
  previousSequenceHandler,
 }) => {
  const intl = useIntl();
-  const [isOpen, open, close] = useToggle();
  const {
    canAccessProctoredExams,
    license,
@@ -46,29 +45,30 @@ const Sequence = ({
  const {
    isStaff,
    originalUserIsStaff,
-    isNewDiscussionSidebarViewEnabled,
  } = useModel('courseHomeMeta', courseId);
  const sequence = useModel('sequences', sequenceId);
  const unit = useModel('units', unitId);
  const sequenceStatus = useSelector(state => state.courseware.sequenceStatus);
  const sequenceMightBeUnit = useSelector(state => state.courseware.sequenceMightBeUnit);
-  const { enableNavigationSidebar: isEnabledOutlineSidebar } = useSelector(getCoursewareOutlineSidebarSettings);
+  const shouldDisplayNotificationTriggerInSequence = useWindowSize().width < breakpoints.small.minWidth;
+  const enableNewSidebar = getConfig().ENABLE_NEW_SIDEBAR;
+
  const handleNext = () => {
    const nextIndex = sequence.unitIds.indexOf(unitId) + 1;
-    const newUnitId = sequence.unitIds[nextIndex];
-    handleNavigate(newUnitId);
-
-    if (nextIndex >= sequence.unitIds.length) {
+    if (nextIndex < sequence.unitIds.length) {
+      const newUnitId = sequence.unitIds[nextIndex];
+      handleNavigate(newUnitId);
+    } else {
      nextSequenceHandler();
    }
  };

  const handlePrevious = () => {
    const previousIndex = sequence.unitIds.indexOf(unitId) - 1;
-    const newUnitId = sequence.unitIds[previousIndex];
-    handleNavigate(newUnitId);
-
-    if (previousIndex < 0) {
+    if (previousIndex >= 0) {
+      const newUnitId = sequence.unitIds[previousIndex];
+      handleNavigate(newUnitId);
+    } else {
      previousSequenceHandler();
    }
  };
@@ -147,57 +147,34 @@ const Sequence = ({

  const gated = sequence && sequence.gatedContent !== undefined && sequence.gatedContent.gated;

-  const renderUnitNavigation = (isAtTop) => (
-    <UnitNavigation
-      sequenceId={sequenceId}
-      unitId={unitId}
-      isAtTop={isAtTop}
-      onClickPrevious={() => {
-        logEvent('edx.ui.lms.sequence.previous_selected', 'bottom');
-        handlePrevious();
-      }}
-      onClickNext={() => {
-        logEvent('edx.ui.lms.sequence.next_selected', 'bottom');
-        handleNext();
-      }}
-    />
-  );
-
  const defaultContent = (
    <>
      <div className="sequence-container d-inline-flex flex-row w-100">
-        <CourseOutlineTrigger />
-        <CourseOutlineTray />
-        <div className="sequence w-100">
-          {!isEnabledOutlineSidebar && (
-            <div className="sequence-navigation-container">
-              <SequenceNavigation
-                sequenceId={sequenceId}
-                unitId={unitId}
-                nextHandler={() => {
-                  logEvent('edx.ui.lms.sequence.next_selected', 'top');
-                  handleNext();
-                }}
-                onNavigate={(destinationUnitId) => {
-                  logEvent('edx.ui.lms.sequence.tab_selected', 'top', destinationUnitId);
-                  handleNavigate(destinationUnitId);
-                }}
-                previousHandler={() => {
-                  logEvent('edx.ui.lms.sequence.previous_selected', 'top');
-                  handlePrevious();
-                }}
-                {...{
-                  nextSequenceHandler,
-                  handleNavigate,
-                  isOpen,
-                  open,
-                  close,
-                }}
-              />
-            </div>
-          )}
+        <div className={classNames('sequence w-100', { 'position-relative': shouldDisplayNotificationTriggerInSequence })}>
+          <div className="sequence-navigation-container">
+            <SequenceNavigation
+              sequenceId={sequenceId}
+              unitId={unitId}
+              className="mb-4"
+              nextHandler={() => {
+                logEvent('edx.ui.lms.sequence.next_selected', 'top');
+                handleNext();
+              }}
+              onNavigate={(destinationUnitId) => {
+                logEvent('edx.ui.lms.sequence.tab_selected', 'top', destinationUnitId);
+                handleNavigate(destinationUnitId);
+              }}
+              previousHandler={() => {
+                logEvent('edx.ui.lms.sequence.previous_selected', 'top');
+                handlePrevious();
+              }}
+            />
+            {shouldDisplayNotificationTriggerInSequence && (
+              enableNewSidebar === 'true' ? <NewSidebarTriggers /> : <SidebarTriggers />
+            )}
+          </div>

-          <div className="unit-container flex-grow-1 pt-4">
+          <div className="unit-container flex-grow-1">
            <SequenceContent
              courseId={courseId}
              gated={gated}
@@ -205,12 +182,25 @@ const Sequence = ({
              unitId={unitId}
              unitLoadedHandler={handleUnitLoaded}
            />
-            {unitHasLoaded && renderUnitNavigation(false)}
+            {unitHasLoaded && (
+            <UnitNavigation
+              sequenceId={sequenceId}
+              unitId={unitId}
+              onClickPrevious={() => {
+                logEvent('edx.ui.lms.sequence.previous_selected', 'bottom');
+                handlePrevious();
+              }}
+              onClickNext={() => {
+                logEvent('edx.ui.lms.sequence.next_selected', 'bottom');
+                handleNext();
+              }}
+            />
+            )}
          </div>
        </div>
-        {isNewDiscussionSidebarViewEnabled ? <NewSidebar /> : <Sidebar />}
+        {enableNewSidebar === 'true' ? <NewSidebar /> : <Sidebar />}
      </div>
-      <SequenceContainerSlot courseId={courseId} unitId={unitId} />
+      <div id="whole-course-translation-feedback-widget" />
    </>
  );

@@ -224,7 +214,6 @@ const Sequence = ({
          originalUserIsStaff={originalUserIsStaff}
          canAccessProctoredExams={canAccessProctoredExams}
        >
-          {isEnabledOutlineSidebar && renderUnitNavigation(true)}
          {defaultContent}
        </SequenceExamWrapper>
        <CourseLicense license={license || undefined} />
--- a/src/courseware/course/sequence/Sequence.test.jsx
+++ b/src/courseware/course/sequence/Sequence.test.jsx
@@ -1,3 +1,4 @@
+import React from 'react';
 import PropTypes from 'prop-types';
 import { Factory } from 'rosie';
 import { sendTrackEvent } from '@edx/frontend-platform/analytics';
@@ -17,14 +18,12 @@ jest.mock('@edx/frontend-lib-special-exams/dist/data/thunks.js', () => ({

 describe('Sequence', () => {
  let mockData;
-  let defaultContextValue;
  const courseMetadata = Factory.build('courseMetadata');
  const unitBlocks = Array.from({ length: 3 }).map(() => Factory.build(
    'block',
    { type: 'vertical' },
    { courseId: courseMetadata.id },
  ));
-  const enableNavigationSidebar = { enable_navigation_sidebar: false };

  beforeAll(async () => {
    const store = await initializeTestStore({ courseMetadata, unitBlocks });
@@ -39,29 +38,12 @@ describe('Sequence', () => {
      toggleNotificationTray: () => {},
      setNotificationStatus: () => {},
    };
-    defaultContextValue = { courseId: mockData.courseId, currentSidebar: null, toggleSidebar: jest.fn() };
  });

  beforeEach(() => {
    global.innerWidth = breakpoints.extraLarge.minWidth;
  });

-  const SidebarWrapper = ({ contextValue = defaultContextValue, overrideData = {} }) => (
-    <SidebarContext.Provider value={contextValue}>
-      <Sequence {...({ ...mockData, ...overrideData })} />
-    </SidebarContext.Provider>
-  );
-
-  SidebarWrapper.defaultProps = {
-    contextValue: defaultContextValue,
-    overrideData: {},
-  };
-
-  SidebarWrapper.propTypes = {
-    contextValue: PropTypes.shape({}),
-    overrideData: PropTypes.shape({}),
-  };
-
  it('renders correctly without data', async () => {
    const testStore = await initializeTestStore({ excludeFetchCourse: true, excludeFetchSequence: true }, false);
    render(
@@ -92,22 +74,18 @@ describe('Sequence', () => {
      { courseId: courseMetadata.id, unitBlocks, sequenceBlock: sequenceBlocks[0] },
    )];
    const testStore = await initializeTestStore({
-      courseMetadata,
-      unitBlocks,
-      sequenceBlocks,
-      sequenceMetadata,
-      enableNavigationSidebar: { enable_navigation_sidebar: true },
+      courseMetadata, unitBlocks, sequenceBlocks, sequenceMetadata,
    }, false);
    const { container } = render(
-      <SidebarWrapper overrideData={{ sequenceId: sequenceBlocks[0].id }} />,
+      <Sequence {...mockData} {...{ sequenceId: sequenceBlocks[0].id }} />,
      { store: testStore, wrapWithRouter: true },
    );

    await waitFor(() => expect(screen.queryByText('Loading locked content messaging...')).toBeInTheDocument());
    // `Previous`, `Prerequisite` and `Close Tray` buttons.
    expect(screen.getAllByRole('button').length).toEqual(3);
-    // `Next` button.
-    expect(screen.getAllByRole('link').length).toEqual(1);
+    // `Active` and `Next` buttons.
+    expect(screen.getAllByRole('link').length).toEqual(2);

    expect(screen.getByText('Content Locked')).toBeInTheDocument();
    const unitContainer = container.querySelector('.unit-container');
@@ -129,7 +107,7 @@ describe('Sequence', () => {
      { courseId: courseMetadata.id, unitBlocks, sequenceBlock: sequenceBlocks[0] },
    )];
    const testStore = await initializeTestStore({
-      courseMetadata, unitBlocks, sequenceBlocks, sequenceMetadata, enableNavigationSidebar,
+      courseMetadata, unitBlocks, sequenceBlocks, sequenceMetadata,
    }, false);
    render(
      <Sequence {...mockData} {...{ sequenceId: sequenceBlocks[0].id }} />,
@@ -156,20 +134,18 @@ describe('Sequence', () => {
  });

  it('handles loading unit', async () => {
-    render(<SidebarWrapper />, { wrapWithRouter: true });
+    render(<Sequence {...mockData} />, { wrapWithRouter: true });
    expect(await screen.findByText('Loading learning sequence...')).toBeInTheDocument();
-    // `Previous`, `Prerequisite` and `Close Tray` buttons.
+    // `Previous`, `Bookmark` and `Close Tray` buttons
    expect(screen.getAllByRole('button')).toHaveLength(3);
-    // Renders `Next` button.
-    expect(screen.getAllByRole('link')).toHaveLength(1);
+    // Renders `Next` button plus one button for each unit.
+    expect(screen.getAllByRole('link')).toHaveLength(1 + unitBlocks.length);

    loadUnit();
    await waitFor(() => expect(screen.queryByText('Loading learning sequence...')).not.toBeInTheDocument());
    // At this point there will be 2 `Previous` and 2 `Next` buttons.
    expect(screen.getAllByRole('button', { name: /previous/i }).length).toEqual(2);
    expect(screen.getAllByRole('link', { name: /next/i }).length).toEqual(2);
-    // Renders two `Next` buttons for top and bottom unit navigations.
-    expect(screen.getAllByRole('link')).toHaveLength(2);
  });

  describe('sequence and unit navigation buttons', () => {
@@ -185,9 +161,7 @@ describe('Sequence', () => {
    )];

    beforeAll(async () => {
-      testStore = await initializeTestStore({
-        courseMetadata, unitBlocks, sequenceBlocks, enableNavigationSidebar,
-      }, false);
+      testStore = await initializeTestStore({ courseMetadata, unitBlocks, sequenceBlocks }, false);
    });

    beforeEach(() => {
@@ -200,13 +174,13 @@ describe('Sequence', () => {
        sequenceId: sequenceBlocks[1].id,
        previousSequenceHandler: jest.fn(),
      };
-      render(<SidebarWrapper overrideData={testData} />, { store: testStore, wrapWithRouter: true });
+      render(<Sequence {...testData} />, { store: testStore, wrapWithRouter: true });
      expect(await screen.findByText('Loading learning sequence...')).toBeInTheDocument();

      const sequencePreviousButton = screen.getByRole('link', { name: /previous/i });
      fireEvent.click(sequencePreviousButton);
      expect(testData.previousSequenceHandler).toHaveBeenCalledTimes(1);
-      expect(sendTrackEvent).toHaveBeenCalledTimes(1);
+      expect(sendTrackEvent).toHaveBeenCalledTimes(2);
      expect(sendTrackEvent).toHaveBeenCalledWith('edx.ui.lms.sequence.previous_selected', {
        current_tab: 1,
        id: testData.unitId,
@@ -220,8 +194,8 @@ describe('Sequence', () => {
        .filter(button => button !== sequencePreviousButton)[0];
      fireEvent.click(unitPreviousButton);
      expect(testData.previousSequenceHandler).toHaveBeenCalledTimes(2);
-      expect(sendTrackEvent).toHaveBeenCalledTimes(2);
-      expect(sendTrackEvent).toHaveBeenNthCalledWith(2, 'edx.ui.lms.sequence.previous_selected', {
+      expect(sendTrackEvent).toHaveBeenCalledTimes(3);
+      expect(sendTrackEvent).toHaveBeenNthCalledWith(3, 'edx.ui.lms.sequence.previous_selected', {
        current_tab: 1,
        id: testData.unitId,
        tab_count: unitBlocks.length,
@@ -236,7 +210,7 @@ describe('Sequence', () => {
        sequenceId: sequenceBlocks[0].id,
        nextSequenceHandler: jest.fn(),
      };
-      render(<SidebarWrapper overrideData={testData} />, { store: testStore, wrapWithRouter: true });
+      render(<Sequence {...testData} />, { store: testStore, wrapWithRouter: true });
      expect(await screen.findByText('Loading learning sequence...')).toBeInTheDocument();

      const sequenceNextButton = screen.getByRole('link', { name: /next/i });
@@ -255,8 +229,8 @@ describe('Sequence', () => {
        .filter(button => button !== sequenceNextButton)[0];
      fireEvent.click(unitNextButton);
      expect(testData.nextSequenceHandler).toHaveBeenCalledTimes(2);
-      expect(sendTrackEvent).toHaveBeenCalledTimes(2);
-      expect(sendTrackEvent).toHaveBeenNthCalledWith(2, 'edx.ui.lms.sequence.next_selected', {
+      expect(sendTrackEvent).toHaveBeenCalledTimes(3);
+      expect(sendTrackEvent).toHaveBeenNthCalledWith(3, 'edx.ui.lms.sequence.next_selected', {
        current_tab: unitBlocks.length,
        id: testData.unitId,
        tab_count: unitBlocks.length,
@@ -274,7 +248,7 @@ describe('Sequence', () => {
        previousSequenceHandler: jest.fn(),
        nextSequenceHandler: jest.fn(),
      };
-      render(<SidebarWrapper overrideData={testData} />, { store: testStore, wrapWithRouter: true });
+      render(<Sequence {...testData} />, { store: testStore, wrapWithRouter: true });
      await waitFor(() => expect(screen.queryByText('Loading learning sequence...')).toBeInTheDocument());

      fireEvent.click(screen.getByRole('link', { name: /previous/i }));
@@ -287,7 +261,7 @@ describe('Sequence', () => {
      // Therefore the next unit will still be `the initial one + 1`.
      expect(testData.unitNavigationHandler).toHaveBeenNthCalledWith(2, unitBlocks[unitNumber + 1].id);

-      expect(sendTrackEvent).toHaveBeenCalledTimes(2);
+      expect(sendTrackEvent).toHaveBeenCalledTimes(3);
    });

    it('handles the `Previous` buttons for the first unit in the first sequence', async () => {
@@ -298,7 +272,7 @@ describe('Sequence', () => {
        unitNavigationHandler: jest.fn(),
        previousSequenceHandler: jest.fn(),
      };
-      render(<SidebarWrapper overrideData={testData} />, { store: testStore, wrapWithRouter: true });
+      render(<Sequence {...testData} />, { store: testStore, wrapWithRouter: true });
      loadUnit();
      await waitFor(() => expect(screen.queryByText('Loading learning sequence...')).not.toBeInTheDocument());

@@ -306,7 +280,7 @@ describe('Sequence', () => {

      expect(testData.previousSequenceHandler).not.toHaveBeenCalled();
      expect(testData.unitNavigationHandler).not.toHaveBeenCalled();
-      expect(sendTrackEvent).not.toHaveBeenCalled();
+      expect(sendTrackEvent).toHaveBeenCalled();
    });

    it('handles the `Next` buttons for the last unit in the last sequence', async () => {
@@ -317,7 +291,7 @@ describe('Sequence', () => {
        unitNavigationHandler: jest.fn(),
        nextSequenceHandler: jest.fn(),
      };
-      render(<SidebarWrapper overrideData={testData} />, { store: testStore, wrapWithRouter: true });
+      render(<Sequence {...testData} />, { store: testStore, wrapWithRouter: true });
      loadUnit();
      await waitFor(() => expect(screen.queryByText('Loading learning sequence...')).not.toBeInTheDocument());

@@ -325,7 +299,7 @@ describe('Sequence', () => {

      expect(testData.nextSequenceHandler).not.toHaveBeenCalled();
      expect(testData.unitNavigationHandler).not.toHaveBeenCalled();
-      expect(sendTrackEvent).not.toHaveBeenCalled();
+      expect(sendTrackEvent).toHaveBeenCalled();
    });

    it('handles the navigation buttons for empty sequence', async () => {
@@ -348,11 +322,7 @@ describe('Sequence', () => {
        { courseId: courseMetadata.id, unitBlocks: block.children.length ? unitBlocks : [], sequenceBlock: block },
      ));
      const innerTestStore = await initializeTestStore({
-        courseMetadata,
-        unitBlocks,
-        sequenceBlocks: testSequenceBlocks,
-        sequenceMetadata: testSequenceMetadata,
-        enableNavigationSidebar,
+        courseMetadata, unitBlocks, sequenceBlocks: testSequenceBlocks, sequenceMetadata: testSequenceMetadata,
      }, false);
      const testData = {
        ...mockData,
@@ -363,37 +333,51 @@ describe('Sequence', () => {
        nextSequenceHandler: jest.fn(),
      };

-      render(<SidebarWrapper overrideData={testData} />, { store: innerTestStore, wrapWithRouter: true });
+      render(<Sequence {...testData} />, { store: innerTestStore, wrapWithRouter: true });
      loadUnit();
      await waitFor(() => expect(screen.queryByText('Loading learning sequence...')).not.toBeInTheDocument());

      screen.getAllByRole('link', { name: /previous/i }).forEach(button => fireEvent.click(button));
      expect(testData.previousSequenceHandler).toHaveBeenCalledTimes(2);
-      expect(testData.unitNavigationHandler).toHaveBeenCalledTimes(2);
+      expect(testData.unitNavigationHandler).not.toHaveBeenCalled();

      screen.getAllByRole('link', { name: /next/i }).forEach(button => fireEvent.click(button));
      expect(testData.nextSequenceHandler).toHaveBeenCalledTimes(2);
-      expect(testData.unitNavigationHandler).toHaveBeenCalledTimes(4);
+      expect(testData.unitNavigationHandler).not.toHaveBeenCalled();

-      expect(sendTrackEvent).toHaveBeenNthCalledWith(1, 'edx.ui.lms.sequence.previous_selected', {
-        current_tab: 1,
-        id: testData.unitId,
-        tab_count: 0,
-        widget_placement: 'top',
+      expect(sendTrackEvent).toHaveBeenNthCalledWith(1, 'edx.ui.course.upgrade.old_sidebar.notifications', {
+        course_end: undefined,
+        course_modes: undefined,
+        course_start: undefined,
+        courserun_key: undefined,
+        enrollment_end: undefined,
+        enrollment_mode: undefined,
+        enrollment_start: undefined,
+        is_upgrade_notification_visible: false,
+        name: 'Old Sidebar Notification Tray',
+        org_key: undefined,
+        username: undefined,
+        verification_status: undefined,
      });
      expect(sendTrackEvent).toHaveBeenNthCalledWith(2, 'edx.ui.lms.sequence.previous_selected', {
+        current_tab: 1,
+        id: testData.unitId,
+        tab_count: 0,
+        widget_placement: 'top',
+      });
+      expect(sendTrackEvent).toHaveBeenNthCalledWith(3, 'edx.ui.lms.sequence.previous_selected', {
        current_tab: 1,
        id: testData.unitId,
        tab_count: 0,
        widget_placement: 'bottom',
      });
-      expect(sendTrackEvent).toHaveBeenNthCalledWith(3, 'edx.ui.lms.sequence.next_selected', {
+      expect(sendTrackEvent).toHaveBeenNthCalledWith(4, 'edx.ui.lms.sequence.next_selected', {
        current_tab: 1,
        id: testData.unitId,
        tab_count: 0,
        widget_placement: 'top',
      });
-      expect(sendTrackEvent).toHaveBeenNthCalledWith(4, 'edx.ui.lms.sequence.next_selected', {
+      expect(sendTrackEvent).toHaveBeenNthCalledWith(5, 'edx.ui.lms.sequence.next_selected', {
        current_tab: 1,
        id: testData.unitId,
        tab_count: 0,
@@ -411,7 +395,7 @@ describe('Sequence', () => {
        sequenceId: sequenceBlocks[0].id,
        unitNavigationHandler: jest.fn(),
      };
-      render(<SidebarWrapper overrideData={testData} />, { store: testStore, wrapWithRouter: true });
+      render(<Sequence {...testData} />, { store: testStore, wrapWithRouter: true });
      await waitFor(() => expect(screen.queryByText('Loading learning sequence...')).toBeInTheDocument());

      fireEvent.click(screen.getByRole('link', { name: targetUnit.display_name }));
@@ -426,6 +410,16 @@ describe('Sequence', () => {
    });
  });

+  const SidebarWrapper = ({ contextValue }) => (
+    <SidebarContext.Provider value={contextValue}>
+      <Sequence {...mockData} />
+    </SidebarContext.Provider>
+  );
+
+  SidebarWrapper.propTypes = {
+    contextValue: PropTypes.shape({}).isRequired,
+  };
+
  describe('notification feature', () => {
    it('renders notification tray in sequence', async () => {
      render(<SidebarWrapper contextValue={{ courseId: mockData.courseId, currentSidebar: 'NOTIFICATIONS', toggleSidebar: () => null }} />, { wrapWithRouter: true });
@@ -437,7 +431,7 @@ describe('Sequence', () => {
      render(<SidebarWrapper contextValue={{ courseId: mockData.courseId, currentSidebar: 'NOTIFICATIONS', toggleSidebar: toggleNotificationTray }} />, { wrapWithRouter: true });
      const notificationCloseIconButton = await screen.findByRole('button', { name: /Close notification tray/i });
      fireEvent.click(notificationCloseIconButton);
-      expect(toggleNotificationTray).toHaveBeenCalled();
+      expect(toggleNotificationTray).toHaveBeenCalledTimes(1);
    });

    it('does not render notification tray in sequence by default if in responsive view', async () => {
--- a/src/courseware/course/sequence/Unit/UnitSuspense.jsx
+++ b/src/courseware/course/sequence/Unit/UnitSuspense.jsx
@@ -2,7 +2,6 @@ import React, { Suspense } from 'react';
 import PropTypes from 'prop-types';

 import { useIntl } from '@edx/frontend-platform/i18n';
-import { PluginSlot } from '@openedx/frontend-plugin-framework';

 import { useModel } from '@src/generic/model-store';
 import PageLoading from '@src/generic/PageLoading';
@@ -25,24 +24,19 @@ const UnitSuspense = ({
    meta.contentTypeGatingEnabled && unit.containsContentTypeGatedContent
  );

+  const suspenseComponent = (message, Component) => (
+    <Suspense fallback={<PageLoading srMessage={formatMessage(message)} />}>
+      <Component courseId={courseId} />
+    </Suspense>
+  );
+
  return (
    <>
      {shouldDisplayContentGating && (
-        <Suspense fallback={<PageLoading srMessage={formatMessage(messages.loadingLockedContent)} />}>
-          <PluginSlot
-            id="gated_unit_content_message_slot"
-            pluginProps={{
-              courseId,
-            }}
-          >
-            <LockPaywall courseId={courseId} />
-          </PluginSlot>
-        </Suspense>
+        suspenseComponent(messages.loadingLockedContent, LockPaywall)
      )}
      {shouldDisplayHonorCode && (
-        <Suspense fallback={<PageLoading srMessage={formatMessage(messages.loadingHonorCode)} />}>
-          <HonorCode courseId={courseId} />
-        </Suspense>
+        suspenseComponent(messages.loadingHonorCode, HonorCode)
      )}
    </>
  );
--- a/src/courseware/course/sequence/Unit/UnitSuspense.test.jsx
+++ b/src/courseware/course/sequence/Unit/UnitSuspense.test.jsx
@@ -64,7 +64,7 @@ describe('UnitSuspense component', () => {
  describe('output', () => {
    describe('LockPaywall', () => {
      const testNoPaywall = () => {
-        it('does not display LockPaywall', () => {
+        it('does not display LockPaywal', () => {
          el = shallow(<UnitSuspense {...props} />);
          expect(el.instance.findByType(LockPaywall).length).toEqual(0);
        });
@@ -79,9 +79,8 @@ describe('UnitSuspense component', () => {
        it('displays LockPaywall in Suspense wrapper with PageLoading fallback', () => {
          el = shallow(<UnitSuspense {...props} />);
          const [component] = el.instance.findByType(LockPaywall);
-          expect(component.parent.type).toEqual('PluginSlot');
-          expect(component.parent.parent.type).toEqual('Suspense');
-          expect(component.parent.parent.props.fallback)
+          expect(component.parent.type).toEqual('Suspense');
+          expect(component.parent.props.fallback)
            .toEqual(<PageLoading srMessage={formatMessage(messages.loadingLockedContent)} />);
          expect(component.props.courseId).toEqual(props.courseId);
        });
--- a/src/courseware/course/sequence/Unit/snapshots/index.test.jsx.snap
+++ b/src/courseware/course/sequence/Unit/snapshots/index.test.jsx.snap
@@ -28,10 +28,14 @@ exports[`Unit component output snapshot: not bookmarked, do not show content 1`]
    >
      unit-title
    </h3>
-    <UnitTitleSlot
-      courseId="test-course-id"
-      unitId="test-props-id"
-      unitTitle="unit-title"
+    <PluginSlot
+      id="unit_title_plugin"
+      pluginProps={
+        Object {
+          "courseId": "test-course-id",
+          "unitId": "test-props-id",
+        }
+      }
    />
  </div>
  <h2
--- a/src/courseware/course/sequence/Unit/hooks/useIFrameBehavior.js
+++ b/src/courseware/course/sequence/Unit/hooks/useIFrameBehavior.js
@@ -1,5 +1,4 @@
 import { getConfig } from '@edx/frontend-platform';
-import { sendTrackEvent } from '@edx/frontend-platform/analytics';
 import React from 'react';
 import { useDispatch } from 'react-redux';

@@ -51,6 +50,12 @@ const useIFrameBehavior = ({
    if (type === messageTypes.resize) {
      setIframeHeight(payload.height);

+      // We observe exit from the video xblock fullscreen mode
+      // and scroll to the previously saved scroll position
+      if (windowTopOffset !== null) {
+        window.scrollTo(0, Number(windowTopOffset));
+      }
+
      if (!hasLoaded && iframeHeight === 0 && payload.height > 0) {
        setHasLoaded(true);
        if (onLoaded) {
@@ -58,12 +63,6 @@ const useIFrameBehavior = ({
        }
      }
    } else if (type === messageTypes.videoFullScreen) {
-      // We observe exit from the video xblock fullscreen mode
-      // and scroll to the previously saved scroll position
-      if (!payload.open && windowTopOffset !== null) {
-        window.scrollTo(0, Number(windowTopOffset));
-      }
-
      // We listen for this message from LMS to know when we need to
      // save or reset scroll position on toggle video xblock fullscreen mode
      setWindowTopOffset(payload.open ? window.scrollY : null);
@@ -95,10 +94,6 @@ const useIFrameBehavior = ({
  const handleIFrameLoad = () => {
    if (!hasLoaded) {
      setShowError(true);
-      sendTrackEvent('edx.bi.error.learning.iframe_load_failed', {
-        iframeUrl,
-        unitId: id,
-      });
      logError('Unit iframe failed to load. Server possibly returned 4xx or 5xx response.', {
        iframeUrl,
      });
@@ -110,11 +105,6 @@ const useIFrameBehavior = ({
    };
  };

-  React.useEffect(() => {
-    setIframeHeight(0);
-    setHasLoaded(false);
-  }, [iframeUrl]);
-
  return {
    iframeHeight,
    handleIFrameLoad,
--- a/src/courseware/course/sequence/Unit/hooks/useIFrameBehavior.test.js
+++ b/src/courseware/course/sequence/Unit/hooks/useIFrameBehavior.test.js
@@ -5,7 +5,6 @@ import { getEffects, mockUseKeyedState } from '@edx/react-unit-test-utils';
 import { logError } from '@edx/frontend-platform/logging';

 import { getConfig } from '@edx/frontend-platform';
-import { sendTrackEvent } from '@edx/frontend-platform/analytics';
 import { fetchCourse } from '@src/courseware/data';
 import { processEvent } from '@src/course-home/data/thunks';
 import { useEventListener } from '@src/generic/hooks';
@@ -18,8 +17,6 @@ jest.mock('@edx/frontend-platform', () => ({
  getConfig: jest.fn(),
 }));

-jest.mock('@edx/frontend-platform/analytics');
-
 jest.mock('react', () => ({
  ...jest.requireActual('react'),
  useEffect: jest.fn(),
@@ -157,9 +154,6 @@ describe('useIFrameBehavior hook', () => {
        const resizeMessage = (height = 23) => ({
          data: { type: messageTypes.resize, payload: { height } },
        });
-        const videoFullScreenMessage = (open = false) => ({
-          data: { type: messageTypes.videoFullScreen, payload: { open } },
-        });
        const testSetIFrameHeight = (height = 23) => {
          const { cb } = useEventListener.mock.calls[0][1];
          cb(resizeMessage(height));
@@ -215,7 +209,7 @@ describe('useIFrameBehavior hook', () => {
          state.mockVals({ ...defaultStateVals, windowTopOffset });
          hook = useIFrameBehavior(props);
          const { cb } = useEventListener.mock.calls[0][1];
-          cb(videoFullScreenMessage());
+          cb(resizeMessage());
          expect(window.scrollTo).toHaveBeenCalledWith(0, windowTopOffset);
        });
        it('does not scroll if towverticalp offset is not set', () => {
@@ -274,16 +268,6 @@ describe('useIFrameBehavior hook', () => {
        expect(state.setState.showError).toHaveBeenCalledWith(true);
        expect(logError).toHaveBeenCalled();
      });
-      it('sends track event if has not loaded', () => {
-        hook = useIFrameBehavior(props);
-        hook.handleIFrameLoad();
-        const eventName = 'edx.bi.error.learning.iframe_load_failed';
-        const eventProperties = {
-          unitId: props.id,
-          iframeUrl: props.iframeUrl,
-        };
-        expect(sendTrackEvent).toHaveBeenCalledWith(eventName, eventProperties);
-      });
      it('does not set/log errors if loaded', () => {
        state.mockVals({ ...defaultStateVals, hasLoaded: true });
        hook = useIFrameBehavior(props);
@@ -291,12 +275,6 @@ describe('useIFrameBehavior hook', () => {
        expect(state.setState.showError).not.toHaveBeenCalled();
        expect(logError).not.toHaveBeenCalled();
      });
-      it('does not send track event if loaded', () => {
-        state.mockVals({ ...defaultStateVals, hasLoaded: true });
-        hook = useIFrameBehavior(props);
-        hook.handleIFrameLoad();
-        expect(sendTrackEvent).not.toHaveBeenCalled();
-      });
      it('registers an event handler to process fetchCourse events.', () => {
        hook = useIFrameBehavior(props);
        hook.handleIFrameLoad();
--- a/src/courseware/course/sequence/Unit/index.jsx
+++ b/src/courseware/course/sequence/Unit/index.jsx
@@ -7,6 +7,7 @@ import { useIntl } from '@edx/frontend-platform/i18n';
 import { useModel } from '@src/generic/model-store';
 import { usePluginsCallback } from '@src/generic/plugin-store';

+import { PluginSlot } from '@openedx/frontend-plugin-framework';
 import BookmarkButton from '../../bookmark/BookmarkButton';
 import messages from '../messages';
 import ContentIFrame from './ContentIFrame';
@@ -14,7 +15,6 @@ import UnitSuspense from './UnitSuspense';
 import { modelKeys, views } from './constants';
 import { useExamAccess, useShouldDisplayHonorCode } from './hooks';
 import { getIFrameUrl } from './urls';
-import UnitTitleSlot from '../../../../plugin-slots/UnitTitleSlot';

 const Unit = ({
  courseId,
@@ -43,7 +43,13 @@ const Unit = ({
    <div className="unit">
      <div className="mb-0">
        <h3 className="h3">{unit.title}</h3>
-        <UnitTitleSlot courseId={courseId} unitId={id} unitTitle={unit.title} />
+        <PluginSlot
+          id="unit_title_plugin"
+          pluginProps={{
+            courseId,
+            unitId: id,
+          }}
+        />
      </div>
      <h2 className="sr-only">{formatMessage(messages.headerPlaceholder)}</h2>
      <BookmarkButton
--- a/src/courseware/course/sequence/sequence-navigation/SequenceNavigation.jsx
+++ b/src/courseware/course/sequence/sequence-navigation/SequenceNavigation.jsx
@@ -10,9 +10,8 @@ import {
  isRtl,
  getLocale,
 } from '@edx/frontend-platform/i18n';
-import { PluginSlot } from '@openedx/frontend-plugin-framework';
-import { useSelector } from 'react-redux';

+import { useSelector } from 'react-redux';
 import { GetCourseExitNavigation } from '../../course-exit';
 import UnitButton from './UnitButton';
 import SequenceNavigationTabs from './SequenceNavigationTabs';
@@ -30,11 +29,6 @@ const SequenceNavigation = ({
  onNavigate,
  nextHandler,
  previousHandler,
-  nextSequenceHandler,
-  handleNavigate,
-  isOpen,
-  open,
-  close,
 }) => {
  const sequence = useModel('sequences', sequenceId);
  const {
@@ -101,37 +95,17 @@ const SequenceNavigation = ({
    const nextArrow = isRtl(getLocale()) ? ChevronLeft : ChevronRight;

    return navigationDisabledNextSequence || (
-      <PluginSlot
-        id="next_button_slot"
-        pluginProps={{
-          courseId,
-          disabled,
-          buttonText,
-          nextArrow,
-          nextLink,
-          shouldDisplayNotificationTriggerInSequence,
-          sequenceId,
-          unitId,
-          nextSequenceHandler,
-          handleNavigate,
-          isOpen,
-          open,
-          close,
-          linkComponent: Link,
-        }}
+      <Button
+        variant="link"
+        className="next-btn"
+        onClick={nextHandler}
+        disabled={disabled}
+        iconAfter={nextArrow}
+        as={disabled ? undefined : Link}
+        to={disabled ? undefined : nextLink}
      >
-        <Button
-          variant="link"
-          className="next-btn"
-          onClick={nextHandler}
-          disabled={disabled}
-          iconAfter={nextArrow}
-          as={disabled ? undefined : Link}
-          to={disabled ? undefined : nextLink}
-        >
-          {shouldDisplayNotificationTriggerInSequence ? null : buttonText}
-        </Button>
-      </PluginSlot>
+        {shouldDisplayNotificationTriggerInSequence ? null : buttonText}
+      </Button>
    );
  };

@@ -152,21 +126,11 @@ SequenceNavigation.propTypes = {
  onNavigate: PropTypes.func.isRequired,
  nextHandler: PropTypes.func.isRequired,
  previousHandler: PropTypes.func.isRequired,
-  close: PropTypes.func,
-  open: PropTypes.func,
-  isOpen: PropTypes.bool,
-  handleNavigate: PropTypes.func,
-  nextSequenceHandler: PropTypes.func,
 };

 SequenceNavigation.defaultProps = {
  className: null,
  unitId: null,
-  close: null,
-  open: null,
-  isOpen: false,
-  handleNavigate: null,
-  nextSequenceHandler: null,
 };

 export default injectIntl(SequenceNavigation);
--- a/src/courseware/course/sequence/sequence-navigation/SequenceNavigationTabs.jsx
+++ b/src/courseware/course/sequence/sequence-navigation/SequenceNavigationTabs.jsx
@@ -1,44 +1,26 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import classNames from 'classnames';

 import UnitButton from './UnitButton';
 import SequenceNavigationDropdown from './SequenceNavigationDropdown';
 import useIndexOfLastVisibleChild from '../../../../generic/tabs/useIndexOfLastVisibleChild';
-import {
-  useIsOnXLDesktop, useIsOnMediumDesktop, useIsOnLargeDesktop, useIsSidebarOpen,
-} from './hooks';

 const SequenceNavigationTabs = ({
  unitIds, unitId, showCompletion, onNavigate,
 }) => {
-  const isSidebarOpen = useIsSidebarOpen(unitId);
  const [
    indexOfLastVisibleChild,
    containerRef,
    invisibleStyle,
-  ] = useIndexOfLastVisibleChild(isSidebarOpen);
-  const isOnXLDesktop = useIsOnXLDesktop();
-  const isOnLargeDesktop = useIsOnLargeDesktop();
-  const isOnMediumDesktop = useIsOnMediumDesktop();
-  const shouldDisplayDropdown = indexOfLastVisibleChild === -1 || indexOfLastVisibleChild < unitIds.length - 1;
+  ] = useIndexOfLastVisibleChild();
+  const shouldDisplayDropdown = indexOfLastVisibleChild === -1;

  return (
-    <div
-      style={{ flexBasis: '100%', minWidth: 0 }}
-      className={classNames({
-        'navigation-tab-width-xl': isOnXLDesktop && isSidebarOpen,
-        'navigation-tab-width-large': isOnLargeDesktop && isSidebarOpen,
-        'navigation-tab-width-medium': isOnMediumDesktop && isSidebarOpen,
-      })}
-    >
-      <div
-        className="sequence-navigation-tabs-container"
-      >
+    <div style={{ flexBasis: '100%', minWidth: 0 }}>
+      <div className="sequence-navigation-tabs-container" ref={containerRef}>
        <div
          className="sequence-navigation-tabs d-flex flex-grow-1"
          style={shouldDisplayDropdown ? invisibleStyle : null}
-          ref={containerRef}
        >
          {unitIds.map(buttonUnitId => (
            <UnitButton
--- a/src/courseware/course/sequence/sequence-navigation/UnitNavigation.jsx
+++ b/src/courseware/course/sequence/sequence-navigation/UnitNavigation.jsx
@@ -1,4 +1,4 @@
-import classNames from 'classnames';
+import React from 'react';
 import { Link } from 'react-router-dom';
 import PropTypes from 'prop-types';
 import { Button } from '@openedx/paragon';
@@ -21,7 +21,6 @@ const UnitNavigation = ({
  unitId,
  onClickPrevious,
  onClickNext,
-  isAtTop,
 }) => {
  const {
    isFirstUnit, isLastUnit, nextLink, previousLink,
@@ -34,7 +33,7 @@ const UnitNavigation = ({
    return (
      <Button
        variant="outline-secondary"
-        className="previous-button mr-sm-2 d-flex align-items-center justify-content-center"
+        className="previous-button mr-2 d-flex align-items-center justify-content-center"
        disabled={disabled}
        onClick={onClickPrevious}
        as={disabled ? undefined : Link}
@@ -69,7 +68,7 @@ const UnitNavigation = ({
  };

  return (
-    <div className={classNames('unit-navigation d-flex', { 'top-unit-navigation mb-3 w-100': isAtTop })}>
+    <div className="unit-navigation d-flex">
      {renderPreviousButton()}
      {renderNextButton()}
    </div>
@@ -82,12 +81,10 @@ UnitNavigation.propTypes = {
  unitId: PropTypes.string,
  onClickPrevious: PropTypes.func.isRequired,
  onClickNext: PropTypes.func.isRequired,
-  isAtTop: PropTypes.bool,
 };

 UnitNavigation.defaultProps = {
  unitId: null,
-  isAtTop: false,
 };

 export default injectIntl(UnitNavigation);
--- a/src/courseware/course/sequence/sequence-navigation/hooks.js
+++ b/src/courseware/course/sequence/sequence-navigation/hooks.js
@@ -1,12 +1,8 @@
-import { useContext } from 'react';
-import { useSelector } from 'react-redux';
-import { breakpoints, useWindowSize } from '@openedx/paragon';
+/* eslint-disable import/prefer-default-export */

+import { useSelector } from 'react-redux';
 import { useModel } from '../../../../generic/model-store';
 import { sequenceIdsSelector } from '../../../data';
-import SidebarContext from '../../sidebar/SidebarContext';
-import NewSidebarContext from '../../new-sidebar/SidebarContext';
-import { WIDGETS } from '../../../../constants';

 export function useSequenceNavigationMetadata(currentSequenceId, currentUnitId) {
  const sequenceIds = useSelector(sequenceIdsSelector);
@@ -72,28 +68,3 @@ export function useSequenceNavigationMetadata(currentSequenceId, currentUnitId)
    navigationDisabledPrevSequence,
  };
 }
-
-export function useIsOnMediumDesktop() {
-  const windowSize = useWindowSize();
-  return windowSize.width >= breakpoints.medium.minWidth && windowSize.width < breakpoints.extraLarge.minWidth;
-}
-
-export function useIsOnLargeDesktop() {
-  const windowSize = useWindowSize();
-  return windowSize.width >= breakpoints.extraLarge.minWidth && windowSize.width < breakpoints.extraLarge.maxWidth;
-}
-
-export function useIsOnXLDesktop() {
-  const windowSize = useWindowSize();
-  return windowSize.width >= breakpoints.extraLarge.maxWidth;
-}
-
-export function useIsSidebarOpen(unitId) {
-  const courseId = useSelector(state => state.courseware.courseId);
-  const { isNewDiscussionSidebarViewEnabled } = useModel('courseHomeMeta', courseId);
-  const { currentSidebar } = useContext(isNewDiscussionSidebarViewEnabled ? NewSidebarContext : SidebarContext);
-  const topic = useModel('discussionTopics', unitId);
-
-  return (currentSidebar === WIDGETS.NOTIFICATIONS) || (currentSidebar === 'DISCUSSIONS_NOTIFICATIONS') || (
-    currentSidebar === WIDGETS.DISCUSSIONS && !!(topic?.id || topic?.enabledInContext));
-}
--- a/src/courseware/course/sidebar/Sidebar.jsx
+++ b/src/courseware/course/sidebar/Sidebar.jsx
@@ -1,20 +1,15 @@
-import { useContext } from 'react';
+import React from 'react';
+import { SIDEBAR_ORDER, SIDEBARS } from './sidebars';

-import SidebarContext from './SidebarContext';
-import { SIDEBARS } from './sidebars';
-
-const Sidebar = () => {
-  const { currentSidebar } = useContext(SidebarContext);
-
-  if (!currentSidebar || !SIDEBARS[currentSidebar]) {
-    return null;
-  }
-
-  const SidebarToRender = SIDEBARS[currentSidebar].Sidebar;
-
-  return (
-    <SidebarToRender />
-  );
-};
+const Sidebar = () => (
+  <>
+    {
+      SIDEBAR_ORDER.map((sideBarId) => {
+        const SidebarToRender = SIDEBARS[sideBarId].Sidebar;
+        return <SidebarToRender key={sideBarId} />;
+      })
+    }
+  </>
+);

 export default Sidebar;
--- a/src/courseware/course/sidebar/SidebarContextProvider.jsx
+++ b/src/courseware/course/sidebar/SidebarContextProvider.jsx
@@ -1,16 +1,12 @@
 import { breakpoints, useWindowSize } from '@openedx/paragon';
 import PropTypes from 'prop-types';
-import { useSelector } from 'react-redux';
-import {
+import React, {
  useEffect, useState, useMemo, useCallback,
 } from 'react';

-import { useModel } from '@src/generic/model-store';
-import { getLocalStorage, setLocalStorage } from '@src/data/localStorage';
-import { getCoursewareOutlineSidebarSettings } from '../../data/selectors';
+import { useModel } from '../../../generic/model-store';
+import { getLocalStorage, setLocalStorage } from '../../../data/localStorage';

-import * as discussionsSidebar from './sidebars/discussions';
-import * as notificationsSidebar from './sidebars/notifications';
 import SidebarContext from './SidebarContext';
 import { SIDEBARS } from './sidebars';

@@ -20,35 +16,18 @@ const SidebarProvider = ({
  children,
 }) => {
  const { verifiedMode } = useModel('courseHomeMeta', courseId);
-  const topic = useModel('discussionTopics', unitId);
-  const isUnitHasDiscussionTopics = topic?.id && topic?.enabledInContext;
-  const shouldDisplayFullScreen = useWindowSize().width < breakpoints.extraLarge.minWidth;
-  const shouldDisplaySidebarOpen = useWindowSize().width > breakpoints.extraLarge.minWidth;
+  const shouldDisplayFullScreen = useWindowSize().width < breakpoints.large.minWidth;
+  const shouldDisplaySidebarOpen = useWindowSize().width > breakpoints.medium.minWidth;
  const query = new URLSearchParams(window.location.search);
-  const { alwaysOpenAuxiliarySidebar } = useSelector(getCoursewareOutlineSidebarSettings);
-  const isInitiallySidebarOpen = shouldDisplaySidebarOpen || query.get('sidebar') === 'true';
-
-  let initialSidebar = shouldDisplayFullScreen ? getLocalStorage(`sidebar.${courseId}`) : null;
-  if (!shouldDisplayFullScreen && isInitiallySidebarOpen && alwaysOpenAuxiliarySidebar) {
-    initialSidebar = isUnitHasDiscussionTopics
-      ? SIDEBARS[discussionsSidebar.ID].ID
-      : verifiedMode && SIDEBARS[notificationsSidebar.ID].ID;
-  }
+  const initialSidebar = (shouldDisplaySidebarOpen || query.get('sidebar') === 'true') ? SIDEBARS.DISCUSSIONS.ID : null;
  const [currentSidebar, setCurrentSidebar] = useState(initialSidebar);
  const [notificationStatus, setNotificationStatus] = useState(getLocalStorage(`notificationStatus.${courseId}`));
  const [upgradeNotificationCurrentState, setUpgradeNotificationCurrentState] = useState(getLocalStorage(`upgradeNotificationCurrentState.${courseId}`));

  useEffect(() => {
-    if (initialSidebar && currentSidebar !== initialSidebar) {
-      setCurrentSidebar(initialSidebar);
-    }
-  }, [unitId, topic]);
-
-  useEffect(() => {
-    if (initialSidebar) {
-      setCurrentSidebar(initialSidebar);
-    }
-  }, [shouldDisplaySidebarOpen]);
+    // if the user hasn't purchased the course, show the notifications sidebar
+    setCurrentSidebar(verifiedMode ? SIDEBARS.NOTIFICATIONS.ID : SIDEBARS.DISCUSSIONS.ID);
+  }, [unitId]);

  const onNotificationSeen = useCallback(() => {
    setNotificationStatus('inactive');
@@ -57,13 +36,10 @@ const SidebarProvider = ({

  const toggleSidebar = useCallback((sidebarId) => {
    // Switch to new sidebar or hide the current sidebar
-    const newSidebar = sidebarId === currentSidebar ? null : sidebarId;
-    setCurrentSidebar(newSidebar);
-    setLocalStorage(`sidebar.${courseId}`, newSidebar);
+    setCurrentSidebar(sidebarId === currentSidebar ? null : sidebarId);
  }, [currentSidebar]);

  const contextValue = useMemo(() => ({
-    initialSidebar,
    toggleSidebar,
    onNotificationSeen,
    setNotificationStatus,
--- a/src/courseware/course/sidebar/SidebarTriggers.jsx
+++ b/src/courseware/course/sidebar/SidebarTriggers.jsx
@@ -1,5 +1,5 @@
-import { useContext } from 'react';
 import classNames from 'classnames';
+import React, { useContext } from 'react';
 import { breakpoints, useWindowSize } from '@openedx/paragon';
 import SidebarContext from './SidebarContext';
 import { SIDEBAR_ORDER, SIDEBARS } from './sidebars';
@@ -19,8 +19,8 @@ const SidebarTriggers = () => {
        const isActive = sidebarId === currentSidebar;
        return (
          <div
-            className={classNames({ 'ml-1': !isMobileView, 'border-primary-700 sidebar-active': isActive })}
-            style={{ borderBottom: '2px solid', borderColor: isActive ? 'inherit' : 'transparent' }}
+            className={classNames({ 'mt-3': !isMobileView, 'border-primary-700': isActive })}
+            style={{ borderBottom: isActive ? '2px solid' : null }}
            key={sidebarId}
          >
            <Trigger onClick={() => toggleSidebar(sidebarId)} key={sidebarId} />
--- a/src/courseware/course/sidebar/common/SidebarBase.jsx
+++ b/src/courseware/course/sidebar/common/SidebarBase.jsx
@@ -3,8 +3,8 @@ import { Icon, IconButton } from '@openedx/paragon';
 import { ArrowBackIos, Close } from '@openedx/paragon/icons';
 import classNames from 'classnames';
 import PropTypes from 'prop-types';
-import { useCallback, useContext } from 'react';
-import { useEventListener } from '@src/generic/hooks';
+import React, { useCallback, useContext } from 'react';
+import { useEventListener } from '../../../../generic/hooks';
 import messages from '../../messages';
 import SidebarContext from '../SidebarContext';

@@ -36,15 +36,14 @@ const SidebarBase = ({

  return (
    <section
-      className={classNames('ml-0 border border-light-400 rounded-sm h-auto align-top zindex-0', {
+      className={classNames('ml-0 ml-lg-4 border border-light-400 rounded-sm h-auto align-top', {
        'bg-white m-0 border-0 fixed-top vh-100 rounded-0': shouldDisplayFullScreen,
-        'align-self-start': !shouldDisplayFullScreen,
+        'min-vh-100': !shouldDisplayFullScreen,
        'd-none': currentSidebar !== sidebarId,
      }, className)}
      data-testid={`sidebar-${sidebarId}`}
      style={{ width: shouldDisplayFullScreen ? '100%' : width }}
      aria-label={ariaLabel}
-      id="course-sidebar"
    >
      {shouldDisplayFullScreen ? (
        <div
@@ -53,6 +52,7 @@ const SidebarBase = ({
          onKeyDown={() => toggleSidebar(null)}
          role="button"
          tabIndex="0"
+          alt={intl.formatMessage(messages.responsiveCloseNotificationTray)}
        >
          <Icon src={ArrowBackIos} />
          <span className="font-weight-bold m-2 d-inline-block">
@@ -62,12 +62,12 @@ const SidebarBase = ({
      ) : null}
      {showTitleBar && (
        <>
-          <div className="d-flex align-items-center mb-2">
-            <strong className="p-2.5 d-inline-block course-sidebar-title">{title}</strong>
+          <div className="d-flex align-items-center">
+            <span className="p-2.5 d-inline-block">{title}</span>
            {shouldDisplayFullScreen
              ? null
              : (
-                <div className="d-inline-flex mr-2 ml-auto">
+                <div className="d-inline-flex mr-2 mt-1.5 ml-auto">
                  <IconButton
                    src={Close}
                    size="sm"
@@ -79,6 +79,7 @@ const SidebarBase = ({
                </div>
              )}
          </div>
+          <div className="py-1 bg-gray-100 border-top border-bottom border-light-400" />
        </>
      )}
      {children}
@@ -91,7 +92,7 @@ SidebarBase.propTypes = {
  title: PropTypes.string.isRequired,
  ariaLabel: PropTypes.string.isRequired,
  sidebarId: PropTypes.string.isRequired,
-  className: PropTypes.string.isRequired,
+  className: PropTypes.string,
  children: PropTypes.element.isRequired,
  showTitleBar: PropTypes.bool,
  width: PropTypes.string,
@@ -100,6 +101,7 @@ SidebarBase.propTypes = {
 SidebarBase.defaultProps = {
  width: '31rem',
  showTitleBar: true,
+  className: '',
 };

 export default injectIntl(SidebarBase);
--- a/src/courseware/course/sidebar/common/SidebarBase.scss
+++ b/src/courseware/course/sidebar/common/SidebarBase.scss
@@ -1,6 +0,0 @@
-#course-sidebar {
-    @media (max-width: -1 + map-get($grid-breakpoints, "lg")) {
-        overflow-y: scroll;
-        padding: 0 .625rem !important;
-    }
-}
--- a/src/courseware/course/sidebar/sidebars/course-outline/CourseOutlineTray.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/CourseOutlineTray.jsx
@@ -1,156 +0,0 @@
-import { useState, useEffect } from 'react';
-import classNames from 'classnames';
-import { useDispatch, useSelector } from 'react-redux';
-import { Button, useToggle, IconButton } from '@openedx/paragon';
-import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
-import {
-  MenuOpen as MenuOpenIcon,
-  ChevronLeft as ChevronLeftIcon,
-} from '@openedx/paragon/icons';
-
-import { useModel } from '@src/generic/model-store';
-import { LOADING, LOADED } from '@src/course-home/data/slice';
-import PageLoading from '@src/generic/PageLoading';
-import {
-  getSequenceId,
-  getCourseOutline,
-  getCourseOutlineStatus,
-  getCourseOutlineShouldUpdate,
-} from '../../../../data/selectors';
-import { getCourseOutlineStructure } from '../../../../data/thunks';
-import SidebarSection from './components/SidebarSection';
-import SidebarSequence from './components/SidebarSequence';
-import { ID } from './constants';
-import { useCourseOutlineSidebar } from './hooks';
-import messages from './messages';
-
-const CourseOutlineTray = ({ intl }) => {
-  const [selectedSection, setSelectedSection] = useState(null);
-  const [isDisplaySequenceLevel, setDisplaySequenceLevel, setDisplaySectionLevel] = useToggle(true);
-
-  const dispatch = useDispatch();
-  const activeSequenceId = useSelector(getSequenceId);
-  const { sections = {}, sequences = {} } = useSelector(getCourseOutline);
-  const courseOutlineStatus = useSelector(getCourseOutlineStatus);
-  const courseOutlineShouldUpdate = useSelector(getCourseOutlineShouldUpdate);
-
-  const {
-    courseId,
-    unitId,
-    isEnabledSidebar,
-    currentSidebar,
-    handleToggleCollapse,
-    isActiveEntranceExam,
-    shouldDisplayFullScreen,
-  } = useCourseOutlineSidebar();
-
-  const {
-    sectionId: activeSectionId,
-  } = useModel('sequences', activeSequenceId);
-
-  const sectionsIds = Object.keys(sections);
-  const sequenceIds = sections[selectedSection || activeSectionId]?.sequenceIds || [];
-  const backButtonTitle = sections[selectedSection || activeSectionId]?.title;
-
-  const handleBackToSectionLevel = () => {
-    setDisplaySectionLevel();
-    setSelectedSection(null);
-  };
-
-  const handleSelectSection = (id) => {
-    setDisplaySequenceLevel();
-    setSelectedSection(id);
-  };
-
-  const sidebarHeading = (
-    <div className="outline-sidebar-heading-wrapper sticky d-flex justify-content-between align-self-start align-items-center bg-light-200 p-2.5 pl-4">
-      {isDisplaySequenceLevel && backButtonTitle ? (
-        <Button
-          variant="link"
-          iconBefore={ChevronLeftIcon}
-          className="outline-sidebar-heading p-0 mb-0 text-left text-dark-500"
-          onClick={handleBackToSectionLevel}
-        >
-          {backButtonTitle}
-        </Button>
-      ) : (
-        <span className="outline-sidebar-heading mb-0 h4 text-dark-500">
-          {intl.formatMessage(messages.courseOutlineTitle)}
-        </span>
-      )}
-      <IconButton
-        alt={intl.formatMessage(messages.toggleCourseOutlineTrigger)}
-        className="outline-sidebar-toggle-btn flex-shrink-0 text-dark bg-light-200"
-        iconAs={MenuOpenIcon}
-        onClick={handleToggleCollapse}
-      />
-    </div>
-  );
-
-  useEffect(() => {
-    if ((isEnabledSidebar && courseOutlineStatus !== LOADED) || courseOutlineShouldUpdate) {
-      dispatch(getCourseOutlineStructure(courseId));
-    }
-  }, [courseId, isEnabledSidebar, courseOutlineShouldUpdate]);
-
-  if (!isEnabledSidebar || isActiveEntranceExam || currentSidebar !== ID) {
-    return null;
-  }
-
-  if (courseOutlineStatus === LOADING) {
-    return (
-      <div className={classNames('outline-sidebar-wrapper', {
-        'flex-shrink-0 mr-4 h-auto': !shouldDisplayFullScreen,
-        'bg-white m-0 fixed-top w-100 vh-100': shouldDisplayFullScreen,
-      })}
-      >
-        <section className="outline-sidebar w-100">
-          {sidebarHeading}
-          <PageLoading
-            srMessage={intl.formatMessage(messages.loading)}
-          />
-        </section>
-      </div>
-    );
-  }
-
-  return (
-    <div className={classNames('outline-sidebar-wrapper', {
-      'flex-shrink-0 mr-4 h-auto': !shouldDisplayFullScreen,
-      'bg-white m-0 fixed-top w-100 vh-100': shouldDisplayFullScreen,
-    })}
-    >
-      <section className="outline-sidebar w-100">
-        {sidebarHeading}
-        <ol id="outline-sidebar-outline" className="list-unstyled">
-          {isDisplaySequenceLevel
-            ? sequenceIds.map((sequenceId) => (
-              <SidebarSequence
-                key={sequenceId}
-                courseId={courseId}
-                sequence={sequences[sequenceId]}
-                defaultOpen={sequenceId === activeSequenceId}
-                activeUnitId={unitId}
-              />
-            ))
-            : sectionsIds.map((sectionId) => (
-              <SidebarSection
-                key={sectionId}
-                courseId={courseId}
-                section={sections[sectionId]}
-                handleSelectSection={handleSelectSection}
-              />
-            ))}
-        </ol>
-      </section>
-    </div>
-  );
-};
-
-CourseOutlineTray.propTypes = {
-  intl: intlShape.isRequired,
-};
-
-CourseOutlineTray.ID = ID;
-
-export default injectIntl(CourseOutlineTray);
--- a/src/courseware/course/sidebar/sidebars/course-outline/CourseOutlineTray.scss
+++ b/src/courseware/course/sidebar/sidebars/course-outline/CourseOutlineTray.scss
@@ -1,103 +0,0 @@
-.outline-sidebar-wrapper {
-    width: 32.125rem;
-    max-width: 100%;
-    overflow: auto;
-    position: relative;
-    flex-shrink: 0;
-}
-
-.outline-sidebar {
-    @media (min-width: map-get($grid-breakpoints, "xl")) {
-        position: absolute;
-        left: 0;
-        top: 0;
-    }
-}
-
-.outline-sidebar-heading-wrapper {
-    border: 1px solid #d7d3d1;
-
-    &.sticky {
-        position: sticky;
-        top: 0;
-        left: 0;
-        z-index: 5;
-    }
-
-    .outline-sidebar-heading {
-        font-weight: $font-weight-bold;
-    }
-}
-
-.course-sidebar-section {
-    background: $white;
-    border: 1px solid #d7d3d1;
-
-    button {
-        line-height: 1.75rem;
-
-        &.focus::before,
-        &:focus::before {
-            border-radius: 0;
-        }
-    }
-}
-
-.outline-sidebar-toggle-btn {
-    font-size: 1.5rem;
-
-    .collapsed & {
-        transform: scale(-1, 1);
-    }
-}
-
-#outline-sidebar-outline {
-    margin-top: -1px;
-
-    @media (min-width: map-get($grid-breakpoints, "xl")) {
-        margin-bottom: 0;
-    }
-
-    li {
-        font-size: 1rem;
-        line-height: 1.5rem;
-
-        .collapsible-trigger {
-            border-radius: 0;
-            padding: map-get($spacers, 3\.5) map-get($spacers, 4) map-get($spacers, 3\.5) map-get($spacers, 5);
-
-            @media (max-width: -1 + map-get($grid-breakpoints, "sm")) {
-                padding-left: map-get($spacers, 4);
-            }
-
-            &:hover {
-                background-color: $light-500;
-            }
-
-            .collapsible-icon {
-                margin-inline-start: initial;
-            }
-        }
-
-        &:last-child .pgn_collapsible {
-            @extend .mb-0;
-        }
-    }
-
-    .collapsible-body {
-        padding: 0;
-
-        ol li > a {
-            padding: map-get($spacers, 3\.5) map-get($spacers, 4) map-get($spacers, 3\.5) map-get($spacers, 5\.5);
-
-            @media (max-width: -1 + map-get($grid-breakpoints, "sm")) {
-                padding-left: map-get($spacers, 4\.5);
-            }
-
-            &:hover {
-                text-decoration: none;
-                background-color: $light-500;
-            }
-        }
-    }
-}
--- a/src/courseware/course/sidebar/sidebars/course-outline/CourseOutlineTray.test.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/CourseOutlineTray.test.jsx
@@ -1,119 +0,0 @@
-import { MemoryRouter } from 'react-router-dom';
-import { render, screen } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import { AppProvider } from '@edx/frontend-platform/react';
-import { IntlProvider } from '@edx/frontend-platform/i18n';
-
-import { initializeTestStore } from '@src/setupTest';
-import courseOutlineMessages from '@src/course-home/outline-tab/messages';
-import SidebarContext from '../../SidebarContext';
-import CourseOutlineTray from './CourseOutlineTray';
-import { ID as outlineSidebarId } from './constants';
-import messages from './messages';
-
-describe('<CourseOutlineTray />', () => {
-  let store;
-  let section = {};
-  let sequence = {};
-  let unit;
-  let unitId;
-  let courseId;
-  let mockData;
-
-  const initTestStore = async (options) => {
-    store = await initializeTestStore(options);
-    const state = store.getState();
-    courseId = state.courseware.courseId;
-    [unitId] = Object.keys(state.models.units);
-
-    if (Object.keys(state.courseware.courseOutline).length) {
-      const [activeSequenceId] = Object.keys(state.courseware.courseOutline.sequences);
-      sequence = state.courseware.courseOutline.sequences[activeSequenceId];
-      const activeSectionId = Object.keys(state.courseware.courseOutline.sections)[0];
-      section = state.courseware.courseOutline.sections[activeSectionId];
-      [unitId] = sequence.unitIds;
-      unit = state.courseware.courseOutline.units[unitId];
-    }
-
-    mockData = {
-      courseId,
-      unitId,
-      currentSidebar: outlineSidebarId,
-      toggleSidebar: jest.fn(),
-    };
-  };
-
-  function renderWithProvider(testData = {}) {
-    const { container } = render(
-      <AppProvider store={store} wrapWithRouter={false}>
-        <IntlProvider locale="en">
-          <SidebarContext.Provider value={{ ...mockData, ...testData }}>
-            <MemoryRouter>
-              <CourseOutlineTray />
-            </MemoryRouter>
-          </SidebarContext.Provider>
-        </IntlProvider>
-      </AppProvider>,
-    );
-    return container;
-  }
-
-  it('renders correctly when course outline is loading', async () => {
-    await initTestStore({ excludeFetchOutlineSidebar: true });
-    renderWithProvider();
-
-    expect(screen.getByText(messages.loading.defaultMessage)).toBeInTheDocument();
-    expect(screen.getByText(messages.courseOutlineTitle.defaultMessage)).toBeInTheDocument();
-    expect(screen.queryByRole('button', { name: 'Course Outline' })).not.toBeInTheDocument();
-  });
-
-  it('doesn\'t render when outline sidebar is disabled', async () => {
-    await initTestStore({ enableNavigationSidebar: { enable_navigation_sidebar: false } });
-    renderWithProvider();
-
-    await expect(screen.queryByText(messages.loading.defaultMessage)).not.toBeInTheDocument();
-    expect(screen.queryByRole('button', { name: section.title })).not.toBeInTheDocument();
-    expect(screen.queryByRole('button', { name: messages.toggleCourseOutlineTrigger.defaultMessage })).not.toBeInTheDocument();
-  });
-
-  it('renders correctly when course outline is loaded', async () => {
-    await initTestStore();
-    renderWithProvider();
-
-    await expect(screen.queryByText(messages.loading.defaultMessage)).not.toBeInTheDocument();
-    expect(screen.getByRole('button', { name: section.title })).toBeInTheDocument();
-    expect(screen.getByRole('button', { name: messages.toggleCourseOutlineTrigger.defaultMessage })).toBeInTheDocument();
-    expect(screen.getByRole('button', { name: `${sequence.title} , ${courseOutlineMessages.incompleteAssignment.defaultMessage}` })).toBeInTheDocument();
-    expect(screen.getByText(unit.title)).toBeInTheDocument();
-  });
-
-  it('collapses sidebar correctly when toggle button is clicked', async () => {
-    const mockToggleSidebar = jest.fn();
-    await initTestStore();
-    renderWithProvider({ toggleSidebar: mockToggleSidebar });
-
-    const collapseBtn = screen.getByRole('button', { name: messages.toggleCourseOutlineTrigger.defaultMessage });
-    const sidebarBackBtn = screen.queryByRole('button', { name: section.title });
-    expect(sidebarBackBtn).toBeInTheDocument();
-    expect(collapseBtn).toBeInTheDocument();
-
-    userEvent.click(collapseBtn);
-    expect(mockToggleSidebar).toHaveBeenCalledWith(null);
-  });
-
-  it('navigates to section or sequence level correctly on click by back/section button', async () => {
-    await initTestStore();
-    renderWithProvider();
-
-    const sidebarBackBtn = screen.queryByRole('button', { name: section.title });
-    expect(sidebarBackBtn).toBeInTheDocument();
-    expect(screen.getByRole('button', { name: `${sequence.title} , ${courseOutlineMessages.incompleteAssignment.defaultMessage}` })).toBeInTheDocument();
-
-    userEvent.click(sidebarBackBtn);
-    expect(sidebarBackBtn).not.toBeInTheDocument();
-    expect(screen.queryByText(messages.courseOutlineTitle.defaultMessage)).toBeInTheDocument();
-
-    userEvent.click(screen.getByRole('button', { name: `${section.title} , ${courseOutlineMessages.incompleteSection.defaultMessage}` }));
-    expect(screen.queryByRole('button', { name: section.title })).toBeInTheDocument();
-  });
-});
--- a/src/courseware/course/sidebar/sidebars/course-outline/CourseOutlineTrigger.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/CourseOutlineTrigger.jsx
@@ -1,52 +0,0 @@
-import classNames from 'classnames';
-import PropTypes from 'prop-types';
-import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
-import { IconButton } from '@openedx/paragon';
-import { MenuOpen as MenuOpenIcon } from '@openedx/paragon/icons';
-
-import { useCourseOutlineSidebar } from './hooks';
-import { ID } from './constants';
-import messages from './messages';
-
-const CourseOutlineTrigger = ({ intl, isMobileView }) => {
-  const {
-    currentSidebar,
-    shouldDisplayFullScreen,
-    handleToggleCollapse,
-    isActiveEntranceExam,
-    isEnabledSidebar,
-  } = useCourseOutlineSidebar();
-
-  const isDisplayForDesktopView = !isMobileView && !shouldDisplayFullScreen && currentSidebar !== ID;
-  const isDisplayForMobileView = isMobileView && shouldDisplayFullScreen;
-
-  if ((!isDisplayForDesktopView && !isDisplayForMobileView) || !isEnabledSidebar || isActiveEntranceExam) {
-    return null;
-  }
-
-  return (
-    <div className={classNames('outline-sidebar-heading-wrapper bg-light-200 collapsed align-self-start', {
-      'flex-shrink-0 mr-4 p-2.5': isDisplayForDesktopView,
-      'p-0': isDisplayForMobileView,
-    })}
-    >
-      <IconButton
-        alt={intl.formatMessage(messages.toggleCourseOutlineTrigger)}
-        className="outline-sidebar-toggle-btn flex-shrink-0 text-dark bg-light-200 rounded-0"
-        iconAs={MenuOpenIcon}
-        onClick={handleToggleCollapse}
-      />
-    </div>
-  );
-};
-
-CourseOutlineTrigger.defaultProps = {
-  isMobileView: false,
-};
-
-CourseOutlineTrigger.propTypes = {
-  intl: intlShape.isRequired,
-  isMobileView: PropTypes.bool,
-};
-
-export default injectIntl(CourseOutlineTrigger);
--- a/src/courseware/course/sidebar/sidebars/course-outline/CourseOutlineTrigger.test.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/CourseOutlineTrigger.test.jsx
@@ -1,109 +0,0 @@
-import { render, screen } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import { AppProvider } from '@edx/frontend-platform/react';
-import { IntlProvider } from '@edx/frontend-platform/i18n';
-
-import { initializeTestStore } from '@src/setupTest';
-import SidebarContext from '../../SidebarContext';
-import { ID as discussionSidebarId } from '../discussions/DiscussionsTrigger';
-import CourseOutlineTrigger from './CourseOutlineTrigger';
-import { ID as outlineSidebarId } from './constants';
-import messages from './messages';
-
-describe('<CourseOutlineTrigger />', () => {
-  let mockData;
-  let courseId;
-  let unitId;
-  let store;
-
-  const initTestStore = async (options) => {
-    store = await initializeTestStore(options);
-    const state = store.getState();
-    courseId = state.courseware.courseId;
-    [unitId] = Object.keys(state.models.units);
-
-    mockData = {
-      courseId,
-      unitId,
-      currentSidebar: discussionSidebarId,
-    };
-  };
-
-  function renderWithProvider(testData = {}, props = {}) {
-    const { container } = render(
-      <AppProvider store={store} wrapWithRouter={false}>
-        <IntlProvider locale="en">
-          <SidebarContext.Provider value={{ ...mockData, ...testData }}>
-            <CourseOutlineTrigger {...props} />
-          </SidebarContext.Provider>
-        </IntlProvider>
-      </AppProvider>,
-    );
-    return container;
-  }
-
-  it('renders correctly for desktop when sidebar is enabled', async () => {
-    const mockToggleSidebar = jest.fn();
-    await initTestStore({ enableNavigationSidebar: { enable_navigation_sidebar: true } });
-    renderWithProvider({ toggleSidebar: mockToggleSidebar }, { isMobileView: false });
-
-    const toggleButton = await screen.getByRole('button', {
-      name: messages.toggleCourseOutlineTrigger.defaultMessage,
-    });
-    expect(toggleButton).toBeInTheDocument();
-
-    userEvent.click(toggleButton);
-
-    expect(mockToggleSidebar).toHaveBeenCalled();
-    expect(mockToggleSidebar).toHaveBeenCalledWith(outlineSidebarId);
-  });
-
-  it('renders correctly for mobile when sidebar is enabled', async () => {
-    const mockToggleSidebar = jest.fn();
-    await initTestStore({ enableNavigationSidebar: { enable_navigation_sidebar: true } });
-    renderWithProvider({
-      toggleSidebar: mockToggleSidebar,
-      shouldDisplayFullScreen: true,
-    }, { isMobileView: true });
-
-    const toggleButton = await screen.getByRole('button', {
-      name: messages.toggleCourseOutlineTrigger.defaultMessage,
-    });
-    expect(toggleButton).toBeInTheDocument();
-
-    userEvent.click(toggleButton);
-
-    expect(mockToggleSidebar).toHaveBeenCalled();
-    expect(mockToggleSidebar).toHaveBeenCalledWith(outlineSidebarId);
-  });
-
-  it('changes current sidebar value on click', async () => {
-    const mockToggleSidebar = jest.fn();
-    await initTestStore({ enableNavigationSidebar: { enable_navigation_sidebar: true } });
-    renderWithProvider({
-      toggleSidebar: mockToggleSidebar,
-      shouldDisplayFullScreen: true,
-      currentSidebar: outlineSidebarId,
-    }, { isMobileView: true });
-
-    const toggleButton = await screen.getByRole('button', {
-      name: messages.toggleCourseOutlineTrigger.defaultMessage,
-    });
-    expect(toggleButton).toBeInTheDocument();
-
-    userEvent.click(toggleButton);
-
-    expect(mockToggleSidebar).toHaveBeenCalledTimes(1);
-    expect(mockToggleSidebar).toHaveBeenCalledWith(null);
-  });
-
-  it('does not render when isEnabled is false', async () => {
-    await initTestStore({ enableNavigationSidebar: { enable_navigation_sidebar: false } });
-    renderWithProvider({}, { isMobileView: false });
-
-    const toggleButton = await screen.queryByRole('button', {
-      name: messages.toggleCourseOutlineTrigger.defaultMessage,
-    });
-    expect(toggleButton).not.toBeInTheDocument();
-  });
-});
--- a/src/courseware/course/sidebar/sidebars/course-outline/components/CompletionIcon.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/components/CompletionIcon.jsx
@@ -1,30 +0,0 @@
-import PropTypes from 'prop-types';
-import {
-  CheckCircle as CheckCircleIcon,
-  LmsCompletionSolid as LmsCompletionSolidIcon,
-} from '@openedx/paragon/icons';
-
-import { DashedCircleIcon } from '../icons';
-
-const CompletionIcon = ({ completionStat: { completed = 0, total = 0 } }) => {
-  const percentage = total !== 0 ? Math.min((completed / total) * 100, 100) : 0;
-  const remainder = 100 - percentage;
-
-  switch (true) {
-    case !completed:
-      return <LmsCompletionSolidIcon className="text-gray-300" data-testid="completion-solid-icon" />;
-    case completed === total:
-      return <CheckCircleIcon className="text-success" data-testid="check-circle-icon" />;
-    default:
-      return <DashedCircleIcon percentage={percentage} remainder={remainder} data-testid="dashed-circle-icon" />;
-  }
-};
-
-CompletionIcon.propTypes = {
-  completionStat: PropTypes.shape({
-    completed: PropTypes.number,
-    total: PropTypes.number,
-  }).isRequired,
-};
-
-export default CompletionIcon;
--- a/src/courseware/course/sidebar/sidebars/course-outline/components/CompletionIcon.test.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/components/CompletionIcon.test.jsx
@@ -1,23 +0,0 @@
-import { render, screen } from '@testing-library/react';
-
-import CompletionIcon from './CompletionIcon';
-
-describe('CompletionIcon', () => {
-  it('renders check circle icon when completion is equal to total', () => {
-    const completionStat = { completed: 5, total: 5 };
-    render(<CompletionIcon completionStat={completionStat} />);
-    expect(screen.getByTestId('check-circle-icon')).toBeInTheDocument();
-  });
-
-  it('renders dashed circle icon when completion is between 0 and total', () => {
-    const completionStat = { completed: 2, total: 5 };
-    render(<CompletionIcon completionStat={completionStat} />);
-    expect(screen.getByTestId('dashed-circle-icon')).toBeInTheDocument();
-  });
-
-  it('renders completion solid icon when completion is 0', () => {
-    const completionStat = { completed: 0, total: 5 };
-    render(<CompletionIcon completionStat={completionStat} />);
-    expect(screen.getByTestId('completion-solid-icon')).toBeInTheDocument();
-  });
-});
--- a/src/courseware/course/sidebar/sidebars/course-outline/components/SidebarSection.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/components/SidebarSection.jsx
@@ -1,72 +0,0 @@
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-import { useSelector } from 'react-redux';
-import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
-import { Button, Icon } from '@openedx/paragon';
-import { ChevronRight as ChevronRightIcon } from '@openedx/paragon/icons';
-
-import courseOutlineMessages from '@src/course-home/outline-tab/messages';
-import { getSequenceId } from '@src/courseware/data/selectors';
-import CompletionIcon from './CompletionIcon';
-
-const SidebarSection = ({ intl, section, handleSelectSection }) => {
-  const {
-    id,
-    complete,
-    title,
-    sequenceIds,
-    completionStat,
-  } = section;
-
-  const activeSequenceId = useSelector(getSequenceId);
-  const isActiveSection = sequenceIds.includes(activeSequenceId);
-
-  const sectionTitle = (
-    <>
-      <div className="col-auto p-0">
-        <CompletionIcon completionStat={completionStat} />
-      </div>
-      <div className="col-10 ml-3 p-0 flex-grow-1 text-dark-500 text-left text-break">
-        {title}
-        <span className="sr-only">
-          , {intl.formatMessage(complete
-          ? courseOutlineMessages.completedSection
-          : courseOutlineMessages.incompleteSection)}
-        </span>
-      </div>
-    </>
-  );
-
-  return (
-    <li className="mb-2 course-sidebar-section">
-      <Button
-        variant="tertiary"
-        className={classNames(
-          'd-flex align-items-center w-100 px-4 py-3.5 rounded-0 justify-content-start',
-          { 'bg-info-100': isActiveSection },
-        )}
-        onClick={() => handleSelectSection(id)}
-      >
-        {sectionTitle}
-        <Icon src={ChevronRightIcon} />
-      </Button>
-    </li>
-  );
-};
-
-SidebarSection.propTypes = {
-  intl: intlShape.isRequired,
-  section: PropTypes.shape({
-    complete: PropTypes.bool,
-    id: PropTypes.string,
-    title: PropTypes.string,
-    sequenceIds: PropTypes.arrayOf(PropTypes.string),
-    completionStat: PropTypes.shape({
-      completed: PropTypes.number,
-      total: PropTypes.number,
-    }),
-  }).isRequired,
-  handleSelectSection: PropTypes.func.isRequired,
-};
-
-export default injectIntl(SidebarSection);
--- a/src/courseware/course/sidebar/sidebars/course-outline/components/SidebarSection.test.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/components/SidebarSection.test.jsx
@@ -1,67 +0,0 @@
-import { render } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import { IntlProvider } from '@edx/frontend-platform/i18n';
-import { AppProvider } from '@edx/frontend-platform/react';
-
-import { initializeTestStore } from '@src/setupTest';
-import courseOutlineMessages from '@src/course-home/outline-tab/messages';
-import SidebarSection from './SidebarSection';
-
-describe('<SidebarSection />', () => {
-  let mockHandleSelectSection;
-  let store;
-  let section;
-
-  const initTestStore = async (options) => {
-    store = await initializeTestStore(options);
-    const state = store.getState();
-    const [activeSectionId] = Object.keys(state.courseware.courseOutline.sections);
-    section = state.courseware.courseOutline.sections[activeSectionId];
-  };
-
-  const RootWrapper = (props) => (
-    <AppProvider store={store} wrapWithRouter={false}>
-      <IntlProvider locale="en">
-        <SidebarSection
-          section={section}
-          handleSelectSection={mockHandleSelectSection}
-          {...props}
-        />,
-      </IntlProvider>
-    </AppProvider>
-  );
-
-  beforeEach(() => {
-    mockHandleSelectSection = jest.fn();
-  });
-
-  it('renders correctly when section is incomplete', async () => {
-    await initTestStore();
-    const { getByText, container } = render(<RootWrapper />);
-
-    expect(getByText(section.title)).toBeInTheDocument();
-    expect(getByText(`, ${courseOutlineMessages.incompleteSection.defaultMessage}`)).toBeInTheDocument();
-    expect(container.querySelector('.text-success')).not.toBeInTheDocument();
-
-    const button = getByText(section.title);
-    userEvent.click(button);
-    expect(mockHandleSelectSection).toHaveBeenCalledTimes(1);
-    expect(mockHandleSelectSection).toHaveBeenCalledWith(section.id);
-  });
-
-  it('renders correctly when section is complete', async () => {
-    await initTestStore();
-    const { getByText, getByTestId } = render(
-      <RootWrapper section={{ ...section, completionStat: { completed: 4, total: 4 }, complete: true }} />,
-    );
-
-    expect(getByText(section.title)).toBeInTheDocument();
-    expect(getByText(`, ${courseOutlineMessages.completedSection.defaultMessage}`)).toBeInTheDocument();
-    expect(getByTestId('check-circle-icon')).toBeInTheDocument();
-
-    const button = getByText(section.title);
-    userEvent.click(button);
-    expect(mockHandleSelectSection).toHaveBeenCalledTimes(1);
-    expect(mockHandleSelectSection).toHaveBeenCalledWith(section.id);
-  });
-});
--- a/src/courseware/course/sidebar/sidebars/course-outline/components/SidebarSequence.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/components/SidebarSequence.jsx
@@ -1,101 +0,0 @@
-import { useState } from 'react';
-import { useSelector } from 'react-redux';
-import classNames from 'classnames';
-import PropTypes from 'prop-types';
-import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
-import { Collapsible } from '@openedx/paragon';
-
-import courseOutlineMessages from '@src/course-home/outline-tab/messages';
-import { getCourseOutline, getSequenceId } from '@src/courseware/data/selectors';
-import CompletionIcon from './CompletionIcon';
-import SidebarUnit from './SidebarUnit';
-import { UNIT_ICON_TYPES } from './UnitIcon';
-
-const SidebarSequence = ({
-  intl,
-  courseId,
-  defaultOpen,
-  sequence,
-  activeUnitId,
-}) => {
-  const {
-    id,
-    complete,
-    title,
-    specialExamInfo,
-    unitIds,
-    type,
-    completionStat,
-  } = sequence;
-
-  const [open, setOpen] = useState(defaultOpen);
-  const { units = {} } = useSelector(getCourseOutline);
-  const activeSequenceId = useSelector(getSequenceId);
-  const isActiveSequence = id === activeSequenceId;
-
-  const sectionTitle = (
-    <>
-      <div className="col-auto p-0" style={{ fontSize: '1.1rem' }}>
-        <CompletionIcon completionStat={completionStat} />
-      </div>
-      <div className="col-9 d-flex flex-column flex-grow-1 ml-3 mr-auto p-0 text-left">
-        <span className="align-middle text-dark-500">{title}</span>
-        {specialExamInfo && <span className="align-middle small text-muted">{specialExamInfo}</span>}
-        <span className="sr-only">
-          , {intl.formatMessage(complete
-          ? courseOutlineMessages.completedAssignment
-          : courseOutlineMessages.incompleteAssignment)}
-        </span>
-      </div>
-    </>
-  );
-
-  return (
-    <li>
-      <Collapsible
-        className={classNames('mb-2', { 'active-section': isActiveSequence, 'bg-info-100': isActiveSequence && !open })}
-        styling="card-lg text-break"
-        title={sectionTitle}
-        open={open}
-        onToggle={() => setOpen(!open)}
-      >
-        <ol className="list-unstyled">
-          {unitIds.map((unitId, index) => (
-            <SidebarUnit
-              key={unitId}
-              id={unitId}
-              courseId={courseId}
-              sequenceId={id}
-              unit={units[unitId]}
-              isActive={activeUnitId === unitId}
-              activeUnitId={activeUnitId}
-              isFirst={index === 0}
-              isLocked={type === UNIT_ICON_TYPES.lock}
-            />
-          ))}
-        </ol>
-      </Collapsible>
-    </li>
-  );
-};
-
-SidebarSequence.propTypes = {
-  intl: intlShape.isRequired,
-  courseId: PropTypes.string.isRequired,
-  defaultOpen: PropTypes.bool.isRequired,
-  sequence: PropTypes.shape({
-    complete: PropTypes.bool,
-    id: PropTypes.string,
-    title: PropTypes.string,
-    type: PropTypes.string,
-    specialExamInfo: PropTypes.string,
-    unitIds: PropTypes.arrayOf(PropTypes.string),
-    completionStat: PropTypes.shape({
-      completed: PropTypes.number,
-      total: PropTypes.number,
-    }),
-  }).isRequired,
-  activeUnitId: PropTypes.string.isRequired,
-};
-
-export default injectIntl(SidebarSequence);
--- a/src/courseware/course/sidebar/sidebars/course-outline/components/SidebarSequence.test.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/components/SidebarSequence.test.jsx
@@ -1,84 +0,0 @@
-import { MemoryRouter } from 'react-router-dom';
-import { render, screen, waitFor } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import { AppProvider } from '@edx/frontend-platform/react';
-import { IntlProvider } from '@edx/frontend-platform/i18n';
-
-import courseOutlineMessages from '@src/course-home/outline-tab/messages';
-import { initializeMockApp, initializeTestStore } from '@src/setupTest';
-import messages from '../messages';
-import SidebarSequence from './SidebarSequence';
-
-initializeMockApp();
-
-describe('<SidebarSequence />', () => {
-  let courseId;
-  let store;
-  let sequence;
-  let unit;
-  const sequenceDescription = 'sequence test description';
-
-  const initTestStore = async (options) => {
-    store = await initializeTestStore(options);
-    const state = store.getState();
-    courseId = state.courseware.courseId;
-    let activeSequenceId = '';
-    [activeSequenceId] = Object.keys(state.courseware.courseOutline.sequences);
-    sequence = state.courseware.courseOutline.sequences[activeSequenceId];
-    const unitId = sequence.unitIds[0];
-    unit = state.courseware.courseOutline.units[unitId];
-  };
-
-  function renderWithProvider(props = {}) {
-    const { container } = render(
-      <AppProvider store={store} wrapWithRouter={false}>
-        <IntlProvider locale="en">
-          <MemoryRouter>
-            <SidebarSequence
-              courseId={courseId}
-              defaultOpen={false}
-              sequence={sequence}
-              activeUnitId={sequence.unitIds[0]}
-              {...props}
-            />
-          </MemoryRouter>
-        </IntlProvider>
-      </AppProvider>,
-    );
-    return container;
-  }
-
-  it('renders correctly when sequence is collapsed and incomplete', async () => {
-    await initTestStore();
-    renderWithProvider();
-
-    expect(screen.getByText(sequence.title)).toBeInTheDocument();
-    expect(screen.queryByText(sequenceDescription)).not.toBeInTheDocument();
-    expect(screen.getByText(`, ${courseOutlineMessages.incompleteAssignment.defaultMessage}`)).toBeInTheDocument();
-    expect(screen.queryByText(unit.title)).not.toBeInTheDocument();
-  });
-
-  it('renders correctly when sequence is not collapsed and complete', async () => {
-    await initTestStore();
-    renderWithProvider({
-      defaultOpen: true,
-      sequence: {
-        ...sequence,
-        specialExamInfo: sequenceDescription,
-        complete: true,
-      },
-    });
-
-    expect(screen.getByText(sequence.title)).toBeInTheDocument();
-    expect(screen.getByText(sequenceDescription)).toBeInTheDocument();
-    expect(screen.getByText(`, ${courseOutlineMessages.completedAssignment.defaultMessage}`)).toBeInTheDocument();
-    expect(screen.getByText(unit.title)).toBeInTheDocument();
-    expect(screen.getByText(`, ${messages.incompleteUnit.defaultMessage}`)).toBeInTheDocument();
-
-    userEvent.click(screen.getByText(sequence.title));
-    await waitFor(() => {
-      expect(screen.queryByText(unit.title)).not.toBeInTheDocument();
-      expect(screen.queryByText(`, ${messages.incompleteUnit.defaultMessage}`)).not.toBeInTheDocument();
-    });
-  });
-});
--- a/src/courseware/course/sidebar/sidebars/course-outline/components/SidebarUnit.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/components/SidebarUnit.jsx
@@ -1,101 +0,0 @@
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-import { Link } from 'react-router-dom';
-import { useDispatch, useSelector } from 'react-redux';
-import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
-import { sendTrackEvent, sendTrackingLogEvent } from '@edx/frontend-platform/analytics';
-
-import { checkBlockCompletion } from '@src/courseware/data';
-import { getCourseOutline } from '@src/courseware/data/selectors';
-import messages from '../messages';
-import UnitIcon, { UNIT_ICON_TYPES } from './UnitIcon';
-
-const SidebarUnit = ({
-  id,
-  intl,
-  courseId,
-  sequenceId,
-  isFirst,
-  unit,
-  isActive,
-  isLocked,
-  activeUnitId,
-}) => {
-  const {
-    complete,
-    title,
-    icon = UNIT_ICON_TYPES.other,
-  } = unit;
-  const dispatch = useDispatch();
-  const { sequences = {} } = useSelector(getCourseOutline);
-
-  const logEvent = (eventName, widgetPlacement) => {
-    const findSequenceByUnitId = (unitId) => Object.values(sequences).find(seq => seq.unitIds.includes(unitId));
-    const activeSequence = findSequenceByUnitId(activeUnitId);
-    const targetSequence = findSequenceByUnitId(id);
-    const payload = {
-      id: activeUnitId,
-      current_tab: activeSequence.unitIds.indexOf(activeUnitId) + 1,
-      tab_count: activeSequence.unitIds.length,
-      target_id: id,
-      target_tab: targetSequence.unitIds.indexOf(id) + 1,
-      widget_placement: widgetPlacement,
-    };
-
-    if (activeSequence.id !== targetSequence.id) {
-      payload.target_tab_count = targetSequence.unitIds.length;
-    }
-
-    sendTrackEvent(eventName, payload);
-    sendTrackingLogEvent(eventName, payload);
-  };
-
-  const handleClick = () => {
-    logEvent('edx.ui.lms.sequence.tab_selected', 'left');
-    dispatch(checkBlockCompletion(courseId, sequenceId, activeUnitId));
-  };
-
-  const iconType = isLocked ? UNIT_ICON_TYPES.lock : icon;
-
-  return (
-    <li className={classNames({ 'bg-info-100': isActive, 'border-top border-light': !isFirst })}>
-      <Link
-        to={`/course/${courseId}/${sequenceId}/${id}`}
-        className="row w-100 m-0 d-flex align-items-center text-gray-700"
-        onClick={handleClick}
-      >
-        <div className="col-auto p-0">
-          <UnitIcon type={iconType} isCompleted={complete} />
-        </div>
-        <div className="col-10 p-0 ml-3 text-break">
-          <span className="align-middle">
-            {title}
-          </span>
-          <span className="sr-only">
-            , {intl.formatMessage(complete ? messages.completedUnit : messages.incompleteUnit)}
-          </span>
-        </div>
-      </Link>
-    </li>
-  );
-};
-
-SidebarUnit.propTypes = {
-  intl: intlShape.isRequired,
-  id: PropTypes.string.isRequired,
-  isFirst: PropTypes.bool.isRequired,
-  unit: PropTypes.shape({
-    complete: PropTypes.bool,
-    icon: PropTypes.string,
-    id: PropTypes.string,
-    title: PropTypes.string,
-    type: PropTypes.string,
-  }).isRequired,
-  isActive: PropTypes.bool.isRequired,
-  isLocked: PropTypes.bool.isRequired,
-  courseId: PropTypes.string.isRequired,
-  sequenceId: PropTypes.string.isRequired,
-  activeUnitId: PropTypes.string.isRequired,
-};
-
-export default injectIntl(SidebarUnit);
--- a/src/courseware/course/sidebar/sidebars/course-outline/components/SidebarUnit.test.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/components/SidebarUnit.test.jsx
@@ -1,107 +0,0 @@
-import { AppProvider } from '@edx/frontend-platform/react';
-import { MemoryRouter } from 'react-router-dom';
-import { render, screen } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import { IntlProvider } from '@edx/frontend-platform/i18n';
-import { sendTrackEvent, sendTrackingLogEvent } from '@edx/frontend-platform/analytics';
-
-import { initializeMockApp, initializeTestStore } from '@src/setupTest';
-import SidebarUnit from './SidebarUnit';
-
-jest.mock('@edx/frontend-platform/analytics', () => ({
-  sendTrackEvent: jest.fn(),
-  sendTrackingLogEvent: jest.fn(),
-}));
-
-initializeMockApp();
-
-describe('<SidebarUnit />', () => {
-  let store = {};
-  let unit;
-  let sequenceId;
-
-  const initTestStore = async (options) => {
-    store = await initializeTestStore(options);
-    const state = store.getState();
-    [sequenceId] = Object.keys(state.courseware.courseOutline.sequences);
-    const sequence = state.courseware.courseOutline.sequences[sequenceId];
-    unit = state.courseware.courseOutline.units[sequence.unitIds[0]];
-  };
-
-  function renderWithProvider(props = {}) {
-    const { container } = render(
-      <AppProvider store={store} wrapWithRouter={false}>
-        <IntlProvider locale="en">
-          <MemoryRouter>
-            <SidebarUnit
-              isFirst
-              id={unit.id}
-              courseId="course123"
-              sequenceId={sequenceId}
-              unit={{ ...unit, icon: 'video', isLocked: false }}
-              isActive={false}
-              activeUnitId={unit.id}
-              {...props}
-            />
-          </MemoryRouter>
-        </IntlProvider>
-      </AppProvider>,
-    );
-    return container;
-  }
-
-  it('renders correctly when unit is incomplete', async () => {
-    await initTestStore();
-    const container = renderWithProvider();
-
-    expect(screen.getByText(unit.title)).toBeInTheDocument();
-    expect(container.querySelector('.text-success')).not.toBeInTheDocument();
-  });
-
-  it('renders correctly when unit is complete', async () => {
-    await initTestStore();
-    const container = renderWithProvider({ unit: { ...unit, complete: true } });
-
-    expect(screen.getByText(unit.title)).toBeInTheDocument();
-    expect(container.querySelector('.text-success')).toBeInTheDocument();
-    expect(container.querySelector('.border-top')).not.toBeInTheDocument();
-  });
-
-  it('renders correctly when unit is not first and icon is not set', async () => {
-    await initTestStore();
-    const container = renderWithProvider({
-      isFirst: false,
-      unit: { ...unit, icon: null },
-    });
-
-    expect(screen.getByText(unit.title)).toBeInTheDocument();
-    expect(container.querySelector('.border-top')).toBeInTheDocument();
-  });
-
-  it('renders correctly when unit is locked', async () => {
-    await initTestStore();
-    renderWithProvider({
-      unit: { ...unit, isLocked: true },
-    });
-
-    expect(screen.getByText(unit.title)).toBeInTheDocument();
-  });
-
-  it('sends log event correctly when unit is clicked', async () => {
-    await initTestStore();
-    renderWithProvider({ unit: { ...unit } });
-    const logData = {
-      id: unit.id,
-      current_tab: 1,
-      tab_count: 1,
-      target_id: unit.id,
-      target_tab: 1,
-      widget_placement: 'left',
-    };
-
-    userEvent.click(screen.getByText(unit.title));
-
-    expect(sendTrackEvent).toHaveBeenCalledWith('edx.ui.lms.sequence.tab_selected', logData);
-    expect(sendTrackingLogEvent).toHaveBeenCalledWith('edx.ui.lms.sequence.tab_selected', logData);
-  });
-});
--- a/src/courseware/course/sidebar/sidebars/course-outline/components/UnitIcon.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/components/UnitIcon.jsx
@@ -1,56 +0,0 @@
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-import {
-  Locked as LockedIcon,
-  Article as ArticleIcon,
-  LmsBook as LmsBookIcon,
-  LmsBookComplete as LmsBookCompleteIcon,
-  LmsEditSquare as LmsEditSquareIcon,
-  LmsEditSquareComplete as LmsEditSquareCompleteIcon,
-  LmsVideocam as LmsVideocamIcon,
-  LmsVideocamComplete as LmsVideocamCompleteIcon,
-} from '@openedx/paragon/icons';
-
-export const UNIT_ICON_TYPES = {
-  video: 'video',
-  problem: 'problem',
-  vertical: 'vertical',
-  lock: 'lock',
-  other: 'other',
-};
-
-const UnitIcon = ({ type, isCompleted, ...props }) => {
-  const iconMap = {
-    [UNIT_ICON_TYPES.video]: {
-      default: LmsVideocamIcon,
-      complete: LmsVideocamCompleteIcon,
-    },
-    [UNIT_ICON_TYPES.problem]: {
-      default: LmsEditSquareIcon,
-      complete: LmsEditSquareCompleteIcon,
-    },
-    [UNIT_ICON_TYPES.vertical]: ArticleIcon,
-    [UNIT_ICON_TYPES.lock]: LockedIcon,
-    [UNIT_ICON_TYPES.other]: {
-      default: LmsBookIcon,
-      complete: LmsBookCompleteIcon,
-    },
-  };
-
-  let Icon = iconMap[type || UNIT_ICON_TYPES.other];
-
-  if (typeof Icon === 'object') {
-    Icon = iconMap[type || UNIT_ICON_TYPES.other]?.[isCompleted ? 'complete' : 'default'];
-  }
-
-  return (
-    <Icon {...props} className={classNames({ 'text-success': isCompleted, 'text-gray-300': !isCompleted })} />
-  );
-};
-
-UnitIcon.propTypes = {
-  type: PropTypes.oneOf(Object.keys(UNIT_ICON_TYPES)).isRequired,
-  isCompleted: PropTypes.bool.isRequired,
-};
-
-export default UnitIcon;
--- a/src/courseware/course/sidebar/sidebars/course-outline/components/UnitIcon.test.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/components/UnitIcon.test.jsx
@@ -1,21 +0,0 @@
-import { render } from '@testing-library/react';
-
-import UnitIcon, { UNIT_ICON_TYPES } from './UnitIcon';
-
-describe('<UnitIcon />', () => {
-  Object.keys(UNIT_ICON_TYPES).forEach((type) => {
-    it(`renders default ${type} icon correctly`, () => {
-      const { container } = render(<UnitIcon type={type} isCompleted={false} />);
-      const icon = container.querySelector('svg');
-      expect(icon).toBeInTheDocument();
-      expect(icon).not.toHaveClass('text-success');
-    });
-
-    it(`renders default ${type} completed icon correctly`, () => {
-      const { container } = render(<UnitIcon type={type} isCompleted />);
-      const icon = container.querySelector('svg');
-      expect(icon).toBeInTheDocument();
-      expect(icon).toHaveClass('text-success');
-    });
-  });
-});
--- a/src/courseware/course/sidebar/sidebars/course-outline/constants.js
+++ b/src/courseware/course/sidebar/sidebars/course-outline/constants.js
@@ -1,2 +0,0 @@
-// eslint-disable-next-line import/prefer-default-export
-export const ID = 'COURSE_OUTLINE';
--- a/src/courseware/course/sidebar/sidebars/course-outline/hooks.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/hooks.jsx
@@ -1,59 +0,0 @@
-import { useContext, useEffect, useState } from 'react';
-import { useSelector } from 'react-redux';
-
-import { useModel } from '@src/generic/model-store';
-import SidebarContext from '@src/courseware/course/sidebar/SidebarContext';
-import { getCoursewareOutlineSidebarSettings } from '@src/courseware/data/selectors';
-import { ID } from './constants';
-
-// eslint-disable-next-line import/prefer-default-export
-export const useCourseOutlineSidebar = () => {
-  const isCollapsedOutlineSidebar = window.sessionStorage.getItem('hideCourseOutlineSidebar');
-  const { enableNavigationSidebar: isEnabledSidebar } = useSelector(getCoursewareOutlineSidebarSettings);
-  const {
-    unitId,
-    courseId,
-    initialSidebar,
-    currentSidebar,
-    toggleSidebar,
-    shouldDisplayFullScreen,
-  } = useContext(SidebarContext);
-
-  const isOpenSidebar = !initialSidebar && isEnabledSidebar && !isCollapsedOutlineSidebar;
-  const [isOpen, setIsOpen] = useState(true);
-
-  const course = useModel('coursewareMeta', courseId);
-  const {
-    entranceExamEnabled,
-    entranceExamPassed,
-  } = course.entranceExamData || {};
-  const isActiveEntranceExam = entranceExamEnabled && !entranceExamPassed;
-
-  const handleToggleCollapse = () => {
-    if (currentSidebar === ID) {
-      toggleSidebar(null);
-      window.sessionStorage.setItem('hideCourseOutlineSidebar', 'true');
-    } else {
-      toggleSidebar(ID);
-      window.sessionStorage.removeItem('hideCourseOutlineSidebar');
-    }
-  };
-
-  useEffect(() => {
-    if (isOpenSidebar && currentSidebar !== ID) {
-      toggleSidebar(ID);
-    }
-  }, [initialSidebar, unitId]);
-
-  return {
-    courseId,
-    unitId,
-    currentSidebar,
-    shouldDisplayFullScreen,
-    isEnabledSidebar,
-    isOpen,
-    setIsOpen,
-    handleToggleCollapse,
-    isActiveEntranceExam,
-  };
-};
--- a/src/courseware/course/sidebar/sidebars/course-outline/icons/DashedCircleIcon.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/icons/DashedCircleIcon.jsx
@@ -1,40 +0,0 @@
-import PropTypes from 'prop-types';
-
-const DashedCircleIcon = (props) => (
-  <svg
-    width={24}
-    height={24}
-    viewBox="0 0 40 40"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    {...props}
-  >
-    <circle
-      cx="20"
-      cy="20"
-      r="15"
-      stroke="#ccc"
-      strokeWidth="3"
-      strokeDasharray="2.6 2.3"
-      fill="transparent"
-      strokeDashoffset="27"
-    />
-    <circle
-      cx="20"
-      cy="20"
-      r="15"
-      fill="transparent"
-      stroke="#0d7d4d"
-      strokeWidth="3"
-      strokeDasharray={`${props.percentage} ${props.remainder}`}
-      strokeDashoffset="29"
-    />
-  </svg>
-);
-
-DashedCircleIcon.propTypes = {
-  percentage: PropTypes.number.isRequired,
-  remainder: PropTypes.number.isRequired,
-};
-
-export default DashedCircleIcon;
--- a/src/courseware/course/sidebar/sidebars/course-outline/icons/index.js
+++ b/src/courseware/course/sidebar/sidebars/course-outline/icons/index.js
@@ -1,2 +0,0 @@
-// eslint-disable-next-line import/prefer-default-export
-export { default as DashedCircleIcon } from './DashedCircleIcon';
--- a/src/courseware/course/sidebar/sidebars/course-outline/index.js
+++ b/src/courseware/course/sidebar/sidebars/course-outline/index.js
@@ -1,3 +0,0 @@
-export { default as Sidebar } from './CourseOutlineTray';
-export { default as Trigger } from './CourseOutlineTrigger';
-export { ID } from './constants';
--- a/src/courseware/course/sidebar/sidebars/course-outline/messages.js
+++ b/src/courseware/course/sidebar/sidebars/course-outline/messages.js
@@ -1,31 +0,0 @@
-import { defineMessages } from '@edx/frontend-platform/i18n';
-
-const messages = defineMessages({
-  loading: {
-    id: 'courseOutline.loading',
-    defaultMessage: 'Loading...',
-    description: 'Screen reader text to use on the spinner while the sidebar is loading.',
-  },
-  toggleCourseOutlineTrigger: {
-    id: 'courseOutline.toggle.button',
-    defaultMessage: 'Toggle course outline tray',
-    description: 'Button for the learner to toggle the sidebar',
-  },
-  courseOutlineTitle: {
-    id: 'courseOutline.tray.title',
-    defaultMessage: 'Course Outline',
-    description: 'Title text displayed for the course outline tray',
-  },
-  completedUnit: {
-    id: 'courseOutline.completedUnit',
-    defaultMessage: 'Completed unit',
-    description: 'Text used to describe the green checkmark icon in front of a unit title',
-  },
-  incompleteUnit: {
-    id: 'courseOutline.incompleteUnit',
-    defaultMessage: 'Incomplete unit',
-    description: 'Text used to describe the gray checkmark icon in front of a unit title',
-  },
-});
-
-export default messages;
--- a/src/courseware/course/sidebar/sidebars/discussions/DiscussionsSidebar.jsx
+++ b/src/courseware/course/sidebar/sidebars/discussions/DiscussionsSidebar.jsx
@@ -1,9 +1,7 @@
-import { useContext } from 'react';
-import classNames from 'classnames';
 import { ensureConfig, getConfig } from '@edx/frontend-platform';
 import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
-
-import { useModel } from '@src/generic/model-store';
+import React, { useContext } from 'react';
+import { useModel } from '../../../../../generic/model-store';
 import SidebarBase from '../../common/SidebarBase';
 import SidebarContext from '../../SidebarContext';
 import { ID } from './DiscussionsTrigger';
@@ -16,7 +14,6 @@ const DiscussionsSidebar = ({ intl }) => {
  const {
    unitId,
    courseId,
-    shouldDisplayFullScreen,
  } = useContext(SidebarContext);
  const topic = useModel('discussionTopics', unitId);
  const discussionsUrl = `${getConfig().DISCUSSIONS_MFE_BASE_URL}/${courseId}/category/${unitId}`;
@@ -30,11 +27,8 @@ const DiscussionsSidebar = ({ intl }) => {
      title={intl.formatMessage(messages.discussionsTitle)}
      ariaLabel={intl.formatMessage(messages.discussionsTitle)}
      sidebarId={ID}
-      width="45rem"
+      width="50rem"
      showTitleBar={false}
-      className={classNames({
-        'ml-4': !shouldDisplayFullScreen,
-      })}
    >
      <iframe
        src={`${discussionsUrl}?inContextSidebar`}
--- a/src/courseware/course/sidebar/sidebars/discussions/DiscussionsTrigger.jsx
+++ b/src/courseware/course/sidebar/sidebars/discussions/DiscussionsTrigger.jsx
@@ -3,17 +3,16 @@ import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
 import { Icon } from '@openedx/paragon';
 import { QuestionAnswer } from '@openedx/paragon/icons';
 import PropTypes from 'prop-types';
-import { useContext, useEffect, useMemo } from 'react';
+import React, { useContext, useEffect, useMemo } from 'react';
 import { useDispatch } from 'react-redux';
-import { useModel } from '@src/generic/model-store';
-import { WIDGETS } from '@src/constants';
+import { useModel } from '../../../../../generic/model-store';
 import { getCourseDiscussionTopics } from '../../../../data/thunks';
 import SidebarTriggerBase from '../../common/TriggerBase';
 import SidebarContext from '../../SidebarContext';
 import messages from './messages';

 ensureConfig(['DISCUSSIONS_MFE_BASE_URL']);
-export const ID = WIDGETS.DISCUSSIONS;
+export const ID = 'DISCUSSIONS';

 const DiscussionsTrigger = ({
  intl,
--- a/src/courseware/course/sidebar/sidebars/notifications/NotificationTray.jsx
+++ b/src/courseware/course/sidebar/sidebars/notifications/NotificationTray.jsx
@@ -1,10 +1,9 @@
 import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
 import classNames from 'classnames';
-import { useContext, useEffect, useMemo } from 'react';
+import React, { useContext, useEffect, useMemo } from 'react';
 import { sendTrackEvent } from '@edx/frontend-platform/analytics';
-import { PluginSlot } from '@openedx/frontend-plugin-framework';
-import { getAuthenticatedUser } from '@edx/frontend-platform/auth';
-import { useModel } from '@src/generic/model-store';
+import { useModel } from '../../../../../generic/model-store';
+import UpgradeNotification from '../../../../../generic/upgrade-notification/UpgradeNotification';

 import messages from '../../../messages';
 import SidebarBase from '../../common/SidebarBase';
@@ -22,11 +21,17 @@ const NotificationTray = ({ intl }) => {
  const course = useModel('coursewareMeta', courseId);

  const {
+    accessExpiration,
+    contentTypeGatingEnabled,
    end,
    enrollmentEnd,
    enrollmentMode,
    enrollmentStart,
+    marketingUrl,
+    offer,
    start,
+    timeOffsetMillis,
+    userTimezone,
    verificationStatus,
  } = course;

@@ -35,10 +40,10 @@ const NotificationTray = ({ intl }) => {
    org,
    verifiedMode,
    username,
-    isStaff,
  } = useModel('courseHomeMeta', courseId);
-  const { administrator } = getAuthenticatedUser();
+
  const activeCourseModes = useMemo(() => courseModes?.map(mode => mode.slug), [courseModes]);
+
  const notificationTrayEventProperties = {
    course_end: end,
    course_modes: activeCourseModes,
@@ -52,9 +57,8 @@ const NotificationTray = ({ intl }) => {
    org_key: org,
    username,
    verification_status: verificationStatus,
-    is_staff: isStaff,
-    is_admin: administrator,
  };
+
  // After three seconds, update notificationSeen (to hide red dot)
  useEffect(() => {
    setTimeout(onNotificationSeen, 3000);
@@ -66,21 +70,25 @@ const NotificationTray = ({ intl }) => {
      title={intl.formatMessage(messages.notificationTitle)}
      ariaLabel={intl.formatMessage(messages.notificationTray)}
      sidebarId={ID}
-      width="45rem"
-      className={classNames({
-        'h-100': !verifiedMode && !shouldDisplayFullScreen,
-        'ml-4': !shouldDisplayFullScreen,
-      })}
+      width="50rem"
+      className={classNames({ 'h-100': !verifiedMode && !shouldDisplayFullScreen })}
    >
      <div>{verifiedMode
        ? (
-          <PluginSlot
-            id="notification_tray_slot"
-            pluginProps={{
-              courseId,
-              notificationCurrentState: upgradeNotificationCurrentState,
-              setNotificationCurrentState: setUpgradeNotificationCurrentState,
-            }}
+          <UpgradeNotification
+            offer={offer}
+            verifiedMode={verifiedMode}
+            accessExpiration={accessExpiration}
+            contentTypeGatingEnabled={contentTypeGatingEnabled}
+            marketingUrl={marketingUrl}
+            upsellPageName="in_course"
+            userTimezone={userTimezone}
+            shouldDisplayBorder={false}
+            timeOffsetMillis={timeOffsetMillis}
+            courseId={courseId}
+            org={org}
+            upgradeNotificationCurrentState={upgradeNotificationCurrentState}
+            setupgradeNotificationCurrentState={setUpgradeNotificationCurrentState}
          />
        ) : (
          <p className="p-3 small">{intl.formatMessage(messages.noNotificationsMessage)}</p>
--- a/src/courseware/course/sidebar/sidebars/notifications/NotificationTray.test.jsx
+++ b/src/courseware/course/sidebar/sidebars/notifications/NotificationTray.test.jsx
@@ -81,7 +81,7 @@ describe('NotificationTray', () => {
      .toBeInTheDocument();
  });

-  it('includes notification_tray_slot', async () => {
+  it('renders upgrade card', async () => {
    await fetchAndRender(
      <SidebarContext.Provider value={{
        currentSidebar: ID,
@@ -91,7 +91,15 @@ describe('NotificationTray', () => {
        <NotificationTray />
      </SidebarContext.Provider>,
    );
-    expect(screen.getByTestId('notification_tray_slot')).toBeInTheDocument();
+    const UpgradeNotification = document.querySelector('.upgrade-notification');
+
+    expect(UpgradeNotification)
+      .toBeInTheDocument();
+    expect(screen.getByRole('link', { name: 'Upgrade for $149' }))
+      .toBeInTheDocument();
+    expect(screen.queryByText('You have no new notifications at this time.'))
+      .not
+      .toBeInTheDocument();
  });

  it('renders no notifications message if no verified mode', async () => {
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Muhammad Abdullah Waheed	a4e504da84	feat: added browser logging	2024-04-18 17:44:37 +05:00
Muhammad Abdullah Waheed	26f53ccfbd	refactor: added datadog logging	2024-04-04 14:58:13 +05:00