chore(deps): bump brace-expansion

Bumps and [brace-expansion](https://github.com/juliangruber/brace-expansion). These dependencies needed to be updated together. Updates `brace-expansion` from 2.0.1 to 2.0.2 - [Release notes](https://github.com/juliangruber/brace-expansion/releases) - [Commits](https://github.com/juliangruber/brace-expansion/compare/v2.0.1...v2.0.2) Updates `brace-expansion` from 1.1.11 to 1.1.12 - [Release notes](https://github.com/juliangruber/brace-expansion/releases) - [Commits](https://github.com/juliangruber/brace-expansion/compare/v2.0.1...v2.0.2) --- updated-dependencies: - dependency-name: brace-expansion dependency-version: 2.0.2 dependency-type: indirect - dependency-name: brace-expansion dependency-version: 1.1.12 dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com>
chore: update browserslist DB (#1784 )
2025-09-01 00:48:36 +00:00 · 2025-09-01 00:46:51 +00:00 · 2025-08-25 12:54:13 -04:00 · 2025-08-25 00:41:09 +00:00 · 2025-08-21 14:21:56 -07:00 · 2025-08-21 14:09:28 -04:00
147 changed files with 3264 additions and 4196 deletions
--- a/.env
+++ b/.env
@@ -12,10 +12,12 @@ CREDIT_HELP_LINK_URL=''
 CSRF_TOKEN_API_PATH=''
 DISCOVERY_API_BASE_URL=''
 DISCUSSIONS_MFE_BASE_URL=''
+DISCOUNT_CODE_INFO_URL=''
 ECOMMERCE_BASE_URL=''
 ENABLE_JUMPNAV='true'
 ENABLE_NOTICES=''
 ENTERPRISE_LEARNER_PORTAL_HOSTNAME=''
+ENTERPRISE_LEARNER_PORTAL_URL=''
 EXAMS_BASE_URL=''
 FAVICON_URL=''
 IGNORED_ERROR_REGEX=''
@@ -49,3 +51,6 @@ TWITTER_URL=''
 USER_INFO_COOKIE_NAME=''
 OPTIMIZELY_FULL_STACK_SDK_KEY=''
 SHOW_UNGRADED_ASSIGNMENT_PROGRESS=''
+# Fallback in local style files
+PARAGON_THEME_URLS={}
+FEATURE_ENABLE_CHAT_V2_ENDPOINT=''
--- a/.env.development
+++ b/.env.development
@@ -12,10 +12,12 @@ CREDIT_HELP_LINK_URL='https://help.edx.org/edxlearner/s/article/Can-I-receive-co
 CSRF_TOKEN_API_PATH='/csrf/api/v1/token'
 DISCOVERY_API_BASE_URL='http://localhost:18381'
 DISCUSSIONS_MFE_BASE_URL='http://localhost:2002'
+DISCOUNT_CODE_INFO_URL=''
 ECOMMERCE_BASE_URL='http://localhost:18130'
 ENABLE_JUMPNAV='true'
 ENABLE_NOTICES=''
 ENTERPRISE_LEARNER_PORTAL_HOSTNAME='localhost:8734'
+ENTERPRISE_LEARNER_PORTAL_URL='http://localhost:8734'
 EXAMS_BASE_URL=''
 FAVICON_URL=https://edx-cdn.org/v3/default/favicon.ico
 IGNORED_ERROR_REGEX=''
@@ -51,3 +53,6 @@ CHAT_RESPONSE_URL='http://localhost:18000/api/learning_assistant/v1/course_id'
 PRIVACY_POLICY_URL='http://localhost:18000/privacy'
 OPTIMIZELY_FULL_STACK_SDK_KEY=''
 SHOW_UNGRADED_ASSIGNMENT_PROGRESS=''
+# Fallback in local style files
+PARAGON_THEME_URLS={}
+FEATURE_ENABLE_CHAT_V2_ENDPOINT='false'
--- a/.env.test
+++ b/.env.test
@@ -12,10 +12,12 @@ CREDIT_HELP_LINK_URL='https://help.edx.org/edxlearner/s/article/Can-I-receive-co
 CSRF_TOKEN_API_PATH='/csrf/api/v1/token'
 DISCOVERY_API_BASE_URL='http://localhost:18381'
 DISCUSSIONS_MFE_BASE_URL='http://localhost:2002'
+DISCOUNT_CODE_INFO_URL=''
 ECOMMERCE_BASE_URL='http://localhost:18130'
 ENABLE_JUMPNAV='true'
 ENABLE_NOTICES=''
 ENTERPRISE_LEARNER_PORTAL_HOSTNAME='localhost:8734'
+ENTERPRISE_LEARNER_PORTAL_URL='http://localhost:8734'
 EXAMS_BASE_URL='http://localhost:18740'
 FAVICON_URL=https://edx-cdn.org/v3/default/favicon.ico
 IGNORED_ERROR_REGEX=''
@@ -48,3 +50,5 @@ TWITTER_URL='https://twitter.com/edXOnline'
 USER_INFO_COOKIE_NAME='edx-user-info'
 PRIVACY_POLICY_URL='http://localhost:18000/privacy'
 SHOW_UNGRADED_ASSIGNMENT_PROGRESS=''
+ENTERPRISE_LEARNER_PORTAL_URL='http://localhost:Enterprise'
+FEATURE_ENABLE_CHAT_V2_ENDPOINT='false'
--- a/.github/workflows/add-issue-to-btr-project.yml
+++ b/.github/workflows/add-issue-to-btr-project.yml
@@ -0,0 +1,18 @@
+# Run the workflow that adds new tickets that are labelled "release testing"
+# to the org-wide BTR project board
+
+name: Add release testing issues to the BTR project board
+
+on:
+  issues:
+    types: [labeled]
+    # This workflow is triggered when an issue is labeled with 'release testing'.
+    # It adds the issue to the BTR project and applies the 'needs triage' label
+    # if it doesn't already have it.
+
+jobs:
+  handle-release-testing:
+    uses: openedx/.github/.github/workflows/add-issue-to-btr-project.yml@master
+    secrets:
+      GITHUB_APP_ID: ${{ secrets.GRAPHQL_AUTH_APP_ID }}
+      GITHUB_APP_PRIVATE_KEY: ${{ secrets.GRAPHQL_AUTH_APP_PEM }}
--- a/.github/workflows/validate.yml
+++ b/.github/workflows/validate.yml
@@ -10,7 +10,7 @@ jobs:
  tests:
    runs-on: ubuntu-latest
    steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v5
    - uses: actions/setup-node@v4
      with:
        node-version-file: '.nvmrc'
@@ -24,9 +24,9 @@ jobs:
    runs-on: ubuntu-latest
    needs: tests
    steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v5
    - name: Download code coverage results
-      uses: actions/download-artifact@v4
+      uses: actions/download-artifact@v5
      with:
        name: code-coverage-report
    - name: Upload coverage
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,18 +13,17 @@
        "@edx/browserslist-config": "1.5.0",
        "@edx/frontend-component-footer": "^14.6.0",
        "@edx/frontend-component-header": "^6.2.0",
-        "@edx/frontend-lib-learning-assistant": "^2.20.0",
-        "@edx/frontend-lib-special-exams": "^3.5.0",
-        "@edx/frontend-platform": "^8.3.1",
-        "@edx/openedx-atlas": "^0.6.0",
-        "@edx/react-unit-test-utils": "^4.0.0",
+        "@edx/frontend-lib-learning-assistant": "^2.23.0",
+        "@edx/frontend-lib-special-exams": "^4.0.0",
+        "@edx/frontend-platform": "^8.4.0",
+        "@edx/openedx-atlas": "^0.7.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-build": "^14.5.0",
        "@openedx/frontend-plugin-framework": "^1.7.0",
-        "@openedx/paragon": "^22.16.0",
+        "@openedx/paragon": "^23.4.5",
        "@popperjs/core": "2.11.8",
        "@reduxjs/toolkit": "1.9.7",
        "buffer": "^6.0.3",
@@ -70,6 +69,7 @@
      "version": "4.4.2",
      "resolved": "https://registry.npmjs.org/@adobe/css-tools/-/css-tools-4.4.2.tgz",
      "integrity": "sha512-baYZExFpsdkBNuvGKTKWCwKH57HRZLVtycZS05WTQNVOiXVSeAki3nU35zlRbToeMW8aHlJfyS+1C4BOv27q0A==",
+      "dev": true,
      "license": "MIT"
    },
    "node_modules/@ampproject/remapping": {
@@ -1940,6 +1940,158 @@
      "integrity": "sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==",
      "license": "MIT"
    },
+    "node_modules/@bundled-es-modules/deepmerge": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/@bundled-es-modules/deepmerge/-/deepmerge-4.3.1.tgz",
+      "integrity": "sha512-Rk453EklPUPC3NRWc3VUNI/SSUjdBaFoaQvFRmNBNtMHVtOFD5AntiWg5kEE1hqcPqedYFDzxE3ZcMYPcA195w==",
+      "license": "ISC",
+      "dependencies": {
+        "deepmerge": "^4.3.1"
+      }
+    },
+    "node_modules/@bundled-es-modules/glob": {
+      "version": "10.4.2",
+      "resolved": "https://registry.npmjs.org/@bundled-es-modules/glob/-/glob-10.4.2.tgz",
+      "integrity": "sha512-740y5ofkzydsFao5EXJrGilcIL6EFEw/cmPf2uhTw9J6G1YOhiIFjNFCHdpgEiiH5VlU3G0SARSjlFlimRRSMA==",
+      "hasInstallScript": true,
+      "license": "ISC",
+      "dependencies": {
+        "buffer": "^6.0.3",
+        "events": "^3.3.0",
+        "glob": "^10.4.2",
+        "patch-package": "^8.0.0",
+        "path": "^0.12.7",
+        "stream": "^0.0.3",
+        "string_decoder": "^1.3.0",
+        "url": "^0.11.3"
+      }
+    },
+    "node_modules/@bundled-es-modules/glob/node_modules/brace-expansion": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^1.0.0"
+      }
+    },
+    "node_modules/@bundled-es-modules/glob/node_modules/glob": {
+      "version": "10.4.5",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-10.4.5.tgz",
+      "integrity": "sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==",
+      "license": "ISC",
+      "dependencies": {
+        "foreground-child": "^3.1.0",
+        "jackspeak": "^3.1.2",
+        "minimatch": "^9.0.4",
+        "minipass": "^7.1.2",
+        "package-json-from-dist": "^1.0.0",
+        "path-scurry": "^1.11.1"
+      },
+      "bin": {
+        "glob": "dist/esm/bin.mjs"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/@bundled-es-modules/glob/node_modules/minimatch": {
+      "version": "9.0.5",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
+      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/@bundled-es-modules/memfs": {
+      "version": "4.17.0",
+      "resolved": "https://registry.npmjs.org/@bundled-es-modules/memfs/-/memfs-4.17.0.tgz",
+      "integrity": "sha512-ykdrkEmQr9BV804yd37ikXfNnvxrwYfY9Z2/EtMHFEFadEjsQXJ1zL9bVZrKNLDtm91UdUOEHso6Aweg93K6xQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "assert": "^2.1.0",
+        "buffer": "^6.0.3",
+        "events": "^3.3.0",
+        "memfs": "^4.17.0",
+        "path": "^0.12.7",
+        "stream": "^0.0.3",
+        "util": "^0.12.5"
+      }
+    },
+    "node_modules/@bundled-es-modules/memfs/node_modules/memfs": {
+      "version": "4.17.1",
+      "resolved": "https://registry.npmjs.org/memfs/-/memfs-4.17.1.tgz",
+      "integrity": "sha512-thuTRd7F4m4dReCIy7vv4eNYnU6XI/tHMLSMMHLiortw/Y0QxqKtinG523U2aerzwYWGi606oBP4oMPy4+edag==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@jsonjoy.com/json-pack": "^1.0.3",
+        "@jsonjoy.com/util": "^1.3.0",
+        "tree-dump": "^1.0.1",
+        "tslib": "^2.0.0"
+      },
+      "engines": {
+        "node": ">= 4.0.0"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/streamich"
+      }
+    },
+    "node_modules/@bundled-es-modules/postcss-calc-ast-parser": {
+      "version": "0.1.6",
+      "resolved": "https://registry.npmjs.org/@bundled-es-modules/postcss-calc-ast-parser/-/postcss-calc-ast-parser-0.1.6.tgz",
+      "integrity": "sha512-y65TM5zF+uaxo9OeekJ3rxwTINlQvrkbZLogYvQYVoLtxm4xEiHfZ7e/MyiWbStYyWZVZkVqsaVU6F4SUK5XUA==",
+      "license": "ISC",
+      "dependencies": {
+        "postcss-calc-ast-parser": "^0.1.4"
+      }
+    },
+    "node_modules/@chevrotain/cst-dts-gen": {
+      "version": "11.0.3",
+      "resolved": "https://registry.npmjs.org/@chevrotain/cst-dts-gen/-/cst-dts-gen-11.0.3.tgz",
+      "integrity": "sha512-BvIKpRLeS/8UbfxXxgC33xOumsacaeCKAjAeLyOn7Pcp95HiRbrpl14S+9vaZLolnbssPIUuiUd8IvgkRyt6NQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@chevrotain/gast": "11.0.3",
+        "@chevrotain/types": "11.0.3",
+        "lodash-es": "4.17.21"
+      }
+    },
+    "node_modules/@chevrotain/gast": {
+      "version": "11.0.3",
+      "resolved": "https://registry.npmjs.org/@chevrotain/gast/-/gast-11.0.3.tgz",
+      "integrity": "sha512-+qNfcoNk70PyS/uxmj3li5NiECO+2YKZZQMbmjTqRI3Qchu8Hig/Q9vgkHpI3alNjr7M+a2St5pw5w5F6NL5/Q==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@chevrotain/types": "11.0.3",
+        "lodash-es": "4.17.21"
+      }
+    },
+    "node_modules/@chevrotain/regexp-to-ast": {
+      "version": "11.0.3",
+      "resolved": "https://registry.npmjs.org/@chevrotain/regexp-to-ast/-/regexp-to-ast-11.0.3.tgz",
+      "integrity": "sha512-1fMHaBZxLFvWI067AVbGJav1eRY7N8DDvYCTwGBiE/ytKBgP8azTdgyrKyWZ9Mfh09eHWb5PgTSO8wi7U824RA==",
+      "license": "Apache-2.0"
+    },
+    "node_modules/@chevrotain/types": {
+      "version": "11.0.3",
+      "resolved": "https://registry.npmjs.org/@chevrotain/types/-/types-11.0.3.tgz",
+      "integrity": "sha512-gsiM3G8b58kZC2HaWR50gu6Y1440cHiJ+i3JUvcp/35JchYejb2+5MVeJK0iKThYpAa/P2PYFV4hoi44HD+aHQ==",
+      "license": "Apache-2.0"
+    },
+    "node_modules/@chevrotain/utils": {
+      "version": "11.0.3",
+      "resolved": "https://registry.npmjs.org/@chevrotain/utils/-/utils-11.0.3.tgz",
+      "integrity": "sha512-YslZMgtJUyuMbZ+aKvfF3x1f5liK4mWNxghFRv7jqRR9C3R3fAOGTTKvxXDa2Y1s9zSbcpuO0cAxDYsc9SrXoQ==",
+      "license": "Apache-2.0"
+    },
    "node_modules/@cospired/i18n-iso-languages": {
      "version": "4.2.0",
      "resolved": "https://registry.npmjs.org/@cospired/i18n-iso-languages/-/i18n-iso-languages-4.2.0.tgz",
@@ -2076,9 +2228,9 @@
      }
    },
    "node_modules/@edx/frontend-component-footer": {
-      "version": "14.6.0",
-      "resolved": "https://registry.npmjs.org/@edx/frontend-component-footer/-/frontend-component-footer-14.6.0.tgz",
-      "integrity": "sha512-cgRhom6W/WErQ9yvLmfgB6ANBs+rBDLOH73NcvJIhfwWgAg67q+MLUscIbcX9N/9Yykk+kb7Ytr3CDefiKS7HA==",
+      "version": "14.9.0",
+      "resolved": "https://registry.npmjs.org/@edx/frontend-component-footer/-/frontend-component-footer-14.9.0.tgz",
+      "integrity": "sha512-eI3ffSvAKDoP1K/vBuQrCL7ca0U7hJqRlGjBq62dSAlsgOS59t+9T1ZkIWCSoRUzHLv4fS+taiBeCsIQVV356Q==",
      "license": "AGPL-3.0",
      "dependencies": {
        "@fortawesome/fontawesome-svg-core": "6.7.2",
@@ -2261,10 +2413,9 @@
      }
    },
    "node_modules/@edx/frontend-lib-learning-assistant": {
-      "version": "2.21.0",
-      "resolved": "https://registry.npmjs.org/@edx/frontend-lib-learning-assistant/-/frontend-lib-learning-assistant-2.21.0.tgz",
-      "integrity": "sha512-CUzPCQaBgXi6E1kvY0nyBSVFu8RUGpwKH4V0p8ZuysyHyRHpA+339b+gEi9FvVBMP/X4IxZHsZhi7nphlr43Iw==",
-      "license": "AGPL-3.0",
+      "version": "2.23.0",
+      "resolved": "https://registry.npmjs.org/@edx/frontend-lib-learning-assistant/-/frontend-lib-learning-assistant-2.23.0.tgz",
+      "integrity": "sha512-ajr213/hGH19iyh4y868AN212YsxLcVeSoGg9BXvltp5x9GM7k+LZK8pMEs2nRpGJ6A8QFm0wgrOYtYEFmCglQ==",
      "dependencies": {
        "@edx/brand": "npm:@openedx/brand-openedx@^1.2.3",
        "@optimizely/react-sdk": "^2.9.2",
@@ -2287,9 +2438,9 @@
      }
    },
    "node_modules/@edx/frontend-lib-special-exams": {
-      "version": "3.5.0",
-      "resolved": "https://registry.npmjs.org/@edx/frontend-lib-special-exams/-/frontend-lib-special-exams-3.5.0.tgz",
-      "integrity": "sha512-lRKD3K+XAuoKAaxbZxb7QLTWkSlV9yIy08XflYoHh/weClesVTETU3+NtJ5YRsC/kYHZrzSYIpMZnBnkKTGTww==",
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@edx/frontend-lib-special-exams/-/frontend-lib-special-exams-4.0.0.tgz",
+      "integrity": "sha512-mJdrxebdKO9NxDFkQZ1vyWVUvWCk393pIVHJyz9vH42Kvn08LC5db8/gYk37srCfsA4Dl78pMLa408CoT14JMA==",
      "license": "AGPL-3.0",
      "dependencies": {
        "@fortawesome/fontawesome-svg-core": "1.2.34",
@@ -2386,16 +2537,16 @@
      }
    },
    "node_modules/@edx/frontend-platform": {
-      "version": "8.3.4",
-      "resolved": "https://registry.npmjs.org/@edx/frontend-platform/-/frontend-platform-8.3.4.tgz",
-      "integrity": "sha512-V3XtTo3KP8QSmId+Vvi4+qzpOVkxvTMNA6jH/i3Bfz+/jHjHBRnmp/Cc2pjTxiTgGNoKX4D1twiZkOBO+kWw1Q==",
+      "version": "8.4.0",
+      "resolved": "https://registry.npmjs.org/@edx/frontend-platform/-/frontend-platform-8.4.0.tgz",
+      "integrity": "sha512-toWMU7qVx56f5bLk6/Sl5WWqlKtGp602qDs22JYp5r2VBp5F/nzcrpXXWC925/kH0TP5hI2OMolmLq6n2N8a4Q==",
      "license": "AGPL-3.0",
      "dependencies": {
        "@cospired/i18n-iso-languages": "4.2.0",
        "@formatjs/intl-pluralrules": "4.3.3",
        "@formatjs/intl-relativetimeformat": "10.0.1",
-        "axios": "1.8.4",
-        "axios-cache-interceptor": "1.6.2",
+        "axios": "1.9.0",
+        "axios-cache-interceptor": "1.8.0",
        "form-urlencoded": "4.1.4",
        "glob": "7.2.3",
        "history": "4.10.1",
@@ -2424,6 +2575,12 @@
        "react-redux": "^7.1.1 || ^8.1.1",
        "react-router-dom": "^6.0.0",
        "redux": "^4.0.4"
+      },
+      "peerDependenciesMeta": {
+        "@openedx/frontend-build": {
+          "optional": true,
+          "reason": "This package is only a peer dependency to ensure using a minimum compatible version that provides env.config and PARAGON_THEME support. It is not needed at runtime, and may be omitted with `--omit=optional`."
+        }
      }
    },
    "node_modules/@edx/new-relic-source-map-webpack-plugin": {
@@ -2436,38 +2593,14 @@
      }
    },
    "node_modules/@edx/openedx-atlas": {
-      "version": "0.6.2",
-      "resolved": "https://registry.npmjs.org/@edx/openedx-atlas/-/openedx-atlas-0.6.2.tgz",
-      "integrity": "sha512-28Q8vzJDMS4wUxdkbIUBQpzWJ3HTdMaGlaEhFjrVGfuZkh++1AG6Tn/7FMD88cegalYAkphu530VQCHEkMZQhw==",
+      "version": "0.7.0",
+      "resolved": "https://registry.npmjs.org/@edx/openedx-atlas/-/openedx-atlas-0.7.0.tgz",
+      "integrity": "sha512-jqv0IV1pHsSn9+RO8Rdsr8jm3SOd84CCzzmo2QC9yvh1MK1+p4YDURQLpmmgKJ0JzE5Cb6ImhnNL/ogpJ2wetQ==",
      "license": "AGPL-3.0",
      "bin": {
        "atlas": "atlas"
      }
    },
-    "node_modules/@edx/react-unit-test-utils": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/@edx/react-unit-test-utils/-/react-unit-test-utils-4.0.0.tgz",
-      "integrity": "sha512-QlVYhYD9L2bzx1eAtf8BbCJr00ek9rrHrG+/pW2bVSt+t0uvKHQpX1CNdMrDePv18DsMeC7IOB00t8ZIn4mi7w==",
-      "license": "AGPL-3.0",
-      "dependencies": {
-        "@edx/browserslist-config": "^1.1.1",
-        "@reduxjs/toolkit": "^1.5.1",
-        "@testing-library/dom": "^10.4.0",
-        "@testing-library/jest-dom": "^6.6.3",
-        "@testing-library/react": "^16.2.0",
-        "classnames": "^2.2.6",
-        "core-js": "3.6.5",
-        "lodash": "^4.17.21",
-        "react-dev-utils": "^12.0.1",
-        "react-test-renderer": "^18.3.1"
-      },
-      "peerDependencies": {
-        "@edx/frontend-platform": "^8.3.1",
-        "@openedx/frontend-build": "^14.3.0",
-        "@openedx/paragon": "^22.0.0 || ^23.0.0",
-        "react": "^18.0.0"
-      }
-    },
    "node_modules/@edx/reactifex": {
      "version": "2.2.0",
      "resolved": "https://registry.npmjs.org/@edx/reactifex/-/reactifex-2.2.0.tgz",
@@ -3154,6 +3287,102 @@
      "deprecated": "Use @eslint/object-schema instead",
      "license": "BSD-3-Clause"
    },
+    "node_modules/@isaacs/cliui": {
+      "version": "8.0.2",
+      "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
+      "integrity": "sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==",
+      "license": "ISC",
+      "dependencies": {
+        "string-width": "^5.1.2",
+        "string-width-cjs": "npm:string-width@^4.2.0",
+        "strip-ansi": "^7.0.1",
+        "strip-ansi-cjs": "npm:strip-ansi@^6.0.1",
+        "wrap-ansi": "^8.1.0",
+        "wrap-ansi-cjs": "npm:wrap-ansi@^7.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@isaacs/cliui/node_modules/ansi-regex": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.1.0.tgz",
+      "integrity": "sha512-7HSX4QQb4CspciLpVFwyRe79O3xsIZDDLER21kERQ71oaPodF8jL725AgJMFAYbooIqolJoRLuM81SpeUkpkvA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-regex?sponsor=1"
+      }
+    },
+    "node_modules/@isaacs/cliui/node_modules/ansi-styles": {
+      "version": "6.2.1",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.1.tgz",
+      "integrity": "sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/@isaacs/cliui/node_modules/emoji-regex": {
+      "version": "9.2.2",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-9.2.2.tgz",
+      "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
+      "license": "MIT"
+    },
+    "node_modules/@isaacs/cliui/node_modules/string-width": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz",
+      "integrity": "sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==",
+      "license": "MIT",
+      "dependencies": {
+        "eastasianwidth": "^0.2.0",
+        "emoji-regex": "^9.2.2",
+        "strip-ansi": "^7.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@isaacs/cliui/node_modules/strip-ansi": {
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.0.tgz",
+      "integrity": "sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/strip-ansi?sponsor=1"
+      }
+    },
+    "node_modules/@isaacs/cliui/node_modules/wrap-ansi": {
+      "version": "8.1.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-8.1.0.tgz",
+      "integrity": "sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^6.1.0",
+        "string-width": "^5.0.1",
+        "strip-ansi": "^7.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
    "node_modules/@istanbuljs/load-nyc-config": {
      "version": "1.1.0",
      "resolved": "https://registry.npmjs.org/@istanbuljs/load-nyc-config/-/load-nyc-config-1.1.0.tgz",
@@ -3556,6 +3785,60 @@
        "@jridgewell/sourcemap-codec": "^1.4.14"
      }
    },
+    "node_modules/@jsonjoy.com/base64": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/@jsonjoy.com/base64/-/base64-1.1.2.tgz",
+      "integrity": "sha512-q6XAnWQDIMA3+FTiOYajoYqySkO+JSat0ytXGSuRdq9uXE7o92gzuQwQM14xaCRlBLGq3v5miDGC4vkVTn54xA==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=10.0"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/streamich"
+      },
+      "peerDependencies": {
+        "tslib": "2"
+      }
+    },
+    "node_modules/@jsonjoy.com/json-pack": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/@jsonjoy.com/json-pack/-/json-pack-1.2.0.tgz",
+      "integrity": "sha512-io1zEbbYcElht3tdlqEOFxZ0dMTYrHz9iMf0gqn1pPjZFTCgM5R4R5IMA20Chb2UPYYsxjzs8CgZ7Nb5n2K2rA==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@jsonjoy.com/base64": "^1.1.1",
+        "@jsonjoy.com/util": "^1.1.2",
+        "hyperdyperid": "^1.2.0",
+        "thingies": "^1.20.0"
+      },
+      "engines": {
+        "node": ">=10.0"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/streamich"
+      },
+      "peerDependencies": {
+        "tslib": "2"
+      }
+    },
+    "node_modules/@jsonjoy.com/util": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/@jsonjoy.com/util/-/util-1.6.0.tgz",
+      "integrity": "sha512-sw/RMbehRhN68WRtcKCpQOPfnH6lLP4GJfqzi3iYej8tnzpZUDr6UkZYJjcjjC0FWEJOJbyM3PTIwxucUmDG2A==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=10.0"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/streamich"
+      },
+      "peerDependencies": {
+        "tslib": "2"
+      }
+    },
    "node_modules/@leichtgewicht/ip-codec": {
      "version": "2.0.5",
      "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.5.tgz",
@@ -3708,9 +3991,9 @@
      }
    },
    "node_modules/@openedx/frontend-build": {
-      "version": "14.5.0",
-      "resolved": "https://registry.npmjs.org/@openedx/frontend-build/-/frontend-build-14.5.0.tgz",
-      "integrity": "sha512-HY0PdXvXBxrvJHj8HsRA+VNCHDePENFhqOIvbSz9Ke7HDwHpfDjg2CeKk41aU/8iTyj3eESfPwKQr5fTE0A3Ww==",
+      "version": "14.6.1",
+      "resolved": "https://registry.npmjs.org/@openedx/frontend-build/-/frontend-build-14.6.1.tgz",
+      "integrity": "sha512-HPswCfxThP0F92fmKqOetQ+E7HNiXDmOE+vHkfrpdKYNUj6Sn+7jaBICn8pNfif8uq4tF2ZGRnAgfUphry2ORQ==",
      "license": "AGPL-3.0",
      "dependencies": {
        "@babel/cli": "7.24.8",
@@ -3899,9 +4182,9 @@
      }
    },
    "node_modules/@openedx/frontend-build/node_modules/postcss-loader/node_modules/semver": {
-      "version": "7.7.1",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.1.tgz",
-      "integrity": "sha512-hlq8tAfn0m/61p4BVRcPzIGr6LKiMwo4VM6dGi6pt4qcRkmNzTcWq6eCEjEh+qXjkMDvPlOFFSGwQjoEa6gyMA==",
+      "version": "7.7.2",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.2.tgz",
+      "integrity": "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==",
      "license": "ISC",
      "bin": {
        "semver": "bin/semver.js"
@@ -4048,9 +4331,9 @@
      }
    },
    "node_modules/@openedx/frontend-build/node_modules/ts-jest/node_modules/semver": {
-      "version": "7.7.1",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.1.tgz",
-      "integrity": "sha512-hlq8tAfn0m/61p4BVRcPzIGr6LKiMwo4VM6dGi6pt4qcRkmNzTcWq6eCEjEh+qXjkMDvPlOFFSGwQjoEa6gyMA==",
+      "version": "7.7.2",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.2.tgz",
+      "integrity": "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==",
      "license": "ISC",
      "bin": {
        "semver": "bin/semver.js"
@@ -4137,9 +4420,9 @@
      }
    },
    "node_modules/@openedx/paragon": {
-      "version": "22.17.0",
-      "resolved": "https://registry.npmjs.org/@openedx/paragon/-/paragon-22.17.0.tgz",
-      "integrity": "sha512-MzOLQ0myaOErwumPJwxVZXTw7zJKrARtu4YMSaISF5Sz6pE1/dYz9qfRcqaraYRcJGNdbPRzOG0v3iqbZo1uHQ==",
+      "version": "23.4.5",
+      "resolved": "https://registry.npmjs.org/@openedx/paragon/-/paragon-23.4.5.tgz",
+      "integrity": "sha512-baBTZDO6hdCjI+Jj3oSQaz5GkFTR2TEs94pPMOls7bc/Fsv4zQIN8xDPo4NzAVo/2+3eSuEzUz3xzBeb+94rtw==",
      "license": "Apache-2.0",
      "workspaces": [
        "example",
@@ -4149,20 +4432,32 @@
        "dependent-usage-analyzer"
      ],
      "dependencies": {
-        "@fortawesome/fontawesome-svg-core": "^6.1.1",
-        "@fortawesome/react-fontawesome": "^0.1.18",
        "@popperjs/core": "^2.11.4",
+        "@tokens-studio/sd-transforms": "^1.2.4",
+        "axios": "^0.27.2",
        "bootstrap": "^4.6.2",
        "chalk": "^4.1.2",
        "child_process": "^1.0.2",
+        "chroma-js": "^2.4.2",
        "classnames": "^2.3.1",
+        "cli-progress": "^3.12.0",
+        "commander": "^9.4.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",
+        "js-toml": "^1.0.0",
        "lodash.uniqby": "^4.7.0",
+        "log-update": "^4.0.0",
        "mailto-link": "^2.0.0",
+        "minimist": "^1.2.8",
+        "ora": "^5.4.1",
+        "postcss": "^8.4.21",
+        "postcss-combine-duplicated-selectors": "^10.0.3",
+        "postcss-custom-media": "^9.1.2",
+        "postcss-import": "^15.1.0",
+        "postcss-map": "^0.11.0",
+        "postcss-minify": "^1.1.0",
        "prop-types": "^15.8.1",
        "react-bootstrap": "^1.6.5",
        "react-colorful": "^5.6.1",
@@ -4175,6 +4470,8 @@
        "react-responsive": "^8.2.0",
        "react-table": "^7.7.0",
        "react-transition-group": "^4.4.2",
+        "sass": "^1.58.3",
+        "style-dictionary": "^4.3.2",
        "tabbable": "^5.3.3",
        "uncontrollable": "^7.2.1",
        "uuid": "^9.0.0"
@@ -4188,15 +4485,34 @@
        "react-intl": "^5.25.1 || ^6.4.0"
      }
    },
+    "node_modules/@openedx/paragon/node_modules/axios": {
+      "version": "0.27.2",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-0.27.2.tgz",
+      "integrity": "sha512-t+yRIyySRTp/wua5xEr+z1q60QmLq8ABsS5O9Me1AsE5dfKqgnCFzwiCZZ/cGNd1lq4/7akDWMxdhVlucjmnOQ==",
+      "license": "MIT",
+      "dependencies": {
+        "follow-redirects": "^1.14.9",
+        "form-data": "^4.0.0"
+      }
+    },
    "node_modules/@openedx/paragon/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==",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
      "license": "MIT",
      "dependencies": {
        "balanced-match": "^1.0.0"
      }
    },
+    "node_modules/@openedx/paragon/node_modules/commander": {
+      "version": "9.5.0",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-9.5.0.tgz",
+      "integrity": "sha512-KRs7WVDKg86PWiuAqhDrAQnTXZKraVcCc6vFdL14qrZ/DcWwuRo7VoiYXalXO7S5GKpqYiVEwCbgFDfxNHKJBQ==",
+      "license": "MIT",
+      "engines": {
+        "node": "^12.20.0 || >=14"
+      }
+    },
    "node_modules/@openedx/paragon/node_modules/glob": {
      "version": "8.1.0",
      "resolved": "https://registry.npmjs.org/glob/-/glob-8.1.0.tgz",
@@ -4229,6 +4545,34 @@
        "node": ">=10"
      }
    },
+    "node_modules/@openedx/paragon/node_modules/postcss-custom-media": {
+      "version": "9.1.5",
+      "resolved": "https://registry.npmjs.org/postcss-custom-media/-/postcss-custom-media-9.1.5.tgz",
+      "integrity": "sha512-GStyWMz7Qbo/Gtw1xVspzVSX8eipgNg4lpsO3CAeY4/A1mzok+RV6MCv3fg62trWijh/lYEj6vps4o8JcBBpDA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "@csstools/cascade-layer-name-parser": "^1.0.2",
+        "@csstools/css-parser-algorithms": "^2.2.0",
+        "@csstools/css-tokenizer": "^2.1.1",
+        "@csstools/media-query-list-parser": "^2.1.1"
+      },
+      "engines": {
+        "node": "^14 || ^16 || >=18"
+      },
+      "peerDependencies": {
+        "postcss": "^8.4"
+      }
+    },
    "node_modules/@optimizely/js-sdk-logging": {
      "version": "0.3.1",
      "resolved": "https://registry.npmjs.org/@optimizely/js-sdk-logging/-/js-sdk-logging-0.3.1.tgz",
@@ -4731,6 +5075,16 @@
        "url": "https://opencollective.com/parcel"
      }
    },
+    "node_modules/@pkgjs/parseargs": {
+      "version": "0.11.0",
+      "resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
+      "integrity": "sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==",
+      "license": "MIT",
+      "optional": true,
+      "engines": {
+        "node": ">=14"
+      }
+    },
    "node_modules/@pmmmwh/react-refresh-webpack-plugin": {
      "version": "0.5.15",
      "resolved": "https://registry.npmjs.org/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.5.15.tgz",
@@ -5173,7 +5527,9 @@
      "version": "10.4.0",
      "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-10.4.0.tgz",
      "integrity": "sha512-pemlzrSESWbdAloYml3bAJMEfNh1Z7EduzqPKprCH5S341frlpYnUEW0H72dLxa6IsYr+mPno20GiSm+h9dEdQ==",
+      "dev": true,
      "license": "MIT",
+      "peer": true,
      "dependencies": {
        "@babel/code-frame": "^7.10.4",
        "@babel/runtime": "^7.12.5",
@@ -5192,6 +5548,7 @@
      "version": "6.6.3",
      "resolved": "https://registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-6.6.3.tgz",
      "integrity": "sha512-IteBhl4XqYNkM54f4ejhLRJiZNqcSCoXUOG2CPK7qbD322KjQozM4kHQOfkG2oln9b9HTYqs+Sae8vBATubxxA==",
+      "dev": true,
      "license": "MIT",
      "dependencies": {
        "@adobe/css-tools": "^4.4.0",
@@ -5212,6 +5569,7 @@
      "version": "3.0.0",
      "resolved": "https://registry.npmjs.org/chalk/-/chalk-3.0.0.tgz",
      "integrity": "sha512-4D3B6Wf41KOYRFdszmDqMCGq5VV/uMAB273JILmO+3jAlh8X4qDtdtgCR3fxtbLEMzSx22QdhnDcJvu2u1fVwg==",
+      "dev": true,
      "license": "MIT",
      "dependencies": {
        "ansi-styles": "^4.1.0",
@@ -5225,12 +5583,14 @@
      "version": "0.6.3",
      "resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.6.3.tgz",
      "integrity": "sha512-7ZgogeTnjuHbo+ct10G9Ffp0mif17idi0IyWNVA/wcwcm7NPOD/WEHVP3n7n3MhXqxoIYm8d6MuZohYWIZ4T3w==",
+      "dev": true,
      "license": "MIT"
    },
    "node_modules/@testing-library/react": {
      "version": "16.3.0",
      "resolved": "https://registry.npmjs.org/@testing-library/react/-/react-16.3.0.tgz",
      "integrity": "sha512-kFSyxiEDwv1WLl2fgsq6pPBbw5aWKrsY2/noi1Id0TK0UParSF62oFQFGHXIyaG4pp2tEub/Zlel+fjjZILDsw==",
+      "dev": true,
      "license": "MIT",
      "dependencies": {
        "@babel/runtime": "^7.12.5"
@@ -5268,6 +5628,32 @@
        "@testing-library/dom": ">=7.21.4"
      }
    },
+    "node_modules/@tokens-studio/sd-transforms": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/@tokens-studio/sd-transforms/-/sd-transforms-1.3.0.tgz",
+      "integrity": "sha512-zVbiYjTGWpSuwzZwiuvcWf79CQEcTMKSxrOaQJ0zHXFxEmrpETWeIRxv2IO8rtMos/cS8mvnDwPngoHQOMs1SA==",
+      "license": "MIT",
+      "dependencies": {
+        "@bundled-es-modules/deepmerge": "^4.3.1",
+        "@bundled-es-modules/postcss-calc-ast-parser": "^0.1.6",
+        "@tokens-studio/types": "^0.5.1",
+        "colorjs.io": "^0.5.2",
+        "expr-eval-fork": "^2.0.2",
+        "is-mergeable-object": "^1.1.1"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      },
+      "peerDependencies": {
+        "style-dictionary": "^4.3.0 || ^5.0.0-rc.0"
+      }
+    },
+    "node_modules/@tokens-studio/types": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/@tokens-studio/types/-/types-0.5.2.tgz",
+      "integrity": "sha512-rzMcZP0bj2E5jaa7Fj0LGgYHysoCrbrxILVbT0ohsCUH5uCHY/u6J7Qw/TE0n6gR9Js/c9ZO9T8mOoz0HdLMbA==",
+      "license": "MIT"
+    },
    "node_modules/@tootallnate/once": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/@tootallnate/once/-/once-2.0.0.tgz",
@@ -5300,7 +5686,9 @@
      "version": "5.0.4",
      "resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.4.tgz",
      "integrity": "sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==",
-      "license": "MIT"
+      "dev": true,
+      "license": "MIT",
+      "peer": true
    },
    "node_modules/@types/babel__core": {
      "version": "7.20.5",
@@ -6504,6 +6892,23 @@
      "integrity": "sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ==",
      "license": "Apache-2.0"
    },
+    "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==",
+      "license": "BSD-2-Clause"
+    },
+    "node_modules/@zip.js/zip.js": {
+      "version": "2.7.60",
+      "resolved": "https://registry.npmjs.org/@zip.js/zip.js/-/zip.js-2.7.60.tgz",
+      "integrity": "sha512-vA3rLyqdxBrVo1FWSsbyoecaqWTV+vgPRf0QKeM7kVDG0r+lHUqd7zQDv1TO9k4BcAoNzNDSNrrel24Mk6addA==",
+      "license": "BSD-3-Clause",
+      "engines": {
+        "bun": ">=0.7.0",
+        "deno": ">=1.0.0",
+        "node": ">=16.5.0"
+      }
+    },
    "node_modules/abab": {
      "version": "2.0.6",
      "resolved": "https://registry.npmjs.org/abab/-/abab-2.0.6.tgz",
@@ -6955,6 +7360,19 @@
      "integrity": "sha512-BSHWgDSAiKs50o2Re8ppvp3seVHXSRM44cdSsT9FfNEUUZLOGWVCsiWaRPWM1Znn+mqZ1OfVZ3z3DWEzSp7hRA==",
      "license": "MIT"
    },
+    "node_modules/assert": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/assert/-/assert-2.1.0.tgz",
+      "integrity": "sha512-eLHpSK/Y4nhMJ07gDaAzoX/XAKS8PSaojml3M0DM4JpV1LAi5JOJ/p6H/XWrl8L+DzVEvVCW1z3vWAaB9oTsQw==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.2",
+        "is-nan": "^1.3.2",
+        "object-is": "^1.1.5",
+        "object.assign": "^4.1.4",
+        "util": "^0.12.5"
+      }
+    },
    "node_modules/assert-ok": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/assert-ok/-/assert-ok-1.0.0.tgz",
@@ -6967,6 +7385,15 @@
      "integrity": "sha512-eBvWn1lvIApYMhzQMsu9ciLfkBY499mFZlNqG+/9WR7PVlroQw0vG30cOQQbaKz3sCEc44TAOu2ykzqXSNnwag==",
      "license": "ISC"
    },
+    "node_modules/astral-regex": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/astral-regex/-/astral-regex-2.0.0.tgz",
+      "integrity": "sha512-Z7tMw1ytTXt5jqMcOP+OQteU1VuNK9Y02uuJtKQ1Sv69jXQKKg5cibLwGJow8yzZP+eAc18EmLGPal0bp36rvQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
    "node_modules/async": {
      "version": "3.2.6",
      "resolved": "https://registry.npmjs.org/async/-/async-3.2.6.tgz",
@@ -7078,9 +7505,9 @@
      }
    },
    "node_modules/axios": {
-      "version": "1.8.4",
-      "resolved": "https://registry.npmjs.org/axios/-/axios-1.8.4.tgz",
-      "integrity": "sha512-eBSYY4Y68NNlHbHBMdeDmKNtDgXWhQsJcGqzO3iLUM0GraQFSS9cVgPX5I9b3lbdFKyYoAEGAZF1DwhTaljNAw==",
+      "version": "1.9.0",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-1.9.0.tgz",
+      "integrity": "sha512-re4CqKTJaURpzbLHtIi6XpDv20/CnpXOtjRY5/CU32L8gU8ek9UIivcfvSWvmKEngmVbrUtPpdDwWDWL7DNHvg==",
      "license": "MIT",
      "dependencies": {
        "follow-redirects": "^1.15.6",
@@ -7089,9 +7516,9 @@
      }
    },
    "node_modules/axios-cache-interceptor": {
-      "version": "1.6.2",
-      "resolved": "https://registry.npmjs.org/axios-cache-interceptor/-/axios-cache-interceptor-1.6.2.tgz",
-      "integrity": "sha512-YLbAODIHZZIcD4b3WYFVQOa5W2TY/WnJ6sBHqAg6Z+hx+RVj8/OcjQyRopO6awn7/kOkGL5X9TP16AucnlJ/lw==",
+      "version": "1.8.0",
+      "resolved": "https://registry.npmjs.org/axios-cache-interceptor/-/axios-cache-interceptor-1.8.0.tgz",
+      "integrity": "sha512-cTNnPGJyQkxnWp0EWvE3NRvgURU5cWw/Qx3dIhXyHSM4Ip0c7EEe0I3an0Jwa549m1CAOg57ibj27YRNLmQCcg==",
      "license": "MIT",
      "dependencies": {
        "cache-parser": "1.2.5",
@@ -7627,9 +8054,9 @@
      }
    },
    "node_modules/brace-expansion": {
-      "version": "1.1.11",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
-      "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
+      "version": "1.1.12",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz",
+      "integrity": "sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==",
      "license": "MIT",
      "dependencies": {
        "balanced-match": "^1.0.0",
@@ -7884,9 +8311,9 @@
      }
    },
    "node_modules/caniuse-lite": {
-      "version": "1.0.30001715",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001715.tgz",
-      "integrity": "sha512-7ptkFGMm2OAOgvZpwgA4yjQ5SQbrNVGdRjzH0pBdy1Fasvcr+KAeECmbCAECzTuDuoX0FCY8KzUxjf9+9kfZEw==",
+      "version": "1.0.30001739",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001739.tgz",
+      "integrity": "sha512-y+j60d6ulelrNSwpPyrHdl+9mJnQzHBr08xm48Qno0nSk4h3Qojh+ziv2qE6rXf4k3tadF4o1J/1tAbVm1NtnA==",
      "funding": [
        {
          "type": "opencollective",
@@ -7934,6 +8361,12 @@
        "url": "https://github.com/chalk/chalk?sponsor=1"
      }
    },
+    "node_modules/change-case": {
+      "version": "5.4.4",
+      "resolved": "https://registry.npmjs.org/change-case/-/change-case-5.4.4.tgz",
+      "integrity": "sha512-HRQyTk2/YPEkt9TnUPbOpr64Uw3KOicFWPVBb+xiHvd6eBx/qPr9xqfBFDT8P2vWsvvz4jbEkfDe71W3VyNu2w==",
+      "license": "MIT"
+    },
    "node_modules/char-regex": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/char-regex/-/char-regex-1.0.2.tgz",
@@ -8077,6 +8510,20 @@
        "boolbase": "~1.0.0"
      }
    },
+    "node_modules/chevrotain": {
+      "version": "11.0.3",
+      "resolved": "https://registry.npmjs.org/chevrotain/-/chevrotain-11.0.3.tgz",
+      "integrity": "sha512-ci2iJH6LeIkvP9eJW6gpueU8cnZhv85ELY8w8WiFtNjMHA5ad6pQLaJo9mEly/9qUyCpvqX8/POVUTf18/HFdw==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@chevrotain/cst-dts-gen": "11.0.3",
+        "@chevrotain/gast": "11.0.3",
+        "@chevrotain/regexp-to-ast": "11.0.3",
+        "@chevrotain/types": "11.0.3",
+        "@chevrotain/utils": "11.0.3",
+        "lodash-es": "4.17.21"
+      }
+    },
    "node_modules/child_process": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/child_process/-/child_process-1.0.2.tgz",
@@ -8113,6 +8560,12 @@
      "integrity": "sha512-jJ0bqzaylmJtVnNgzTeSOs8DPavpbYgEr/b0YL8/2GO3xJEhInFmhKMUnEJQjZumK7KXGFhUy89PrsJWlakBVg==",
      "license": "ISC"
    },
+    "node_modules/chroma-js": {
+      "version": "2.6.0",
+      "resolved": "https://registry.npmjs.org/chroma-js/-/chroma-js-2.6.0.tgz",
+      "integrity": "sha512-BLHvCB9s8Z1EV4ethr6xnkl/P2YRFOGqfgvuMG/MyCbZPrTA+NeiByY6XvgF0zP4/2deU2CXnWyMa3zu1LqQ3A==",
+      "license": "(BSD-3-Clause AND Apache-2.0)"
+    },
    "node_modules/chrome-trace-event": {
      "version": "1.0.4",
      "resolved": "https://registry.npmjs.org/chrome-trace-event/-/chrome-trace-event-1.0.4.tgz",
@@ -8204,6 +8657,18 @@
        "node": ">=8"
      }
    },
+    "node_modules/cli-progress": {
+      "version": "3.12.0",
+      "resolved": "https://registry.npmjs.org/cli-progress/-/cli-progress-3.12.0.tgz",
+      "integrity": "sha512-tRkV3HJ1ASwm19THiiLIXLO7Im7wlTuKnvkYaTkyoAPefqjNg7W7DHKUlGRxy9vxDvbyCYQkQozvptuMkGCg8A==",
+      "license": "MIT",
+      "dependencies": {
+        "string-width": "^4.2.3"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
    "node_modules/cli-spinners": {
      "version": "2.9.2",
      "resolved": "https://registry.npmjs.org/cli-spinners/-/cli-spinners-2.9.2.tgz",
@@ -8348,6 +8813,12 @@
      "integrity": "sha512-IfEDxwoWIjkeXL1eXcDiow4UbKjhLdq6/EuSVR9GMN7KVH3r9gQ83e73hsz1Nd1T3ijd5xv1wcWRYO+D6kCI2w==",
      "license": "MIT"
    },
+    "node_modules/colorjs.io": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/colorjs.io/-/colorjs.io-0.5.2.tgz",
+      "integrity": "sha512-twmVoizEW7ylZSN32OgKdXRmo1qg+wT5/6C3xu5b9QsWzSFAhHLn2xd8ro0diCsKfCj1RdaTP/nrcW+vAoQPIw==",
+      "license": "MIT"
+    },
    "node_modules/combined-stream": {
      "version": "1.0.8",
      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
@@ -8606,18 +9077,6 @@
        "url": "https://github.com/sponsors/sindresorhus"
      }
    },
-    "node_modules/core-js": {
-      "version": "3.6.5",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.6.5.tgz",
-      "integrity": "sha512-vZVEEwZoIsI+vPEuoF9Iqf5H7/M3eeQqWlQnYa8FSKKePuYTf5MWnxb5SDAzCa60b3JBRS5g9b+Dq7b1y/RCrA==",
-      "deprecated": "core-js@<3.23.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Some versions have web compatibility issues. Please, upgrade your dependencies to the actual version of core-js.",
-      "hasInstallScript": true,
-      "license": "MIT",
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/core-js"
-      }
-    },
    "node_modules/core-js-compat": {
      "version": "3.41.0",
      "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.41.0.tgz",
@@ -8848,6 +9307,7 @@
      "version": "1.5.1",
      "resolved": "https://registry.npmjs.org/css.escape/-/css.escape-1.5.1.tgz",
      "integrity": "sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==",
+      "dev": true,
      "license": "MIT"
    },
    "node_modules/cssesc": {
@@ -9485,7 +9945,9 @@
      "version": "0.5.16",
      "resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.5.16.tgz",
      "integrity": "sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==",
-      "license": "MIT"
+      "dev": true,
+      "license": "MIT",
+      "peer": true
    },
    "node_modules/dom-converter": {
      "version": "0.2.0",
@@ -9656,6 +10118,12 @@
      "integrity": "sha512-jtD6YG370ZCIi/9GTaJKQxWTZD045+4R4hTk/x1UyoqadyJ9x9CgSi1RlVDQF8U2sxLLSnFkCaMihqljHIWgMg==",
      "license": "MIT"
    },
+    "node_modules/eastasianwidth": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
+      "integrity": "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==",
+      "license": "MIT"
+    },
    "node_modules/ee-first": {
      "version": "1.1.1",
      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
@@ -10496,9 +10964,9 @@
      }
    },
    "node_modules/eslint-plugin-formatjs/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==",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
      "license": "MIT",
      "dependencies": {
        "balanced-match": "^1.0.0"
@@ -11059,6 +11527,12 @@
        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
      }
    },
+    "node_modules/expr-eval-fork": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/expr-eval-fork/-/expr-eval-fork-2.0.2.tgz",
+      "integrity": "sha512-NaAnObPVwHEYrODd7Jzp3zzT9pgTAlUUL4MZiZu9XAYPDpx89cPsfyEImFb2XY0vQNbrqg2CG7CLiI+Rs3seaQ==",
+      "license": "MIT"
+    },
    "node_modules/express": {
      "version": "4.21.2",
      "resolved": "https://registry.npmjs.org/express/-/express-4.21.2.tgz",
@@ -11360,9 +11834,9 @@
      }
    },
    "node_modules/filelist/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==",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
      "license": "MIT",
      "dependencies": {
        "balanced-match": "^1.0.0"
@@ -11479,6 +11953,15 @@
        "node": ">=8"
      }
    },
+    "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==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "micromatch": "^4.0.2"
+      }
+    },
    "node_modules/flat": {
      "version": "5.0.2",
      "resolved": "https://registry.npmjs.org/flat/-/flat-5.0.2.tgz",
@@ -11556,15 +12039,6 @@
        }
      }
    },
-    "node_modules/font-awesome": {
-      "version": "4.7.0",
-      "resolved": "https://registry.npmjs.org/font-awesome/-/font-awesome-4.7.0.tgz",
-      "integrity": "sha512-U6kGnykA/6bFmg1M/oT9EkFeIYv7JlX3bozwQJWiiLz6L0w3F5vBVPxHlwyX/vtNq1ckcpRKOB9f2Qal/VtFpg==",
-      "license": "(OFL-1.1 AND MIT)",
-      "engines": {
-        "node": ">=0.10.3"
-      }
-    },
    "node_modules/for-each": {
      "version": "0.3.5",
      "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.5.tgz",
@@ -11580,6 +12054,34 @@
        "url": "https://github.com/sponsors/ljharb"
      }
    },
+    "node_modules/foreground-child": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.3.1.tgz",
+      "integrity": "sha512-gIXjKqtFuWEgzFRJA9WCQeSJLZDjgJUOMCMzxtvFq/37KojM1BFGufqsCy0r4qSQmYLsZYMeyRqzIWOMup03sw==",
+      "license": "ISC",
+      "dependencies": {
+        "cross-spawn": "^7.0.6",
+        "signal-exit": "^4.0.1"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/foreground-child/node_modules/signal-exit": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
+      "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
    "node_modules/fork-ts-checker-webpack-plugin": {
      "version": "6.5.3",
      "resolved": "https://registry.npmjs.org/fork-ts-checker-webpack-plugin/-/fork-ts-checker-webpack-plugin-6.5.3.tgz",
@@ -12283,9 +12785,9 @@
      }
    },
    "node_modules/help-me/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==",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
      "dev": true,
      "license": "MIT",
      "dependencies": {
@@ -12664,6 +13166,15 @@
        "node": ">=10.17.0"
      }
    },
+    "node_modules/hyperdyperid": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/hyperdyperid/-/hyperdyperid-1.2.0.tgz",
+      "integrity": "sha512-Y93lCzHYgGWdrJ66yIktxiaGULYc6oGiABxhcO5AufBeOyoIdZF7bIfLaOrbM0iGIOXQQgxxRrFEnb+Y6w1n4A==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=10.18"
+      }
+    },
    "node_modules/hyphenate-style-name": {
      "version": "1.1.0",
      "resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.1.0.tgz",
@@ -12884,6 +13395,7 @@
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-4.0.0.tgz",
      "integrity": "sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==",
+      "dev": true,
      "license": "MIT",
      "engines": {
        "node": ">=8"
@@ -13039,6 +13551,22 @@
        "node": ">= 0.10"
      }
    },
+    "node_modules/is-arguments": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/is-arguments/-/is-arguments-1.2.0.tgz",
+      "integrity": "sha512-7bVbi0huj/wrIAOzb8U1aszg9kdi3KN/CyU19CTI7tAoZYEZoL9yCDXpbXN+uPsuWnP02cyug1gleqq+TU+YCA==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "has-tostringtag": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
    "node_modules/is-array-buffer": {
      "version": "3.0.5",
      "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.5.tgz",
@@ -13369,6 +13897,28 @@
        "url": "https://github.com/sponsors/ljharb"
      }
    },
+    "node_modules/is-mergeable-object": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/is-mergeable-object/-/is-mergeable-object-1.1.1.tgz",
+      "integrity": "sha512-CPduJfuGg8h8vW74WOxHtHmtQutyQBzR+3MjQ6iDHIYdbOnm1YC7jv43SqCoU8OPGTJD4nibmiryA4kmogbGrA==",
+      "license": "MIT"
+    },
+    "node_modules/is-nan": {
+      "version": "1.3.2",
+      "resolved": "https://registry.npmjs.org/is-nan/-/is-nan-1.3.2.tgz",
+      "integrity": "sha512-E+zBKpQ2t6MEo1VsonYmluk9NxGrbzpeeLC2xIViuO2EjU2xsXsBPwTr3Ykv9l08UYEVEdWeRZNouaZqF6RN0w==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.0",
+        "define-properties": "^1.1.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
    "node_modules/is-number": {
      "version": "7.0.0",
      "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
@@ -13818,6 +14368,21 @@
        "node": ">= 0.4"
      }
    },
+    "node_modules/jackspeak": {
+      "version": "3.4.3",
+      "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-3.4.3.tgz",
+      "integrity": "sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw==",
+      "license": "BlueOak-1.0.0",
+      "dependencies": {
+        "@isaacs/cliui": "^8.0.2"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      },
+      "optionalDependencies": {
+        "@pkgjs/parseargs": "^0.11.0"
+      }
+    },
    "node_modules/jake": {
      "version": "10.9.2",
      "resolved": "https://registry.npmjs.org/jake/-/jake-10.9.2.tgz",
@@ -14792,6 +15357,16 @@
      "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
      "license": "MIT"
    },
+    "node_modules/js-toml": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/js-toml/-/js-toml-1.0.2.tgz",
+      "integrity": "sha512-/7IQ//bzn2a/5IDazPUNzlW7bsjxS51cxciYZDR+Z+3Le60yzT0YfI8KOWqTtBcZkXXVklhWd2OuGd8ZksB0wQ==",
+      "license": "MIT",
+      "dependencies": {
+        "chevrotain": "^11.0.3",
+        "xregexp": "^5.1.1"
+      }
+    },
    "node_modules/js-yaml": {
      "version": "3.14.1",
      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.14.1.tgz",
@@ -15037,6 +15612,15 @@
        "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==",
+      "license": "MIT",
+      "dependencies": {
+        "graceful-fs": "^4.1.11"
+      }
+    },
    "node_modules/kleur": {
      "version": "3.0.3",
      "resolved": "https://registry.npmjs.org/kleur/-/kleur-3.0.3.tgz",
@@ -15178,6 +15762,12 @@
      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
      "license": "MIT"
    },
+    "node_modules/lodash-es": {
+      "version": "4.17.21",
+      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
+      "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==",
+      "license": "MIT"
+    },
    "node_modules/lodash.assignin": {
      "version": "4.2.0",
      "resolved": "https://registry.npmjs.org/lodash.assignin/-/lodash.assignin-4.2.0.tgz",
@@ -15332,6 +15922,24 @@
        "url": "https://github.com/sponsors/sindresorhus"
      }
    },
+    "node_modules/log-update": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/log-update/-/log-update-4.0.0.tgz",
+      "integrity": "sha512-9fkkDevMefjg0mmzWFBW8YkFP91OrizzkW3diF7CpG+S2EYdy4+TVfGwz1zeF8x7hCx1ovSPTOE9Ngib74qqUg==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-escapes": "^4.3.0",
+        "cli-cursor": "^3.1.0",
+        "slice-ansi": "^4.0.0",
+        "wrap-ansi": "^6.2.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
    "node_modules/loose-envify": {
      "version": "1.4.0",
      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
@@ -15366,7 +15974,9 @@
      "version": "1.5.0",
      "resolved": "https://registry.npmjs.org/lz-string/-/lz-string-1.5.0.tgz",
      "integrity": "sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==",
+      "dev": true,
      "license": "MIT",
+      "peer": true,
      "bin": {
        "lz-string": "bin/bin.js"
      }
@@ -16120,6 +16730,7 @@
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/min-indent/-/min-indent-1.0.1.tgz",
      "integrity": "sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==",
+      "dev": true,
      "license": "MIT",
      "engines": {
        "node": ">=4"
@@ -16191,6 +16802,15 @@
        "url": "https://github.com/sponsors/ljharb"
      }
    },
+    "node_modules/minipass": {
+      "version": "7.1.2",
+      "resolved": "https://registry.npmjs.org/minipass/-/minipass-7.1.2.tgz",
+      "integrity": "sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      }
+    },
    "node_modules/mkdirp-classic": {
      "version": "0.5.3",
      "resolved": "https://registry.npmjs.org/mkdirp-classic/-/mkdirp-classic-0.5.3.tgz",
@@ -16492,6 +17112,22 @@
        "url": "https://github.com/sponsors/ljharb"
      }
    },
+    "node_modules/object-is": {
+      "version": "1.1.6",
+      "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.1.6.tgz",
+      "integrity": "sha512-F8cZ+KfGlSGi09lJT7/Nd6KJZ9ygtvYC0/UYYLI9nmQKLMnydpB9yvbv9K1uSkEu7FU9vYPmVwLg328tX+ot3Q==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
    "node_modules/object-keys": {
      "version": "1.1.1",
      "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.1.1.tgz",
@@ -16829,6 +17465,12 @@
        "node": ">=6"
      }
    },
+    "node_modules/package-json-from-dist": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/package-json-from-dist/-/package-json-from-dist-1.0.1.tgz",
+      "integrity": "sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw==",
+      "license": "BlueOak-1.0.0"
+    },
    "node_modules/param-case": {
      "version": "3.0.4",
      "resolved": "https://registry.npmjs.org/param-case/-/param-case-3.0.4.tgz",
@@ -16900,6 +17542,95 @@
        "tslib": "^2.0.3"
      }
    },
+    "node_modules/patch-package": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/patch-package/-/patch-package-8.0.0.tgz",
+      "integrity": "sha512-da8BVIhzjtgScwDJ2TtKsfT5JFWz1hYoBl9rUQ1f38MC2HwnEIkK8VN3dKMKcP7P7bvvgzNDbfNHtx3MsQb5vA==",
+      "license": "MIT",
+      "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/open": {
+      "version": "7.4.2",
+      "resolved": "https://registry.npmjs.org/open/-/open-7.4.2.tgz",
+      "integrity": "sha512-MVHddDVweXZF3awtlAS+6pgKLlm/JgxZ90+/NBurBoQctVOOB/zDdVjcyPzQ+0laDGbsWgrRkflI65sQeOgT9Q==",
+      "license": "MIT",
+      "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/semver": {
+      "version": "7.7.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.1.tgz",
+      "integrity": "sha512-hlq8tAfn0m/61p4BVRcPzIGr6LKiMwo4VM6dGi6pt4qcRkmNzTcWq6eCEjEh+qXjkMDvPlOFFSGwQjoEa6gyMA==",
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/patch-package/node_modules/slash": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/slash/-/slash-2.0.0.tgz",
+      "integrity": "sha512-ZYKh3Wh2z1PpEXWr0MpSBZ0V6mZHAQfYevttO11c51CaWjGTaadiKZ+wVt1PbMlDV5qhMFslpZCemhwOK7C89A==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/patch-package/node_modules/yaml": {
+      "version": "2.7.1",
+      "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.7.1.tgz",
+      "integrity": "sha512-10ULxpnOCQXxJvBgxsn9ptjq6uviG/htZKk9veJGhlqn3w/DxQ631zFF+nlQXLwmImeS5amR2dl2U8sg6U9jsQ==",
+      "license": "ISC",
+      "bin": {
+        "yaml": "bin.mjs"
+      },
+      "engines": {
+        "node": ">= 14"
+      }
+    },
+    "node_modules/path": {
+      "version": "0.12.7",
+      "resolved": "https://registry.npmjs.org/path/-/path-0.12.7.tgz",
+      "integrity": "sha512-aXXC6s+1w7otVF9UletFkFcDsJeO7lSZBPUQhtb5O0xJe8LtYhj/GxldoL09bBj9+ZmE2hNoHqQSFMN5fikh4Q==",
+      "license": "MIT",
+      "dependencies": {
+        "process": "^0.11.1",
+        "util": "^0.10.3"
+      }
+    },
    "node_modules/path-exists": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
@@ -16939,6 +17670,28 @@
      "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
      "license": "MIT"
    },
+    "node_modules/path-scurry": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.11.1.tgz",
+      "integrity": "sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA==",
+      "license": "BlueOak-1.0.0",
+      "dependencies": {
+        "lru-cache": "^10.2.0",
+        "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/path-scurry/node_modules/lru-cache": {
+      "version": "10.4.3",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
+      "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
+      "license": "ISC"
+    },
    "node_modules/path-to-regexp": {
      "version": "0.1.12",
      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.12.tgz",
@@ -16954,6 +17707,27 @@
        "node": ">=8"
      }
    },
+    "node_modules/path-unified": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/path-unified/-/path-unified-0.2.0.tgz",
+      "integrity": "sha512-MNKqvrKbbbb5p7XHXV6ZAsf/1f/yJQa13S/fcX0uua8ew58Tgc6jXV+16JyAbnR/clgCH+euKDxrF2STxMHdrg==",
+      "license": "MIT"
+    },
+    "node_modules/path/node_modules/inherits": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
+      "integrity": "sha512-x00IRNXNy63jwGkJmzPigoySHbaqpNuzKbBOmzK+g2OdZpQ9w+sxCN+VSB3ja7IAge2OP2qpfxTjeNcyjmW1uw==",
+      "license": "ISC"
+    },
+    "node_modules/path/node_modules/util": {
+      "version": "0.10.4",
+      "resolved": "https://registry.npmjs.org/util/-/util-0.10.4.tgz",
+      "integrity": "sha512-0Pm9hTQ3se5ll1XihRic3FDIku70C+iHUdT/W926rSgHV5QgXsYbKZN8MSC3tJtSkhuROzvsQjAaFENRXr+19A==",
+      "license": "MIT",
+      "dependencies": {
+        "inherits": "2.0.3"
+      }
+    },
    "node_modules/picocolors": {
      "version": "1.1.1",
      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
@@ -17357,6 +18131,24 @@
        "postcss": "^8.2.2"
      }
    },
+    "node_modules/postcss-calc-ast-parser": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/postcss-calc-ast-parser/-/postcss-calc-ast-parser-0.1.4.tgz",
+      "integrity": "sha512-CebpbHc96zgFjGgdQ6BqBy6XIUgRx1xXWCAAk6oke02RZ5nxwo9KQejTg8y7uYEeI9kv8jKQPYjoe6REsY23vw==",
+      "license": "MIT",
+      "dependencies": {
+        "postcss-value-parser": "^3.3.1"
+      },
+      "engines": {
+        "node": ">=6.5"
+      }
+    },
+    "node_modules/postcss-calc-ast-parser/node_modules/postcss-value-parser": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.1.tgz",
+      "integrity": "sha512-pISE66AbVkp4fDQ7VHBwRNXzAAKJjw4Vw7nWI/+Q3vuly7SNfgYXvm6i5IgFylHGK5sP/xHAbB7N49OS4gWNyQ==",
+      "license": "MIT"
+    },
    "node_modules/postcss-colormin": {
      "version": "6.1.0",
      "resolved": "https://registry.npmjs.org/postcss-colormin/-/postcss-colormin-6.1.0.tgz",
@@ -17375,6 +18167,21 @@
        "postcss": "^8.4.31"
      }
    },
+    "node_modules/postcss-combine-duplicated-selectors": {
+      "version": "10.0.3",
+      "resolved": "https://registry.npmjs.org/postcss-combine-duplicated-selectors/-/postcss-combine-duplicated-selectors-10.0.3.tgz",
+      "integrity": "sha512-IP0BmwFloCskv7DV7xqvzDXqMHpwdczJa6ZvIW8abgHdcIHs9mCJX2ltFhu3EwA51ozp13DByng30+Ke+eIExA==",
+      "license": "MIT",
+      "dependencies": {
+        "postcss-selector-parser": "^6.0.4"
+      },
+      "engines": {
+        "node": "^10.0.0 || ^12.0.0 || >=14.0.0"
+      },
+      "peerDependencies": {
+        "postcss": "^8.1.0"
+      }
+    },
    "node_modules/postcss-convert-values": {
      "version": "6.1.0",
      "resolved": "https://registry.npmjs.org/postcss-convert-values/-/postcss-convert-values-6.1.0.tgz",
@@ -17467,6 +18274,23 @@
        "postcss": "^8.4.31"
      }
    },
+    "node_modules/postcss-import": {
+      "version": "15.1.0",
+      "resolved": "https://registry.npmjs.org/postcss-import/-/postcss-import-15.1.0.tgz",
+      "integrity": "sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==",
+      "license": "MIT",
+      "dependencies": {
+        "postcss-value-parser": "^4.0.0",
+        "read-cache": "^1.0.0",
+        "resolve": "^1.1.7"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      },
+      "peerDependencies": {
+        "postcss": "^8.0.0"
+      }
+    },
    "node_modules/postcss-loader": {
      "version": "8.1.1",
      "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-8.1.1.tgz",
@@ -17554,6 +18378,52 @@
        "node": ">=10"
      }
    },
+    "node_modules/postcss-map": {
+      "version": "0.11.0",
+      "resolved": "https://registry.npmjs.org/postcss-map/-/postcss-map-0.11.0.tgz",
+      "integrity": "sha512-cgHYZrH9aAMds90upYUPhYz8xnAcRD45SwuNns/nQHONIrPQDhpwk3JLsAQGOndQxnRVXfB6nB+3WqSMy8fqlA==",
+      "license": "Unlicense",
+      "dependencies": {
+        "js-yaml": "^3.12.0",
+        "postcss": "^7.0.2",
+        "reduce-function-call": "^1.0.1"
+      },
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/postcss-map/node_modules/picocolors": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-0.2.1.tgz",
+      "integrity": "sha512-cMlDqaLEqfSaW8Z7N5Jw+lyIW869EzT73/F5lhtY9cLGoVxSXznfgfXMO0Z5K0o0Q2TkTXq+0KFsdnSe3jDViA==",
+      "license": "ISC"
+    },
+    "node_modules/postcss-map/node_modules/postcss": {
+      "version": "7.0.39",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.39.tgz",
+      "integrity": "sha512-yioayjNbHn6z1/Bywyb2Y4s3yvDAeXGOyxqD+LnVOinq6Mdmd++SW2wUNVzavyyHxd6+DxzWGIuosg6P1Rj8uA==",
+      "license": "MIT",
+      "dependencies": {
+        "picocolors": "^0.2.1",
+        "source-map": "^0.6.1"
+      },
+      "engines": {
+        "node": ">=6.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/postcss/"
+      }
+    },
+    "node_modules/postcss-map/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==",
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
    "node_modules/postcss-merge-longhand": {
      "version": "6.0.5",
      "resolved": "https://registry.npmjs.org/postcss-merge-longhand/-/postcss-merge-longhand-6.0.5.tgz",
@@ -17588,6 +18458,19 @@
        "postcss": "^8.4.31"
      }
    },
+    "node_modules/postcss-minify": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/postcss-minify/-/postcss-minify-1.1.0.tgz",
+      "integrity": "sha512-9D64ueIW0DL2FdLajQTlXrnTN8Ox9NjuXqigKMmB819RhdClNPYx5Zp3i5x0ghjjy3vGrLBBYEYvJjY/1eMNbw==",
+      "license": "MIT",
+      "dependencies": {
+        "postcss-selector-parser": "^6.0",
+        "postcss-value-parser": "^4.1"
+      },
+      "peerDependencies": {
+        "postcss": "^8.0"
+      }
+    },
    "node_modules/postcss-minify-font-values": {
      "version": "6.1.0",
      "resolved": "https://registry.npmjs.org/postcss-minify-font-values/-/postcss-minify-font-values-6.1.0.tgz",
@@ -18018,9 +18901,9 @@
      }
    },
    "node_modules/prebuild-install/node_modules/tar-fs": {
-      "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-2.1.2.tgz",
-      "integrity": "sha512-EsaAXwxmx8UB7FRKqeozqEPop69DXcmYwTQwXvyAPF352HJsPdkVhvTaDPYqfNgruveJIJy3TA2l+2zj8LJIJA==",
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-2.1.3.tgz",
+      "integrity": "sha512-090nwYJDmlhwFwEW3QQl+vaNnxsO2yVsd45eTKRBzSzu+hlb1w2K9inVq5b0ngXuLVqQ4ApvsUHHnu/zQNkWAg==",
      "license": "MIT",
      "dependencies": {
        "chownr": "^1.1.1",
@@ -18054,6 +18937,21 @@
        "node": ">= 0.8.0"
      }
    },
+    "node_modules/prettier": {
+      "version": "3.5.3",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.5.3.tgz",
+      "integrity": "sha512-QQtaxnoDJeAkDvDKWCLiwIXkTgRhwYDEQCghU9Z6q03iyek/rxRh/2lC3HB7P8sWT2xC/y5JDctPLBIGzHKbhw==",
+      "license": "MIT",
+      "bin": {
+        "prettier": "bin/prettier.cjs"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/prettier/prettier?sponsor=1"
+      }
+    },
    "node_modules/pretty-error": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/pretty-error/-/pretty-error-4.0.0.tgz",
@@ -18068,7 +18966,9 @@
      "version": "27.5.1",
      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-27.5.1.tgz",
      "integrity": "sha512-Qb1gy5OrP5+zDf2Bvnzdl3jsTf1qXVMazbvCoKhtKqVs4/YK4ozX4gKQJJVyNe+cajNPn0KoC0MC3FUmaHWEmQ==",
+      "dev": true,
      "license": "MIT",
+      "peer": true,
      "dependencies": {
        "ansi-regex": "^5.0.1",
        "ansi-styles": "^5.0.0",
@@ -18082,7 +18982,9 @@
      "version": "5.2.0",
      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+      "dev": true,
      "license": "MIT",
+      "peer": true,
      "engines": {
        "node": ">=10"
      },
@@ -18094,13 +18996,14 @@
      "version": "17.0.2",
      "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
      "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==",
-      "license": "MIT"
+      "dev": true,
+      "license": "MIT",
+      "peer": true
    },
    "node_modules/process": {
      "version": "0.11.10",
      "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
      "integrity": "sha512-cdGef/drWFoydD1JsMzuFf8100nZl+GT+yacc2bEced5f9Rjk4z+WtFUTBu9PhOi9j/jfmBPu0mMEY4wIdAF8A==",
-      "dev": true,
      "license": "MIT",
      "engines": {
        "node": ">= 0.6.0"
@@ -18254,9 +19157,9 @@
      }
    },
    "node_modules/purgecss/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==",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
      "license": "MIT",
      "dependencies": {
        "balanced-match": "^1.0.0"
@@ -19055,19 +19958,6 @@
        "react-dom": ">=16.8"
      }
    },
-    "node_modules/react-shallow-renderer": {
-      "version": "16.15.0",
-      "resolved": "https://registry.npmjs.org/react-shallow-renderer/-/react-shallow-renderer-16.15.0.tgz",
-      "integrity": "sha512-oScf2FqQ9LFVQgA73vr86xl2NaOIX73rh+YFqcOp68CWj56tSfgtGKrEbyhCj0rSijyG9M1CYprTh39fBi5hzA==",
-      "license": "MIT",
-      "dependencies": {
-        "object-assign": "^4.1.1",
-        "react-is": "^16.12.0 || ^17.0.0 || ^18.0.0"
-      },
-      "peerDependencies": {
-        "react": "^16.0.0 || ^17.0.0 || ^18.0.0"
-      }
-    },
    "node_modules/react-share": {
      "version": "4.4.1",
      "resolved": "https://registry.npmjs.org/react-share/-/react-share-4.4.1.tgz",
@@ -19129,26 +20019,6 @@
        "react": "^16.8.3 || ^17.0.0-0 || ^18.0.0"
      }
    },
-    "node_modules/react-test-renderer": {
-      "version": "18.3.1",
-      "resolved": "https://registry.npmjs.org/react-test-renderer/-/react-test-renderer-18.3.1.tgz",
-      "integrity": "sha512-KkAgygexHUkQqtvvx/otwxtuFu5cVjfzTCtjXLH9boS19/Nbtg84zS7wIQn39G8IlrhThBpQsMKkq5ZHZIYFXA==",
-      "license": "MIT",
-      "dependencies": {
-        "react-is": "^18.3.1",
-        "react-shallow-renderer": "^16.15.0",
-        "scheduler": "^0.23.2"
-      },
-      "peerDependencies": {
-        "react": "^18.3.1"
-      }
-    },
-    "node_modules/react-test-renderer/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==",
-      "license": "MIT"
-    },
    "node_modules/react-transition-group": {
      "version": "4.4.5",
      "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz",
@@ -19165,6 +20035,24 @@
        "react-dom": ">=16.6.0"
      }
    },
+    "node_modules/read-cache": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
+      "integrity": "sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==",
+      "license": "MIT",
+      "dependencies": {
+        "pify": "^2.3.0"
+      }
+    },
+    "node_modules/read-cache/node_modules/pify": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+      "integrity": "sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
    "node_modules/read-pkg": {
      "version": "5.2.0",
      "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-5.2.0.tgz",
@@ -19283,6 +20171,7 @@
      "version": "3.0.0",
      "resolved": "https://registry.npmjs.org/redent/-/redent-3.0.0.tgz",
      "integrity": "sha512-6tDA8g98We0zd0GvVeMT9arEOnTw9qM03L9cJXaCjrip1OO764RDBLBfrB4cwzNGDj5OA5ioymC9GkizgWJDUg==",
+      "dev": true,
      "license": "MIT",
      "dependencies": {
        "indent-string": "^4.0.0",
@@ -19292,6 +20181,15 @@
        "node": ">=8"
      }
    },
+    "node_modules/reduce-function-call": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/reduce-function-call/-/reduce-function-call-1.0.3.tgz",
+      "integrity": "sha512-Hl/tuV2VDgWgCSEeWMLwxLZqX7OK59eU1guxXsRKTAyeYimivsKdtcV4fu3r710tpG5GmDKDhQ0HSZLExnNmyQ==",
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^1.0.0"
+      }
+    },
    "node_modules/redux": {
      "version": "4.2.1",
      "resolved": "https://registry.npmjs.org/redux/-/redux-4.2.1.tgz",
@@ -20508,6 +21406,23 @@
        "node": ">=8"
      }
    },
+    "node_modules/slice-ansi": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-4.0.0.tgz",
+      "integrity": "sha512-qMCMfhY040cVHT43K9BFygqYbUPFZKHOg7K73mtTWJRb8pyP3fzf4Ixd5SzdEJQ6MRUg/WBnOLxghZtKKurENQ==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "astral-regex": "^2.0.0",
+        "is-fullwidth-code-point": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/slice-ansi?sponsor=1"
+      }
+    },
    "node_modules/snake-case": {
      "version": "3.0.4",
      "resolved": "https://registry.npmjs.org/snake-case/-/snake-case-3.0.4.tgz",
@@ -20766,6 +21681,27 @@
        "node": ">= 0.8"
      }
    },
+    "node_modules/stream": {
+      "version": "0.0.3",
+      "resolved": "https://registry.npmjs.org/stream/-/stream-0.0.3.tgz",
+      "integrity": "sha512-aMsbn7VKrl4A2T7QAQQbzgN7NVc70vgF5INQrBXqn4dCXN1zy3L9HGgLO5s7PExmdrzTJ8uR/27aviW8or8/+A==",
+      "license": "MIT",
+      "dependencies": {
+        "component-emitter": "^2.0.0"
+      }
+    },
+    "node_modules/stream/node_modules/component-emitter": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-2.0.0.tgz",
+      "integrity": "sha512-4m5s3Me2xxlVKG9PkZpQqHQR7bgpnN7joDMJ4yvVkVXngjoITG76IaZmzmywSeRTeTpc6N6r3H3+KyUurV8OYw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
    "node_modules/streamx": {
      "version": "2.22.0",
      "resolved": "https://registry.npmjs.org/streamx/-/streamx-2.22.0.tgz",
@@ -20824,6 +21760,27 @@
        "node": ">=8"
      }
    },
+    "node_modules/string-width-cjs": {
+      "name": "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==",
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/string-width-cjs/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==",
+      "license": "MIT"
+    },
    "node_modules/string-width/node_modules/emoji-regex": {
      "version": "8.0.0",
      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
@@ -20925,6 +21882,19 @@
        "node": ">=8"
      }
    },
+    "node_modules/strip-ansi-cjs": {
+      "name": "strip-ansi",
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
    "node_modules/strip-bom": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-4.0.0.tgz",
@@ -20947,6 +21917,7 @@
      "version": "3.0.0",
      "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-3.0.0.tgz",
      "integrity": "sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==",
+      "dev": true,
      "license": "MIT",
      "dependencies": {
        "min-indent": "^1.0.0"
@@ -20967,6 +21938,55 @@
        "url": "https://github.com/sponsors/sindresorhus"
      }
    },
+    "node_modules/style-dictionary": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/style-dictionary/-/style-dictionary-4.4.0.tgz",
+      "integrity": "sha512-+xU0IA1StzqAqFs/QtXkK+XJa7wpS4X5H+JQccRKsRCElgeLGocFU1U/UMvMUylKFw6vwGV+Y/a2wb2pm5rFFQ==",
+      "hasInstallScript": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@bundled-es-modules/deepmerge": "^4.3.1",
+        "@bundled-es-modules/glob": "^10.4.2",
+        "@bundled-es-modules/memfs": "^4.9.4",
+        "@zip.js/zip.js": "^2.7.44",
+        "chalk": "^5.3.0",
+        "change-case": "^5.3.0",
+        "commander": "^12.1.0",
+        "is-plain-obj": "^4.1.0",
+        "json5": "^2.2.2",
+        "patch-package": "^8.0.0",
+        "path-unified": "^0.2.0",
+        "prettier": "^3.3.3",
+        "tinycolor2": "^1.6.0"
+      },
+      "bin": {
+        "style-dictionary": "bin/style-dictionary.js"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
+    "node_modules/style-dictionary/node_modules/chalk": {
+      "version": "5.4.1",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.4.1.tgz",
+      "integrity": "sha512-zgVZuo2WcZgfUEmsn6eO3kINexW8RAE4maiQ8QNs8CtpPCSyMiYsULR3HQYkm3w8FIA3SberyMJMSldGsW+U3w==",
+      "license": "MIT",
+      "engines": {
+        "node": "^12.17.0 || ^14.13 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
+    "node_modules/style-dictionary/node_modules/commander": {
+      "version": "12.1.0",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-12.1.0.tgz",
+      "integrity": "sha512-Vw8qHK3bZM9y/P10u3Vib8o/DdkvA2OtPtZvD871QKjy74Wj1WSKFILMPRPSdUSx5RFK1arlJzEtA4PkFgnbuA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
    "node_modules/style-loader": {
      "version": "3.3.4",
      "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-3.3.4.tgz",
@@ -21186,9 +22206,9 @@
      }
    },
    "node_modules/tar-fs": {
-      "version": "3.0.8",
-      "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.0.8.tgz",
-      "integrity": "sha512-ZoROL70jptorGAlgAYiLoBLItEKw/fUxg9BSYK/dF/GAGYFJOJJJMvjPAKDJraCXFwadD456FCuvLWgfhMsPwg==",
+      "version": "3.0.9",
+      "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.0.9.tgz",
+      "integrity": "sha512-XF4w9Xp+ZQgifKakjZYmFdkLoSWd34VGKcsTCwlNWM7QG3ZbaxnTsaBwnjFZqHRf/rROxaR8rXnbtwdvaDI+lA==",
      "license": "MIT",
      "dependencies": {
        "pump": "^3.0.0",
@@ -21345,6 +22365,18 @@
      "integrity": "sha512-N+8UisAXDGk8PFXP4HAzVR9nbfmVJ3zYLAWiTIoqC5v5isinhr+r5uaO8+7r3BMfuNIufIsA7RdpVgacC2cSpw==",
      "license": "MIT"
    },
+    "node_modules/thingies": {
+      "version": "1.21.0",
+      "resolved": "https://registry.npmjs.org/thingies/-/thingies-1.21.0.tgz",
+      "integrity": "sha512-hsqsJsFMsV+aD4s3CWKk85ep/3I9XzYV/IXaSouJMYIoDlgyi11cBhsqYe9/geRfB0YIikBQg6raRaM+nIMP9g==",
+      "license": "Unlicense",
+      "engines": {
+        "node": ">=10.18"
+      },
+      "peerDependencies": {
+        "tslib": "^2"
+      }
+    },
    "node_modules/thread-stream": {
      "version": "2.7.0",
      "resolved": "https://registry.npmjs.org/thread-stream/-/thread-stream-2.7.0.tgz",
@@ -21379,6 +22411,12 @@
      "integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==",
      "license": "MIT"
    },
+    "node_modules/tinycolor2": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/tinycolor2/-/tinycolor2-1.6.0.tgz",
+      "integrity": "sha512-XPaBkWQJdsf3pLKJV9p4qN/S+fm2Oj8AIPo1BTUhg5oxkvm9+SVEGFdhyOz7tTdUTfvxMiAs4sp6/eZO2Ew+pw==",
+      "license": "MIT"
+    },
    "node_modules/tinyglobby": {
      "version": "0.2.13",
      "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.13.tgz",
@@ -21505,6 +22543,22 @@
        "node": ">=12"
      }
    },
+    "node_modules/tree-dump": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/tree-dump/-/tree-dump-1.0.2.tgz",
+      "integrity": "sha512-dpev9ABuLWdEubk+cIaI9cHwRNNDjkBBLXTwI4UCUFdQ5xXKqNXoK4FEciw/vxf+NQ7Cb7sGUyeUtORvHIdRXQ==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=10.0"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/streamich"
+      },
+      "peerDependencies": {
+        "tslib": "2"
+      }
+    },
    "node_modules/trim-lines": {
      "version": "3.0.1",
      "resolved": "https://registry.npmjs.org/trim-lines/-/trim-lines-3.0.1.tgz",
@@ -22197,6 +23251,19 @@
        "punycode": "^2.1.0"
      }
    },
+    "node_modules/url": {
+      "version": "0.11.4",
+      "resolved": "https://registry.npmjs.org/url/-/url-0.11.4.tgz",
+      "integrity": "sha512-oCwdVC7mTuWiPyjLUz/COz5TLk6wgp0RCsN+wHZ2Ekneac9w8uuV0njcbbie2ME+Vs+d6duwmYuR3HgQXs1fOg==",
+      "license": "MIT",
+      "dependencies": {
+        "punycode": "^1.4.1",
+        "qs": "^6.12.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
    "node_modules/url-loader": {
      "version": "4.1.1",
      "resolved": "https://registry.npmjs.org/url-loader/-/url-loader-4.1.1.tgz",
@@ -22252,6 +23319,12 @@
        "requires-port": "^1.0.0"
      }
    },
+    "node_modules/url/node_modules/punycode": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
+      "integrity": "sha512-jmYNElW7yvO7TV33CjSmvSiE2yco3bV2czu/OzDKdMNVZQWfxCblURLhf+47syQRBntjfLdd/H0egrzIG+oaFQ==",
+      "license": "MIT"
+    },
    "node_modules/use-callback-ref": {
      "version": "1.3.3",
      "resolved": "https://registry.npmjs.org/use-callback-ref/-/use-callback-ref-1.3.3.tgz",
@@ -22304,6 +23377,19 @@
        "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
      }
    },
+    "node_modules/util": {
+      "version": "0.12.5",
+      "resolved": "https://registry.npmjs.org/util/-/util-0.12.5.tgz",
+      "integrity": "sha512-kZf/K6hEIrWHI6XqOFUiiMa+79wE/D8Q+NCNAWclkyg3b4d2k7s0QGepNjiABc+aR3N1PAyHL7p6UcLY6LmrnA==",
+      "license": "MIT",
+      "dependencies": {
+        "inherits": "^2.0.3",
+        "is-arguments": "^1.0.4",
+        "is-generator-function": "^1.0.7",
+        "is-typed-array": "^1.1.3",
+        "which-typed-array": "^1.1.2"
+      }
+    },
    "node_modules/util-deprecate": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
@@ -23063,6 +24149,24 @@
        "node": ">=8"
      }
    },
+    "node_modules/wrap-ansi-cjs": {
+      "name": "wrap-ansi",
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
+      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
    "node_modules/wrappy": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
@@ -23118,6 +24222,15 @@
      "integrity": "sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==",
      "license": "MIT"
    },
+    "node_modules/xregexp": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/xregexp/-/xregexp-5.1.2.tgz",
+      "integrity": "sha512-6hGgEMCGhqCTFEJbqmWrNIPqfpdirdGWkqshu7fFZddmTSfgv5Sn9D2SaKloR79s5VUiUlpwzg3CM3G6D3VIlw==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime-corejs3": "^7.26.9"
+      }
+    },
    "node_modules/y18n": {
      "version": "5.0.8",
      "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
--- a/package.json
+++ b/package.json
@@ -15,10 +15,10 @@
    "i18n_extract": "fedx-scripts formatjs extract",
    "lint": "fedx-scripts eslint --ext .js --ext .jsx --ext .ts --ext .tsx .",
    "lint:fix": "fedx-scripts eslint --fix --ext .js --ext .jsx --ext .ts --ext .tsx .",
-    "snapshot": "fedx-scripts jest --updateSnapshot",
    "start": "fedx-scripts webpack-dev-server --progress",
+    "start:with-theme": "paragon install-theme && npm start && npm install",
    "dev": "PUBLIC_PATH=/learning/ MFE_CONFIG_API_URL='http://localhost:8000/api/mfe_config/v1' fedx-scripts webpack-dev-server --progress --host apps.local.openedx.io",
-    "test": "fedx-scripts jest --coverage --passWithNoTests",
+    "test": "NODE_ENV=test fedx-scripts jest --coverage --passWithNoTests",
    "test:watch": "fedx-scripts jest --watch --passWithNoTests",
    "types": "tsc --noEmit"
  },
@@ -36,18 +36,17 @@
    "@edx/browserslist-config": "1.5.0",
    "@edx/frontend-component-footer": "^14.6.0",
    "@edx/frontend-component-header": "^6.2.0",
-    "@edx/frontend-lib-learning-assistant": "^2.20.0",
-    "@edx/frontend-lib-special-exams": "^3.5.0",
-    "@edx/frontend-platform": "^8.3.1",
-    "@edx/openedx-atlas": "^0.6.0",
-    "@edx/react-unit-test-utils": "^4.0.0",
+    "@edx/frontend-lib-learning-assistant": "^2.23.0",
+    "@edx/frontend-lib-special-exams": "^4.0.0",
+    "@edx/frontend-platform": "^8.4.0",
+    "@edx/openedx-atlas": "^0.7.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-build": "^14.5.0",
    "@openedx/frontend-plugin-framework": "^1.7.0",
-    "@openedx/paragon": "^22.16.0",
+    "@openedx/paragon": "^23.4.5",
    "@popperjs/core": "2.11.8",
    "@reduxjs/toolkit": "1.9.7",
    "buffer": "^6.0.3",
--- a/src/snapshots/index.test.jsx.snap
+++ b/src/snapshots/index.test.jsx.snap
@@ -1,224 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`app registry subscribe: APP_INIT_ERROR.  snapshot: displays an ErrorPage to root element 1`] = `
-<React Strict Mode>
-  <ErrorPage
-    message="test-error-message"
-  />
-</React Strict Mode>
-`;
-
-exports[`app registry subscribe: APP_READY.  links App to root element 1`] = `
-<React Strict Mode>
-  <AppProvider
-    store={
-      {
-        "dispatch": [Function],
-        "getState": [Function],
-        "replaceReducer": [Function],
-        "subscribe": [Function],
-        Symbol(Symbol.observable): [Function],
-      }
-    }
-  >
-    <HelmetWrapper
-      defer={true}
-      encodeSpecialCharacters={true}
-    >
-      <link
-        href="favicon-url"
-        rel="shortcut icon"
-        type="image/x-icon"
-      />
-    </HelmetWrapper>
-    <PathFixesProvider>
-      <NoticesProvider>
-        <UserMessagesProvider>
-          <Routes>
-            <Route
-              element={
-                <PageWrap>
-                  <Page Not Found />
-                </PageWrap>
-              }
-              path="*"
-            />
-            <Route
-              element={
-                <PageWrap>
-                  <Goal Unsubscribe />
-                </PageWrap>
-              }
-              path="/goal-unsubscribe/:token"
-            />
-            <Route
-              element={
-                <PageWrap>
-                  <Courseware Redirect Landing Page />
-                </PageWrap>
-              }
-              path="/redirect/*"
-            />
-            <Route
-              element={
-                <PageWrap>
-                  <Preferences Unsubscribe />
-                </PageWrap>
-              }
-              path="/preferences-unsubscribe/:userToken/:updatePatch"
-            />
-            <Route
-              element={
-                <DecodePageRoute>
-                  <Course Access Error Page />
-                </DecodePageRoute>
-              }
-              path="/course/:courseId/access-denied"
-            />
-            <Route
-              element={
-                <DecodePageRoute>
-                  <Tab Container
-                    fetch={[Function]}
-                    slice="courseHome"
-                    tab="outline"
-                  >
-                    <Outline Tab />
-                  </Tab Container>
-                </DecodePageRoute>
-              }
-              path="/course/:courseId/home"
-            />
-            <Route
-              element={
-                <DecodePageRoute>
-                  <Tab Container
-                    fetch={[Function]}
-                    slice="courseHome"
-                    tab="lti_live"
-                  >
-                    <Live Tab />
-                  </Tab Container>
-                </DecodePageRoute>
-              }
-              path="/course/:courseId/live"
-            />
-            <Route
-              element={
-                <DecodePageRoute>
-                  <Tab Container
-                    fetch={[Function]}
-                    slice="courseHome"
-                    tab="dates"
-                  >
-                    <Dates Tab />
-                  </Tab Container>
-                </DecodePageRoute>
-              }
-              path="/course/:courseId/dates"
-            />
-            <Route
-              element={
-                <DecodePageRoute>
-                  <Tab Container
-                    fetch={[Function]}
-                    slice="courseHome"
-                    tab="discussion"
-                  >
-                    <Discussion Tab />
-                  </Tab Container>
-                </DecodePageRoute>
-              }
-              path="/course/:courseId/discussion/:path/*"
-            />
-            <Route
-              element={
-                <DecodePageRoute>
-                  <Tab Container
-                    fetch={[Function]}
-                    isProgressTab={true}
-                    slice="courseHome"
-                    tab="progress"
-                  >
-                    <Progress Tab />
-                  </Tab Container>
-                </DecodePageRoute>
-              }
-              path="/course/:courseId/progress/:targetUserId/"
-            />
-            <Route
-              element={
-                <DecodePageRoute>
-                  <Tab Container
-                    fetch={[Function]}
-                    isProgressTab={true}
-                    slice="courseHome"
-                    tab="progress"
-                  >
-                    <Progress Tab />
-                  </Tab Container>
-                </DecodePageRoute>
-              }
-              path="/course/:courseId/progress"
-            />
-            <Route
-              element={
-                <DecodePageRoute>
-                  <Tab Container
-                    fetch={[Function]}
-                    slice="courseware"
-                    tab="courseware"
-                  >
-                    <Course Exit />
-                  </Tab Container>
-                </DecodePageRoute>
-              }
-              path="/course/:courseId/course-end"
-            />
-            <Route
-              element={
-                <DecodePageRoute>
-                  <Courseware Container />
-                </DecodePageRoute>
-              }
-              path="/course/:courseId/:sequenceId/:unitId"
-            />
-            <Route
-              element={
-                <DecodePageRoute>
-                  <Courseware Container />
-                </DecodePageRoute>
-              }
-              path="/course/:courseId/:sequenceId"
-            />
-            <Route
-              element={
-                <DecodePageRoute>
-                  <Courseware Container />
-                </DecodePageRoute>
-              }
-              path="/course/:courseId"
-            />
-            <Route
-              element={
-                <DecodePageRoute>
-                  <Courseware Container />
-                </DecodePageRoute>
-              }
-              path="/preview/course/:courseId/:sequenceId/:unitId"
-            />
-            <Route
-              element={
-                <DecodePageRoute>
-                  <Courseware Container />
-                </DecodePageRoute>
-              }
-              path="/preview/course/:courseId/:sequenceId"
-            />
-          </Routes>
-        </UserMessagesProvider>
-      </NoticesProvider>
-    </PathFixesProvider>
-  </AppProvider>
-</React Strict Mode>
-`;
--- a/src/constants.ts
+++ b/src/constants.ts
@@ -22,7 +22,7 @@ export const DECODE_ROUTES = {

 export const ROUTES = {
  UNSUBSCRIBE: '/goal-unsubscribe/:token',
-  PREFERENCES_UNSUBSCRIBE: '/preferences-unsubscribe/:userToken/:updatePatch',
+  PREFERENCES_UNSUBSCRIBE: '/preferences-unsubscribe/:userToken/:updatePatch?',
  REDIRECT: '/redirect/*',
  DASHBOARD: 'dashboard',
  ENTERPRISE_LEARNER_DASHBOARD: 'enterprise-learner-dashboard',
--- a/src/course-home/courseware-search/CoursewareSearchEmpty.test.jsx
+++ b/src/course-home/courseware-search/CoursewareSearchEmpty.test.jsx
@@ -5,6 +5,7 @@ import {
  screen,
 } from '../../setupTest';
 import CoursewareSearchEmpty from './CoursewareSearchEmpty';
+import messages from './messages';

 function renderComponent() {
  const { container } = render(<CoursewareSearchEmpty />);
@@ -16,9 +17,12 @@ describe('CoursewareSearchEmpty', () => {
    initializeMockApp();
  });

-  it('should match the snapshot', () => {
+  it('render empty results text and corresponding classes', () => {
    renderComponent();
-
-    expect(screen.getByTestId('no-results')).toMatchSnapshot();
+    const emptyText = screen.getByText(messages.searchResultsNone.defaultMessage);
+    expect(emptyText).toBeInTheDocument();
+    expect(emptyText).toHaveClass('courseware-search-results__empty');
+    expect(emptyText).toHaveAttribute('data-testid', 'no-results');
+    expect(emptyText.parentElement).toHaveClass('courseware-search-results');
  });
 });
--- a/src/course-home/courseware-search/CoursewareSearchResults.test.jsx
+++ b/src/course-home/courseware-search/CoursewareSearchResults.test.jsx
@@ -7,6 +7,7 @@ import {
 import CoursewareSearchResults from './CoursewareSearchResults';
 import messages from './messages';
 import searchResultsFactory from './test-data/search-results-factory';
+import * as mock from './test-data/mocked-response.json';

 jest.mock('react-redux');

@@ -34,8 +35,53 @@ describe('CoursewareSearchResults', () => {
      renderComponent({ results });
    });

-    it('should match the snapshot', () => {
-      expect(screen.getByTestId('search-results')).toMatchSnapshot();
+    it('should render complete list', () => {
+      const courses = screen.getAllByRole('link');
+      expect(courses.length).toBe(mock.results.length);
+    });
+
+    it('should render correct link for internal course', () => {
+      const courses = screen.getAllByRole('link');
+      const firstCourse = courses[0];
+      const firstCourseTitle = firstCourse.querySelector('.courseware-search-results__title span');
+      expect(firstCourseTitle.innerHTML).toEqual(mock.results[0].data.content.display_name);
+      expect(firstCourse.href).toContain(mock.results[0].data.url);
+      expect(firstCourse).not.toHaveAttribute('target', '_blank');
+      expect(firstCourse).not.toHaveAttribute('rel', 'nofollow');
+    });
+
+    it('should render correct link if is External url course', () => {
+      const courses = screen.getAllByRole('link');
+      const externalCourse = courses[courses.length - 1];
+      const externalCourseTitle = externalCourse.querySelector('.courseware-search-results__title span');
+      expect(externalCourseTitle.innerHTML).toEqual(mock.results[mock.results.length - 1].data.content.display_name);
+      expect(externalCourse.href).toContain(mock.results[mock.results.length - 1].data.url);
+      expect(externalCourse).toHaveAttribute('target', '_blank');
+      expect(externalCourse).toHaveAttribute('rel', 'nofollow');
+      const icon = externalCourse.querySelector('svg');
+      expect(icon).toBeInTheDocument();
+    });
+
+    it('should render location breadcrumbs', () => {
+      const breadcrumbs = screen.getAllByText(mock.results[0].data.location[0]);
+      expect(breadcrumbs.length).toBeGreaterThan(0);
+      const firstBreadcrumb = breadcrumbs[0].closest('li');
+      expect(firstBreadcrumb).toBeInTheDocument();
+      expect(firstBreadcrumb.querySelector('div').textContent).toBe(mock.results[0].data.location[0]);
+      expect(firstBreadcrumb.nextSibling.querySelector('div').textContent).toBe(mock.results[0].data.location[1]);
+    });
+  });
+
+  describe('when results are provided with content hits', () => {
+    beforeEach(() => {
+      const { results } = searchResultsFactory('Passing');
+      renderComponent({ results });
+    });
+
+    it('should render content hits', () => {
+      const contentHits = screen.getByText('1');
+      expect(contentHits).toBeInTheDocument();
+      expect(contentHits.tagName).toBe('EM');
    });
  });
 });
--- a/src/course-home/courseware-search/snapshots/CoursewareSearchEmpty.test.jsx.snap
+++ b/src/course-home/courseware-search/snapshots/CoursewareSearchEmpty.test.jsx.snap
@@ -1,10 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`CoursewareSearchEmpty should match the snapshot 1`] = `
-<p
-  class="courseware-search-results__empty"
-  data-testid="no-results"
->
-  No results found.
-</p>
-`;
--- a/src/course-home/courseware-search/snapshots/CoursewareSearchResults.test.jsx.snap
+++ b/src/course-home/courseware-search/snapshots/CoursewareSearchResults.test.jsx.snap
@@ -1,1238 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`CoursewareSearchResults when list of results is provided should match the snapshot 1`] = `
-<div
-  class="courseware-search-results"
-  data-testid="search-results"
->
-  <a
-    class="courseware-search-results__item"
-    href="http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@sequential+block@edx_introduction"
-  >
-    <div
-      class="courseware-search-results__icon"
-    >
-      <span
-        class="pgn__icon"
-      >
-        <svg
-          aria-hidden="true"
-          fill="none"
-          focusable="false"
-          height="24"
-          role="img"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M10 4H2v16h20V6H12l-2-2z"
-            fill="currentColor"
-          />
-        </svg>
-      </span>
-    </div>
-    <div
-      class="courseware-search-results__info"
-    >
-      <div
-        class="courseware-search-results__title"
-      >
-        <span>
-          Demo Course Overview
-        </span>
-      </div>
-      <ul
-        class="courseware-search-results__breadcrumbs"
-      >
-        <li>
-          <div>
-            Introduction
-          </div>
-        </li>
-        <li>
-          <div>
-            Demo Course Overview
-          </div>
-        </li>
-      </ul>
-    </div>
-  </a>
-  <a
-    class="courseware-search-results__item"
-    href="http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@html+block@5e009378f0b64585baa0a14b155974b9"
-  >
-    <div
-      class="courseware-search-results__icon"
-    >
-      <span
-        class="pgn__icon"
-      >
-        <svg
-          aria-hidden="true"
-          fill="none"
-          focusable="false"
-          height="24"
-          role="img"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M2.5 4v3h5v12h3V7h5V4h-13zm19 5h-9v3h3v7h3v-7h3V9z"
-            fill="currentColor"
-          />
-        </svg>
-      </span>
-    </div>
-    <div
-      class="courseware-search-results__info"
-    >
-      <div
-        class="courseware-search-results__title"
-      >
-        <span>
-          Passing a Course
-        </span>
-        <em>
-          1
-        </em>
-      </div>
-      <ul
-        class="courseware-search-results__breadcrumbs"
-      >
-        <li>
-          <div>
-            About Exams and Certificates
-          </div>
-        </li>
-        <li>
-          <div>
-            edX Exams
-          </div>
-        </li>
-        <li>
-          <div>
-            Passing a Course
-          </div>
-        </li>
-      </ul>
-    </div>
-  </a>
-  <a
-    class="courseware-search-results__item"
-    href="http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@vertical+block@c7e98fd39a6944edb6b286c32e1150ff"
-  >
-    <div
-      class="courseware-search-results__icon"
-    >
-      <span
-        class="pgn__icon"
-      >
-        <svg
-          aria-hidden="true"
-          fill="none"
-          focusable="false"
-          height="24"
-          role="img"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M10 4H2v16h20V6H12l-2-2z"
-            fill="currentColor"
-          />
-        </svg>
-      </span>
-    </div>
-    <div
-      class="courseware-search-results__info"
-    >
-      <div
-        class="courseware-search-results__title"
-      >
-        <span>
-          Passing a Course
-        </span>
-      </div>
-      <ul
-        class="courseware-search-results__breadcrumbs"
-      >
-        <li>
-          <div>
-            About Exams and Certificates
-          </div>
-        </li>
-        <li>
-          <div>
-            edX Exams
-          </div>
-        </li>
-        <li>
-          <div>
-            Passing a Course
-          </div>
-        </li>
-      </ul>
-    </div>
-  </a>
-  <a
-    class="courseware-search-results__item"
-    href="http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@problem+block@0d759dee4f9d459c8956136dbde55f02"
-  >
-    <div
-      class="courseware-search-results__icon"
-    >
-      <span
-        class="pgn__icon"
-      >
-        <svg
-          aria-hidden="true"
-          fill="none"
-          focusable="false"
-          height="24"
-          role="img"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M3 3v18h18V3H3Zm11 14H7v-2h7v2Zm3-4H7v-2h10v2Zm0-4H7V7h10v2Z"
-            fill="currentColor"
-          />
-        </svg>
-      </span>
-    </div>
-    <div
-      class="courseware-search-results__info"
-    >
-      <div
-        class="courseware-search-results__title"
-      >
-        <span>
-          Text Input
-        </span>
-      </div>
-      <ul
-        class="courseware-search-results__breadcrumbs"
-      >
-        <li>
-          <div>
-            Example Week 1: Getting Started
-          </div>
-        </li>
-        <li>
-          <div>
-            Homework - Question Styles
-          </div>
-        </li>
-        <li>
-          <div>
-            Text input
-          </div>
-        </li>
-      </ul>
-    </div>
-  </a>
-  <a
-    class="courseware-search-results__item"
-    href="http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@problem+block@c554538a57664fac80783b99d9d6da7c"
-  >
-    <div
-      class="courseware-search-results__icon"
-    >
-      <span
-        class="pgn__icon"
-      >
-        <svg
-          aria-hidden="true"
-          fill="none"
-          focusable="false"
-          height="24"
-          role="img"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M3 3v18h18V3H3Zm11 14H7v-2h7v2Zm3-4H7v-2h10v2Zm0-4H7V7h10v2Z"
-            fill="currentColor"
-          />
-        </svg>
-      </span>
-    </div>
-    <div
-      class="courseware-search-results__info"
-    >
-      <div
-        class="courseware-search-results__title"
-      >
-        <span>
-          Pointing on a Picture
-        </span>
-      </div>
-      <ul
-        class="courseware-search-results__breadcrumbs"
-      >
-        <li>
-          <div>
-            Example Week 1: Getting Started
-          </div>
-        </li>
-        <li>
-          <div>
-            Homework - Question Styles
-          </div>
-        </li>
-        <li>
-          <div>
-            Pointing on a Picture
-          </div>
-        </li>
-      </ul>
-    </div>
-  </a>
-  <a
-    class="courseware-search-results__item"
-    href="http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@problem+block@45d46192272c4f6db6b63586520bbdf4"
-  >
-    <div
-      class="courseware-search-results__icon"
-    >
-      <span
-        class="pgn__icon"
-      >
-        <svg
-          aria-hidden="true"
-          fill="none"
-          focusable="false"
-          height="24"
-          role="img"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M3 3v18h18V3H3Zm11 14H7v-2h7v2Zm3-4H7v-2h10v2Zm0-4H7V7h10v2Z"
-            fill="currentColor"
-          />
-        </svg>
-      </span>
-    </div>
-    <div
-      class="courseware-search-results__info"
-    >
-      <div
-        class="courseware-search-results__title"
-      >
-        <span>
-          Getting Answers
-        </span>
-      </div>
-      <ul
-        class="courseware-search-results__breadcrumbs"
-      >
-        <li>
-          <div>
-            About Exams and Certificates
-          </div>
-        </li>
-        <li>
-          <div>
-            edX Exams
-          </div>
-        </li>
-        <li>
-          <div>
-            Getting Answers
-          </div>
-        </li>
-      </ul>
-    </div>
-  </a>
-  <a
-    class="courseware-search-results__item"
-    href="http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@video+block@0b9e39477cf34507a7a48f74be381fdd"
-  >
-    <div
-      class="courseware-search-results__icon"
-    >
-      <span
-        class="pgn__icon"
-      >
-        <svg
-          aria-hidden="true"
-          fill="none"
-          focusable="false"
-          height="24"
-          role="img"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M17 10.5V6H3v12h14v-4.5l4 4v-11l-4 4Z"
-            fill="currentColor"
-          />
-        </svg>
-      </span>
-    </div>
-    <div
-      class="courseware-search-results__info"
-    >
-      <div
-        class="courseware-search-results__title"
-      >
-        <span>
-          Welcome!
-        </span>
-        <em>
-          30
-        </em>
-      </div>
-      <ul
-        class="courseware-search-results__breadcrumbs"
-      >
-        <li>
-          <div>
-            Introduction
-          </div>
-        </li>
-        <li>
-          <div>
-            Demo Course Overview
-          </div>
-        </li>
-        <li>
-          <div>
-            Introduction: Video and Sequences
-          </div>
-        </li>
-      </ul>
-    </div>
-  </a>
-  <a
-    class="courseware-search-results__item"
-    href="http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@problem+block@a0effb954cca4759994f1ac9e9434bf4"
-  >
-    <div
-      class="courseware-search-results__icon"
-    >
-      <span
-        class="pgn__icon"
-      >
-        <svg
-          aria-hidden="true"
-          fill="none"
-          focusable="false"
-          height="24"
-          role="img"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M3 3v18h18V3H3Zm11 14H7v-2h7v2Zm3-4H7v-2h10v2Zm0-4H7V7h10v2Z"
-            fill="currentColor"
-          />
-        </svg>
-      </span>
-    </div>
-    <div
-      class="courseware-search-results__info"
-    >
-      <div
-        class="courseware-search-results__title"
-      >
-        <span>
-          Multiple Choice Questions
-        </span>
-      </div>
-      <ul
-        class="courseware-search-results__breadcrumbs"
-      >
-        <li>
-          <div>
-            Example Week 1: Getting Started
-          </div>
-        </li>
-        <li>
-          <div>
-            Homework - Question Styles
-          </div>
-        </li>
-        <li>
-          <div>
-            Multiple Choice Questions
-          </div>
-        </li>
-      </ul>
-    </div>
-  </a>
-  <a
-    class="courseware-search-results__item"
-    href="http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@problem+block@75f9562c77bc4858b61f907bb810d974"
-  >
-    <div
-      class="courseware-search-results__icon"
-    >
-      <span
-        class="pgn__icon"
-      >
-        <svg
-          aria-hidden="true"
-          fill="none"
-          focusable="false"
-          height="24"
-          role="img"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M3 3v18h18V3H3Zm11 14H7v-2h7v2Zm3-4H7v-2h10v2Zm0-4H7V7h10v2Z"
-            fill="currentColor"
-          />
-        </svg>
-      </span>
-    </div>
-    <div
-      class="courseware-search-results__info"
-    >
-      <div
-        class="courseware-search-results__title"
-      >
-        <span>
-          Numerical Input
-        </span>
-      </div>
-      <ul
-        class="courseware-search-results__breadcrumbs"
-      >
-        <li>
-          <div>
-            Example Week 1: Getting Started
-          </div>
-        </li>
-        <li>
-          <div>
-            Homework - Question Styles
-          </div>
-        </li>
-        <li>
-          <div>
-            Numerical Input
-          </div>
-        </li>
-      </ul>
-    </div>
-  </a>
-  <a
-    class="courseware-search-results__item"
-    href="http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@video+block@636541acbae448d98ab484b028c9a7f6"
-  >
-    <div
-      class="courseware-search-results__icon"
-    >
-      <span
-        class="pgn__icon"
-      >
-        <svg
-          aria-hidden="true"
-          fill="none"
-          focusable="false"
-          height="24"
-          role="img"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M17 10.5V6H3v12h14v-4.5l4 4v-11l-4 4Z"
-            fill="currentColor"
-          />
-        </svg>
-      </span>
-    </div>
-    <div
-      class="courseware-search-results__info"
-    >
-      <div
-        class="courseware-search-results__title"
-      >
-        <span>
-          Connecting a Circuit and a Circuit Diagram
-        </span>
-        <em>
-          3
-        </em>
-      </div>
-      <ul
-        class="courseware-search-results__breadcrumbs"
-      >
-        <li>
-          <div>
-            Example Week 1: Getting Started
-          </div>
-        </li>
-        <li>
-          <div>
-            Lesson 1 - Getting Started
-          </div>
-        </li>
-        <li>
-          <div>
-            Video Presentation Styles
-          </div>
-        </li>
-      </ul>
-    </div>
-  </a>
-  <a
-    class="courseware-search-results__item"
-    href="http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@problem+block@python_grader"
-  >
-    <div
-      class="courseware-search-results__icon"
-    >
-      <span
-        class="pgn__icon"
-      >
-        <svg
-          aria-hidden="true"
-          fill="none"
-          focusable="false"
-          height="24"
-          role="img"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M3 3v18h18V3H3Zm11 14H7v-2h7v2Zm3-4H7v-2h10v2Zm0-4H7V7h10v2Z"
-            fill="currentColor"
-          />
-        </svg>
-      </span>
-    </div>
-    <div
-      class="courseware-search-results__info"
-    >
-      <div
-        class="courseware-search-results__title"
-      >
-        <span>
-          CAPA
-        </span>
-      </div>
-      <ul
-        class="courseware-search-results__breadcrumbs"
-      >
-        <li>
-          <div>
-            Example Week 2: Get Interactive
-          </div>
-        </li>
-        <li>
-          <div>
-            Homework - Labs and Demos
-          </div>
-        </li>
-        <li>
-          <div>
-            Code Grader
-          </div>
-        </li>
-      </ul>
-    </div>
-  </a>
-  <a
-    class="courseware-search-results__item"
-    href="http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@problem+block@9cee77a606ea4c1aa5440e0ea5d0f618"
-  >
-    <div
-      class="courseware-search-results__icon"
-    >
-      <span
-        class="pgn__icon"
-      >
-        <svg
-          aria-hidden="true"
-          fill="none"
-          focusable="false"
-          height="24"
-          role="img"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M3 3v18h18V3H3Zm11 14H7v-2h7v2Zm3-4H7v-2h10v2Zm0-4H7V7h10v2Z"
-            fill="currentColor"
-          />
-        </svg>
-      </span>
-    </div>
-    <div
-      class="courseware-search-results__info"
-    >
-      <div
-        class="courseware-search-results__title"
-      >
-        <span>
-          Interactive Questions
-        </span>
-      </div>
-      <ul
-        class="courseware-search-results__breadcrumbs"
-      >
-        <li>
-          <div>
-            Example Week 1: Getting Started
-          </div>
-        </li>
-        <li>
-          <div>
-            Lesson 1 - Getting Started
-          </div>
-        </li>
-        <li>
-          <div>
-            Interactive Questions
-          </div>
-        </li>
-      </ul>
-    </div>
-  </a>
-  <a
-    class="courseware-search-results__item"
-    href="http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@html+block@030e35c4756a4ddc8d40b95fbbfff4d4"
-  >
-    <div
-      class="courseware-search-results__icon"
-    >
-      <span
-        class="pgn__icon"
-      >
-        <svg
-          aria-hidden="true"
-          fill="none"
-          focusable="false"
-          height="24"
-          role="img"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M2.5 4v3h5v12h3V7h5V4h-13zm19 5h-9v3h3v7h3v-7h3V9z"
-            fill="currentColor"
-          />
-        </svg>
-      </span>
-    </div>
-    <div
-      class="courseware-search-results__info"
-    >
-      <div
-        class="courseware-search-results__title"
-      >
-        <span>
-          Blank HTML Page
-        </span>
-        <em>
-          6
-        </em>
-      </div>
-      <ul
-        class="courseware-search-results__breadcrumbs"
-      >
-        <li>
-          <div>
-            Introduction
-          </div>
-        </li>
-        <li>
-          <div>
-            Demo Course Overview
-          </div>
-        </li>
-        <li>
-          <div>
-            Introduction: Video and Sequences
-          </div>
-        </li>
-      </ul>
-    </div>
-  </a>
-  <a
-    class="courseware-search-results__item"
-    href="http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@html+block@html_49b4494da2f7"
-  >
-    <div
-      class="courseware-search-results__icon"
-    >
-      <span
-        class="pgn__icon"
-      >
-        <svg
-          aria-hidden="true"
-          fill="none"
-          focusable="false"
-          height="24"
-          role="img"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M2.5 4v3h5v12h3V7h5V4h-13zm19 5h-9v3h3v7h3v-7h3V9z"
-            fill="currentColor"
-          />
-        </svg>
-      </span>
-    </div>
-    <div
-      class="courseware-search-results__info"
-    >
-      <div
-        class="courseware-search-results__title"
-      >
-        <span>
-          Discussion Forums
-        </span>
-        <em>
-          5
-        </em>
-      </div>
-      <ul
-        class="courseware-search-results__breadcrumbs"
-      >
-        <li>
-          <div>
-            Example Week 3: Be Social
-          </div>
-        </li>
-        <li>
-          <div>
-            Lesson 3 - Be Social
-          </div>
-        </li>
-        <li>
-          <div>
-            Discussion Forums
-          </div>
-        </li>
-      </ul>
-    </div>
-  </a>
-  <a
-    class="courseware-search-results__item"
-    href="http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@html+block@f4a39219742149f781a1dda6f43a623c"
-  >
-    <div
-      class="courseware-search-results__icon"
-    >
-      <span
-        class="pgn__icon"
-      >
-        <svg
-          aria-hidden="true"
-          fill="none"
-          focusable="false"
-          height="24"
-          role="img"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M2.5 4v3h5v12h3V7h5V4h-13zm19 5h-9v3h3v7h3v-7h3V9z"
-            fill="currentColor"
-          />
-        </svg>
-      </span>
-    </div>
-    <div
-      class="courseware-search-results__info"
-    >
-      <div
-        class="courseware-search-results__title"
-      >
-        <span>
-          Overall Grade
-        </span>
-        <em>
-          7
-        </em>
-      </div>
-      <ul
-        class="courseware-search-results__breadcrumbs"
-      >
-        <li>
-          <div>
-            About Exams and Certificates
-          </div>
-        </li>
-        <li>
-          <div>
-            edX Exams
-          </div>
-        </li>
-        <li>
-          <div>
-            Overall Grade Performance
-          </div>
-        </li>
-      </ul>
-    </div>
-  </a>
-  <a
-    class="courseware-search-results__item"
-    href="http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@html+block@87fa6792d79f4862be098e5169e93339"
-  >
-    <div
-      class="courseware-search-results__icon"
-    >
-      <span
-        class="pgn__icon"
-      >
-        <svg
-          aria-hidden="true"
-          fill="none"
-          focusable="false"
-          height="24"
-          role="img"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M2.5 4v3h5v12h3V7h5V4h-13zm19 5h-9v3h3v7h3v-7h3V9z"
-            fill="currentColor"
-          />
-        </svg>
-      </span>
-    </div>
-    <div
-      class="courseware-search-results__info"
-    >
-      <div
-        class="courseware-search-results__title"
-      >
-        <span>
-          Blank HTML Page
-        </span>
-        <em>
-          3
-        </em>
-      </div>
-      <ul
-        class="courseware-search-results__breadcrumbs"
-      >
-        <li>
-          <div>
-            Example Week 3: Be Social
-          </div>
-        </li>
-        <li>
-          <div>
-            Lesson 3 - Be Social
-          </div>
-        </li>
-        <li>
-          <div>
-            Homework - Find Your Study Buddy
-          </div>
-        </li>
-      </ul>
-    </div>
-  </a>
-  <a
-    class="courseware-search-results__item"
-    href="http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@html+block@6018785795994726950614ce7d0f38c5"
-  >
-    <div
-      class="courseware-search-results__icon"
-    >
-      <span
-        class="pgn__icon"
-      >
-        <svg
-          aria-hidden="true"
-          fill="none"
-          focusable="false"
-          height="24"
-          role="img"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M2.5 4v3h5v12h3V7h5V4h-13zm19 5h-9v3h3v7h3v-7h3V9z"
-            fill="currentColor"
-          />
-        </svg>
-      </span>
-    </div>
-    <div
-      class="courseware-search-results__info"
-    >
-      <div
-        class="courseware-search-results__title"
-      >
-        <span>
-          Find Your Study Buddy
-        </span>
-        <em>
-          3
-        </em>
-      </div>
-      <ul
-        class="courseware-search-results__breadcrumbs"
-      >
-        <li>
-          <div>
-            Example Week 3: Be Social
-          </div>
-        </li>
-        <li>
-          <div>
-            Homework - Find Your Study Buddy
-          </div>
-        </li>
-        <li>
-          <div>
-            Homework - Find Your Study Buddy
-          </div>
-        </li>
-      </ul>
-    </div>
-  </a>
-  <a
-    class="courseware-search-results__item"
-    href="http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@html+block@f9f3a25e7bab46e583fd1fbbd7a2f6a0"
-  >
-    <div
-      class="courseware-search-results__icon"
-    >
-      <span
-        class="pgn__icon"
-      >
-        <svg
-          aria-hidden="true"
-          fill="none"
-          focusable="false"
-          height="24"
-          role="img"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M2.5 4v3h5v12h3V7h5V4h-13zm19 5h-9v3h3v7h3v-7h3V9z"
-            fill="currentColor"
-          />
-        </svg>
-      </span>
-    </div>
-    <div
-      class="courseware-search-results__info"
-    >
-      <div
-        class="courseware-search-results__title"
-      >
-        <span>
-          Be Social
-        </span>
-        <em>
-          4
-        </em>
-      </div>
-      <ul
-        class="courseware-search-results__breadcrumbs"
-      >
-        <li>
-          <div>
-            Example Week 3: Be Social
-          </div>
-        </li>
-        <li>
-          <div>
-            Lesson 3 - Be Social
-          </div>
-        </li>
-        <li>
-          <div>
-            Be Social
-          </div>
-        </li>
-      </ul>
-    </div>
-  </a>
-  <a
-    class="courseware-search-results__item"
-    href="http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@html+block@8293139743f34377817d537b69911530"
-  >
-    <div
-      class="courseware-search-results__icon"
-    >
-      <span
-        class="pgn__icon"
-      >
-        <svg
-          aria-hidden="true"
-          fill="none"
-          focusable="false"
-          height="24"
-          role="img"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M2.5 4v3h5v12h3V7h5V4h-13zm19 5h-9v3h3v7h3v-7h3V9z"
-            fill="currentColor"
-          />
-        </svg>
-      </span>
-    </div>
-    <div
-      class="courseware-search-results__info"
-    >
-      <div
-        class="courseware-search-results__title"
-      >
-        <span>
-          EdX Exams
-        </span>
-        <em>
-          4
-        </em>
-      </div>
-      <ul
-        class="courseware-search-results__breadcrumbs"
-      >
-        <li>
-          <div>
-            About Exams and Certificates
-          </div>
-        </li>
-        <li>
-          <div>
-            edX Exams
-          </div>
-        </li>
-        <li>
-          <div>
-            EdX Exams
-          </div>
-        </li>
-      </ul>
-    </div>
-  </a>
-  <a
-    class="courseware-search-results__item"
-    href="http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@html+block@9d5104b502f24ee89c3d2f4ce9d347cf"
-  >
-    <div
-      class="courseware-search-results__icon"
-    >
-      <span
-        class="pgn__icon"
-      >
-        <svg
-          aria-hidden="true"
-          fill="none"
-          focusable="false"
-          height="24"
-          role="img"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M2.5 4v3h5v12h3V7h5V4h-13zm19 5h-9v3h3v7h3v-7h3V9z"
-            fill="currentColor"
-          />
-        </svg>
-      </span>
-    </div>
-    <div
-      class="courseware-search-results__info"
-    >
-      <div
-        class="courseware-search-results__title"
-      >
-        <span>
-          When Are Your Exams? 
-        </span>
-        <em>
-          2
-        </em>
-      </div>
-      <ul
-        class="courseware-search-results__breadcrumbs"
-      >
-        <li>
-          <div>
-            Example Week 1: Getting Started
-          </div>
-        </li>
-        <li>
-          <div>
-            Lesson 1 - Getting Started
-          </div>
-        </li>
-        <li>
-          <div>
-            When Are Your Exams? 
-          </div>
-        </li>
-      </ul>
-    </div>
-  </a>
-  <a
-    class="courseware-search-results__item"
-    href="https://www.edx.org"
-    rel="nofollow"
-    target="_blank"
-  >
-    <div
-      class="courseware-search-results__icon"
-    >
-      <span
-        class="pgn__icon"
-      >
-        <svg
-          aria-hidden="true"
-          fill="none"
-          focusable="false"
-          height="24"
-          role="img"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M3 3v18h18V3H3Zm11 14H7v-2h7v2Zm3-4H7v-2h10v2Zm0-4H7V7h10v2Z"
-            fill="currentColor"
-          />
-        </svg>
-      </span>
-    </div>
-    <div
-      class="courseware-search-results__info"
-    >
-      <div
-        class="courseware-search-results__title"
-      >
-        <span>
-          External Course Link Test
-        </span>
-      </div>
-    </div>
-  </a>
-</div>
-`;
--- a/src/course-home/courseware-search/snapshots/map-search-response.test.js.snap
+++ b/src/course-home/courseware-search/snapshots/map-search-response.test.js.snap
@@ -1,306 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`mapSearchResponse when the response is correct should match snapshot 1`] = `
-{
-  "filters": [
-    {
-      "count": 7,
-      "key": "capa",
-      "label": "CAPA",
-    },
-    {
-      "count": 2,
-      "key": "sequence",
-      "label": "Sequence",
-    },
-    {
-      "count": 9,
-      "key": "text",
-      "label": "Text",
-    },
-    {
-      "count": 1,
-      "key": "unknown",
-      "label": "Unknown",
-    },
-    {
-      "count": 2,
-      "key": "video",
-      "label": "Video",
-    },
-  ],
-  "maxScore": 3.4545178,
-  "ms": 5,
-  "results": [
-    {
-      "contentHits": 0,
-      "id": "block-v1:edX+DemoX+Demo_Course+type@sequential+block@edx_introduction",
-      "location": [
-        "Introduction",
-        "Demo Course Overview",
-      ],
-      "score": 3.4545178,
-      "title": "Demo Course Overview",
-      "type": "sequence",
-      "url": "/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@sequential+block@edx_introduction",
-    },
-    {
-      "contentHits": 0,
-      "id": "block-v1:edX+DemoX+Demo_Course+type@html+block@5e009378f0b64585baa0a14b155974b9",
-      "location": [
-        "About Exams and Certificates",
-        "edX Exams",
-        "Passing a Course",
-      ],
-      "score": 3.4545178,
-      "title": "Passing a Course",
-      "type": "text",
-      "url": "/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@html+block@5e009378f0b64585baa0a14b155974b9",
-    },
-    {
-      "contentHits": 0,
-      "id": "block-v1:edX+DemoX+Demo_Course+type@vertical+block@c7e98fd39a6944edb6b286c32e1150ff",
-      "location": [
-        "About Exams and Certificates",
-        "edX Exams",
-        "Passing a Course",
-      ],
-      "score": 3.4545178,
-      "title": "Passing a Course",
-      "type": "sequence",
-      "url": "/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@vertical+block@c7e98fd39a6944edb6b286c32e1150ff",
-    },
-    {
-      "contentHits": 0,
-      "id": "block-v1:edX+DemoX+Demo_Course+type@problem+block@0d759dee4f9d459c8956136dbde55f02",
-      "location": [
-        "Example Week 1: Getting Started",
-        "Homework - Question Styles",
-        "Text input",
-      ],
-      "score": 1.5874016,
-      "title": "Text Input",
-      "type": "capa",
-      "url": "/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@problem+block@0d759dee4f9d459c8956136dbde55f02",
-    },
-    {
-      "contentHits": 0,
-      "id": "block-v1:edX+DemoX+Demo_Course+type@problem+block@c554538a57664fac80783b99d9d6da7c",
-      "location": [
-        "Example Week 1: Getting Started",
-        "Homework - Question Styles",
-        "Pointing on a Picture",
-      ],
-      "score": 1.5499392,
-      "title": "Pointing on a Picture",
-      "type": "capa",
-      "url": "/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@problem+block@c554538a57664fac80783b99d9d6da7c",
-    },
-    {
-      "contentHits": 0,
-      "id": "block-v1:edX+DemoX+Demo_Course+type@problem+block@45d46192272c4f6db6b63586520bbdf4",
-      "location": [
-        "About Exams and Certificates",
-        "edX Exams",
-        "Getting Answers",
-      ],
-      "score": 1.5003732,
-      "title": "Getting Answers",
-      "type": "capa",
-      "url": "/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@problem+block@45d46192272c4f6db6b63586520bbdf4",
-    },
-    {
-      "contentHits": 0,
-      "id": "block-v1:edX+DemoX+Demo_Course+type@video+block@0b9e39477cf34507a7a48f74be381fdd",
-      "location": [
-        "Introduction",
-        "Demo Course Overview",
-        "Introduction: Video and Sequences",
-      ],
-      "score": 1.4792063,
-      "title": "Welcome!",
-      "type": "video",
-      "url": "/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@video+block@0b9e39477cf34507a7a48f74be381fdd",
-    },
-    {
-      "contentHits": 0,
-      "id": "block-v1:edX+DemoX+Demo_Course+type@problem+block@a0effb954cca4759994f1ac9e9434bf4",
-      "location": [
-        "Example Week 1: Getting Started",
-        "Homework - Question Styles",
-        "Multiple Choice Questions",
-      ],
-      "score": 1.4341705,
-      "title": "Multiple Choice Questions",
-      "type": "capa",
-      "url": "/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@problem+block@a0effb954cca4759994f1ac9e9434bf4",
-    },
-    {
-      "contentHits": 0,
-      "id": "block-v1:edX+DemoX+Demo_Course+type@problem+block@75f9562c77bc4858b61f907bb810d974",
-      "location": [
-        "Example Week 1: Getting Started",
-        "Homework - Question Styles",
-        "Numerical Input",
-      ],
-      "score": 1.2987298,
-      "title": "Numerical Input",
-      "type": "capa",
-      "url": "/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@problem+block@75f9562c77bc4858b61f907bb810d974",
-    },
-    {
-      "contentHits": 0,
-      "id": "block-v1:edX+DemoX+Demo_Course+type@video+block@636541acbae448d98ab484b028c9a7f6",
-      "location": [
-        "Example Week 1: Getting Started",
-        "Lesson 1 - Getting Started",
-        "Video Presentation Styles",
-      ],
-      "score": 1.1870136,
-      "title": "Connecting a Circuit and a Circuit Diagram",
-      "type": "video",
-      "url": "/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@video+block@636541acbae448d98ab484b028c9a7f6",
-    },
-    {
-      "contentHits": 0,
-      "id": "block-v1:edX+DemoX+Demo_Course+type@problem+block@python_grader",
-      "location": [
-        "Example Week 2: Get Interactive",
-        "Homework - Labs and Demos",
-        "Code Grader",
-      ],
-      "score": 1.0107487,
-      "title": "CAPA",
-      "type": "capa",
-      "url": "/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@problem+block@python_grader",
-    },
-    {
-      "contentHits": 0,
-      "id": "block-v1:edX+DemoX+Demo_Course+type@problem+block@9cee77a606ea4c1aa5440e0ea5d0f618",
-      "location": [
-        "Example Week 1: Getting Started",
-        "Lesson 1 - Getting Started",
-        "Interactive Questions",
-      ],
-      "score": 0.96387196,
-      "title": "Interactive Questions",
-      "type": "capa",
-      "url": "/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@problem+block@9cee77a606ea4c1aa5440e0ea5d0f618",
-    },
-    {
-      "contentHits": 0,
-      "id": "block-v1:edX+DemoX+Demo_Course+type@html+block@030e35c4756a4ddc8d40b95fbbfff4d4",
-      "location": [
-        "Introduction",
-        "Demo Course Overview",
-        "Introduction: Video and Sequences",
-      ],
-      "score": 0.8844358,
-      "title": "Blank HTML Page",
-      "type": "text",
-      "url": "/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@html+block@030e35c4756a4ddc8d40b95fbbfff4d4",
-    },
-    {
-      "contentHits": 0,
-      "id": "block-v1:edX+DemoX+Demo_Course+type@html+block@html_49b4494da2f7",
-      "location": [
-        "Example Week 3: Be Social",
-        "Lesson 3 - Be Social",
-        "Discussion Forums",
-      ],
-      "score": 0.8803684,
-      "title": "Discussion Forums",
-      "type": "text",
-      "url": "/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@html+block@html_49b4494da2f7",
-    },
-    {
-      "contentHits": 0,
-      "id": "block-v1:edX+DemoX+Demo_Course+type@html+block@f4a39219742149f781a1dda6f43a623c",
-      "location": [
-        "About Exams and Certificates",
-        "edX Exams",
-        "Overall Grade Performance",
-      ],
-      "score": 0.87981963,
-      "title": "Overall Grade",
-      "type": "text",
-      "url": "/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@html+block@f4a39219742149f781a1dda6f43a623c",
-    },
-    {
-      "contentHits": 0,
-      "id": "block-v1:edX+DemoX+Demo_Course+type@html+block@87fa6792d79f4862be098e5169e93339",
-      "location": [
-        "Example Week 3: Be Social",
-        "Lesson 3 - Be Social",
-        "Homework - Find Your Study Buddy",
-      ],
-      "score": 0.84284115,
-      "title": "Blank HTML Page",
-      "type": "text",
-      "url": "/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@html+block@87fa6792d79f4862be098e5169e93339",
-    },
-    {
-      "contentHits": 0,
-      "id": "block-v1:edX+DemoX+Demo_Course+type@html+block@6018785795994726950614ce7d0f38c5",
-      "location": [
-        "Example Week 3: Be Social",
-        "Homework - Find Your Study Buddy",
-        "Homework - Find Your Study Buddy",
-      ],
-      "score": 0.84284115,
-      "title": "Find Your Study Buddy",
-      "type": "text",
-      "url": "/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@html+block@6018785795994726950614ce7d0f38c5",
-    },
-    {
-      "contentHits": 0,
-      "id": "block-v1:edX+DemoX+Demo_Course+type@html+block@f9f3a25e7bab46e583fd1fbbd7a2f6a0",
-      "location": [
-        "Example Week 3: Be Social",
-        "Lesson 3 - Be Social",
-        "Be Social",
-      ],
-      "score": 0.84210813,
-      "title": "Be Social",
-      "type": "text",
-      "url": "/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@html+block@f9f3a25e7bab46e583fd1fbbd7a2f6a0",
-    },
-    {
-      "contentHits": 0,
-      "id": "block-v1:edX+DemoX+Demo_Course+type@html+block@8293139743f34377817d537b69911530",
-      "location": [
-        "About Exams and Certificates",
-        "edX Exams",
-        "EdX Exams",
-      ],
-      "score": 0.8306555,
-      "title": "EdX Exams",
-      "type": "text",
-      "url": "/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@html+block@8293139743f34377817d537b69911530",
-    },
-    {
-      "contentHits": 0,
-      "id": "block-v1:edX+DemoX+Demo_Course+type@html+block@9d5104b502f24ee89c3d2f4ce9d347cf",
-      "location": [
-        "Example Week 1: Getting Started",
-        "Lesson 1 - Getting Started",
-        "When Are Your Exams? ",
-      ],
-      "score": 0.82610154,
-      "title": "When Are Your Exams? ",
-      "type": "text",
-      "url": "/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+DemoX+Demo_Course+type@html+block@9d5104b502f24ee89c3d2f4ce9d347cf",
-    },
-    {
-      "contentHits": 0,
-      "id": "random-element-id",
-      "location": null,
-      "score": 0.82610154,
-      "title": "External Course Link Test",
-      "type": "unknown",
-      "url": "https://www.edx.org",
-    },
-  ],
-  "total": 29,
-}
-`;
--- a/src/course-home/courseware-search/courseware-search.scss
+++ b/src/course-home/courseware-search/courseware-search.scss
@@ -9,8 +9,8 @@
  height: 100%;
  max-width: none;
  margin: 0;
-  border-top: 1px solid $light-300;
-  z-index: $zindex-modal; // Bootstrap's z-index layer for Modals.
+  border-top: 1px solid var(--pgn-color-light-300);
+  z-index: var(--pgn-elevation-modal-zindex); // Bootstrap's z-index layer for Modals.

  &__form {
    position: relative;
@@ -47,7 +47,7 @@

  &__results-summary {
    font-size: .9rem;
-    color: $gray-500;
+    color: var(--pgn-color-gray-500);
    padding: 1rem 0 .5rem;
  }

@@ -62,7 +62,7 @@
  margin-top: 1.5rem;

  &__empty {
-    color: $gray-500;
+    color: var(--pgn-color-gray-500);
    padding: 6rem 0;
    text-align: center;
  }
@@ -76,17 +76,17 @@

    &:hover {
      text-decoration: none;
-      background: $light-300;
+      background: var(--pgn-color-light-300);
    }

    &:not(:first-child) {
-      border-top: 1px solid $light-300;
+      border-top: 1px solid var(--pgn-color-light-300);
    }
  }

  &__icon {
    padding: 0.375rem 0 0 0.375rem;
-    color: $gray-300;
+    color: var(--pgn-color-gray-300);
  }

  &__info {
@@ -99,7 +99,7 @@
    align-items: center;
    line-height: 2.5;
    font-size: 0.875rem;
-    color: $black;
+    color: var(--pgn-color-black);

    > span {
      display: block;
@@ -113,7 +113,7 @@
      font-variant-numeric: lining-nums tabular-nums;
      min-width: 1.25rem;
      line-height: 1rem;
-      background: $light-300;
+      background: var(--pgn-color-light-300);
      border-radius: 99rem;
      font-style: normal;
      margin-left: 0.375rem;
@@ -125,7 +125,7 @@
  &__breadcrumbs {
    display: flex;
    gap: 1.25rem;
-    color: $gray-500;
+    color: var(--pgn-color-gray-500);
    overflow: hidden;
    list-style: none;
    padding: 0;
@@ -156,14 +156,14 @@
 }

 .courseware-search-results-tabs {
-  border-bottom-color: $gray-400 !important;
+  border-bottom-color: var(--pgn-color-gray-400) !important;

  &.nav-tabs .nav-link.active {
    border-bottom-width: 4px !important;
  }
 }

-@media (min-width: map-get($grid-breakpoints, 'md')) {
+@media (--pgn-size-breakpoint-min-width-md) {
  .courseware-search {
    &__close {
      right: -2.5rem;
--- a/src/course-home/courseware-search/map-search-response.test.js
+++ b/src/course-home/courseware-search/map-search-response.test.js
@@ -10,8 +10,8 @@ describe('mapSearchResponse', () => {
      response = mapSearchResponse(camelCaseObject(mockedResponse));
    });

-    it('should match snapshot', () => {
-      expect(response).toMatchSnapshot();
+    it('should match number of results', () => {
+      expect(response.results.length).toBe(mockedResponse.results.length);
    });

    it('should match expected filters', () => {
@@ -24,6 +24,25 @@ describe('mapSearchResponse', () => {
      ];
      expect(response.filters).toEqual(expectedFilters);
    });
+
+    it('should match expected results', () => {
+      const mockFirstResult = mockedResponse.results[0];
+      const expectedFirstResult = {
+        id: mockFirstResult.data.id,
+        title: mockFirstResult.data.content.display_name,
+        type: mockFirstResult.data.content_type.toLowerCase(),
+        location: mockFirstResult.data.location,
+        url: mockFirstResult.data.url,
+        contentHits: 0,
+        score: mockFirstResult.score,
+      };
+      expect(response.results[0]).toEqual(expectedFirstResult);
+    });
+
+    it('should match expected ms and max score', () => {
+      expect(response.maxScore).toBe(mockedResponse.max_score);
+      expect(response.ms).toBe(mockedResponse.took);
+    });
  });

  describe('when the a keyword is provided', () => {
--- a/src/course-home/data/snapshots/redux.test.js.snap
+++ b/src/course-home/data/snapshots/redux.test.js.snap
@@ -1,941 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Data layer integration tests Test fetchDatesTab Should fetch, normalize, and save metadata 1`] = `
-{
-  "courseHome": {
-    "courseId": "course-v1:edX+DemoX+Demo_Course",
-    "courseStatus": "loaded",
-    "proctoringPanelStatus": "loading",
-    "showSearch": false,
-    "targetUserId": undefined,
-    "toastBodyLink": null,
-    "toastBodyText": null,
-    "toastHeader": "",
-  },
-  "courseware": {
-    "courseId": null,
-    "courseOutline": {},
-    "courseOutlineShouldUpdate": false,
-    "courseOutlineStatus": "loading",
-    "courseStatus": "loading",
-    "coursewareOutlineSidebarSettings": {},
-    "sequenceId": null,
-    "sequenceMightBeUnit": false,
-    "sequenceStatus": "loading",
-  },
-  "learningAssistant": ObjectContaining {
-    "conversationId": Any<String>,
-  },
-  "models": {
-    "courseHomeMeta": {
-      "course-v1:edX+DemoX+Demo_Course": {
-        "canViewCertificate": true,
-        "celebrations": null,
-        "courseAccess": {
-          "additionalContextUserMessage": null,
-          "developerMessage": null,
-          "errorCode": null,
-          "hasAccess": true,
-          "userFragment": null,
-          "userMessage": null,
-        },
-        "id": "course-v1:edX+DemoX+Demo_Course",
-        "isEnrolled": false,
-        "isMasquerading": false,
-        "isNewDiscussionSidebarViewEnabled": false,
-        "isSelfPaced": false,
-        "isStaff": false,
-        "number": "DemoX",
-        "org": "edX",
-        "originalUserIsStaff": false,
-        "start": "2013-02-05T05:00:00Z",
-        "tabs": [
-          {
-            "slug": "outline",
-            "title": "Course",
-            "url": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/course/",
-          },
-          {
-            "slug": "discussion",
-            "title": "Discussion",
-            "url": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/discussion/forum/",
-          },
-          {
-            "slug": "wiki",
-            "title": "Wiki",
-            "url": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/course_wiki",
-          },
-          {
-            "slug": "progress",
-            "title": "Progress",
-            "url": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/progress",
-          },
-          {
-            "slug": "instructor",
-            "title": "Instructor",
-            "url": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/instructor",
-          },
-          {
-            "slug": "dates",
-            "title": "Dates",
-            "url": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/dates",
-          },
-        ],
-        "title": "Demonstration Course",
-        "userTimezone": "UTC",
-        "username": "MockUser",
-        "verifiedMode": {
-          "accessExpirationDate": null,
-          "currency": "USD",
-          "currencySymbol": "$",
-          "price": 149,
-          "sku": "8CF08E5",
-          "upgradeUrl": "http://localhost:18130/basket/add/?sku=8CF08E5",
-        },
-      },
-    },
-    "dates": {
-      "course-v1:edX+DemoX+Demo_Course": {
-        "courseDateBlocks": [
-          {
-            "date": "2020-05-01T17:59:41Z",
-            "dateType": "course-start-date",
-            "description": "",
-            "extraInfo": null,
-            "learnerHasAccess": true,
-            "link": "",
-            "title": "Course Starts",
-          },
-          {
-            "assignmentType": "Homework",
-            "complete": true,
-            "date": "2020-05-04T02:59:40.942669Z",
-            "dateType": "assignment-due-date",
-            "description": "",
-            "extraInfo": null,
-            "learnerHasAccess": true,
-            "title": "Multi Badges Completed",
-          },
-          {
-            "assignmentType": "Homework",
-            "date": "2020-05-05T02:59:40.942669Z",
-            "dateType": "assignment-due-date",
-            "description": "",
-            "extraInfo": null,
-            "learnerHasAccess": true,
-            "title": "Multi Badges Past Due",
-          },
-          {
-            "assignmentType": "Homework",
-            "date": "2020-05-27T02:59:40.942669Z",
-            "dateType": "assignment-due-date",
-            "description": "",
-            "extraInfo": null,
-            "learnerHasAccess": true,
-            "link": "https://example.com/",
-            "title": "Both Past Due 1",
-          },
-          {
-            "assignmentType": "Homework",
-            "date": "2020-05-27T02:59:40.942669Z",
-            "dateType": "assignment-due-date",
-            "description": "",
-            "extraInfo": null,
-            "learnerHasAccess": true,
-            "link": "https://example.com/",
-            "title": "Both Past Due 2",
-          },
-          {
-            "assignmentType": "Homework",
-            "complete": true,
-            "date": "2020-05-28T08:59:40.942669Z",
-            "dateType": "assignment-due-date",
-            "description": "",
-            "extraInfo": null,
-            "learnerHasAccess": true,
-            "link": "https://example.com/",
-            "title": "One Completed/Due 1",
-          },
-          {
-            "assignmentType": "Homework",
-            "date": "2020-05-28T08:59:40.942669Z",
-            "dateType": "assignment-due-date",
-            "description": "",
-            "extraInfo": null,
-            "learnerHasAccess": true,
-            "link": "https://example.com/",
-            "title": "One Completed/Due 2",
-          },
-          {
-            "assignmentType": "Homework",
-            "complete": true,
-            "date": "2020-05-29T08:59:40.942669Z",
-            "dateType": "assignment-due-date",
-            "description": "",
-            "extraInfo": null,
-            "learnerHasAccess": true,
-            "link": "https://example.com/",
-            "title": "Both Completed 1",
-          },
-          {
-            "assignmentType": "Homework",
-            "complete": true,
-            "date": "2020-05-29T08:59:40.942669Z",
-            "dateType": "assignment-due-date",
-            "description": "",
-            "extraInfo": null,
-            "learnerHasAccess": true,
-            "link": "https://example.com/",
-            "title": "Both Completed 2",
-          },
-          {
-            "date": "2020-06-16T17:59:40.942669Z",
-            "dateType": "verified-upgrade-deadline",
-            "description": "Don't miss the opportunity to highlight your new knowledge and skills by earning a verified certificate.",
-            "extraInfo": null,
-            "learnerHasAccess": true,
-            "link": "https://example.com/",
-            "title": "Upgrade to Verified Certificate",
-          },
-          {
-            "assignmentType": "Homework",
-            "date": "2030-08-17T05:59:40.942669Z",
-            "dateType": "assignment-due-date",
-            "description": "",
-            "extraInfo": null,
-            "learnerHasAccess": false,
-            "link": "https://example.com/",
-            "title": "One Verified 1",
-          },
-          {
-            "assignmentType": "Homework",
-            "date": "2030-08-17T05:59:40.942669Z",
-            "dateType": "assignment-due-date",
-            "description": "",
-            "extraInfo": null,
-            "learnerHasAccess": true,
-            "link": "https://example.com/",
-            "title": "One Verified 2",
-          },
-          {
-            "assignmentType": "Homework",
-            "date": "2030-08-17T05:59:40.942669Z",
-            "dateType": "assignment-due-date",
-            "description": "",
-            "extraInfo": "ORA Dates are set by the instructor, and can't be changed",
-            "learnerHasAccess": true,
-            "link": "https://example.com/",
-            "title": "ORA Verified 2",
-          },
-          {
-            "assignmentType": "Homework",
-            "date": "2030-08-18T05:59:40.942669Z",
-            "dateType": "assignment-due-date",
-            "description": "",
-            "extraInfo": null,
-            "learnerHasAccess": false,
-            "link": "https://example.com/",
-            "title": "Both Verified 1",
-          },
-          {
-            "assignmentType": "Homework",
-            "date": "2030-08-18T05:59:40.942669Z",
-            "dateType": "assignment-due-date",
-            "description": "",
-            "extraInfo": null,
-            "learnerHasAccess": false,
-            "link": "https://example.com/",
-            "title": "Both Verified 2",
-          },
-          {
-            "assignmentType": "Homework",
-            "date": "2030-08-19T05:59:40.942669Z",
-            "dateType": "assignment-due-date",
-            "description": "",
-            "learnerHasAccess": true,
-            "title": "One Unreleased 1",
-          },
-          {
-            "assignmentType": "Homework",
-            "date": "2030-08-19T05:59:40.942669Z",
-            "dateType": "assignment-due-date",
-            "description": "",
-            "extraInfo": null,
-            "learnerHasAccess": true,
-            "link": "https://example.com/",
-            "title": "One Unreleased 2",
-          },
-          {
-            "assignmentType": "Homework",
-            "date": "2030-08-20T05:59:40.942669Z",
-            "dateType": "assignment-due-date",
-            "description": "",
-            "extraInfo": null,
-            "learnerHasAccess": true,
-            "title": "Both Unreleased 1",
-          },
-          {
-            "assignmentType": "Homework",
-            "date": "2030-08-20T05:59:40.942669Z",
-            "dateType": "assignment-due-date",
-            "description": "",
-            "extraInfo": null,
-            "learnerHasAccess": true,
-            "title": "Both Unreleased 2",
-          },
-          {
-            "date": "2030-08-23T00:00:00Z",
-            "dateType": "course-end-date",
-            "description": "",
-            "extraInfo": null,
-            "learnerHasAccess": true,
-            "link": "",
-            "title": "Course Ends",
-          },
-          {
-            "date": "2030-09-01T00:00:00Z",
-            "dateType": "verification-deadline-date",
-            "description": "You must successfully complete verification before this date to qualify for a Verified Certificate.",
-            "extraInfo": null,
-            "learnerHasAccess": false,
-            "link": "https://example.com/",
-            "title": "Verification Deadline",
-          },
-        ],
-        "datesBannerInfo": {
-          "contentTypeGatingEnabled": false,
-          "missedDeadlines": false,
-          "missedGatedContent": false,
-          "verifiedUpgradeLink": "http://localhost:18130/basket/add/?sku=8CF08E5",
-        },
-        "hasEnded": false,
-        "id": "course-v1:edX+DemoX+Demo_Course",
-        "learnerIsFullAccess": true,
-      },
-    },
-  },
-  "plugins": {},
-  "recommendations": {
-    "recommendationsStatus": "loading",
-  },
-  "specialExams": {
-    "activeAttempt": null,
-    "allowProctoringOptOut": false,
-    "apiErrorMsg": "",
-    "exam": {
-      "attempt": {
-        "attempt_code": "",
-        "attempt_id": null,
-        "attempt_status": "",
-        "course_id": "",
-        "desktop_application_js_url": "",
-        "exam_display_name": "",
-        "exam_started_poll_url": "",
-        "exam_type": "",
-        "exam_url_path": "",
-        "external_id": "",
-        "in_timed_exam": true,
-        "ping_interval": null,
-        "taking_as_proctored": true,
-        "time_remaining_seconds": null,
-        "use_legacy_attempt_api": true,
-      },
-      "backend": "",
-      "content_id": "",
-      "course_id": "",
-      "due_date": null,
-      "exam_name": "",
-      "external_id": "",
-      "hide_after_due": false,
-      "id": null,
-      "is_active": true,
-      "is_practice_exam": false,
-      "is_proctored": false,
-      "prerequisite_status": {
-        "are_prerequisites_satisifed": true,
-        "declined_prerequisites": [],
-        "failed_prerequisites": [],
-        "pending_prerequisites": [],
-        "satisfied_prerequisites": [],
-      },
-      "time_limit_mins": null,
-      "type": "",
-    },
-    "examAccessToken": {
-      "exam_access_token": "",
-      "exam_access_token_expiration": "",
-    },
-    "isLoading": true,
-    "proctoringSettings": {
-      "exam_proctoring_backend": {
-        "download_url": "",
-        "instructions": [],
-        "name": "",
-        "rules": {},
-      },
-      "integration_specific_email": "",
-      "learner_notification_from_email": "",
-      "provider_name": "",
-      "provider_tech_support_email": "",
-      "provider_tech_support_phone": "",
-      "provider_tech_support_url": "",
-    },
-    "timeIsOver": false,
-  },
-  "tours": {
-    "showCoursewareTour": false,
-    "showExistingUserCourseHomeTour": false,
-    "showNewUserCourseHomeModal": false,
-    "showNewUserCourseHomeTour": false,
-    "toursEnabled": false,
-  },
-}
-`;
-
-exports[`Data layer integration tests Test fetchOutlineTab Should fetch, normalize, and save metadata 1`] = `
-{
-  "courseHome": {
-    "courseId": "course-v1:edX+DemoX+Demo_Course",
-    "courseStatus": "loaded",
-    "proctoringPanelStatus": "loading",
-    "showSearch": false,
-    "targetUserId": undefined,
-    "toastBodyLink": null,
-    "toastBodyText": null,
-    "toastHeader": "",
-  },
-  "courseware": {
-    "courseId": null,
-    "courseOutline": {},
-    "courseOutlineShouldUpdate": false,
-    "courseOutlineStatus": "loading",
-    "courseStatus": "loading",
-    "coursewareOutlineSidebarSettings": {},
-    "sequenceId": null,
-    "sequenceMightBeUnit": false,
-    "sequenceStatus": "loading",
-  },
-  "learningAssistant": ObjectContaining {
-    "conversationId": Any<String>,
-  },
-  "models": {
-    "courseHomeMeta": {
-      "course-v1:edX+DemoX+Demo_Course": {
-        "canViewCertificate": true,
-        "celebrations": null,
-        "courseAccess": {
-          "additionalContextUserMessage": null,
-          "developerMessage": null,
-          "errorCode": null,
-          "hasAccess": true,
-          "userFragment": null,
-          "userMessage": null,
-        },
-        "id": "course-v1:edX+DemoX+Demo_Course",
-        "isEnrolled": false,
-        "isMasquerading": false,
-        "isNewDiscussionSidebarViewEnabled": false,
-        "isSelfPaced": false,
-        "isStaff": false,
-        "number": "DemoX",
-        "org": "edX",
-        "originalUserIsStaff": false,
-        "start": "2013-02-05T05:00:00Z",
-        "tabs": [
-          {
-            "slug": "outline",
-            "title": "Course",
-            "url": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/course/",
-          },
-          {
-            "slug": "discussion",
-            "title": "Discussion",
-            "url": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/discussion/forum/",
-          },
-          {
-            "slug": "wiki",
-            "title": "Wiki",
-            "url": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/course_wiki",
-          },
-          {
-            "slug": "progress",
-            "title": "Progress",
-            "url": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/progress",
-          },
-          {
-            "slug": "instructor",
-            "title": "Instructor",
-            "url": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/instructor",
-          },
-          {
-            "slug": "dates",
-            "title": "Dates",
-            "url": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/dates",
-          },
-        ],
-        "title": "Demonstration Course",
-        "userTimezone": "UTC",
-        "username": "MockUser",
-        "verifiedMode": {
-          "accessExpirationDate": null,
-          "currency": "USD",
-          "currencySymbol": "$",
-          "price": 149,
-          "sku": "8CF08E5",
-          "upgradeUrl": "http://localhost:18130/basket/add/?sku=8CF08E5",
-        },
-      },
-    },
-    "outline": {
-      "course-v1:edX+DemoX+Demo_Course": {
-        "accessExpiration": null,
-        "certData": {
-          "certStatus": null,
-          "certWebViewUrl": null,
-          "certificateAvailableDate": null,
-        },
-        "courseBlocks": {
-          "courses": {
-            "block-v1:edX+DemoX+Demo_Course+type@course+block@bcdabcdabcdabcdabcdabcdabcdabcd3": {
-              "hasScheduledContent": false,
-              "id": "course-v1:edX+DemoX+Demo_Course",
-              "sectionIds": [
-                "block-v1:edX+DemoX+Demo_Course+type@chapter+block@bcdabcdabcdabcdabcdabcdabcdabcd2",
-              ],
-              "title": "bcdabcdabcdabcdabcdabcdabcdabcd3",
-            },
-          },
-          "sections": {
-            "block-v1:edX+DemoX+Demo_Course+type@chapter+block@bcdabcdabcdabcdabcdabcdabcdabcd2": {
-              "complete": false,
-              "courseId": "course-v1:edX+DemoX+Demo_Course",
-              "hideFromTOC": undefined,
-              "id": "block-v1:edX+DemoX+Demo_Course+type@chapter+block@bcdabcdabcdabcdabcdabcdabcdabcd2",
-              "resumeBlock": false,
-              "sequenceIds": [
-                "block-v1:edX+DemoX+Demo_Course+type@sequential+block@bcdabcdabcdabcdabcdabcdabcdabcd1",
-              ],
-              "title": "Title of Section",
-            },
-          },
-          "sequences": {
-            "block-v1:edX+DemoX+Demo_Course+type@sequential+block@bcdabcdabcdabcdabcdabcdabcdabcd1": {
-              "complete": false,
-              "description": null,
-              "due": null,
-              "effortActivities": 2,
-              "effortTime": 15,
-              "hideFromTOC": undefined,
-              "icon": null,
-              "id": "block-v1:edX+DemoX+Demo_Course+type@sequential+block@bcdabcdabcdabcdabcdabcdabcdabcd1",
-              "navigationDisabled": undefined,
-              "sectionId": "block-v1:edX+DemoX+Demo_Course+type@chapter+block@bcdabcdabcdabcdabcdabcdabcdabcd2",
-              "showLink": true,
-              "title": "Title of Sequence",
-            },
-          },
-        },
-        "courseGoals": {
-          "daysPerWeek": null,
-          "goalOptions": [],
-          "selectedGoal": null,
-          "subscribedToReminders": null,
-          "weeklyLearningGoalEnabled": false,
-        },
-        "courseTools": [
-          {
-            "analyticsId": "edx.bookmarks",
-            "title": "Bookmarks",
-            "url": "https://example.com/bookmarks",
-          },
-        ],
-        "datesBannerInfo": {
-          "contentTypeGatingEnabled": false,
-          "missedDeadlines": false,
-          "missedGatedContent": false,
-        },
-        "datesWidget": {
-          "courseDateBlocks": [],
-        },
-        "enableProctoredExams": undefined,
-        "enrollAlert": {
-          "canEnroll": true,
-          "extraText": "Contact the administrator.",
-        },
-        "enrollmentMode": undefined,
-        "handoutsHtml": "<ul><li>Handout 1</li></ul>",
-        "hasEnded": undefined,
-        "hasScheduledContent": null,
-        "id": "course-v1:edX+DemoX+Demo_Course",
-        "offer": null,
-        "resumeCourse": {
-          "hasVisitedCourse": false,
-          "url": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/jump_to/block-v1:edX+Test+Block@12345abcde",
-        },
-        "timeOffsetMillis": 0,
-        "userHasPassingGrade": undefined,
-        "verifiedMode": {
-          "accessExpirationDate": "2050-01-01T12:00:00",
-          "currency": "USD",
-          "currencySymbol": "$",
-          "price": 149,
-          "sku": "ABCD1234",
-          "upgradeUrl": "http://localhost:18000/dashboard",
-        },
-        "welcomeMessageHtml": "<p>Welcome to this course!</p>",
-      },
-    },
-  },
-  "plugins": {},
-  "recommendations": {
-    "recommendationsStatus": "loading",
-  },
-  "specialExams": {
-    "activeAttempt": null,
-    "allowProctoringOptOut": false,
-    "apiErrorMsg": "",
-    "exam": {
-      "attempt": {
-        "attempt_code": "",
-        "attempt_id": null,
-        "attempt_status": "",
-        "course_id": "",
-        "desktop_application_js_url": "",
-        "exam_display_name": "",
-        "exam_started_poll_url": "",
-        "exam_type": "",
-        "exam_url_path": "",
-        "external_id": "",
-        "in_timed_exam": true,
-        "ping_interval": null,
-        "taking_as_proctored": true,
-        "time_remaining_seconds": null,
-        "use_legacy_attempt_api": true,
-      },
-      "backend": "",
-      "content_id": "",
-      "course_id": "",
-      "due_date": null,
-      "exam_name": "",
-      "external_id": "",
-      "hide_after_due": false,
-      "id": null,
-      "is_active": true,
-      "is_practice_exam": false,
-      "is_proctored": false,
-      "prerequisite_status": {
-        "are_prerequisites_satisifed": true,
-        "declined_prerequisites": [],
-        "failed_prerequisites": [],
-        "pending_prerequisites": [],
-        "satisfied_prerequisites": [],
-      },
-      "time_limit_mins": null,
-      "type": "",
-    },
-    "examAccessToken": {
-      "exam_access_token": "",
-      "exam_access_token_expiration": "",
-    },
-    "isLoading": true,
-    "proctoringSettings": {
-      "exam_proctoring_backend": {
-        "download_url": "",
-        "instructions": [],
-        "name": "",
-        "rules": {},
-      },
-      "integration_specific_email": "",
-      "learner_notification_from_email": "",
-      "provider_name": "",
-      "provider_tech_support_email": "",
-      "provider_tech_support_phone": "",
-      "provider_tech_support_url": "",
-    },
-    "timeIsOver": false,
-  },
-  "tours": {
-    "showCoursewareTour": false,
-    "showExistingUserCourseHomeTour": false,
-    "showNewUserCourseHomeModal": false,
-    "showNewUserCourseHomeTour": false,
-    "toursEnabled": false,
-  },
-}
-`;
-
-exports[`Data layer integration tests Test fetchProgressTab Should fetch, normalize, and save metadata 1`] = `
-{
-  "courseHome": {
-    "courseId": "course-v1:edX+DemoX+Demo_Course",
-    "courseStatus": "loaded",
-    "proctoringPanelStatus": "loading",
-    "showSearch": false,
-    "targetUserId": undefined,
-    "toastBodyLink": null,
-    "toastBodyText": null,
-    "toastHeader": "",
-  },
-  "courseware": {
-    "courseId": null,
-    "courseOutline": {},
-    "courseOutlineShouldUpdate": false,
-    "courseOutlineStatus": "loading",
-    "courseStatus": "loading",
-    "coursewareOutlineSidebarSettings": {},
-    "sequenceId": null,
-    "sequenceMightBeUnit": false,
-    "sequenceStatus": "loading",
-  },
-  "learningAssistant": ObjectContaining {
-    "conversationId": Any<String>,
-  },
-  "models": {
-    "courseHomeMeta": {
-      "course-v1:edX+DemoX+Demo_Course": {
-        "canViewCertificate": true,
-        "celebrations": null,
-        "courseAccess": {
-          "additionalContextUserMessage": null,
-          "developerMessage": null,
-          "errorCode": null,
-          "hasAccess": true,
-          "userFragment": null,
-          "userMessage": null,
-        },
-        "id": "course-v1:edX+DemoX+Demo_Course",
-        "isEnrolled": false,
-        "isMasquerading": false,
-        "isNewDiscussionSidebarViewEnabled": false,
-        "isSelfPaced": false,
-        "isStaff": false,
-        "number": "DemoX",
-        "org": "edX",
-        "originalUserIsStaff": false,
-        "start": "2013-02-05T05:00:00Z",
-        "tabs": [
-          {
-            "slug": "outline",
-            "title": "Course",
-            "url": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/course/",
-          },
-          {
-            "slug": "discussion",
-            "title": "Discussion",
-            "url": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/discussion/forum/",
-          },
-          {
-            "slug": "wiki",
-            "title": "Wiki",
-            "url": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/course_wiki",
-          },
-          {
-            "slug": "progress",
-            "title": "Progress",
-            "url": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/progress",
-          },
-          {
-            "slug": "instructor",
-            "title": "Instructor",
-            "url": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/instructor",
-          },
-          {
-            "slug": "dates",
-            "title": "Dates",
-            "url": "http://localhost:18000/courses/course-v1:edX+DemoX+Demo_Course/dates",
-          },
-        ],
-        "title": "Demonstration Course",
-        "userTimezone": "UTC",
-        "username": "MockUser",
-        "verifiedMode": {
-          "accessExpirationDate": null,
-          "currency": "USD",
-          "currencySymbol": "$",
-          "price": 149,
-          "sku": "8CF08E5",
-          "upgradeUrl": "http://localhost:18130/basket/add/?sku=8CF08E5",
-        },
-      },
-    },
-    "progress": {
-      "course-v1:edX+DemoX+Demo_Course": {
-        "accessExpiration": null,
-        "certificateData": {},
-        "completionSummary": {
-          "completeCount": 1,
-          "incompleteCount": 1,
-          "lockedCount": 0,
-        },
-        "courseGrade": {
-          "isPassing": true,
-          "letterGrade": "pass",
-          "percent": 1,
-        },
-        "courseId": "course-v1:edX+DemoX+Demo_Course",
-        "creditCourseRequirements": null,
-        "end": "3027-03-31T00:00:00Z",
-        "enrollmentMode": "audit",
-        "gradesFeatureIsFullyLocked": false,
-        "gradesFeatureIsPartiallyLocked": false,
-        "gradingPolicy": {
-          "assignmentPolicies": [
-            {
-              "averageGrade": "1.0000",
-              "numDroppable": 1,
-              "shortLabel": "HW",
-              "type": "Homework",
-              "weight": 1,
-              "weightedGrade": 1,
-            },
-          ],
-          "gradeRange": {
-            "pass": 0.75,
-          },
-        },
-        "hasScheduledContent": false,
-        "id": "course-v1:edX+DemoX+Demo_Course",
-        "sectionScores": [
-          {
-            "displayName": "First section",
-            "subsections": [
-              {
-                "assignmentType": "Homework",
-                "blockKey": "block-v1:edX+DemoX+Demo_Course+type@sequential+block@12345",
-                "displayName": "First subsection",
-                "hasGradedAssignment": true,
-                "learnerHasAccess": true,
-                "numPointsEarned": 0,
-                "numPointsPossible": 3,
-                "percentGraded": 0,
-                "problemScores": [
-                  {
-                    "earned": 0,
-                    "possible": 1,
-                  },
-                  {
-                    "earned": 0,
-                    "possible": 1,
-                  },
-                  {
-                    "earned": 0,
-                    "possible": 1,
-                  },
-                ],
-                "showCorrectness": "always",
-                "showGrades": true,
-                "url": "http://learning.edx.org/course/course-v1:edX+Test+run/first_subsection",
-              },
-            ],
-          },
-          {
-            "displayName": "Second section",
-            "subsections": [
-              {
-                "assignmentType": "Homework",
-                "displayName": "Second subsection",
-                "hasGradedAssignment": true,
-                "numPointsEarned": 1,
-                "numPointsPossible": 1,
-                "percentGraded": 1,
-                "problemScores": [
-                  {
-                    "earned": 1,
-                    "possible": 1,
-                  },
-                ],
-                "showCorrectness": "always",
-                "showGrades": true,
-                "url": "http://learning.edx.org/course/course-v1:edX+Test+run/second_subsection",
-              },
-            ],
-          },
-        ],
-        "studioUrl": "http://studio.edx.org/settings/grading/course-v1:edX+Test+run",
-        "userHasPassingGrade": false,
-        "verificationData": {
-          "link": null,
-          "status": "none",
-          "statusDate": null,
-        },
-        "verifiedMode": null,
-      },
-    },
-  },
-  "plugins": {},
-  "recommendations": {
-    "recommendationsStatus": "loading",
-  },
-  "specialExams": {
-    "activeAttempt": null,
-    "allowProctoringOptOut": false,
-    "apiErrorMsg": "",
-    "exam": {
-      "attempt": {
-        "attempt_code": "",
-        "attempt_id": null,
-        "attempt_status": "",
-        "course_id": "",
-        "desktop_application_js_url": "",
-        "exam_display_name": "",
-        "exam_started_poll_url": "",
-        "exam_type": "",
-        "exam_url_path": "",
-        "external_id": "",
-        "in_timed_exam": true,
-        "ping_interval": null,
-        "taking_as_proctored": true,
-        "time_remaining_seconds": null,
-        "use_legacy_attempt_api": true,
-      },
-      "backend": "",
-      "content_id": "",
-      "course_id": "",
-      "due_date": null,
-      "exam_name": "",
-      "external_id": "",
-      "hide_after_due": false,
-      "id": null,
-      "is_active": true,
-      "is_practice_exam": false,
-      "is_proctored": false,
-      "prerequisite_status": {
-        "are_prerequisites_satisifed": true,
-        "declined_prerequisites": [],
-        "failed_prerequisites": [],
-        "pending_prerequisites": [],
-        "satisfied_prerequisites": [],
-      },
-      "time_limit_mins": null,
-      "type": "",
-    },
-    "examAccessToken": {
-      "exam_access_token": "",
-      "exam_access_token_expiration": "",
-    },
-    "isLoading": true,
-    "proctoringSettings": {
-      "exam_proctoring_backend": {
-        "download_url": "",
-        "instructions": [],
-        "name": "",
-        "rules": {},
-      },
-      "integration_specific_email": "",
-      "learner_notification_from_email": "",
-      "provider_name": "",
-      "provider_tech_support_email": "",
-      "provider_tech_support_phone": "",
-      "provider_tech_support_url": "",
-    },
-    "timeIsOver": false,
-  },
-  "tours": {
-    "showCoursewareTour": false,
-    "showExistingUserCourseHomeTour": false,
-    "showNewUserCourseHomeModal": false,
-    "showNewUserCourseHomeTour": false,
-    "toursEnabled": false,
-  },
-}
-`;
--- a/src/course-home/data/redux.test.js
+++ b/src/course-home/data/redux.test.js
@@ -90,14 +90,14 @@ describe('Data layer integration tests', () => {

      const state = store.getState();
      expect(state.courseHome.courseStatus).toEqual('loaded');
-      expect(state).toMatchSnapshot({
+      expect(state).toEqual(expect.objectContaining({
        // The Xpert chatbot (frontend-lib-learning-assistant) generates a unique UUID
-        // to keep track of conversations. This causes snapshots to fail, because this UUID
-        // is generated on each run of the snapshot. Instead, we use an asymmetric matcher here.
+        // to keep track of conversations. This UUID is generated on each run.
+        // Instead, we use an asymmetric matcher here.
        learningAssistant: expect.objectContaining({
          conversationId: expect.any(String),
        }),
-      });
+      }));
    });

    it.each([401, 403, 404])(
@@ -137,14 +137,14 @@ describe('Data layer integration tests', () => {

      const state = store.getState();
      expect(state.courseHome.courseStatus).toEqual('loaded');
-      expect(state).toMatchSnapshot({
+      expect(state).toEqual(expect.objectContaining({
        // The Xpert chatbot (frontend-lib-learning-assistant) generates a unique UUID
-        // to keep track of conversations. This causes snapshots to fail, because this UUID
-        // is generated on each run of the snapshot. Instead, we use an asymmetric matcher here.
+        // to keep track of conversations. This UUID is generated on each run.
+        // Instead, we use an asymmetric matcher here.
        learningAssistant: expect.objectContaining({
          conversationId: expect.any(String),
        }),
-      });
+      }));
    });

    it.each([401, 403, 404])(
@@ -185,14 +185,14 @@ describe('Data layer integration tests', () => {

      const state = store.getState();
      expect(state.courseHome.courseStatus).toEqual('loaded');
-      expect(state).toMatchSnapshot({
+      expect(state).toEqual(expect.objectContaining({
        // The Xpert chatbot (frontend-lib-learning-assistant) generates a unique UUID
-        // to keep track of conversations. This causes snapshots to fail, because this UUID
-        // is generated on each run of the snapshot. Instead, we use an asymmetric matcher here.
+        // to keep track of conversations. This UUID is generated on each run.
+        // Instead, we use an asymmetric matcher here.
        learningAssistant: expect.objectContaining({
          conversationId: expect.any(String),
        }),
-      });
+      }));
    });

    it('Should handle the url including a targetUserId', async () => {
--- a/src/course-home/outline-tab/DateSummary.jsx
+++ b/src/course-home/outline-tab/DateSummary.jsx
@@ -65,6 +65,7 @@ const DateSummary = ({
        )}
        {!linkedTitle && dateBlock.link && (
          <a
+            id={dateBlock.dateType === 'verified-upgrade-deadline' ? 'date-verified-upgrade-deadline' : ''}
            href={dateBlock.link}
            onClick={dateBlock.dateType === 'verified-upgrade-deadline' ? logVerifiedUpgradeClick : () => {}}
            className="description-link"
--- a/src/course-home/outline-tab/widgets/CourseDates.jsx
+++ b/src/course-home/outline-tab/widgets/CourseDates.jsx
@@ -39,7 +39,7 @@ const CourseDates = () => {
            />
          ))}
        </ol>
-        <a className="font-weight-bold ml-4 pl-1 small" href={datesTabLink}>
+        <a id="dates-tab-link" className="font-weight-bold ml-4 pl-1 small" href={datesTabLink}>
          {intl.formatMessage(messages.allDates)}
        </a>
      </div>
--- a/src/course-home/outline-tab/widgets/FlagButton.scss
+++ b/src/course-home/outline-tab/widgets/FlagButton.scss
@@ -1,22 +1,18 @@
-@import "~@edx/brand/paragon/variables";
-@import "~@openedx/paragon/scss/core/core";
-@import "~@edx/brand/paragon/overrides";
-
 .flag-button {
-  background-color: $white;
-  border: 1px solid $light-400;
+  background-color: var(--pgn-color-white);
+  border: 1px solid var(--pgn-color-light-400);
  border-radius: .2rem;
-  box-shadow: 0 0 0 2px $light-400;
+  box-shadow: 0 0 0 2px var(--pgn-color-light-400);

  &:hover {
-    border: 1px solid $primary-300;
-    box-shadow: 0 0 0 2px $white;
+    border: 1px solid var(--pgn-color-primary-300);
+    box-shadow: 0 0 0 2px var(--pgn-color-white);
  }
 }

 .flag-button-selected {
-  border: 1px solid $primary-300;
-  box-shadow: 0 0 0 2px $primary-300;
+  border: 1px solid var(--pgn-color-primary-300);
+  box-shadow: 0 0 0 2px var(--pgn-color-primary-300);
  pointer-events: none;
 }

--- a/src/course-home/outline-tab/widgets/ProctoringInfoPanel.jsx
+++ b/src/course-home/outline-tab/widgets/ProctoringInfoPanel.jsx
@@ -3,6 +3,7 @@ import { useDispatch, useSelector } from 'react-redux';
 import camelCase from 'lodash.camelcase';

 import { useIntl } from '@edx/frontend-platform/i18n';
+import { getExternalLinkUrl } from '@edx/frontend-platform';
 import { Button } from '@openedx/paragon';

 import messages from '../messages';
@@ -207,7 +208,7 @@ const ProctoringInfoPanel = () => {
            {isSubmissionRequired(readableStatus) && (
              onboardingExamButton
            )}
-            <Button variant="outline-primary" block href="https://support.edx.org/hc/en-us/sections/115004169247-Taking-Timed-and-Proctored-Exams">
+            <Button variant="outline-primary" block href={getExternalLinkUrl('https://support.edx.org/hc/en-us/sections/115004169247-Taking-Timed-and-Proctored-Exams')}>
              {intl.formatMessage(messages.proctoringReviewRequirementsButton)}
            </Button>
          </div>
--- a/src/course-home/outline-tab/widgets/ProctoringInfoPanel.scss
+++ b/src/course-home/outline-tab/widgets/ProctoringInfoPanel.scss
@@ -1,10 +1,10 @@
 .outline-sidebar-proctoring-panel {
-  border: 1px solid $dark-500;
-  border-top: 5px solid $brand-600;
+  border: 1px solid var(--pgn-color-dark-500);
+  border-top: 5px solid var(--pgn-color-brand-600);
 }
 .proctoring-onboarding-success {
-  border-top: 5px solid $primary-500;
+  border-top: 5px solid var(--pgn-color-primary-500);
 }
 .proctoring-onboarding-submitted {
-  border-top: 5px solid $dark-500;
+  border-top: 5px solid var(--pgn-color-dark-500);
 }
--- a/src/course-home/progress-tab/certificate-status/CertificateStatus.jsx
+++ b/src/course-home/progress-tab/certificate-status/CertificateStatus.jsx
@@ -187,7 +187,8 @@ const CertificateStatus = () => {
        // regardless of passing or nonpassing status
        if (!canViewCertificate) {
          certCase = 'notAvailable';
-          endDate = intl.formatDate(end, {
+          // use the certificate_available_date if it is available, otherwise use the end date of the course
+          endDate = intl.formatDate((certificateAvailableDate || end), {
            year: 'numeric',
            month: 'long',
            day: 'numeric',
--- a/src/course-home/progress-tab/course-completion/CompletionDonutChart.scss
+++ b/src/course-home/progress-tab/course-completion/CompletionDonutChart.scss
@@ -7,18 +7,18 @@

 .donut-chart-label {
  font: {
-    family: $font-family-sans-serif;
+    family: var(--pgn-typography-font-family-sans-serif);
    size: .2rem;
-    weight: $font-weight-normal;
+    weight: var(--pgn-typography-font-weight-normal);
  }
  text-anchor: middle;
 }

 .donut-chart-number {
  font: {
-    family: $font-family-monospace;
+    family: var(--pgn-typography-font-family-monospace);
    size: .5rem;
-    weight: $font-weight-bold;
+    weight: var(--pgn-typography-font-weight-bold);
  }
  line-height: 1rem;
  text-anchor: middle;
@@ -29,7 +29,7 @@
 }

 .donut-chart-text {
-  fill: $primary-500;
+  fill: var(--pgn-color-primary-500);
  -moz-transform: translateY(0.25em);
  -ms-transform: translateY(0.25em);
  -webkit-transform: translateY(0.25em);
@@ -56,7 +56,7 @@

 .donut-ring, .donut-segment, .donut-hole {
  &.complete-stroke {
-    stroke: $info-500;
+    stroke: var(--pgn-color-info-500);
  }

  &.divider-stroke {
@@ -65,10 +65,10 @@
  }

  &.incomplete-stroke {
-    stroke: $light-300;
+    stroke: var(--pgn-color-light-300);
  }

  &.locked-stroke {
-    stroke: $primary-500;
+    stroke: var(--pgn-color-primary-500);
  }
 }
--- a/src/course-home/progress-tab/grades/course-grade/CourseGradeHeader.jsx
+++ b/src/course-home/progress-tab/grades/course-grade/CourseGradeHeader.jsx
@@ -48,7 +48,7 @@ const CourseGradeHeader = () => {
    previewText = intl.formatMessage(messages.courseGradePreviewUpgradeDeadlinePassedBody);
  }
  return (
-    <div className="row w-100 m-0 p-4 rounded-top bg-primary-500 text-white">
+    <div id="grade-course-header" className="row w-100 m-0 p-4 rounded-top bg-primary-500 text-white">
      <div className={`col-12 ${verifiedMode ? 'col-md-9' : ''} p-0`}>
        <div className="row w-100 m-0 p-0">
          <div className="col-1 p-0">
@@ -71,7 +71,7 @@ const CourseGradeHeader = () => {
      </div>
      {verifiedMode && (
        <div className="col-12 col-md-3 mt-3 mt-md-0 p-0 align-self-center text-right">
-          <Button variant="brand" size="sm" href={verifiedMode.upgradeUrl} onClick={logUpgradeButtonClick}>
+          <Button id="upgrade-button" variant="brand" size="sm" href={verifiedMode.upgradeUrl} onClick={logUpgradeButtonClick}>
            {intl.formatMessage(messages.courseGradePreviewUpgradeButton)}
          </Button>
        </div>
--- a/src/course-home/progress-tab/grades/course-grade/GradeBar.scss
+++ b/src/course-home/progress-tab/grades/course-grade/GradeBar.scss
@@ -4,24 +4,24 @@
  }

  .grade-bar__base {
-    fill: $light-300;
+    fill: var(--pgn-color-light-300);
  }

  .grade-bar__divider {
-    fill: $primary-500;
+    fill: var(--pgn-color-primary-500);
    width: 1px;
  }

  .grade-bar--passing {
-    fill: $primary-500;
+    fill: var(--pgn-color-primary-500);
  }

  .grade-bar--current-passing {
-    fill: $success-500;
+    fill: var(--pgn-color-success-500);
  }

  .grade-bar--current-non-passing {
-    fill: $accent-b;
+    fill: var(--pgn-color-accent-b);
  }
 }

@@ -31,22 +31,22 @@

 #minimum-grade-tooltip {
  .arrow::after {
-    border-bottom-color: $primary-500;
+    border-bottom-color: var(--pgn-color-primary-500);
  }
 }

 #passing-grade-tooltip {
-  background: $success-500;
+  background: var(--pgn-color-success-500);

  .arrow::after {
-    border-top-color: $success-500;
+    border-top-color: var(--pgn-color-success-500);
  }
 }

 #non-passing-grade-tooltip {
-  background: $accent-b;
+  background: var(--pgn-color-accent-b);

  .arrow::after {
-    border-top-color: $accent-b;
+    border-top-color: var(--pgn-color-accent-b);
  }
 }
--- a/src/course-home/suggested-schedule-messaging/UpgradeToCompleteAlert.jsx
+++ b/src/course-home/suggested-schedule-messaging/UpgradeToCompleteAlert.jsx
@@ -34,7 +34,7 @@ const UpgradeToCompleteAlert = ({ logUpgradeLinkClick }) => {
  }

  return (
-    <Alert className="bg-light-200">
+    <Alert id="upgrade-complete-alert" className="bg-light-200">
      <Row className="w-100 m-0">
        <Col xs={12} md={9} className="small p-0 pr-md-2">
          <Alert.Heading>{intl.formatMessage(messages.upgradeToCompleteHeader)}</Alert.Heading>
--- a/src/course-home/suggested-schedule-messaging/UpgradeToShiftDatesAlert.jsx
+++ b/src/course-home/suggested-schedule-messaging/UpgradeToShiftDatesAlert.jsx
@@ -36,7 +36,7 @@ const UpgradeToShiftDatesAlert = ({ logUpgradeLinkClick, model }) => {
  }

  return (
-    <Alert className="bg-light-200">
+    <Alert id="upgrade-shift-dates-alert" className="bg-light-200">
      <Row className="w-100 m-0">
        <Col xs={12} md={9} className="small p-0 pr-md-2">
          <strong>{intl.formatMessage(messages.missedDeadlines)}</strong>
--- a/src/course-tabs/course-tabs-navigation.scss
+++ b/src/course-tabs/course-tabs-navigation.scss
@@ -5,13 +5,13 @@
  .nav a,
  .nav button {
    &:hover {
-      background-color: $light-400;
+      background-color: var(--pgn-color-light-400);
    }
  }

  .nav a {
    &:not(.active):hover {
-      background-color: $light-400;
+      background-color: var(--pgn-color-light-400);
      border-bottom: none;
    }
  }
--- a/src/courseware/CoursewareContainer.test.jsx
+++ b/src/courseware/CoursewareContainer.test.jsx
@@ -1,7 +1,7 @@
 import { getConfig, history } from '@edx/frontend-platform';
 import { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';
 import { AppProvider } from '@edx/frontend-platform/react';
-import { waitForElementToBeRemoved, fireEvent } from '@testing-library/dom';
+import { waitForElementToBeRemoved } from '@testing-library/dom';
 import '@testing-library/jest-dom';
 import { render, screen } from '@testing-library/react';
 import React from 'react';
@@ -193,15 +193,13 @@ describe('CoursewareContainer', () => {
      expect(courseHeader.querySelector('.course-title')).toHaveTextContent(courseHomeMetadata.title);
    }

-    function assertSequenceNavigation(container, expectedUnitCount = 3) {
-      // Ensure we had appropriate sequence navigation buttons.  We should only have one unit.
+    function assertNoSequenceNavigation(container) {
      const sequenceNavButtons = container.querySelectorAll('nav.sequence-navigation a, nav.sequence-navigation button');
-      expect(sequenceNavButtons).toHaveLength(expectedUnitCount + 2);
+      expect(sequenceNavButtons).toHaveLength(0);

-      expect(sequenceNavButtons[0]).toHaveTextContent('Previous');
-      // Prove this button is rendering an SVG tasks icon, meaning it's a unit/vertical.
-      expect(sequenceNavButtons[1].querySelector('svg')).toHaveClass('fa-tasks');
-      expect(sequenceNavButtons[sequenceNavButtons.length - 1]).toHaveTextContent('Next');
+      expect(container.querySelector('button, a')).not.toHaveTextContent('Previous');
+      expect(container.querySelector('svg.fa-tasks')).toBeNull();
+      expect(container.querySelector('button, a')).not.toHaveTextContent('Next');
    }

    beforeEach(async () => {
@@ -224,7 +222,7 @@ describe('CoursewareContainer', () => {
        const container = await loadContainer();

        assertLoadedHeader(container);
-        assertSequenceNavigation(container);
+        assertNoSequenceNavigation(container);

        expect(container.querySelector('.fake-unit')).toHaveTextContent('Unit Contents');
        expect(container.querySelector('.fake-unit')).toHaveTextContent(courseId);
@@ -247,7 +245,7 @@ describe('CoursewareContainer', () => {
        const container = await loadContainer();

        assertLoadedHeader(container);
-        assertSequenceNavigation(container);
+        assertNoSequenceNavigation(container);

        expect(container.querySelector('.fake-unit')).toHaveTextContent('Unit Contents');
        expect(container.querySelector('.fake-unit')).toHaveTextContent(courseId);
@@ -274,29 +272,12 @@ describe('CoursewareContainer', () => {
        setUpMockRequests({ courseBlocks });
      });

-      // describe('when the URL contains a unit ID', () => {
-      //   it('should ignore the section ID and redirect based on the unit ID', async () => {
-      //     const urlUnit = unitTree[1][1][1];
-      //     setUrl(sectionTree[1].id, urlUnit.id);
-      //     const container = await loadContainer();
-      //     assertLoadedHeader(container);
-      //     assertSequenceNavigation(container, 2);
-      //     assertLocation(container, sequenceTree[1][1].id, urlUnit.id);
-      //   });
-
-      //   it('should ignore invalid unit IDs and redirect to the course root', async () => {
-      //     setUrl(sectionTree[1].id, 'foobar');
-      //     await loadContainer();
-      //     expect(global.location.href).toEqual(`http://localhost/course/${courseId}`);
-      //   });
-      // });
-
      describe('when the URL does not contain a unit ID', () => {
        it('should choose a unit within the section\'s first sequence', async () => {
          setUrl(sectionTree[1].id);
          const container = await loadContainer();
          assertLoadedHeader(container);
-          assertSequenceNavigation(container, 2);
+          assertNoSequenceNavigation(container);
          assertLocation(container, sequenceTree[1][0].id, unitTree[1][0][0].id);
        });
      });
@@ -342,27 +323,6 @@ describe('CoursewareContainer', () => {
      });
    });

-    // describe('when the URL only contains a unit ID', () => {
-    //   const { courseBlocks, unitTree, sequenceTree } = buildBinaryCourseBlocks(courseId, courseMetadata.name);
-
-    //   beforeEach(async () => {
-    //     setUpMockRequests({ courseBlocks });
-    //   });
-
-    //   it('should insert the sequence ID into the URL', async () => {
-    //     const unit = unitTree[1][0][1];
-    //     history.push(`/course/${courseId}/${unit.id}`);
-    //     const container = await loadContainer();
-
-    //     assertLoadedHeader(container);
-    //     assertSequenceNavigation(container, 2);
-    //     const expectedSequenceId = sequenceTree[1][0].id;
-    //     const expectedUrl = `http://localhost/course/${courseId}/${expectedSequenceId}/${unit.id}`;
-    //     expect(global.location.href).toEqual(expectedUrl);
-    //     expect(container.querySelector('.fake-unit')).toHaveTextContent(unit.id);
-    //   });
-    // });
-
    describe('when the URL contains a course ID and sequence ID', () => {
      const sequenceBlock = defaultSequenceBlock;
      const unitBlocks = defaultUnitBlocks;
@@ -372,7 +332,7 @@ describe('CoursewareContainer', () => {
        const container = await loadContainer();

        assertLoadedHeader(container);
-        assertSequenceNavigation(container);
+        assertNoSequenceNavigation(container);

        expect(container.querySelector('.fake-unit')).toHaveTextContent('Unit Contents');
        expect(container.querySelector('.fake-unit')).toHaveTextContent(courseId);
@@ -391,7 +351,7 @@ describe('CoursewareContainer', () => {
        const container = await loadContainer();

        assertLoadedHeader(container);
-        assertSequenceNavigation(container);
+        assertNoSequenceNavigation(container);

        expect(container.querySelector('.fake-unit')).toHaveTextContent('Unit Contents');
        expect(container.querySelector('.fake-unit')).toHaveTextContent(courseId);
@@ -408,44 +368,24 @@ describe('CoursewareContainer', () => {
        const container = await loadContainer();

        assertLoadedHeader(container);
-        assertSequenceNavigation(container);
+        assertNoSequenceNavigation(container);

        expect(container.querySelector('.fake-unit')).toHaveTextContent('Unit Contents');
        expect(container.querySelector('.fake-unit')).toHaveTextContent(courseId);
        expect(container.querySelector('.fake-unit')).toHaveTextContent(unitBlocks[2].id);
      });

-      it('should navigate between units and check block completion', async () => {
-        axiosMock.onPost(`${courseId}/xblock/${sequenceBlock.id}/handler/get_completion`).reply(200, {
-          complete: true,
-        });
+      it('should render the sequence_navigation plugin slot correctly', async () => {
+        axiosMock
+          .onPost(`${courseId}/xblock/${sequenceBlock.id}/handler/get_completion`)
+          .reply(200, { complete: true });

        history.push(`/course/${courseId}/${sequenceBlock.id}/${unitBlocks[0].id}`);
-        const container = await loadContainer();
+        await loadContainer();

-        const sequenceNavButtons = container.querySelectorAll('nav.sequence-navigation a, nav.sequence-navigation button');
-        const sequenceNextButton = sequenceNavButtons[4];
-        expect(sequenceNextButton).toHaveTextContent('Next');
-        fireEvent.click(sequenceNextButton);
-
-        expect(global.location.href).toEqual(`http://localhost/course/${courseId}/${sequenceBlock.id}/${unitBlocks[1].id}`);
+        expect(screen.getByTestId('org.openedx.frontend.learning.sequence_navigation.v1')).toBeInTheDocument();
      });
    });
-
-    // describe('when the current sequence is an exam', () => {
-    //   const { location } = window;
-
-    //   beforeEach(() => {
-    //     delete window.location;
-    //     window.location = {
-    //       assign: jest.fn(),
-    //     };
-    //   });
-
-    //   afterEach(() => {
-    //     window.location = location;
-    //   });
-    // });
  });

  describe('when receiving a course_access error_code', () => {
--- a/src/courseware/RedirectPage.test.jsx
+++ b/src/courseware/RedirectPage.test.jsx
@@ -16,6 +16,7 @@ jest.mock('react-router-dom', () => ({
  useLocation: () => ({
    search: '?consentPath=/some-path',
  }),
+  useSearchParams: () => [new URLSearchParams('?consentPath=/some-path'), () => {}],
 }));

 describe('RedirectPage component', () => {
--- a/src/courseware/RedirectPage.tsx
+++ b/src/courseware/RedirectPage.tsx
@@ -1,18 +1,20 @@
-import PropTypes from 'prop-types';
 import {
-  generatePath, useParams, useLocation,
+  generatePath, useParams, useLocation, useSearchParams,
 } from 'react-router-dom';
 import { getConfig } from '@edx/frontend-platform';

-import queryString from 'query-string';
 import { REDIRECT_MODES } from '../constants';

-const RedirectPage = ({
-  pattern, mode,
-}) => {
+interface Props {
+  pattern: string;
+  mode: string;
+}
+
+const RedirectPage = ({ pattern = '', mode }: Props) => {
  const { courseId } = useParams();
  const location = useLocation();
-  const { consentPath } = queryString.parse(location?.search);
+  const [searchParams] = useSearchParams();
+  const consentPath = searchParams.get('consentPath') ?? '';

  const {
    LMS_BASE_URL,
@@ -39,13 +41,4 @@ const RedirectPage = ({
  return null;
 };

-RedirectPage.propTypes = {
-  pattern: PropTypes.string,
-  mode: PropTypes.string.isRequired,
-};
-
-RedirectPage.defaultProps = {
-  pattern: null,
-};
-
 export default RedirectPage;
--- a/src/courseware/course/Course.jsx
+++ b/src/courseware/course/Course.jsx
@@ -1,14 +1,13 @@
 import { 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 { useLocation, useNavigate } from 'react-router-dom';
 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 Chat from './chat/Chat';
 import SidebarProvider from './sidebar/SidebarContextProvider';
 import NewSidebarProvider from './new-sidebar/SidebarContextProvider';
@@ -37,8 +36,6 @@ const Course = ({
  } = 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 navigate = useNavigate();
  const { pathname } = useLocation();

@@ -84,17 +81,13 @@ const Course = ({
        <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">
-        {navigationDisabled || (
-        <>
-          <CourseBreadcrumbsSlot
-            courseId={courseId}
-            sectionId={section ? section.id : null}
-            sequenceId={sequenceId}
-            isStaff={isStaff}
-            unitId={unitId}
-          />
-        </>
-        )}
+        <CourseBreadcrumbsSlot
+          courseId={courseId}
+          sectionId={section ? section.id : null}
+          sequenceId={sequenceId}
+          isStaff={isStaff}
+          unitId={unitId}
+        />
        {shouldDisplayChat && (
          <>
            <Chat
--- a/src/courseware/course/Course.test.jsx
+++ b/src/courseware/course/Course.test.jsx
@@ -202,7 +202,7 @@ describe('Course', () => {
    });
  });

-  it('renders course breadcrumbs as expected', async () => {
+  it('doesn\'t renders course breadcrumbs by default', async () => {
    const courseMetadata = Factory.build('courseMetadata');
    const unitBlocks = Array.from({ length: 3 }).map(() => Factory.build(
      'block',
@@ -210,7 +210,7 @@ describe('Course', () => {
      { courseId: courseMetadata.id },
    ));
    const testStore = await initializeTestStore({
-      courseMetadata, unitBlocks, enableNavigationSidebar: { enable_navigation_sidebar: false },
+      courseMetadata, unitBlocks,
    }, false);
    const { courseware, models } = testStore.getState();
    const { courseId, sequenceId } = courseware;
@@ -226,10 +226,10 @@ describe('Course', () => {
    await waitFor(() => {
      expect(screen.queryByText('Loading learning sequence...')).not.toBeInTheDocument();
    });
-    // expect the section and sequence "titles" to be loaded in as breadcrumb labels.
-    waitFor(() => {
-      expect(screen.findByText(Object.values(models.sections)[0].title)).toBeInTheDocument();
-      expect(screen.findByText(Object.values(models.sequences)[0].title)).toBeInTheDocument();
+    // expect the section and sequence "titles" not to be loaded in as breadcrumb labels.
+    await waitFor(() => {
+      expect(screen.queryByText(Object.values(models.sections)[0].title)).not.toBeInTheDocument();
+      expect(screen.queryByText(Object.values(models.sequences)[0].title)).not.toBeInTheDocument();
    });
  });

--- a/src/courseware/course/celebration/CelebrationModal.scss
+++ b/src/courseware/course/celebration/CelebrationModal.scss
@@ -22,7 +22,6 @@
    justify-content: center;

    button {
-      @extend .btn-primary;
      font-size: 1.2rem;
      width: 50%;
    }
--- a/src/courseware/course/content-tools/calculator/Calculator.jsx
+++ b/src/courseware/course/content-tools/calculator/Calculator.jsx
@@ -149,7 +149,7 @@ const Calculator = () => {
                />
              </li>
            </ul>
-            <table className="table small">
+            <table className="pgn__data-table small">
              <thead>
                <tr>
                  <th scope="col">
--- a/src/courseware/course/content-tools/calculator/calculator.scss
+++ b/src/courseware/course/content-tools/calculator/calculator.scss
@@ -4,4 +4,19 @@
    background-color: #f1f1f1;
    box-shadow: 0 -1px 0 0 #ddd;
  }
+
+  table {
+    tr {
+      border-bottom: var(--pgn-size-border-width) solid var(--pgn-color-border);
+    }
+
+    thead tr {
+      border-bottom: calc(2 *  var(--pgn-size-border-width)) solid var(--pgn-color-border);
+      border-top: var(--pgn-size-border-width) solid var(--pgn-color-border);
+    }
+  
+    tbody tr {
+      vertical-align: top;
+    }
+  }
 }
--- a/src/courseware/course/content-tools/contentTools.scss
+++ b/src/courseware/course/content-tools/contentTools.scss
@@ -8,8 +8,8 @@
    display: inline-block;
    position: relative;
    z-index: 2;
-    background-color: #f1f1f1;
-    border: solid 1px #ddd;
+    background-color: #f1f1f1 !important;
+    border: solid 1px #ddd !important;
    border-bottom: none;
    border-top-left-radius: .3rem;
    border-top-right-radius: .3rem;
--- a/src/courseware/course/course-exit/CourseCelebration.jsx
+++ b/src/courseware/course/course-exit/CourseCelebration.jsx
@@ -18,19 +18,19 @@ import { getAuthenticatedUser } from '@edx/frontend-platform/auth';

 import CelebrationMobile from './assets/celebration_456x328.gif';
 import CelebrationDesktop from './assets/celebration_750x540.gif';
-import certificate from '../../../generic/assets/edX_certificate.png';
-import certificateLocked from '../../../generic/assets/edX_locked_certificate.png';
+import certificate from '../../../generic/assets/openedx_certificate.png';
+import certificateLocked from '../../../generic/assets/openedx_locked_certificate.png';
 import { FormattedPricing } from '../../../generic/upgrade-button';
 import messages from './messages';
 import { useModel } from '../../../generic/model-store';
 import { requestCert } from '../../../course-home/data/thunks';
 import ProgramCompletion from './ProgramCompletion';
-import DashboardFootnote from './DashboardFootnote';
 import UpgradeFootnote from './UpgradeFootnote';
 import SocialIcons from '../../social-share/SocialIcons';
 import { logClick, logVisit } from './utils';
 import { DashboardLink, IdVerificationSupportLink, ProfileLink } from '../../../shared/links';
-import CourseRecommendationsSlot from '../../../plugin-slots/CourseRecommendationsSlot';
+import DashboardFootnote from './DashboardFootnote';
+import { CourseRecommendationsSlot } from '../../../plugin-slots/CourseExitPluginSlots';

 const LINKEDIN_BLUE = '#2867B2';

--- a/src/courseware/course/course-exit/CourseExit.jsx
+++ b/src/courseware/course/course-exit/CourseExit.jsx
@@ -1,8 +1,5 @@
-import React, { useEffect } from 'react';
+import { useEffect } from 'react';

-import { getConfig } from '@edx/frontend-platform';
-import { useIntl } from '@edx/frontend-platform/i18n';
-import { Button } from '@openedx/paragon';
 import { useSelector } from 'react-redux';
 import { Navigate } from 'react-router-dom';

@@ -10,13 +7,12 @@ import CourseCelebration from './CourseCelebration';
 import CourseInProgress from './CourseInProgress';
 import CourseNonPassing from './CourseNonPassing';
 import { COURSE_EXIT_MODES, getCourseExitMode } from './utils';
-import messages from './messages';
 import { unsubscribeFromGoalReminders } from './data/thunks';
+import { CourseExitViewCoursesPluginSlot } from '../../../plugin-slots/CourseExitPluginSlots';

 import { useModel } from '../../../generic/model-store';

 const CourseExit = () => {
-  const intl = useIntl();
  const { courseId } = useSelector(state => state.courseware);
  const {
    certificateData,
@@ -64,14 +60,7 @@ const CourseExit = () => {

  return (
    <>
-      <div className="row w-100 mt-2 mb-4 justify-content-end">
-        <Button
-          variant="outline-primary"
-          href={`${getConfig().LMS_BASE_URL}/dashboard`}
-        >
-          {intl.formatMessage(messages.viewCoursesButton)}
-        </Button>
-      </div>
+      <CourseExitViewCoursesPluginSlot />
      {body}
    </>
  );
--- a/src/courseware/course/course-exit/DashboardFootnote.jsx
+++ b/src/courseware/course/course-exit/DashboardFootnote.jsx
@@ -1,47 +1,19 @@
-import React from 'react';
 import PropTypes from 'prop-types';
-import { useSelector } from 'react-redux';
-
-import { getAuthenticatedUser } from '@edx/frontend-platform/auth';
-import { FormattedMessage, useIntl } from '@edx/frontend-platform/i18n';
-import { Hyperlink } from '@openedx/paragon';
+import { useIntl } from '@edx/frontend-platform/i18n';
 import { faCalendarAlt } from '@fortawesome/free-regular-svg-icons';
-import { getConfig } from '@edx/frontend-platform';
-
-import { useModel } from '../../../generic/model-store';

+import { DashboardFootnoteLinkPluginSlot } from '../../../plugin-slots/CourseExitPluginSlots';
 import Footnote from './Footnote';
 import messages from './messages';
-import { logClick } from './utils';

 const DashboardFootnote = ({ variant }) => {
  const intl = useIntl();
-  const { courseId } = useSelector(state => state.courseware);
-  const { org } = useModel('courseHomeMeta', courseId);
-  const { administrator } = getAuthenticatedUser();
-
-  const dashboardLink = (
-    <Hyperlink
-      style={{ textDecoration: 'underline' }}
-      destination={`${getConfig().LMS_BASE_URL}/dashboard`}
-      className="text-reset"
-      onClick={() => logClick(org, courseId, administrator, 'dashboard_footnote', { variant })}
-    >
-      {intl.formatMessage(messages.dashboardLink)}
-    </Hyperlink>
-  );
+  const dashboardLink = (<DashboardFootnoteLinkPluginSlot variant={variant} />);

  return (
    <Footnote
      icon={faCalendarAlt}
-      text={(
-        <FormattedMessage
-          id="courseCelebration.dashboardInfo" // for historical reasons
-          defaultMessage="You can access this course and its materials on your {dashboardLink}."
-          description="Text that precedes link to learner's dashboard"
-          values={{ dashboardLink }}
-        />
-      )}
+      text={intl.formatMessage(messages.dashboardInfo, { dashboardLink })}
    />
  );
 };
--- a/src/courseware/course/course-exit/Footnote.jsx
+++ b/src/courseware/course/course-exit/Footnote.jsx
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';

 const Footnote = ({ icon, text }) => (
-  <div className="row w-100 mx-0 my-4 justify-content-center">
+  <div id="celebration-footnote-wrapper" className="row w-100 mx-0 my-4 justify-content-center">
    <p className="text-gray-700">
      <FontAwesomeIcon icon={icon} style={{ width: '20px' }} />&nbsp;
      {text}
--- a/src/courseware/course/course-exit/ProgramCompletion.jsx
+++ b/src/courseware/course/course-exit/ProgramCompletion.jsx
@@ -4,7 +4,7 @@ import PropTypes from 'prop-types';
 import { getConfig } from '@edx/frontend-platform';
 import { FormattedMessage, useIntl } from '@edx/frontend-platform/i18n';
 import { Alert, Button, Hyperlink } from '@openedx/paragon';
-import certImage from '../../../generic/assets/edX_certificate.png';
+import certImage from '../../../generic/assets/openedx_certificate.png';
 import messages from './messages';

 /**
--- a/src/courseware/course/course-exit/UpgradeFootnote.jsx
+++ b/src/courseware/course/course-exit/UpgradeFootnote.jsx
@@ -20,6 +20,7 @@ const UpgradeFootnote = ({ deadline, href }) => {

  const upgradeLink = (
    <Hyperlink
+      id="upgrade-link"
      style={{ textDecoration: 'underline' }}
      destination={href}
      className="text-reset"
--- a/src/courseware/course/course-exit/messages.ts
+++ b/src/courseware/course/course-exit/messages.ts
@@ -76,6 +76,11 @@ const messages = defineMessages({
    defaultMessage: 'Dashboard',
    description: 'Link to user’s dashboard',
  },
+  dashboardInfo: {
+    id: 'courseCelebration.dashboardInfo', // for historical reasons
+    defaultMessage: 'You can access this course and its materials on your {dashboardLink}.',
+    description: "Text that precedes link to learner's dashboard",
+  },
  endOfCourseDescription: {
    id: 'courseExit.endOfCourseDescription',
    defaultMessage: 'Unfortunately, you are not currently eligible for a certificate. You need to receive a passing grade to be eligible for a certificate.',
--- a/src/courseware/course/course-exit/utils.js
+++ b/src/courseware/course/course-exit/utils.js
@@ -17,6 +17,7 @@ const CELEBRATION_STATUSES = [
  'audit_passing',
  'downloadable',
  'earned_but_not_available',
+  'not_earned_but_available_date',
  'honor_passing',
  'requesting',
  'unverified',
--- a/src/courseware/course/new-sidebar/SidebarContextProvider.tsx
+++ b/src/courseware/course/new-sidebar/SidebarContextProvider.tsx
@@ -54,6 +54,8 @@ const SidebarProvider: React.FC<Props> = ({
  }, [courseId]);

  useEffect(() => {
+    window.sessionStorage.setItem('hideCourseOutlineSidebar', 'true');
+    window.sessionStorage.setItem(`notificationTrayStatus.${courseId}`, 'open');
    setHideDiscussionbar(!isDiscussionbarAvailable);
    setHideNotificationbar(!isNotificationbarAvailable);
    if (initialSidebar && currentSidebar !== initialSidebar) {
--- a/src/courseware/course/new-sidebar/sidebars/discussions-notifications/discussions/DiscussionsWidget.test.tsx
+++ b/src/courseware/course/new-sidebar/sidebars/discussions-notifications/discussions/DiscussionsWidget.test.tsx
@@ -1,11 +1,13 @@
 import React from 'react';

+import { fireEvent } from '@testing-library/react';
 import MockAdapter from 'axios-mock-adapter';

 import { getConfig } from '@edx/frontend-platform';
-import { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';
 import { sendTrackEvent } from '@edx/frontend-platform/analytics';
+import { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';

+import { getSessionStorage, setSessionStorage } from '../../../../../../data/sessionStorage';
 import {
  initializeMockApp, initializeTestStore, render, screen,
 } from '../../../../../../setupTest';
@@ -14,11 +16,19 @@ import { buildTopicsFromUnits } from '../../../../../data/__factories__/discussi
 import { getCourseDiscussionTopics } from '../../../../../data/thunks';
 import SidebarContext from '../../../SidebarContext';
 import DiscussionsNotificationsSidebar from '../DiscussionsNotificationsSidebar';
+import DiscussionsNotificationsTrigger from '../DiscussionsNotificationsTrigger';
 import DiscussionsWidget from './DiscussionsWidget';

 initializeMockApp();
 jest.mock('@edx/frontend-platform/analytics');

+jest.mock('../../../../../../data/sessionStorage', () => ({
+  getSessionStorage: jest.fn(),
+  setSessionStorage: jest.fn(),
+}));
+
+const onClickMock = jest.fn();
+
 describe('DiscussionsWidget', () => {
  let axiosMock;
  let mockData;
@@ -81,4 +91,34 @@ describe('DiscussionsWidget', () => {
    expect(screen.queryByText('Back to course')).toBeInTheDocument();
    expect(sendTrackEvent).toHaveBeenCalledTimes(1);
  });
+
+  it('should open notification tray if closed', () => {
+    (getSessionStorage as jest.Mock).mockReturnValue('closed');
+
+    renderWithProvider(() => <DiscussionsNotificationsTrigger onClick={onClickMock} />);
+
+    const button = screen.getByRole('button');
+    fireEvent.click(button);
+
+    expect(setSessionStorage).toHaveBeenCalledWith(
+      `notificationTrayStatus.${courseId}`,
+      'open',
+    );
+    expect(onClickMock).toHaveBeenCalled();
+  });
+
+  it('should close notification tray if open', () => {
+    (getSessionStorage as jest.Mock).mockReturnValue('open');
+
+    renderWithProvider(() => <DiscussionsNotificationsTrigger onClick={onClickMock} />);
+
+    const button = screen.getByRole('button');
+    fireEvent.click(button);
+
+    expect(setSessionStorage).toHaveBeenCalledWith(
+      `notificationTrayStatus.${courseId}`,
+      'open',
+    );
+    expect(onClickMock).toHaveBeenCalled();
+  });
 });
--- a/src/courseware/course/sequence/Sequence.jsx
+++ b/src/courseware/course/sequence/Sequence.jsx
@@ -13,17 +13,17 @@ import SequenceExamWrapper from '@edx/frontend-lib-special-exams';
 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 SequenceContainerSlot from '@src/plugin-slots/SequenceContainerSlot';
+import { CourseOutlineSidebarSlot } from '@src/plugin-slots/CourseOutlineSidebarSlot';
+import { CourseOutlineSidebarTriggerSlot } from '@src/plugin-slots/CourseOutlineSidebarTriggerSlot';
+import { NotificationsDiscussionsSidebarSlot } from '@src/plugin-slots/NotificationsDiscussionsSidebarSlot';
+import SequenceNavigationSlot from '@src/plugin-slots/SequenceNavigationSlot';

-import { getCoursewareOutlineSidebarSettings } from '../../data/selectors';
 import CourseLicense from '../course-license';
-import { NotificationsDiscussionsSidebarSlot } from '../../../plugin-slots/NotificationsDiscussionsSidebarSlot';
 import messages from './messages';
 import HiddenAfterDue from './hidden-after-due';
-import { SequenceNavigation, UnitNavigation } from './sequence-navigation';
+import { UnitNavigation } from './sequence-navigation';
 import SequenceContent from './SequenceContent';
-import { CourseOutlineSidebarSlot } from '../../../plugin-slots/CourseOutlineSidebarSlot';
-import { CourseOutlineSidebarTriggerSlot } from '../../../plugin-slots/CourseOutlineSidebarTriggerSlot';

 const Sequence = ({
  unitId,
@@ -47,7 +47,7 @@ const Sequence = ({
  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 handleNext = () => {
    const nextIndex = sequence.unitIds.indexOf(unitId) + 1;
    const newUnitId = sequence.unitIds[nextIndex];
@@ -90,6 +90,30 @@ const Sequence = ({
    sendTrackingLogEvent(eventName, payload);
  };

+  /* istanbul ignore next */
+  const nextHandler = () => {
+    logEvent('edx.ui.lms.sequence.next_selected', 'top');
+    handleNext();
+  };
+
+  /* istanbul ignore next */
+  const previousHandler = () => {
+    logEvent('edx.ui.lms.sequence.previous_selected', 'top');
+    handlePrevious();
+  };
+
+  /* istanbul ignore next */
+  const onNavigate = (destinationUnitId) => {
+    logEvent('edx.ui.lms.sequence.tab_selected', 'top', destinationUnitId);
+    handleNavigate(destinationUnitId);
+  };
+
+  const sequenceNavProps = {
+    nextHandler,
+    previousHandler,
+    onNavigate,
+  };
+
  useSequenceBannerTextAlert(sequenceId);
  useSequenceEntranceExamAlert(courseId, sequenceId, intl);

@@ -170,30 +194,25 @@ const Sequence = ({
        />
        <CourseOutlineSidebarSlot />
        <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,
-                }}
-              />
-            </div>
-          )}
+          <div className="sequence-navigation-container">
+            {/**
+             SequenceNavigationSlot renders nothing by default.
+             However, we still pass nextHandler, previousHandler, and onNavigate,
+             because, as per the slot's contract, if this slot is replaced
+             with the default SequenceNavigation component, these props are required.
+             These handlers are excluded from test coverage via istanbul ignore,
+             since they are not used unless the slot is overridden.
+             */}
+            <SequenceNavigationSlot
+              sequenceId={sequenceId}
+              unitId={unitId}
+              {...{
+                ...sequenceNavProps,
+                nextSequenceHandler,
+                handleNavigate,
+              }}
+            />
+          </div>

          <div className="unit-container flex-grow-1 pt-4">
            <SequenceContent
@@ -203,7 +222,6 @@ const Sequence = ({
              unitId={unitId}
              unitLoadedHandler={handleUnitLoaded}
              isOriginalUserStaff={originalUserIsStaff}
-              isEnabledOutlineSidebar={isEnabledOutlineSidebar}
              renderUnitNavigation={renderUnitNavigation}
            />
            {unitHasLoaded && renderUnitNavigation(false)}
@@ -217,18 +235,20 @@ const Sequence = ({

  if (sequenceStatus === 'loaded') {
    return (
-      <div>
-        <SequenceExamWrapper
-          sequence={sequence}
-          courseId={courseId}
-          isStaff={isStaff}
-          originalUserIsStaff={originalUserIsStaff}
-          canAccessProctoredExams={canAccessProctoredExams}
-        >
-          {defaultContent}
-        </SequenceExamWrapper>
+      <>
+        <div className="d-flex flex-column flex-grow-1 justify-content-center">
+          <SequenceExamWrapper
+            sequence={sequence}
+            courseId={courseId}
+            isStaff={isStaff}
+            originalUserIsStaff={originalUserIsStaff}
+            canAccessProctoredExams={canAccessProctoredExams}
+          >
+            {defaultContent}
+          </SequenceExamWrapper>
+        </div>
        <CourseLicense license={license || undefined} />
-      </div>
+      </>
    );
  }

--- a/src/courseware/course/sequence/Sequence.test.jsx
+++ b/src/courseware/course/sequence/Sequence.test.jsx
@@ -24,7 +24,6 @@ describe('Sequence', () => {
    { type: 'vertical' },
    { courseId: courseMetadata.id },
  ));
-  const enableNavigationSidebar = { enable_navigation_sidebar: false };

  beforeAll(async () => {
    const store = await initializeTestStore({ courseMetadata, unitBlocks });
@@ -96,7 +95,6 @@ describe('Sequence', () => {
      unitBlocks,
      sequenceBlocks,
      sequenceMetadata,
-      enableNavigationSidebar: { enable_navigation_sidebar: true },
    }, false);
    const { container } = render(
      <SidebarWrapper overrideData={{ sequenceId: sequenceBlocks[0].id }} />,
@@ -131,7 +129,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 }} />,
@@ -190,7 +188,7 @@ describe('Sequence', () => {

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

@@ -366,7 +364,6 @@ describe('Sequence', () => {
        unitBlocks,
        sequenceBlocks: testSequenceBlocks,
        sequenceMetadata: testSequenceMetadata,
-        enableNavigationSidebar,
      }, false);
      const testData = {
        ...mockData,
--- a/src/courseware/course/sequence/SequenceContent.jsx
+++ b/src/courseware/course/sequence/SequenceContent.jsx
@@ -16,7 +16,6 @@ const SequenceContent = ({
  unitId,
  unitLoadedHandler,
  isOriginalUserStaff,
-  isEnabledOutlineSidebar,
  renderUnitNavigation,
 }) => {
  const intl = useIntl();
@@ -63,7 +62,6 @@ const SequenceContent = ({
      id={unitId}
      onLoaded={unitLoadedHandler}
      isOriginalUserStaff={isOriginalUserStaff}
-      isEnabledOutlineSidebar={isEnabledOutlineSidebar}
      renderUnitNavigation={renderUnitNavigation}
    />
  );
@@ -76,7 +74,6 @@ SequenceContent.propTypes = {
  unitId: PropTypes.string,
  unitLoadedHandler: PropTypes.func.isRequired,
  isOriginalUserStaff: PropTypes.bool.isRequired,
-  isEnabledOutlineSidebar: PropTypes.bool.isRequired,
  renderUnitNavigation: PropTypes.func.isRequired,
 };

--- a/src/courseware/course/sequence/SequenceContent.test.jsx
+++ b/src/courseware/course/sequence/SequenceContent.test.jsx
@@ -15,6 +15,7 @@ describe('Sequence Content', () => {
      sequenceId: courseware.sequenceId,
      unitId: models.sequences[courseware.sequenceId].unitIds[0],
      unitLoadedHandler: () => { },
+      renderUnitNavigation: () => { },
    };
  });

@@ -38,7 +39,7 @@ describe('Sequence Content', () => {
  });

  it('displays message for no content', () => {
-    render(<SequenceContent {...mockData} unitId={null} />, { wrapWithRouter: true });
+    render(<SequenceContent {...mockData} unitId="" />, { wrapWithRouter: true });
    expect(screen.getByText('There is no content here.')).toBeInTheDocument();
  });
 });
--- a/src/courseware/course/sequence/Unit/ContentIFrame.jsx
+++ b/src/courseware/course/sequence/Unit/ContentIFrame.jsx
@@ -1,9 +1,7 @@
 import PropTypes from 'prop-types';
-import React from 'react';

 import { ErrorPage } from '@edx/frontend-platform/react';
-import { StrictDict } from '@edx/react-unit-test-utils';
-import { ModalDialog, Modal } from '@openedx/paragon';
+import { ModalDialog } from '@openedx/paragon';
 import { ContentIFrameLoaderSlot } from '../../../../plugin-slots/ContentIFrameLoaderSlot';

 import * as hooks from './hooks';
@@ -22,10 +20,10 @@ export const IFRAME_FEATURE_POLICY = (
  'microphone *; camera *; midi *; geolocation *; encrypted-media *; clipboard-write *; autoplay *'
 );

-export const testIDs = StrictDict({
+export const testIDs = {
  contentIFrame: 'content-iframe-test-id',
  modalIFrame: 'modal-iframe-test-id',
-});
+};

 const ContentIFrame = ({
  iframeUrl,
@@ -65,21 +63,6 @@ const ContentIFrame = ({
    onLoad: handleIFrameLoad,
  };

-  let modalContent;
-  if (modalOptions.isOpen) {
-    modalContent = modalOptions.body
-      ? <div className="unit-modal">{ modalOptions.body }</div>
-      : (
-        <iframe
-          title={modalOptions.title}
-          allow={IFRAME_FEATURE_POLICY}
-          frameBorder="0"
-          src={modalOptions.url}
-          style={{ width: '100%', height: modalOptions.height }}
-        />
-      );
-  }
-
  return (
    <>
      {(shouldShowContent && !hasLoaded) && (
@@ -90,29 +73,30 @@ const ContentIFrame = ({
          <iframe title={title} {...contentIFrameProps} data-testid={testIDs.contentIFrame} />
        </div>
      )}
-      {modalOptions.isOpen && (modalOptions.isFullscreen
-        ? (
+      {modalOptions.isOpen
+          && (
          <ModalDialog
            dialogClassName="modal-lti"
            onClose={handleModalClose}
-            size="fullscreen"
+            size={modalOptions.isFullscreen ? 'fullscreen' : 'md'}
            isOpen
            hasCloseButton={false}
          >
            <ModalDialog.Body className={modalOptions.modalBodyClassName}>
-              {modalContent}
+              {modalOptions.body
+                ? <div className="unit-modal">{ modalOptions.body }</div>
+                : (
+                  <iframe
+                    title={modalOptions.title}
+                    allow={IFRAME_FEATURE_POLICY}
+                    frameBorder="0"
+                    src={modalOptions.url}
+                    style={{ width: '100%', height: modalOptions.height }}
+                  />
+                )}
            </ModalDialog.Body>
          </ModalDialog>
-
-        ) : (
-          <Modal
-            body={modalContent}
-            dialogClassName="modal-lti"
-            onClose={handleModalClose}
-            open
-          />
-        )
-      )}
+          )}
    </>
  );
 };
--- a/src/courseware/course/sequence/Unit/ContentIFrame.test.jsx
+++ b/src/courseware/course/sequence/Unit/ContentIFrame.test.jsx
@@ -1,26 +1,11 @@
-import React from 'react';
+import { render, screen } from '@testing-library/react';

-import { ErrorPage } from '@edx/frontend-platform/react';
-import { ModalDialog, Modal } from '@openedx/paragon';
-import { shallow } from '@edx/react-unit-test-utils';
-
-import PageLoading from '@src/generic/PageLoading';
-
-import { ContentIFrameLoaderSlot } from '@src/plugin-slots/ContentIFrameLoaderSlot';
 import * as hooks from './hooks';
-import ContentIFrame, { IFRAME_FEATURE_POLICY, testIDs } from './ContentIFrame';
+import ContentIFrame, { IFRAME_FEATURE_POLICY } from './ContentIFrame';

-jest.mock('@edx/frontend-platform/react', () => ({ ErrorPage: 'ErrorPage' }));
+jest.mock('@edx/frontend-platform/react', () => ({ ErrorPage: () => <div>ErrorPage</div> }));

-jest.mock('@openedx/paragon', () => jest.requireActual('@edx/react-unit-test-utils')
-  .mockComponents({
-    Modal: 'Modal',
-    ModalDialog: {
-      Body: 'ModalDialog.Body',
-    },
-  }));
-
-jest.mock('@src/generic/PageLoading', () => 'PageLoading');
+jest.mock('@src/generic/PageLoading', () => jest.fn(() => <div>PageLoading</div>));

 jest.mock('./hooks', () => ({
  useIFrameBehavior: jest.fn(),
@@ -68,14 +53,13 @@ const props = {
  title: 'test-title',
 };

-let el;
 describe('ContentIFrame Component', () => {
  beforeEach(() => {
    jest.clearAllMocks();
  });
  describe('behavior', () => {
    beforeEach(() => {
-      el = shallow(<ContentIFrame {...props} />);
+      render(<ContentIFrame {...props} />);
    });
    it('initializes iframe behavior hook', () => {
      expect(hooks.useIFrameBehavior).toHaveBeenCalledWith({
@@ -90,61 +74,61 @@ describe('ContentIFrame Component', () => {
    });
  });
  describe('output', () => {
-    let component;
    describe('if shouldShowContent', () => {
      describe('if not hasLoaded', () => {
        it('displays errorPage if showError', () => {
          hooks.useIFrameBehavior.mockReturnValueOnce({ ...iframeBehavior, showError: true });
-          el = shallow(<ContentIFrame {...props} />);
-          expect(el.instance.findByType(ErrorPage).length).toEqual(1);
+          render(<ContentIFrame {...props} />);
+          const errorPage = screen.getByText('ErrorPage');
+          expect(errorPage).toBeInTheDocument();
        });
        it('displays PageLoading component if not showError', () => {
-          el = shallow(<ContentIFrame {...props} />);
-          [component] = el.instance.findByType(ContentIFrameLoaderSlot);
-          expect(component.props.loadingMessage).toEqual(props.loadingMessage);
+          render(<ContentIFrame {...props} />);
+          const pageLoading = screen.getByText('PageLoading');
+          expect(pageLoading).toBeInTheDocument();
        });
      });
      describe('hasLoaded', () => {
        it('does not display PageLoading or ErrorPage', () => {
          hooks.useIFrameBehavior.mockReturnValueOnce({ ...iframeBehavior, hasLoaded: true });
-          el = shallow(<ContentIFrame {...props} />);
-          expect(el.instance.findByType(PageLoading).length).toEqual(0);
-          expect(el.instance.findByType(ErrorPage).length).toEqual(0);
+          render(<ContentIFrame {...props} />);
+          const pageLoading = screen.queryByText('PageLoading');
+          expect(pageLoading).toBeNull();
+          const errorPage = screen.queryByText('ErrorPage');
+          expect(errorPage).toBeNull();
        });
      });
      it('display iframe with props from hooks', () => {
-        el = shallow(<ContentIFrame {...props} />);
-        [component] = el.instance.findByTestId(testIDs.contentIFrame);
-        expect(component.props).toEqual({
-          allow: IFRAME_FEATURE_POLICY,
-          allowFullScreen: true,
-          scrolling: 'no',
-          referrerPolicy: 'origin',
-          title: props.title,
-          id: props.elementId,
-          src: props.iframeUrl,
-          height: iframeBehavior.iframeHeight,
-          onLoad: iframeBehavior.handleIFrameLoad,
-          'data-testid': testIDs.contentIFrame,
-        });
+        render(<ContentIFrame {...props} />);
+        const iframe = screen.getByTitle(props.title);
+        expect(iframe).toBeInTheDocument();
+        expect(iframe).toHaveAttribute('id', props.elementId);
+        expect(iframe).toHaveAttribute('src', props.iframeUrl);
+        expect(iframe).toHaveAttribute('allow', IFRAME_FEATURE_POLICY);
+        expect(iframe).toHaveAttribute('allowfullscreen', '');
+        expect(iframe).toHaveAttribute('scrolling', 'no');
+        expect(iframe).toHaveAttribute('referrerpolicy', 'origin');
      });
    });
    describe('if not shouldShowContent', () => {
      it('does not show PageLoading, ErrorPage, or unit-iframe-wrapper', () => {
-        el = shallow(<ContentIFrame {...{ ...props, shouldShowContent: false }} />);
-        expect(el.instance.findByType(PageLoading).length).toEqual(0);
-        expect(el.instance.findByType(ErrorPage).length).toEqual(0);
-        expect(el.instance.findByTestId(testIDs.contentIFrame).length).toEqual(0);
+        render(<ContentIFrame {...{ ...props, shouldShowContent: false }} />);
+        expect(screen.queryByText('PageLoading')).toBeNull();
+        expect(screen.queryByText('ErrorPage')).toBeNull();
+        expect(screen.queryByTitle(props.title)).toBeNull();
      });
    });
    it('does not display modal if modalOptions returns isOpen: false', () => {
-      el = shallow(<ContentIFrame {...props} />);
-      expect(el.instance.findByType(Modal).length).toEqual(0);
+      render(<ContentIFrame {...props} />);
+      const modal = screen.queryByRole('dialog');
+      expect(modal).toBeNull();
    });
    describe('if modalOptions.isOpen', () => {
      const testModalOpenAndHandleClose = () => {
-        test('Modal component isOpen, with handleModalClose from hook', () => {
-          expect(component.props.onClose).toEqual(modalIFrameData.handleModalClose);
+        it('closes modal on close button click', () => {
+          const closeButton = screen.getByTestId('modal-backdrop');
+          closeButton.click();
+          expect(modalIFrameData.handleModalClose).toHaveBeenCalled();
        });
      };
      describe('fullscreen modal', () => {
@@ -154,14 +138,13 @@ describe('ContentIFrame Component', () => {
              ...modalIFrameData,
              modalOptions: { ...modalOptions.withBody, isFullscreen: true },
            });
-            el = shallow(<ContentIFrame {...props} />);
-            [component] = el.instance.findByType(ModalDialog);
+            render(<ContentIFrame {...props} />);
          });
          it('displays Modal with div wrapping provided body content if modal.body is provided', () => {
-            const content = component.findByType(ModalDialog.Body)[0].children[0];
-            expect(content.matches(shallow(
-              <div className="unit-modal">{modalOptions.withBody.body}</div>,
-            ))).toEqual(true);
+            const dialog = screen.getByRole('dialog');
+            expect(dialog).toBeInTheDocument();
+            const modalBody = screen.getByText(modalOptions.withBody.body);
+            expect(modalBody).toBeInTheDocument();
          });
          testModalOpenAndHandleClose();
        });
@@ -172,53 +155,42 @@ describe('ContentIFrame Component', () => {
                ...modalIFrameData,
                modalOptions: { ...modalOptions.withUrl, isFullscreen: true },
              });
-            el = shallow(<ContentIFrame {...props} />);
-            [component] = el.instance.findByType(ModalDialog);
+            render(<ContentIFrame {...props} />);
+          });
+          it('displays Modal with iframe to provided url if modal.body is not provided', () => {
+            const iframe = screen.getByTitle(modalOptions.withUrl.title);
+            expect(iframe).toBeInTheDocument();
+            expect(iframe).toHaveAttribute('allow', IFRAME_FEATURE_POLICY);
+            expect(iframe).toHaveAttribute('src', modalOptions.withUrl.url);
          });
          testModalOpenAndHandleClose();
-          it('displays Modal with iframe to provided url if modal.body is not provided', () => {
-            const content = component.findByType(ModalDialog.Body)[0].children[0];
-            expect(content.matches(shallow(
-              <iframe
-                title={modalOptions.withUrl.title}
-                allow={IFRAME_FEATURE_POLICY}
-                frameBorder="0"
-                src={modalOptions.withUrl.url}
-                style={{ width: '100%', height: modalOptions.withUrl.height }}
-              />,
-            ))).toEqual(true);
-          });
        });
      });
      describe('body modal', () => {
        beforeEach(() => {
          hooks.useModalIFrameData.mockReturnValueOnce({ ...modalIFrameData, modalOptions: modalOptions.withBody });
-          el = shallow(<ContentIFrame {...props} />);
-          [component] = el.instance.findByType(Modal);
+          render(<ContentIFrame {...props} />);
        });
        it('displays Modal with div wrapping provided body content if modal.body is provided', () => {
-          expect(component.props.body).toEqual(<div className="unit-modal">{modalOptions.withBody.body}</div>);
+          const dialog = screen.getByRole('dialog');
+          expect(dialog).toBeInTheDocument();
+          const modalBody = screen.getByText(modalOptions.withBody.body);
+          expect(modalBody).toBeInTheDocument();
        });
        testModalOpenAndHandleClose();
      });
      describe('url modal', () => {
        beforeEach(() => {
          hooks.useModalIFrameData.mockReturnValueOnce({ ...modalIFrameData, modalOptions: modalOptions.withUrl });
-          el = shallow(<ContentIFrame {...props} />);
-          [component] = el.instance.findByType(Modal);
+          render(<ContentIFrame {...props} />);
+        });
+        it('displays Modal with iframe to provided url if modal.body is not provided', () => {
+          const iframe = screen.getByTitle(modalOptions.withUrl.title);
+          expect(iframe).toBeInTheDocument();
+          expect(iframe).toHaveAttribute('allow', IFRAME_FEATURE_POLICY);
+          expect(iframe).toHaveAttribute('src', modalOptions.withUrl.url);
        });
        testModalOpenAndHandleClose();
-        it('displays Modal with iframe to provided url if modal.body is not provided', () => {
-          expect(component.props.body).toEqual(
-            <iframe
-              title={modalOptions.withUrl.title}
-              allow={IFRAME_FEATURE_POLICY}
-              frameBorder="0"
-              src={modalOptions.withUrl.url}
-              style={{ width: '100%', height: modalOptions.withUrl.height }}
-            />,
-          );
-        });
      });
    });
  });
--- a/src/courseware/course/sequence/Unit/UnitSuspense.test.jsx
+++ b/src/courseware/course/sequence/Unit/UnitSuspense.test.jsx
@@ -1,22 +1,15 @@
-import React from 'react';
-
-import { formatMessage, shallow } from '@edx/react-unit-test-utils';
+import { render, screen } from '@testing-library/react';
+import { IntlProvider } from '@edx/frontend-platform/i18n';

 import { useModel } from '@src/generic/model-store';
-import PageLoading from '@src/generic/PageLoading';
-
-import { GatedUnitContentMessageSlot } from '@src/plugin-slots/GatedUnitContentMessageSlot';
-import messages from '../messages';
-import HonorCode from '../honor-code';
-import LockPaywall from '../lock-paywall';
 import hooks from './hooks';
 import { modelKeys } from './constants';

 import UnitSuspense from './UnitSuspense';

 jest.mock('@edx/frontend-platform/i18n', () => ({
+  ...jest.requireActual('@edx/frontend-platform/i18n'),
  defineMessages: m => m,
-  useIntl: () => ({ formatMessage: jest.requireActual('@edx/react-unit-test-utils').formatMessage }),
 }));

 jest.mock('react', () => ({
@@ -24,10 +17,9 @@ jest.mock('react', () => ({
  Suspense: 'Suspense',
 }));

-jest.mock('../honor-code', () => 'HonorCode');
-jest.mock('../lock-paywall', () => 'LockPaywall');
+jest.mock('../honor-code', () => jest.fn(() => <div>HonorCode</div>));
+jest.mock('../lock-paywall', () => jest.fn(() => <div>LockPaywall</div>));
 jest.mock('@src/generic/model-store', () => ({ useModel: jest.fn() }));
-jest.mock('@src/generic/PageLoading', () => 'PageLoading');

 jest.mock('./hooks', () => ({
  useShouldDisplayHonorCode: jest.fn(() => false),
@@ -46,7 +38,6 @@ const props = {
  id: 'test-id',
 };

-let el;
 describe('UnitSuspense component', () => {
  beforeEach(() => {
    jest.clearAllMocks();
@@ -54,7 +45,7 @@ describe('UnitSuspense component', () => {
  });
  describe('behavior', () => {
    it('initializes models', () => {
-      el = shallow(<UnitSuspense {...props} />);
+      render(<IntlProvider locale="en"><UnitSuspense {...props} /></IntlProvider>);
      const { calls } = useModel.mock;
      const [unitCall] = calls.filter(call => call[0] === modelKeys.units);
      const [metaCall] = calls.filter(call => call[0] === modelKeys.coursewareMeta);
@@ -66,8 +57,9 @@ describe('UnitSuspense component', () => {
    describe('LockPaywall', () => {
      const testNoPaywall = () => {
        it('does not display LockPaywall', () => {
-          el = shallow(<UnitSuspense {...props} />);
-          expect(el.instance.findByType(LockPaywall).length).toEqual(0);
+          render(<IntlProvider locale="en"><UnitSuspense {...props} /></IntlProvider>);
+          const lockPaywall = screen.queryByText('LockPaywall');
+          expect(lockPaywall).toBeNull();
        });
      };
      describe('gating not enabled', () => { testNoPaywall(); });
@@ -78,29 +70,29 @@ describe('UnitSuspense component', () => {
      describe('gating enabled, gated content included', () => {
        beforeEach(() => { mockModels(true, true); });
        it('displays LockPaywall in Suspense wrapper with PageLoading fallback', () => {
-          el = shallow(<UnitSuspense {...props} />);
-          const [component] = el.instance.findByType(GatedUnitContentMessageSlot);
-          expect(component.parent.type).toEqual('Suspense');
-          expect(component.parent.props.fallback)
-            .toEqual(<PageLoading srMessage={formatMessage(messages.loadingLockedContent)} />);
-          expect(component.props.courseId).toEqual(props.courseId);
+          hooks.useShouldDisplayHonorCode.mockReturnValueOnce(false);
+          render(<IntlProvider locale="en"><UnitSuspense {...props} /></IntlProvider>);
+          const lockPaywall = screen.getByText('LockPaywall');
+          expect(lockPaywall).toBeInTheDocument();
+          const suspenseWrapper = lockPaywall.closest('suspense');
+          expect(suspenseWrapper).toBeInTheDocument();
        });
      });
    });
    describe('HonorCode', () => {
      it('does not display HonorCode if useShouldDisplayHonorCode => false', () => {
        hooks.useShouldDisplayHonorCode.mockReturnValueOnce(false);
-        el = shallow(<UnitSuspense {...props} />);
-        expect(el.instance.findByType(HonorCode).length).toEqual(0);
+        render(<IntlProvider locale="en"><UnitSuspense {...props} /></IntlProvider>);
+        const honorCode = screen.queryByText('HonorCode');
+        expect(honorCode).toBeNull();
      });
      it('displays HonorCode component in Suspense wrapper with PageLoading fallback if shouldDisplayHonorCode', () => {
        hooks.useShouldDisplayHonorCode.mockReturnValueOnce(true);
-        el = shallow(<UnitSuspense {...props} />);
-        const [component] = el.instance.findByType(HonorCode);
-        expect(component.parent.type).toEqual('Suspense');
-        expect(component.parent.props.fallback)
-          .toEqual(<PageLoading srMessage={formatMessage(messages.loadingHonorCode)} />);
-        expect(component.props.courseId).toEqual(props.courseId);
+        render(<IntlProvider locale="en"><UnitSuspense {...props} /></IntlProvider>);
+        const honorCode = screen.getByText('HonorCode');
+        expect(honorCode).toBeInTheDocument();
+        const suspenseWrapper = honorCode.closest('suspense');
+        expect(suspenseWrapper).toBeInTheDocument();
      });
    });
  });
--- a/src/courseware/course/sequence/Unit/constants.ts
+++ b/src/courseware/course/sequence/Unit/constants.ts
@@ -1,26 +1,25 @@
-import { StrictDict } from '@edx/react-unit-test-utils/dist';
-
-export const modelKeys = StrictDict({
+export const modelKeys = {
  units: 'units',
  coursewareMeta: 'coursewareMeta',
-});
+} as const;

-export const views = StrictDict({
+export const views = {
  student: 'student_view',
  public: 'public_view',
-});
+} as const;

 export const loadingState = 'loading';

-export const messageTypes = StrictDict({
+export const messageTypes = {
  modal: 'plugin.modal',
  resize: 'plugin.resize',
  videoFullScreen: 'plugin.videoFullScreen',
-});
+  autoAdvance: 'plugin.autoAdvance',
+} as const;

-export default StrictDict({
+export default {
  modelKeys,
  views,
  loadingState,
  messageTypes,
-});
+};
--- a/src/courseware/course/sequence/Unit/hooks/useExamAccess.js
+++ b/src/courseware/course/sequence/Unit/hooks/useExamAccess.js
@@ -1,19 +1,13 @@
 import React from 'react';

 import { logError } from '@edx/frontend-platform/logging';
-import { StrictDict, useKeyedState } from '@edx/react-unit-test-utils';
 import { useExamAccessToken, useFetchExamAccessToken, useIsExam } from '@edx/frontend-lib-special-exams';

-export const stateKeys = StrictDict({
-  accessToken: 'accessToken',
-  blockAccess: 'blockAccess',
-});
-
 const useExamAccess = ({
  id,
 }) => {
  const isExam = useIsExam();
-  const [blockAccess, setBlockAccess] = useKeyedState(stateKeys.blockAccess, isExam);
+  const [blockAccess, setBlockAccess] = React.useState(isExam);

  const fetchExamAccessToken = useFetchExamAccessToken();

--- a/src/courseware/course/sequence/Unit/hooks/useIFrameBehavior.test.js
+++ b/src/courseware/course/sequence/Unit/hooks/useIFrameBehavior.test.js
@@ -1,7 +1,6 @@
-import React from 'react';
 import { useDispatch } from 'react-redux';
+import { renderHook } from '@testing-library/react';

-import { getEffects, mockUseKeyedState } from '@edx/react-unit-test-utils';
 import { logError } from '@edx/frontend-platform/logging';

 import { getConfig } from '@edx/frontend-platform';
@@ -9,10 +8,13 @@ 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';
+import { useSequenceNavigationMetadata } from '@src/courseware/course/sequence/sequence-navigation/hooks';

 import { messageTypes } from '../constants';

-import useIFrameBehavior, { stateKeys } from './useIFrameBehavior';
+import useIFrameBehavior, { iframeBehaviorState } from './useIFrameBehavior';
+
+const mockNavigate = jest.fn();

 jest.mock('@edx/frontend-platform', () => ({
  getConfig: jest.fn(),
@@ -22,21 +24,14 @@ jest.mock('@edx/frontend-platform/analytics');

 jest.mock('react', () => ({
  ...jest.requireActual('react'),
-  useEffect: jest.fn(),
  useCallback: jest.fn((cb, prereqs) => ({ cb, prereqs })),
 }));

 jest.mock('react-redux', () => ({
  useDispatch: jest.fn(),
+  useSelector: jest.fn(),
 }));

-jest.mock('lodash', () => ({
-  ...jest.requireActual('lodash'),
-  throttle: jest.fn((fn) => fn),
-}));
-
-jest.mock('./useLoadBearingHook', () => jest.fn());
-
 jest.mock('@edx/frontend-platform/logging', () => ({
  logError: jest.fn(),
 }));
@@ -50,8 +45,16 @@ jest.mock('@src/course-home/data/thunks', () => ({
 jest.mock('@src/generic/hooks', () => ({
  useEventListener: jest.fn(),
 }));
+jest.mock('@src/generic/model-store', () => ({
+  useModel: () => ({ unitIds: ['unit1', 'unit2'], entranceExamData: { entranceExamPassed: null } }),
+}));
+jest.mock('react-router-dom', () => ({
+  ...jest.requireActual('react-router-dom'),
+  useNavigate: () => mockNavigate,
+}));

-const state = mockUseKeyedState(stateKeys);
+jest.mock('@src/courseware/course/sequence/sequence-navigation/hooks');
+useSequenceNavigationMetadata.mockReturnValue({ isLastUnit: false, nextLink: '/next-unit-link' });

 const props = {
  elementId: 'test-element-id',
@@ -90,148 +93,147 @@ const stateVals = {
  windowTopOffset: 32,
 };

+const setIframeHeight = jest.fn();
+const setHasLoaded = jest.fn();
+const setShowError = jest.fn();
+const setWindowTopOffset = jest.fn();
+
+const mockState = (state) => {
+  const {
+    iframeHeight, hasLoaded, showError, windowTopOffset,
+  } = state;
+  if ('iframeHeight' in state) { jest.spyOn(iframeBehaviorState, 'iframeHeight').mockImplementation(() => [iframeHeight, setIframeHeight]); }
+  if ('hasLoaded' in state) { jest.spyOn(iframeBehaviorState, 'hasLoaded').mockImplementation(() => [hasLoaded, setHasLoaded]); }
+  if ('showError' in state) { jest.spyOn(iframeBehaviorState, 'showError').mockImplementation(() => [showError, setShowError]); }
+  if ('windowTopOffset' in state) { jest.spyOn(iframeBehaviorState, 'windowTopOffset').mockImplementation(() => [windowTopOffset, setWindowTopOffset]); }
+};
+
 describe('useIFrameBehavior hook', () => {
-  let hook;
  beforeEach(() => {
    jest.clearAllMocks();
-    state.mock();
    global.document.getElementById = mockGetElementById;
    global.window.addEventListener = jest.fn();
    global.window.removeEventListener = jest.fn();
    global.window.innerHeight = 800;
  });
-  afterEach(() => {
-    state.resetVals();
-  });
  describe('behavior', () => {
    it('initializes iframe height to 0 and error/loaded values to false', () => {
-      hook = useIFrameBehavior(props);
-      state.expectInitializedWith(stateKeys.iframeHeight, 0);
-      state.expectInitializedWith(stateKeys.hasLoaded, false);
-      state.expectInitializedWith(stateKeys.showError, false);
-      state.expectInitializedWith(stateKeys.windowTopOffset, null);
+      mockState(defaultStateVals);
+      const { result } = renderHook(() => useIFrameBehavior(props));
+
+      expect(result.current.iframeHeight).toBe(0);
+      expect(result.current.showError).toBe(false);
+      expect(result.current.hasLoaded).toBe(false);
    });
    describe('effects - on frame change', () => {
      let oldGetElement;
      beforeEach(() => {
        global.window ??= Object.create(window);
        Object.defineProperty(window, 'location', { value: {}, writable: true });
-        state.mockVals(stateVals);
        oldGetElement = document.getElementById;
        document.getElementById = mockGetElementById;
+        mockState(defaultStateVals);
      });
      afterEach(() => {
-        state.resetVals();
+        jest.clearAllMocks();
        document.getElementById = oldGetElement;
      });
      it('does not post url hash if the window does not have one', () => {
-        hook = useIFrameBehavior(props);
-        const cb = getEffects([
-          props.id,
-          props.onLoaded,
-          testIFrameHeight,
-          true,
-        ], React)[0];
-        cb();
+        window.location.hash = '';
+        renderHook(() => useIFrameBehavior(props));
        expect(postMessage).not.toHaveBeenCalled();
      });
      it('posts url hash if the window has one', () => {
        window.location.hash = testHash;
-        hook = useIFrameBehavior(props);
-        const cb = getEffects([
-          props.id,
-          props.onLoaded,
-          testIFrameHeight,
-          true,
-        ], React)[0];
-        cb();
+        renderHook(() => useIFrameBehavior(props));
        expect(postMessage).toHaveBeenCalledWith({ hashName: testHash }, config.LMS_BASE_URL);
      });
    });
    describe('event listener', () => {
      it('calls eventListener with prepared callback', () => {
-        state.mockVals(stateVals);
-        hook = useIFrameBehavior(props);
+        mockState(stateVals);
+        renderHook(() => useIFrameBehavior(props));
        const [call] = useEventListener.mock.calls;
        expect(call[0]).toEqual('message');
        expect(call[1].prereqs).toEqual([
          props.id,
          props.onLoaded,
-          state.values.hasLoaded,
-          state.setState.hasLoaded,
-          state.values.iframeHeight,
-          state.setState.iframeHeight,
-          state.values.windowTopOffset,
-          state.setState.windowTopOffset,
+          stateVals.hasLoaded,
+          setHasLoaded,
+          stateVals.iframeHeight,
+          setIframeHeight,
+          stateVals.windowTopOffset,
+          setWindowTopOffset,
        ]);
      });
      describe('resize message', () => {
-        const resizeMessage = (height = 23) => ({
+        const customHeight = 25;
+        const defaultHeight = 23;
+        const resizeMessage = (height = defaultHeight) => ({
          data: { type: messageTypes.resize, payload: { height } },
        });
        const videoFullScreenMessage = (open = false) => ({
          data: { type: messageTypes.videoFullScreen, payload: { open } },
        });
-        const testSetIFrameHeight = (height = 23) => {
+        const testSetIFrameHeight = (height = defaultHeight) => {
          const { cb } = useEventListener.mock.calls[0][1];
          cb(resizeMessage(height));
-          expect(state.setState.iframeHeight).toHaveBeenCalledWith(height);
-        };
-        const testOnlySetsHeight = () => {
-          it('sets iframe height with payload height', () => {
-            testSetIFrameHeight();
-          });
-          it('does not set hasLoaded', () => {
-            expect(state.setState.hasLoaded).not.toHaveBeenCalled();
-          });
+          expect(setIframeHeight).toHaveBeenCalledWith(height);
        };
        describe('hasLoaded', () => {
-          beforeEach(() => {
-            state.mockVals({ ...defaultStateVals, hasLoaded: true });
-            hook = useIFrameBehavior(props);
+          it('sets iframe height with payload height', () => {
+            mockState({ ...defaultStateVals, hasLoaded: true });
+            renderHook(() => useIFrameBehavior(props));
+            const { cb } = useEventListener.mock.calls[0][1];
+            cb(resizeMessage(customHeight));
+            expect(setIframeHeight).toHaveBeenCalledWith(0);
+            expect(setIframeHeight).toHaveBeenCalledWith(customHeight);
+            expect(setIframeHeight).not.toHaveBeenCalledWith(defaultHeight);
          });
-          testOnlySetsHeight();
-        });
-        describe('iframeHeight is not 0', () => {
-          beforeEach(() => {
-            state.mockVals({ ...defaultStateVals, hasLoaded: true });
-            hook = useIFrameBehavior(props);
-          });
-          testOnlySetsHeight();
        });
        describe('payload height is 0', () => {
-          beforeEach(() => { hook = useIFrameBehavior(props); });
-          testOnlySetsHeight(0);
+          it('sets iframe height with payload height', () => {
+            mockState(defaultStateVals);
+            renderHook(() => useIFrameBehavior(props));
+            const { cb } = useEventListener.mock.calls[0][1];
+            cb(resizeMessage(0));
+            expect(setIframeHeight).toHaveBeenCalledWith(0);
+            expect(setIframeHeight).not.toHaveBeenCalledWith(customHeight);
+            expect(setIframeHeight).not.toHaveBeenCalledWith(defaultHeight);
+          });
        });
        describe('payload is present but uninitialized', () => {
+          beforeEach(() => {
+            mockState(defaultStateVals);
+          });
          it('sets iframe height with payload height', () => {
-            hook = useIFrameBehavior(props);
+            renderHook(() => useIFrameBehavior(props));
            testSetIFrameHeight();
          });
          it('sets hasLoaded and calls onLoaded', () => {
-            hook = useIFrameBehavior(props);
+            renderHook(() => useIFrameBehavior(props));
            const { cb } = useEventListener.mock.calls[0][1];
            cb(resizeMessage());
-            expect(state.setState.hasLoaded).toHaveBeenCalledWith(true);
+            expect(setHasLoaded).toHaveBeenCalledWith(true);
            expect(props.onLoaded).toHaveBeenCalled();
          });
          test('onLoaded is optional', () => {
-            hook = useIFrameBehavior({ ...props, onLoaded: undefined });
+            renderHook(() => useIFrameBehavior({ ...props, onLoaded: undefined }));
            const { cb } = useEventListener.mock.calls[0][1];
            cb(resizeMessage());
-            expect(state.setState.hasLoaded).toHaveBeenCalledWith(true);
+            expect(setHasLoaded).toHaveBeenCalledWith(true);
          });
        });
        it('scrolls to current window vertical offset if one is set', () => {
          const windowTopOffset = 32;
-          state.mockVals({ ...defaultStateVals, windowTopOffset });
-          hook = useIFrameBehavior(props);
+          mockState({ ...defaultStateVals, windowTopOffset });
+          renderHook(() => useIFrameBehavior(props));
          const { cb } = useEventListener.mock.calls[0][1];
          cb(videoFullScreenMessage());
          expect(window.scrollTo).toHaveBeenCalledWith(0, windowTopOffset);
        });
        it('does not scroll if towverticalp offset is not set', () => {
-          hook = useIFrameBehavior(props);
+          renderHook(() => useIFrameBehavior(props));
          const { cb } = useEventListener.mock.calls[0][1];
          cb(resizeMessage());
          expect(window.scrollTo).not.toHaveBeenCalled();
@@ -245,16 +247,16 @@ describe('useIFrameBehavior hook', () => {
        });
        beforeEach(() => {
          window.scrollY = scrollY;
-          hook = useIFrameBehavior(props);
+          renderHook(() => useIFrameBehavior(props));
          [[, { cb }]] = useEventListener.mock.calls;
        });
        it('sets window top offset based on window.scrollY if opening the video', () => {
          cb(fullScreenMessage(true));
-          expect(state.setState.windowTopOffset).toHaveBeenCalledWith(scrollY);
+          expect(setWindowTopOffset).toHaveBeenCalledWith(scrollY);
        });
        it('sets window top offset to null if closing the video', () => {
          cb(fullScreenMessage(false));
-          expect(state.setState.windowTopOffset).toHaveBeenCalledWith(null);
+          expect(setWindowTopOffset).toHaveBeenCalledWith(null);
        });
      });
      describe('offset message', () => {
@@ -266,7 +268,7 @@ describe('useIFrameBehavior hook', () => {
          document.getElementById = mockGetEl;
          const oldScrollTo = window.scrollTo;
          window.scrollTo = jest.fn();
-          hook = useIFrameBehavior(props);
+          renderHook(() => useIFrameBehavior(props));
          const { cb } = useEventListener.mock.calls[0][1];
          const offset = 99;
          cb({ data: { offset } });
@@ -279,12 +281,9 @@ describe('useIFrameBehavior hook', () => {
    });
    describe('visibility tracking', () => {
      it('sets up visibility tracking after iframe has loaded', () => {
-        state.mockVals({ ...defaultStateVals, hasLoaded: true });
-        useIFrameBehavior(props);
+        mockState({ ...defaultStateVals, hasLoaded: true });

-        const effects = getEffects([true, props.elementId], React);
-        expect(effects.length).toEqual(2);
-        effects[0](); // Execute the visibility tracking effect.
+        renderHook(() => useIFrameBehavior(props));

        expect(global.window.addEventListener).toHaveBeenCalledTimes(2);
        expect(global.window.addEventListener).toHaveBeenCalledWith('scroll', expect.any(Function));
@@ -302,22 +301,18 @@ describe('useIFrameBehavior hook', () => {
        );
      });
      it('does not set up visibility tracking before iframe has loaded', () => {
-        state.mockVals({ ...defaultStateVals, hasLoaded: false });
-        useIFrameBehavior(props);
-
-        const effects = getEffects([false, props.elementId], React);
-        expect(effects).toBeNull();
+        window.location.hash = ''; // Avoid posting hash message.
+        mockState({ ...defaultStateVals, hasLoaded: false });
+        renderHook(() => useIFrameBehavior(props));

        expect(global.window.addEventListener).not.toHaveBeenCalled();
        expect(postMessage).not.toHaveBeenCalled();
      });
      it('cleans up event listeners on unmount', () => {
-        state.mockVals({ ...defaultStateVals, hasLoaded: true });
-        useIFrameBehavior(props);
+        mockState({ ...defaultStateVals, hasLoaded: true });
+        const { unmount } = renderHook(() => useIFrameBehavior(props));

-        const effects = getEffects([true, props.elementId], React);
-        const cleanup = effects[0](); // Execute the effect and get the cleanup function.
-        cleanup(); // Call the cleanup function.
+        unmount(); // Call the cleanup function.

        expect(global.window.removeEventListener).toHaveBeenCalledTimes(2);
        expect(global.window.removeEventListener).toHaveBeenCalledWith('scroll', expect.any(Function));
@@ -328,14 +323,16 @@ describe('useIFrameBehavior hook', () => {
  describe('output', () => {
    describe('handleIFrameLoad', () => {
      it('sets and logs error if has not loaded', () => {
-        hook = useIFrameBehavior(props);
-        hook.handleIFrameLoad();
-        expect(state.setState.showError).toHaveBeenCalledWith(true);
+        mockState(defaultStateVals);
+        const { result } = renderHook(() => useIFrameBehavior(props));
+        result.current.handleIFrameLoad();
+        expect(setShowError).toHaveBeenCalledWith(true);
        expect(logError).toHaveBeenCalled();
      });
      it('sends track event if has not loaded', () => {
-        hook = useIFrameBehavior(props);
-        hook.handleIFrameLoad();
+        mockState(defaultStateVals);
+        const { result } = renderHook(() => useIFrameBehavior(props));
+        result.current.handleIFrameLoad();
        const eventName = 'edx.bi.error.learning.iframe_load_failed';
        const eventProperties = {
          unitId: props.id,
@@ -344,21 +341,22 @@ describe('useIFrameBehavior hook', () => {
        expect(sendTrackEvent).toHaveBeenCalledWith(eventName, eventProperties);
      });
      it('does not set/log errors if loaded', () => {
-        state.mockVals({ ...defaultStateVals, hasLoaded: true });
-        hook = useIFrameBehavior(props);
-        hook.handleIFrameLoad();
-        expect(state.setState.showError).not.toHaveBeenCalled();
+        mockState({ ...defaultStateVals, hasLoaded: true });
+        const { result } = renderHook(() => useIFrameBehavior(props));
+        result.current.handleIFrameLoad();
+        expect(setShowError).not.toHaveBeenCalled();
        expect(logError).not.toHaveBeenCalled();
      });
      it('does not send track event if loaded', () => {
-        state.mockVals({ ...defaultStateVals, hasLoaded: true });
-        hook = useIFrameBehavior(props);
-        hook.handleIFrameLoad();
+        mockState({ ...defaultStateVals, hasLoaded: true });
+        const { result } = renderHook(() => useIFrameBehavior(props));
+        result.current.handleIFrameLoad();
        expect(sendTrackEvent).not.toHaveBeenCalled();
      });
      it('registers an event handler to process fetchCourse events.', () => {
-        hook = useIFrameBehavior(props);
-        hook.handleIFrameLoad();
+        mockState(defaultStateVals);
+        const { result } = renderHook(() => useIFrameBehavior(props));
+        result.current.handleIFrameLoad();
        const eventName = 'test-event-name';
        const event = { data: { event_name: eventName } };
        window.onmessage(event);
@@ -366,11 +364,35 @@ describe('useIFrameBehavior hook', () => {
      });
    });
    it('forwards handleIframeLoad, showError, and hasLoaded from state fields', () => {
-      state.mockVals(stateVals);
-      hook = useIFrameBehavior(props);
-      expect(hook.iframeHeight).toEqual(stateVals.iframeHeight);
-      expect(hook.showError).toEqual(stateVals.showError);
-      expect(hook.hasLoaded).toEqual(stateVals.hasLoaded);
+      mockState(stateVals);
+      const { result } = renderHook(() => useIFrameBehavior(props));
+      expect(result.current.iframeHeight).toBe(stateVals.iframeHeight);
+      expect(result.current.showError).toBe(stateVals.showError);
+      expect(result.current.hasLoaded).toBe(stateVals.hasLoaded);
+    });
+  });
+  describe('navigate link for the next unit on auto advance', () => {
+    it('test for link when it is not last unit', () => {
+      mockState(defaultStateVals);
+      renderHook(() => useIFrameBehavior(props));
+      const { cb } = useEventListener.mock.calls[0][1];
+      const autoAdvanceMessage = () => ({
+        data: { type: messageTypes.autoAdvance },
+      });
+      cb(autoAdvanceMessage());
+      expect(mockNavigate).toHaveBeenCalledWith('/next-unit-link');
+    });
+    it('test for link when it is last unit', () => {
+      mockState(defaultStateVals);
+      useSequenceNavigationMetadata.mockReset();
+      useSequenceNavigationMetadata.mockReturnValue({ isLastUnit: true, nextLink: '/next-unit-link' });
+      renderHook(() => useIFrameBehavior(props));
+      const { cb } = useEventListener.mock.calls[0][1];
+      const autoAdvanceMessage = () => ({
+        data: { type: messageTypes.autoAdvance },
+      });
+      cb(autoAdvanceMessage());
+      expect(mockNavigate).not.toHaveBeenCalled();
    });
  });
 });
--- a/src/courseware/course/sequence/Unit/hooks/useIFrameBehavior.ts
+++ b/src/courseware/course/sequence/Unit/hooks/useIFrameBehavior.ts
@@ -1,25 +1,28 @@
+import React, { useState } from 'react';
 import { getConfig } from '@edx/frontend-platform';
 import { sendTrackEvent } from '@edx/frontend-platform/analytics';
-import React from 'react';
-import { useDispatch } from 'react-redux';
+import { useDispatch, useSelector } from 'react-redux';
+import { useNavigate } from 'react-router-dom';
 import { throttle } from 'lodash';

-import { StrictDict, useKeyedState } from '@edx/react-unit-test-utils';
 import { logError } from '@edx/frontend-platform/logging';

 import { fetchCourse } from '@src/courseware/data';
 import { processEvent } from '@src/course-home/data/thunks';
 import { useEventListener } from '@src/generic/hooks';
+import { getSequenceId } from '@src/courseware/data/selectors';
+import { useModel } from '@src/generic/model-store';
+import { useSequenceNavigationMetadata } from '@src/courseware/course/sequence/sequence-navigation/hooks';
 import { messageTypes } from '../constants';

 import useLoadBearingHook from './useLoadBearingHook';

-export const stateKeys = StrictDict({
-  iframeHeight: 'iframeHeight',
-  hasLoaded: 'hasLoaded',
-  showError: 'showError',
-  windowTopOffset: 'windowTopOffset',
-});
+export const iframeBehaviorState = {
+    iframeHeight: (val) => useState<number>(val), // eslint-disable-line
+    hasLoaded: (val) => useState<boolean>(val), // eslint-disable-line
+    showError: (val) => useState<boolean>(val), // eslint-disable-line
+    windowTopOffset: (val) => useState<number | null>(val), // eslint-disable-line
+} as const;

 const useIFrameBehavior = ({
  elementId,
@@ -31,23 +34,29 @@ const useIFrameBehavior = ({
  useLoadBearingHook(id);

  const dispatch = useDispatch();
+  const activeSequenceId = useSelector(getSequenceId);
+  const navigate = useNavigate();
+  const activeSequence = useModel('sequences', activeSequenceId);
+  const activeUnitId = activeSequence.unitIds.length > 0
+    ? activeSequence.unitIds[activeSequence.activeUnitIndex] : null;
+  const { isLastUnit, nextLink } = useSequenceNavigationMetadata(activeSequenceId, activeUnitId);

-  const [iframeHeight, setIframeHeight] = useKeyedState(stateKeys.iframeHeight, 0);
-  const [hasLoaded, setHasLoaded] = useKeyedState(stateKeys.hasLoaded, false);
-  const [showError, setShowError] = useKeyedState(stateKeys.showError, false);
-  const [windowTopOffset, setWindowTopOffset] = useKeyedState(stateKeys.windowTopOffset, null);
+  const [iframeHeight, setIframeHeight] = iframeBehaviorState.iframeHeight(0);
+  const [hasLoaded, setHasLoaded] = iframeBehaviorState.hasLoaded(false);
+  const [showError, setShowError] = iframeBehaviorState.showError(false);
+  const [windowTopOffset, setWindowTopOffset] = iframeBehaviorState.windowTopOffset(null);

  React.useEffect(() => {
-    const frame = document.getElementById(elementId);
+    const frame = document.getElementById(elementId) as HTMLIFrameElement | null;
    const { hash } = window.location;
    if (hash) {
      // The url hash will be sent to LMS-served iframe in order to find the location of the
      // hash within the iframe.
-      frame.contentWindow.postMessage({ hashName: hash }, `${getConfig().LMS_BASE_URL}`);
+      frame?.contentWindow?.postMessage({ hashName: hash }, `${getConfig().LMS_BASE_URL}`);
    }
  }, [id, onLoaded, iframeHeight, hasLoaded]);

-  const receiveMessage = React.useCallback(({ data }) => {
+  const receiveMessage = React.useCallback(({ data }: MessageEvent) => {
    const { type, payload } = data;
    if (type === messageTypes.resize) {
      setIframeHeight(payload.height);
@@ -71,7 +80,13 @@ const useIFrameBehavior = ({
    } else if (data.offset) {
      // We listen for this message from LMS to know when the page needs to
      // be scrolled to another location on the page.
-      window.scrollTo(0, data.offset + document.getElementById('unit-iframe').offsetTop);
+      window.scrollTo(0, data.offset + document.getElementById('unit-iframe')!.offsetTop);
+    } else if (type === messageTypes.autoAdvance) {
+      // We are listening to autoAdvance message to move to next sequence automatically.
+      // In case it is the last unit we need not do anything.
+      if (!isLastUnit && nextLink) {
+        navigate(nextLink);
+      }
    }
  }, [
    id,
@@ -92,7 +107,7 @@ const useIFrameBehavior = ({
      return undefined;
    }

-    const iframeElement = document.getElementById(elementId);
+    const iframeElement = document.getElementById(elementId) as HTMLIFrameElement | null;
    if (!iframeElement || !iframeElement.contentWindow) {
      return undefined;
    }
@@ -106,7 +121,7 @@ const useIFrameBehavior = ({
          viewportHeight: window.innerHeight,
        },
      };
-      iframeElement.contentWindow.postMessage(
+      iframeElement?.contentWindow?.postMessage(
        visibleInfo,
        `${getConfig().LMS_BASE_URL}`,
      );
--- a/src/courseware/course/sequence/Unit/hooks/useModalIFrameData.js
+++ b/src/courseware/course/sequence/Unit/hooks/useModalIFrameData.js
@@ -1,19 +1,11 @@
 import React from 'react';
-
-import { StrictDict, useKeyedState } from '@edx/react-unit-test-utils/dist';
-
 import { useEventListener } from '@src/generic/hooks';

-export const stateKeys = StrictDict({
-  isOpen: 'isOpen',
-  options: 'options',
-});
-
 export const DEFAULT_HEIGHT = '100%';

 const useModalIFrameData = () => {
-  const [isOpen, setIsOpen] = useKeyedState(stateKeys.isOpen, false);
-  const [options, setOptions] = useKeyedState(stateKeys.options, { height: DEFAULT_HEIGHT });
+  const [isOpen, setIsOpen] = React.useState(false);
+  const [options, setOptions] = React.useState({ height: DEFAULT_HEIGHT });

  const handleModalClose = () => {
    const rootFrame = document.querySelector('iframe');
--- a/src/courseware/course/sequence/Unit/hooks/useModalIFrameData.test.js
+++ b/src/courseware/course/sequence/Unit/hooks/useModalIFrameData.test.js
@@ -1,74 +1,85 @@
-import { mockUseKeyedState } from '@edx/react-unit-test-utils';
+import React from 'react';
+import { renderHook } from '@testing-library/react';
 import { useEventListener } from '@src/generic/hooks';
 import { messageTypes } from '../constants';

-import useModalIFrameData, { stateKeys, DEFAULT_HEIGHT } from './useModalIFrameData';
+import useModalIFrameData, { DEFAULT_HEIGHT } from './useModalIFrameData';

 jest.mock('react', () => ({
  ...jest.requireActual('react'),
  useCallback: jest.fn((cb, prereqs) => ({ cb, prereqs })),
+  useState: jest.fn((initialValue) => [initialValue, jest.fn()]),
 }));
 jest.mock('@src/generic/hooks', () => ({
  useEventListener: jest.fn(),
 }));

-const state = mockUseKeyedState(stateKeys);
+const setIsOpen = jest.fn();
+const setOptions = jest.fn();
+
+const defaultState = {
+  isOpen: false,
+  options: { height: DEFAULT_HEIGHT },
+};
+
+const mockUseStateWithValues = (values) => {
+  jest.spyOn(React, 'useState')
+    .mockReturnValueOnce([values.isOpen, setIsOpen])
+    .mockReturnValueOnce([values.options, setOptions]);
+};

 describe('useModalIFrameData', () => {
  beforeEach(() => {
    jest.clearAllMocks();
-    state.mock();
  });
  const testHandleModalClose = ({ trigger }) => {
    const postMessage = jest.fn();
    document.querySelector = jest.fn().mockReturnValue({ contentWindow: { postMessage } });
    trigger();
-    state.expectSetStateCalledWith(stateKeys.isOpen, false);
+    expect(React.useState).toHaveBeenNthCalledWith(1, false);
    expect(postMessage).toHaveBeenCalledWith({ type: 'plugin.modal-close' }, '*');
  };
  describe('behavior', () => {
-    it('initializes isOpen to false', () => {
-      useModalIFrameData();
-      state.expectInitializedWith(stateKeys.isOpen, false);
-    });
-    it('initializes options with default height', () => {
-      useModalIFrameData();
-      state.expectInitializedWith(stateKeys.options, { height: DEFAULT_HEIGHT });
+    it('should initialize with modal closed and default height', () => {
+      const { result } = renderHook(() => useModalIFrameData());
+
+      expect(result.current.modalOptions).toEqual({
+        isOpen: false,
+        height: DEFAULT_HEIGHT,
+      });
    });
    describe('eventListener', () => {
      const oldOptions = { some: 'old', options: 'yeah' };
      const prepareListener = () => {
-        useModalIFrameData();
        expect(useEventListener).toHaveBeenCalled();
        const call = useEventListener.mock.calls[0][1];
        expect(call.prereqs).toEqual([]);
        return call.cb;
      };
      it('consumes modal events and opens sets modal options with open: true', () => {
-        state.mockVals({
-          [stateKeys.isOpen]: false,
-          [stateKeys.options]: oldOptions,
+        mockUseStateWithValues({
+          isOpen: false,
+          options: oldOptions,
        });
+        renderHook(() => useModalIFrameData());
        const receiveMessage = prepareListener();
        const payload = { test: 'values' };
        receiveMessage({ data: { type: messageTypes.modal, payload } });
-        expect(state.setState.isOpen).toHaveBeenCalledWith(true);
-        expect(state.setState.options).toHaveBeenCalled();
-        const [[setOptionsCb]] = state.setState.options.mock.calls;
+        expect(setIsOpen).toHaveBeenCalledWith(true);
+        expect(setOptions).toHaveBeenCalled();
+        const [[setOptionsCb]] = setOptions.mock.calls;
        expect(setOptionsCb(oldOptions)).toEqual({ ...oldOptions, ...payload });
      });
      it('ignores events with no type', () => {
-        state.mockVals({
-          [stateKeys.isOpen]: false,
-          [stateKeys.options]: oldOptions,
-        });
+        const { result } = renderHook(() => useModalIFrameData());
+        const initialState = result.current.modalOptions;
        const receiveMessage = prepareListener();
        const payload = { test: 'values' };
        receiveMessage({ data: { payload } });
-        expect(state.setState.isOpen).not.toHaveBeenCalled();
-        expect(state.setState.options).not.toHaveBeenCalled();
+        expect(result.current.modalOptions).toEqual(initialState);
      });
      it('calls handleModalClose behavior when receiving a "plugin.modal-close" event', () => {
+        renderHook(() => useModalIFrameData());
        const receiveMessage = prepareListener();
        testHandleModalClose({
          trigger: () => {
@@ -80,13 +91,14 @@ describe('useModalIFrameData', () => {
  });
  describe('output', () => {
    test('returns handleModalClose callback', () => {
+      mockUseStateWithValues(defaultState);
      testHandleModalClose({ trigger: useModalIFrameData().handleModalClose });
    });
    it('forwards modalOptions from state values', () => {
      const modalOptions = { test: 'options' };
-      state.mockVals({
-        [stateKeys.options]: modalOptions,
-        [stateKeys.isOpen]: true,
+      mockUseStateWithValues({
+        isOpen: true,
+        options: modalOptions,
      });
      expect(useModalIFrameData().modalOptions).toEqual({
        ...modalOptions,
--- a/src/courseware/course/sequence/Unit/hooks/useShouldDisplayHonorCode.js
+++ b/src/courseware/course/sequence/Unit/hooks/useShouldDisplayHonorCode.js
@@ -1,19 +1,13 @@
 import React from 'react';
-
-import { StrictDict, useKeyedState } from '@edx/react-unit-test-utils/dist';
 import { useModel } from '@src/generic/model-store';

 import { modelKeys } from '../constants';

-export const stateKeys = StrictDict({
-  shouldDisplay: 'shouldDisplay',
-});
-
 /**
 * @return {bool} should the honor code be displayed?
 */
 const useShouldDisplayHonorCode = ({ id, courseId }) => {
-  const [shouldDisplay, setShouldDisplay] = useKeyedState(stateKeys.shouldDisplay, false);
+  const [shouldDisplay, setShouldDisplay] = React.useState(false);

  const { graded } = useModel(modelKeys.units, id);
  const { userNeedsIntegritySignature } = useModel(modelKeys.coursewareMeta, courseId);
--- a/src/courseware/course/sequence/Unit/hooks/useShouldDisplayHonorCode.test.js
+++ b/src/courseware/course/sequence/Unit/hooks/useShouldDisplayHonorCode.test.js
@@ -1,22 +1,12 @@
-import React from 'react';
-
-import { getEffects, mockUseKeyedState } from '@edx/react-unit-test-utils';
+import { renderHook } from '@testing-library/react';
 import { useModel } from '@src/generic/model-store';
-
+import useShouldDisplayHonorCode from './useShouldDisplayHonorCode';
 import { modelKeys } from '../constants';

-import useShouldDisplayHonorCode, { stateKeys } from './useShouldDisplayHonorCode';
-
-jest.mock('react', () => ({
-  ...jest.requireActual('react'),
-  useEffect: jest.fn(),
-}));
 jest.mock('@src/generic/model-store', () => ({
  useModel: jest.fn(),
 }));

-const state = mockUseKeyedState(stateKeys);
-
 const props = {
  id: 'test-id',
  courseId: 'test-course-id',
@@ -28,52 +18,29 @@ const mockModels = (graded, userNeedsIntegritySignature) => {
  ));
 };

-describe('useShouldDisplayHonorCode hook', () => {
+describe('useShouldDisplayHonorCode', () => {
  beforeEach(() => {
    jest.clearAllMocks();
-    mockModels(false, false);
-    state.mock();
  });
-  describe('behavior', () => {
-    it('initializes shouldDisplay to false', () => {
-      useShouldDisplayHonorCode(props);
-      state.expectInitializedWith(stateKeys.shouldDisplay, false);
-    });
-    describe('effect - on userNeedsIntegritySignature', () => {
-      describe('graded and needs integrity signature', () => {
-        it('sets shouldDisplay(true)', () => {
-          mockModels(true, true);
-          useShouldDisplayHonorCode(props);
-          const cb = getEffects([state.setState.shouldDisplay, true], React)[0];
-          cb();
-          expect(state.setState.shouldDisplay).toHaveBeenCalledWith(true);
-        });
-      });
-      describe('not graded', () => {
-        it('sets should not display', () => {
-          mockModels(true, false);
-          useShouldDisplayHonorCode(props);
-          const cb = getEffects([state.setState.shouldDisplay, false], React)[0];
-          cb();
-          expect(state.setState.shouldDisplay).toHaveBeenCalledWith(false);
-        });
-      });
-      describe('does not need integrity signature', () => {
-        it('sets should not display', () => {
-          mockModels(false, true);
-          useShouldDisplayHonorCode(props);
-          const cb = getEffects([state.setState.shouldDisplay, true], React)[0];
-          cb();
-          expect(state.setState.shouldDisplay).toHaveBeenCalledWith(false);
-        });
-      });
-    });
+
+  it('should return false when userNeedsIntegritySignature is false', () => {
+    mockModels(true, false);
+
+    const { result } = renderHook(() => useShouldDisplayHonorCode(props));
+    expect(result.current).toBe(false);
  });
-  describe('output', () => {
-    it('returns shouldDisplay value from state', () => {
-      const testValue = 'test-value';
-      state.mockVal(stateKeys.shouldDisplay, testValue);
-      expect(useShouldDisplayHonorCode(props)).toEqual(testValue);
-    });
+
+  it('should return false when graded is false', () => {
+    mockModels(false, true);
+
+    const { result } = renderHook(() => useShouldDisplayHonorCode(props));
+    expect(result.current).toBe(false);
+  });
+
+  it('should return true when both userNeedsIntegritySignature and graded are true', () => {
+    mockModels(true, true);
+
+    const { result } = renderHook(() => useShouldDisplayHonorCode(props));
+    expect(result.current).toBe(true);
  });
 });
--- a/src/courseware/course/sequence/Unit/index.jsx
+++ b/src/courseware/course/sequence/Unit/index.jsx
@@ -22,7 +22,6 @@ const Unit = ({
  onLoaded,
  id,
  isOriginalUserStaff,
-  isEnabledOutlineSidebar,
  renderUnitNavigation,
 }) => {
  const { formatMessage } = useIntl();
@@ -48,7 +47,7 @@ const Unit = ({

  return (
    <div className="unit">
-      <UnitTitleSlot unitId={id} {...{ unit, isEnabledOutlineSidebar, renderUnitNavigation }} />
+      <UnitTitleSlot unitId={id} {...{ unit, renderUnitNavigation }} />
      <UnitSuspense {...{ courseId, id }} />
      <ContentIFrame
        elementId="unit-iframe"
@@ -70,7 +69,6 @@ Unit.propTypes = {
  id: PropTypes.string.isRequired,
  onLoaded: PropTypes.func,
  isOriginalUserStaff: PropTypes.bool.isRequired,
-  isEnabledOutlineSidebar: PropTypes.bool.isRequired,
  renderUnitNavigation: PropTypes.func.isRequired,
 };

--- a/src/courseware/course/sequence/Unit/index.test.jsx
+++ b/src/courseware/course/sequence/Unit/index.test.jsx
@@ -14,7 +14,6 @@ const defaultProps = {
  onLoaded: jest.fn().mockName('props.onLoaded'),
  id: 'unit-id',
  isOriginalUserStaff: false,
-  isEnabledOutlineSidebar: false,
  renderUnitNavigation: jest.fn(enabled => enabled && 'UnitNaviagtion'),
 };

@@ -68,16 +67,8 @@ describe('<Unit />', () => {
      expect(screen.getByText('Bookmark this page')).toBeInTheDocument();
    });

-    it('does not render unit navigation buttons', () => {
-      renderComponent(defaultProps);
-
-      const nextButton = screen.queryByText('UnitNaviagtion');
-
-      expect(nextButton).toBeNull();
-    });
-
-    it('renders unit navigation buttons when isEnabledOutlineSidebar is true', () => {
-      const props = { ...defaultProps, isEnabledOutlineSidebar: true };
+    it('renders unit navigation buttons', () => {
+      const props = { ...defaultProps };
      renderComponent(props);

      const nextButton = screen.getByText('UnitNaviagtion');
--- a/src/courseware/course/sequence/Unit/urls.js
+++ b/src/courseware/course/sequence/Unit/urls.js
@@ -1,35 +0,0 @@
-import { getConfig } from '@edx/frontend-platform';
-import { stringifyUrl } from 'query-string';
-
-export const iframeParams = {
-  show_title: 0,
-  show_bookmark: 0,
-  recheck_access: 1,
-};
-
-export const getIFrameUrl = ({
-  id,
-  view,
-  format,
-  examAccess,
-  jumpToId,
-  preview,
-}) => {
-  const xblockUrl = `${getConfig().LMS_BASE_URL}/xblock/${id}`;
-  return stringifyUrl({
-    url: xblockUrl,
-    query: {
-      ...iframeParams,
-      view,
-      preview,
-      ...(format && { format }),
-      ...(!examAccess.blockAccess && { exam_access: examAccess.accessToken }),
-      jumpToId, // Pass jumpToId as query param as fragmentIdentifier is not passed to server.
-    },
-    fragmentIdentifier: jumpToId, // this is used by browser to scroll to correct block.
-  });
-};
-
-export default {
-  getIFrameUrl,
-};
--- a/src/courseware/course/sequence/Unit/urls.test.js
+++ b/src/courseware/course/sequence/Unit/urls.test.js
@@ -1,83 +0,0 @@
-import { getConfig } from '@edx/frontend-platform';
-import { stringifyUrl } from 'query-string';
-import { getIFrameUrl, iframeParams } from './urls';
-
-jest.mock('@edx/frontend-platform', () => ({
-  getConfig: jest.fn(),
-}));
-jest.mock('query-string', () => ({
-  stringifyUrl: jest.fn((arg) => ({ stringifyUrl: arg })),
-}));
-
-const config = { LMS_BASE_URL: 'test-lms-url' };
-getConfig.mockReturnValue(config);
-
-const props = {
-  id: 'test-id',
-  view: 'test-view',
-  format: 'test-format',
-  examAccess: { blockAccess: false, accessToken: 'test-access-token' },
-  preview: false,
-};
-
-describe('urls module getIFrameUrl', () => {
-  test('format provided, exam access and token available', () => {
-    const url = stringifyUrl({
-      url: `${config.LMS_BASE_URL}/xblock/${props.id}`,
-      query: {
-        ...iframeParams,
-        view: props.view,
-        format: props.format,
-        exam_access: props.examAccess.accessToken,
-        preview: props.preview,
-      },
-    });
-    expect(getIFrameUrl(props)).toEqual(url);
-  });
-  test('no format provided, exam access blocked', () => {
-    const url = stringifyUrl({
-      url: `${config.LMS_BASE_URL}/xblock/${props.id}`,
-      query: { ...iframeParams, view: props.view, preview: props.preview },
-    });
-    expect(getIFrameUrl({
-      id: props.id,
-      view: props.view,
-      preview: props.preview,
-      examAccess: { blockAccess: true },
-    })).toEqual(url);
-  });
-  test('jumpToId and fragmentIdentifier is added to url', () => {
-    const url = stringifyUrl({
-      url: `${config.LMS_BASE_URL}/xblock/${props.id}`,
-      query: {
-        ...iframeParams,
-        view: props.view,
-        format: props.format,
-        preview: props.preview,
-        exam_access: props.examAccess.accessToken,
-        jumpToId: 'some-xblock-id',
-      },
-      fragmentIdentifier: 'some-xblock-id',
-    });
-    expect(getIFrameUrl({
-      ...props,
-      jumpToId: 'some-xblock-id',
-    })).toEqual(url);
-  });
-  test('preview is true and url param equals 1', () => {
-    const url = stringifyUrl({
-      url: `${config.LMS_BASE_URL}/xblock/${props.id}`,
-      query: {
-        ...iframeParams,
-        view: props.view,
-        format: props.format,
-        preview: true,
-        exam_access: props.examAccess.accessToken,
-      },
-    });
-    expect(getIFrameUrl({
-      ...props,
-      preview: true,
-    })).toEqual(url);
-  });
-});
--- a/src/courseware/course/sequence/Unit/urls.test.ts
+++ b/src/courseware/course/sequence/Unit/urls.test.ts
@@ -0,0 +1,42 @@
+import { getConfig } from '@edx/frontend-platform';
+import { getIFrameUrl } from './urls';
+
+jest.mock('@edx/frontend-platform', () => ({
+  getConfig: jest.fn(),
+}));
+const config = { LMS_BASE_URL: 'https://test-lms-url' };
+getConfig.mockReturnValue(config);
+
+const props = {
+  id: 'test-id',
+  view: 'test-view',
+  format: 'test-format',
+  examAccess: { blockAccess: false, accessToken: 'test-access-token' },
+  preview: false,
+};
+
+describe('urls module getIFrameUrl', () => {
+  test('format provided, exam access and token available', () => {
+    expect(getIFrameUrl(props)).toEqual('https://test-lms-url/xblock/test-id?exam_access=test-access-token&format=test-format&preview=false&recheck_access=1&show_bookmark=0&show_title=0&view=test-view');
+  });
+  test('no format provided, exam access blocked', () => {
+    expect(getIFrameUrl({
+      id: props.id,
+      view: props.view,
+      preview: props.preview,
+      examAccess: { blockAccess: true },
+    })).toEqual('https://test-lms-url/xblock/test-id?preview=false&recheck_access=1&show_bookmark=0&show_title=0&view=test-view');
+  });
+  test('jumpToId and fragmentIdentifier is added to url', () => {
+    expect(getIFrameUrl({
+      ...props,
+      jumpToId: 'some-xblock-id',
+    })).toEqual('https://test-lms-url/xblock/test-id?exam_access=test-access-token&format=test-format&jumpToId=some-xblock-id&preview=false&recheck_access=1&show_bookmark=0&show_title=0&view=test-view#some-xblock-id');
+  });
+  test('preview is true and url param equals 1', () => {
+    expect(getIFrameUrl({
+      ...props,
+      preview: true,
+    })).toEqual('https://test-lms-url/xblock/test-id?exam_access=test-access-token&format=test-format&preview=true&recheck_access=1&show_bookmark=0&show_title=0&view=test-view');
+  });
+});
--- a/src/courseware/course/sequence/Unit/urls.ts
+++ b/src/courseware/course/sequence/Unit/urls.ts
@@ -0,0 +1,49 @@
+import { getConfig } from '@edx/frontend-platform';
+
+export const iframeParams = {
+  show_title: 0,
+  show_bookmark: 0,
+  recheck_access: 1,
+};
+
+interface Props {
+  id: string;
+  view: string;
+  format?: string | null;
+  examAccess: { blockAccess: boolean, accessToken?: string };
+  jumpToId?: string;
+  preview: boolean;
+}
+
+export const getIFrameUrl = ({
+  id,
+  view,
+  format = null,
+  examAccess,
+  jumpToId,
+  preview,
+}: Props) => {
+  const xblockUrl = new URL(`${getConfig().LMS_BASE_URL}/xblock/${id}`);
+  for (const [key, value] of Object.entries(iframeParams)) {
+    xblockUrl.searchParams.set(key, String(value));
+  }
+  xblockUrl.searchParams.set('view', view);
+  xblockUrl.searchParams.set('preview', String(preview));
+  if (format) {
+    xblockUrl.searchParams.set('format', format);
+  }
+  if (!examAccess.blockAccess) {
+    xblockUrl.searchParams.set('exam_access', examAccess.accessToken!);
+  }
+  // Pass jumpToId as query param as fragmentIdentifier is not passed to server.
+  if (jumpToId) {
+    xblockUrl.searchParams.set('jumpToId', jumpToId);
+    xblockUrl.hash = `#${jumpToId}`; // this is used by browser to scroll to correct block.
+  }
+  xblockUrl.searchParams.sort();
+  return xblockUrl.toString();
+};
+
+export default {
+  getIFrameUrl,
+};
--- a/src/courseware/course/sequence/lock-paywall/LockPaywall.jsx
+++ b/src/courseware/course/sequence/lock-paywall/LockPaywall.jsx
@@ -9,7 +9,7 @@ import {
 import { Locked } from '@openedx/paragon/icons';
 import SidebarContext from '../../sidebar/SidebarContext';
 import messages from './messages';
-import certificateLocked from '../../../../generic/assets/edX_locked_certificate.png';
+import certificateLocked from '../../../../generic/assets/openedx_locked_certificate.png';
 import { useModel } from '../../../../generic/model-store';
 import { UpgradeButton } from '../../../../generic/upgrade-button';
 import {
--- a/src/courseware/course/sequence/lock-paywall/LockPaywall.scss
+++ b/src/courseware/course/sequence/lock-paywall/LockPaywall.scss
@@ -4,7 +4,7 @@
 }

 .lock-paywall-container svg {
-    color: $primary-700;
+    color: var(--pgn-color-primary-700);
 }

@media only screen and (min-width: 992px) and (max-width: 1100px) {
--- a/src/courseware/course/sequence/sequence-navigation/SequenceNavigation.jsx
+++ b/src/courseware/course/sequence/sequence-navigation/SequenceNavigation.jsx
@@ -100,13 +100,13 @@ const SequenceNavigation = ({
    );
  };

-  return sequenceStatus === LOADED && (
+  return sequenceStatus === LOADED ? (
    <nav id="courseware-sequence-navigation" data-testid="courseware-sequence-navigation" className={classNames('sequence-navigation', className, { 'mr-2': shouldDisplayNotificationTriggerInSequence })}>
      {renderPreviousButton()}
      {renderUnitButtons()}
      {renderNextButton()}
    </nav>
-  );
+  ) : null;
 };

 SequenceNavigation.propTypes = {
--- a/src/courseware/course/share/ShareButton.jsx
+++ b/src/courseware/course/share/ShareButton.jsx
@@ -1,49 +0,0 @@
-import React from 'react';
-import { PropTypes } from 'prop-types';
-import { useIntl } from '@edx/frontend-platform/i18n';
-import { TwitterShareButton, TwitterIcon } from 'react-share';
-import { stringifyUrl } from 'query-string';
-
-import { Icon } from '@openedx/paragon';
-import messages from './messages';
-
-const ShareTwitterIcon = () => (
-  <TwitterIcon
-    round
-    iconFillColor="#0A3055"
-    bgStyle={{
-      fill: '#fff',
-    }}
-  />
-);
-
-const ShareButton = ({ url }) => {
-  const { formatMessage } = useIntl();
-
-  const twitterUrl = stringifyUrl({
-    url,
-    query: {
-      utm_source: 'twitter',
-      utm_medium: 'social',
-      utm_campaign: 'social-share-exp',
-    },
-  });
-
-  return (
-    <TwitterShareButton
-      url={twitterUrl}
-      title={formatMessage(messages.shareQuote)}
-      resetButtonStyle={false}
-      className="px-1 ml-n1 btn-sm text-primary-500 btn btn-link"
-    >
-      <Icon src={ShareTwitterIcon} />
-      {formatMessage(messages.shareButton)}
-    </TwitterShareButton>
-  );
-};
-
-ShareButton.propTypes = {
-  url: PropTypes.string.isRequired,
-};
-
-export default ShareButton;
--- a/src/courseware/course/share/messages.ts
+++ b/src/courseware/course/share/messages.ts
@@ -1,26 +0,0 @@
-import { defineMessages } from '@edx/frontend-platform/i18n';
-
-const messages = defineMessages({
-  shareButton: {
-    id: 'learn.sequence.share.button',
-    defaultMessage: 'Share this content',
-    description: 'share message button message',
-  },
-  shareModalTitle: {
-    id: 'learn.sequence.share.modal.title',
-    defaultMessage: 'Title',
-    description: 'share message modal title',
-  },
-  shareModalBody: {
-    id: 'learn.sequence.share.modal.body',
-    defaultMessage: 'Copy the link below to share this content.',
-    description: 'share message modal body',
-  },
-  shareQuote: {
-    id: 'learn.sequence.share.quote',
-    defaultMessage: 'Here\'s a fun clip from a class I\'m taking on @edXonline.\n',
-    description: 'share message quote',
-  },
-});
-
-export default messages;
--- a/src/courseware/course/sidebar/SidebarContextProvider.jsx
+++ b/src/courseware/course/sidebar/SidebarContextProvider.jsx
@@ -1,13 +1,11 @@
 import { breakpoints, useWindowSize } from '@openedx/paragon';
 import PropTypes from 'prop-types';
-import { useSelector } from 'react-redux';
 import {
  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 * as discussionsSidebar from './sidebars/discussions';
 import * as notificationsSidebar from './sidebars/notifications';
@@ -25,11 +23,10 @@ const SidebarProvider = ({
  const shouldDisplayFullScreen = useWindowSize().width < breakpoints.extraLarge.minWidth;
  const shouldDisplaySidebarOpen = useWindowSize().width > breakpoints.extraLarge.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) {
+  if (!shouldDisplayFullScreen && isInitiallySidebarOpen) {
    initialSidebar = isUnitHasDiscussionTopics
      ? SIDEBARS[discussionsSidebar.ID].ID
      : verifiedMode && SIDEBARS[notificationsSidebar.ID].ID;
--- a/src/courseware/course/sidebar/common/SidebarBase.scss
+++ b/src/courseware/course/sidebar/common/SidebarBase.scss
@@ -1,5 +1,5 @@
 #course-sidebar {
-    @media (max-width: -1 + map-get($grid-breakpoints, "lg")) {
+    @media (--pgn-size-breakpoint-max-width-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
@@ -7,7 +7,6 @@ import {
  ChevronLeft as ChevronLeftIcon,
 } from '@openedx/paragon/icons';

-import { useModel } from '@src/generic/model-store';
 import { LOADING } from '@src/constants';
 import PageLoading from '@src/generic/PageLoading';
 import SidebarSection from './components/SidebarSection';
@@ -24,7 +23,6 @@ const CourseOutlineTray = () => {
  const {
    courseId,
    unitId,
-    isEnabledSidebar,
    currentSidebar,
    handleToggleCollapse,
    isActiveEntranceExam,
@@ -35,13 +33,13 @@ const CourseOutlineTray = () => {
    sequences,
  } = useCourseOutlineSidebar();

-  const {
-    sectionId: activeSectionId,
-  } = useModel('sequences', activeSequenceId);
-
+  const resolvedSectionId = selectedSection
+    || Object.keys(sections).find(
+      (sectionId) => sections[sectionId].sequenceIds.includes(activeSequenceId),
+    );
  const sectionsIds = Object.keys(sections);
-  const sequenceIds = sections[selectedSection || activeSectionId]?.sequenceIds || [];
-  const backButtonTitle = sections[selectedSection || activeSectionId]?.title;
+  const sequenceIds = sections[resolvedSectionId]?.sequenceIds || [];
+  const backButtonTitle = sections[resolvedSectionId]?.title;

  const handleBackToSectionLevel = () => {
    setDisplaySectionLevel();
@@ -78,7 +76,7 @@ const CourseOutlineTray = () => {
    </div>
  );

-  if (!isEnabledSidebar || isActiveEntranceExam || currentSidebar !== ID) {
+  if (isActiveEntranceExam || currentSidebar !== ID) {
    return null;
  }

--- a/src/courseware/course/sidebar/sidebars/course-outline/CourseOutlineTray.scss
+++ b/src/courseware/course/sidebar/sidebars/course-outline/CourseOutlineTray.scss
@@ -1,14 +1,12 @@
 .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;
+    @media (--pgn-size-breakpoint-min-width-xl) {
        left: 0;
        top: 0;
    }
@@ -25,12 +23,12 @@
    }

    .outline-sidebar-heading {
-        font-weight: $font-weight-bold;
+        font-weight: var(--pgn-typography-font-weight-bold);
    }
 }

 .course-sidebar-section {
-    background: $white;
+    background: var(--pgn-color-white);
    border: 1px solid #d7d3d1;

    button {
@@ -54,7 +52,7 @@
 #outline-sidebar-outline {
    margin-top: -1px;

-    @media (min-width: map-get($grid-breakpoints, "xl")) {
+    @media (--pgn-size-breakpoint-min-width-xl) {
        margin-bottom: 0;
    }

@@ -64,14 +62,14 @@

        .collapsible-trigger {
            border-radius: 0;
-            padding: map-get($spacers, 3\.5) map-get($spacers, 4) map-get($spacers, 3\.5) map-get($spacers, 5);
+            padding: var(--pgn-spacing-spacer-3-5) var(--pgn-spacing-spacer-4) var(--pgn-spacing-spacer-3-5) var(--pgn-spacing-spacer-5);

-            @media (max-width: -1 + map-get($grid-breakpoints, "sm")) {
-                padding-left: map-get($spacers, 4);
+            @media (--pgn-size-breakpoint-max-width-sm) {
+                padding-left: var(--pgn-spacing-spacer-4);
            }

            &:hover {
-                background-color: $light-500;
+                background-color: var(--pgn-color-light-500);
            }

            .collapsible-icon {
@@ -80,7 +78,7 @@
        }

        &:last-child .pgn_collapsible {
-            @extend .mb-0;
+            margin-bottom: 0px !important;
        }
    }

@@ -88,15 +86,15 @@
        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);
+            padding: var(--pgn-spacing-spacer-3-5) var(--pgn-spacing-spacer-4) var(--pgn-spacing-spacer-3-5) var(--pgn-spacing-spacer-5-5);

-            @media (max-width: -1 + map-get($grid-breakpoints, "sm")) {
-                padding-left: map-get($spacers, 4\.5);
+            @media (--pgn-size-breakpoint-max-width-sm) {
+                padding-left: var(--pgn-spacing-spacer-4-5);
            }

            &:hover {
                text-decoration: none;
-                background-color: $light-500;
+                background-color: var(--pgn-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
@@ -67,15 +67,6 @@ describe('<CourseOutlineTray />', () => {
    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();
@@ -102,6 +93,21 @@ describe('<CourseOutlineTray />', () => {
    expect(mockToggleSidebar).toHaveBeenCalledWith(null);
  });

+  it('collapses sidebar correctly when screen is resized', async () => {
+    const mockToggleSidebar = jest.fn();
+    await initTestStore();
+    renderWithProvider({ toggleSidebar: mockToggleSidebar });
+
+    const collapseBtn = screen.getByRole('button', { name: messages.toggleCourseOutlineTrigger.defaultMessage });
+    expect(collapseBtn).toBeInTheDocument();
+
+    // Simulate screen resize
+    window.innerWidth = 500;
+    window.dispatchEvent(new Event('resize'));
+
+    expect(mockToggleSidebar).toHaveBeenCalledWith(null);
+  });
+
  it('navigates to section or sequence level correctly on click by back/section button', async () => {
    const user = userEvent.setup();
    await initTestStore();
--- a/src/courseware/course/sidebar/sidebars/course-outline/CourseOutlineTrigger.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/CourseOutlineTrigger.jsx
@@ -15,13 +15,12 @@ const CourseOutlineTrigger = ({ isMobileView }) => {
    shouldDisplayFullScreen,
    handleToggleCollapse,
    isActiveEntranceExam,
-    isEnabledSidebar,
  } = useCourseOutlineSidebar();

  const isDisplayForDesktopView = !isMobileView && !shouldDisplayFullScreen && currentSidebar !== ID;
  const isDisplayForMobileView = isMobileView && shouldDisplayFullScreen;

-  if ((!isDisplayForDesktopView && !isDisplayForMobileView) || !isEnabledSidebar || isActiveEntranceExam) {
+  if ((!isDisplayForDesktopView && !isDisplayForMobileView) || isActiveEntranceExam) {
    return null;
  }

--- a/src/courseware/course/sidebar/sidebars/course-outline/CourseOutlineTrigger.test.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/CourseOutlineTrigger.test.jsx
@@ -45,7 +45,7 @@ describe('<CourseOutlineTrigger />', () => {
  it('renders correctly for desktop when sidebar is enabled', async () => {
    const user = userEvent.setup();
    const mockToggleSidebar = jest.fn();
-    await initTestStore({ enableNavigationSidebar: { enable_navigation_sidebar: true } });
+    await initTestStore();
    renderWithProvider({ toggleSidebar: mockToggleSidebar }, { isMobileView: false });

    const toggleButton = await screen.getByRole('button', {
@@ -62,7 +62,7 @@ describe('<CourseOutlineTrigger />', () => {
  it('renders correctly for mobile when sidebar is enabled', async () => {
    const user = userEvent.setup();
    const mockToggleSidebar = jest.fn();
-    await initTestStore({ enableNavigationSidebar: { enable_navigation_sidebar: true } });
+    await initTestStore();
    renderWithProvider({
      toggleSidebar: mockToggleSidebar,
      shouldDisplayFullScreen: true,
@@ -82,7 +82,7 @@ describe('<CourseOutlineTrigger />', () => {
  it('changes current sidebar value on click', async () => {
    const user = userEvent.setup();
    const mockToggleSidebar = jest.fn();
-    await initTestStore({ enableNavigationSidebar: { enable_navigation_sidebar: true } });
+    await initTestStore();
    renderWithProvider({
      toggleSidebar: mockToggleSidebar,
      shouldDisplayFullScreen: true,
@@ -99,14 +99,4 @@ describe('<CourseOutlineTrigger />', () => {
    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
@@ -6,12 +6,12 @@ import {

 import { DashedCircleIcon } from '../icons';

-const CompletionIcon = ({ completionStat: { completed = 0, total = 0 } }) => {
+const CompletionIcon = ({ completionStat: { completed = 0, total = 0 }, enabled }) => {
  const percentage = total !== 0 ? Math.min((completed / total) * 100, 100) : 0;
  const remainder = 100 - percentage;

  switch (true) {
-    case !completed:
+    case !completed || !enabled:
      return <LmsCompletionSolidIcon className="text-gray-300" data-testid="completion-solid-icon" />;
    case completed === total:
      return <CheckCircleIcon className="text-success" data-testid="check-circle-icon" />;
@@ -25,6 +25,7 @@ CompletionIcon.propTypes = {
    completed: PropTypes.number,
    total: PropTypes.number,
  }).isRequired,
+  enabled: PropTypes.bool.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
@@ -3,21 +3,33 @@ import { render, screen } from '@testing-library/react';
 import CompletionIcon from './CompletionIcon';

 describe('CompletionIcon', () => {
-  it('renders check circle icon when completion is equal to total', () => {
+  it('renders check circle icon when completion is equal to total and completion tracking is enabled', () => {
    const completionStat = { completed: 5, total: 5 };
-    render(<CompletionIcon completionStat={completionStat} />);
+    render(<CompletionIcon completionStat={completionStat} enabled />);
    expect(screen.getByTestId('check-circle-icon')).toBeInTheDocument();
  });

-  it('renders dashed circle icon when completion is between 0 and total', () => {
+  it('renders dashed circle icon when completion is between 0 and total and completion tracking is enabled', () => {
    const completionStat = { completed: 2, total: 5 };
-    render(<CompletionIcon completionStat={completionStat} />);
+    render(<CompletionIcon completionStat={completionStat} enabled />);
    expect(screen.getByTestId('dashed-circle-icon')).toBeInTheDocument();
  });

-  it('renders completion solid icon when completion is 0', () => {
+  it('renders completion solid icon when completion is between 0 and total and completion tracking is not enabled', () => {
+    const completionStat = { completed: 2, total: 5 };
+    render(<CompletionIcon completionStat={completionStat} enabled={false} />);
+    expect(screen.getByTestId('completion-solid-icon')).toBeInTheDocument();
+  });
+
+  it('renders completion solid icon when completion is 0 and enabled', () => {
    const completionStat = { completed: 0, total: 5 };
-    render(<CompletionIcon completionStat={completionStat} />);
+    render(<CompletionIcon completionStat={completionStat} enabled />);
+    expect(screen.getByTestId('completion-solid-icon')).toBeInTheDocument();
+  });
+
+  it('renders completion solid icon when completion is at any value and not enabled', () => {
+    const completionStat = { completed: 0, total: 5 };
+    render(<CompletionIcon completionStat={completionStat} enabled={false} />);
    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
@@ -18,21 +18,24 @@ const SidebarSection = ({ section, handleSelectSection }) => {
    completionStat,
  } = section;

-  const { activeSequenceId } = useCourseOutlineSidebar();
+  const { activeSequenceId, isEnabledCompletionTracking } = useCourseOutlineSidebar();
  const isActiveSection = sequenceIds.includes(activeSequenceId);

  const sectionTitle = (
    <>
      <div className="col-auto p-0">
-        <CompletionIcon completionStat={completionStat} />
+        <CompletionIcon completionStat={completionStat} enabled={isEnabledCompletionTracking} />
      </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>
+        {isEnabledCompletionTracking && (
+          <span className="sr-only">
+            , {intl.formatMessage(complete
+            ? courseOutlineMessages.completedSection
+            : courseOutlineMessages.incompleteSection)}
+          </span>
+        )}
+
      </div>
    </>
  );
--- a/src/courseware/course/sidebar/sidebars/course-outline/components/SidebarSequence.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/components/SidebarSequence.jsx
@@ -28,22 +28,24 @@ const SidebarSequence = ({
  } = sequence;

  const [open, setOpen] = useState(defaultOpen);
-  const { activeSequenceId, units } = useCourseOutlineSidebar();
+  const { activeSequenceId, units, isEnabledCompletionTracking } = useCourseOutlineSidebar();
  const isActiveSequence = id === activeSequenceId;

  const sectionTitle = (
    <>
      <div className="col-auto p-0" style={{ fontSize: '1.1rem' }}>
-        <CompletionIcon completionStat={completionStat} />
+        <CompletionIcon completionStat={completionStat} enabled={isEnabledCompletionTracking} />
      </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>
+        {isEnabledCompletionTracking && (
+          <span className="sr-only">
+            , {intl.formatMessage(complete
+            ? courseOutlineMessages.completedAssignment
+            : courseOutlineMessages.incompleteAssignment)}
+          </span>
+        )}
      </div>
    </>
  );
@@ -69,6 +71,7 @@ const SidebarSequence = ({
              activeUnitId={activeUnitId}
              isFirst={index === 0}
              isLocked={type === UNIT_ICON_TYPES.lock}
+              isCompletionTrackingEnabled={isEnabledCompletionTracking}
            />
          ))}
        </ol>
--- a/src/courseware/course/sidebar/sidebars/course-outline/components/SidebarSequence.test.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/components/SidebarSequence.test.jsx
@@ -66,7 +66,7 @@ describe('<SidebarSequence />', () => {
    expect(screen.queryByText(unit.title)).not.toBeInTheDocument();
  });

-  it('renders correctly when sequence is not collapsed and complete', async () => {
+  it('renders correctly when sequence is not collapsed and complete and completion tracking enabled', async () => {
    const user = userEvent.setup();
    await initTestStore();
    renderWithProvider({
--- a/src/courseware/course/sidebar/sidebars/course-outline/components/SidebarUnit.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/components/SidebarUnit.jsx
@@ -15,6 +15,7 @@ const SidebarUnit = ({
  isActive,
  isLocked,
  activeUnitId,
+  isCompletionTrackingEnabled,
 }) => {
  const intl = useIntl();
  const {
@@ -24,6 +25,7 @@ const SidebarUnit = ({
  } = unit;

  const iconType = isLocked ? UNIT_ICON_TYPES.lock : icon;
+  const completeAndEnabled = complete && isCompletionTrackingEnabled;

  return (
    <li className={classNames({ 'bg-info-100': isActive, 'border-top border-light': !isFirst })}>
@@ -36,15 +38,17 @@ const SidebarUnit = ({
        }}
      >
        <div className="col-auto p-0">
-          <UnitIcon type={iconType} isCompleted={complete} />
+          <UnitIcon type={iconType} isCompleted={completeAndEnabled} />
        </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>
+          {isCompletionTrackingEnabled && (
+            <span className="sr-only">
+              , {intl.formatMessage(complete ? messages.completedUnit : messages.incompleteUnit)}
+            </span>
+          )}
        </div>
      </UnitLinkWrapper>
    </li>
@@ -66,6 +70,7 @@ SidebarUnit.propTypes = {
  courseId: PropTypes.string.isRequired,
  sequenceId: PropTypes.string.isRequired,
  activeUnitId: PropTypes.string.isRequired,
+  isCompletionTrackingEnabled: PropTypes.bool.isRequired,
 };

 export default 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
@@ -50,6 +50,7 @@ describe('<SidebarUnit />', () => {
                unit={{ ...unit, icon: 'video', isLocked: false }}
                isActive={false}
                activeUnitId={unit.id}
+                isCompletionTrackingEnabled
                {...props}
              />
            </MemoryRouter>
@@ -68,7 +69,7 @@ describe('<SidebarUnit />', () => {
    expect(container.querySelector('.text-success')).not.toBeInTheDocument();
  });

-  it('renders correctly when unit is complete', async () => {
+  it('renders correctly when unit is complete and tracking enabled', async () => {
    await initTestStore();
    const container = renderWithProvider({ unit: { ...unit, complete: true } });

--- a/src/courseware/course/sidebar/sidebars/course-outline/hooks.jsx
+++ b/src/courseware/course/sidebar/sidebars/course-outline/hooks.jsx
@@ -1,7 +1,10 @@
-import { useContext, useEffect, useState } from 'react';
+import {
+  useContext, useEffect, useLayoutEffect, useState,
+} from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { useParams } from 'react-router-dom';
 import { sendTrackEvent, sendTrackingLogEvent } from '@edx/frontend-platform/analytics';
+import { breakpoints } from '@openedx/paragon';

 import { useModel } from '@src/generic/model-store';
 import { LOADED } from '@src/constants';
@@ -22,7 +25,9 @@ import { ID } from './constants';
 export const useCourseOutlineSidebar = () => {
  const dispatch = useDispatch();
  const isCollapsedOutlineSidebar = window.sessionStorage.getItem('hideCourseOutlineSidebar');
-  const { enableNavigationSidebar: isEnabledSidebar } = useSelector(getCoursewareOutlineSidebarSettings);
+  const {
+    enableCompletionTracking: isEnabledCompletionTracking,
+  } = useSelector(getCoursewareOutlineSidebarSettings);
  const courseOutlineShouldUpdate = useSelector(getCourseOutlineShouldUpdate);
  const courseOutlineStatus = useSelector(getCourseOutlineStatus);
  const sequenceStatus = useSelector(getSequenceStatus);
@@ -42,7 +47,7 @@ export const useCourseOutlineSidebar = () => {
    shouldDisplayFullScreen,
  } = useContext(SidebarContext);

-  const isOpenSidebar = !initialSidebar && isEnabledSidebar && !isCollapsedOutlineSidebar;
+  const isOpenSidebar = !initialSidebar && !isCollapsedOutlineSidebar;
  const [isOpen, setIsOpen] = useState(true);

  const {
@@ -51,13 +56,18 @@ export const useCourseOutlineSidebar = () => {
  } = course.entranceExamData || {};
  const isActiveEntranceExam = entranceExamEnabled && !entranceExamPassed;

+  const collapseSidebar = () => {
+    toggleSidebar(null);
+    window.sessionStorage.setItem('hideCourseOutlineSidebar', 'true');
+  };
+
  const handleToggleCollapse = () => {
    if (currentSidebar === ID) {
-      toggleSidebar(null);
-      window.sessionStorage.setItem('hideCourseOutlineSidebar', 'true');
+      collapseSidebar();
    } else {
      toggleSidebar(ID);
      window.sessionStorage.removeItem('hideCourseOutlineSidebar');
+      window.sessionStorage.setItem(`notificationTrayStatus.${courseId}`, 'closed');
    }
  };

@@ -99,17 +109,32 @@ export const useCourseOutlineSidebar = () => {
  }, [initialSidebar, unitId]);

  useEffect(() => {
-    if ((isEnabledSidebar && courseOutlineStatus !== LOADED) || courseOutlineShouldUpdate) {
+    if (courseOutlineStatus !== LOADED || courseOutlineShouldUpdate) {
      dispatch(getCourseOutlineStructure(courseId));
    }
-  }, [courseId, isEnabledSidebar, courseOutlineShouldUpdate]);
+  }, [courseId, courseOutlineShouldUpdate]);
+
+  // Collapse sidebar if screen resized to a width that displays the sidebar automatically
+  useLayoutEffect(() => {
+    const handleResize = () => {
+      // breakpoints.large.maxWidth is 1200px and currently the breakpoint for showing the sidebar
+      if (currentSidebar === ID && global.innerWidth < breakpoints.large.maxWidth) {
+        collapseSidebar();
+      }
+    };
+
+    global.addEventListener('resize', handleResize);
+    return () => {
+      global.removeEventListener('resize', handleResize);
+    };
+  }, [isOpen]);

  return {
    courseId,
    unitId,
    currentSidebar,
    shouldDisplayFullScreen,
-    isEnabledSidebar,
+    isEnabledCompletionTracking,
    isOpen,
    setIsOpen,
    handleToggleCollapse,
--- a/src/courseware/course/sidebar/sidebars/discussions/Discussions.scss
+++ b/src/courseware/course/sidebar/sidebars/discussions/Discussions.scss
@@ -1,5 +1,5 @@
 .discussions-sidebar-frame {
-    @media (max-width: -1 + map-get($grid-breakpoints, "xl")) {
+    @media (--pgn-size-breakpoint-max-width-xl) {
        max-height: calc(100vh - 65px);
    }
 }
--- a/src/courseware/data/api.js
+++ b/src/courseware/data/api.js
@@ -104,16 +104,15 @@ export async function getCourseOutline(courseId) {
 }

 /**
- * Get waffle flag value that enable courseware outline sidebar and always open auxiliary sidebar.
+ * Get waffle flag value that enables completion tracking.
 * @param {string} courseId - The unique identifier for the course.
- * @returns {Promise<{enable_navigation_sidebar: boolean, enable_navigation_sidebar: boolean}>} - The object
- * of boolean values of enabling of the outline sidebar and is always open auxiliary sidebar.
+ * @returns {Promise<{enable_completion_tracking: boolean}>} - The object
+ * of boolean values of enabling of the completion tracking.
 */
 export async function getCoursewareOutlineSidebarToggles(courseId) {
  const url = new URL(`${getConfig().LMS_BASE_URL}/courses/${courseId}/courseware-navigation-sidebar/toggles/`);
  const { data } = await getAuthenticatedHttpClient().get(url.href);
  return {
-    enable_navigation_sidebar: data.enable_navigation_sidebar || false,
-    always_open_auxiliary_sidebar: data.always_open_auxiliary_sidebar || false,
+    enable_completion_tracking: data.enable_completion_tracking || false,
  };
 }
--- a/src/courseware/data/redux.test.js
+++ b/src/courseware/data/redux.test.js
@@ -111,8 +111,7 @@ describe('Data layer integration tests', () => {
      axiosMock.onGet(courseUrl).reply(200, courseMetadata);
      axiosMock.onGet(learningSequencesUrlRegExp).reply(200, buildOutlineFromBlocks(courseBlocks));
      axiosMock.onGet(coursewareSidebarSettingsUrl).reply(200, {
-        enable_navigation_sidebar: true,
-        always_open_auxiliary_sidebar: true,
+        enable_completion_tracking: true,
      });

      await executeThunk(thunks.fetchCourse(courseId), store.dispatch);
@@ -124,8 +123,7 @@ describe('Data layer integration tests', () => {
      expect(state.courseware.sequenceStatus).toEqual('loading');
      expect(state.courseware.sequenceId).toEqual(null);
      expect(state.courseware.coursewareOutlineSidebarSettings).toEqual({
-        enableNavigationSidebar: true,
-        alwaysOpenAuxiliarySidebar: true,
+        enableCompletionTracking: true,
      });

      // check that at least one key camel cased, thus course data normalized
@@ -139,8 +137,7 @@ describe('Data layer integration tests', () => {
      axiosMock.onGet(courseUrl).reply(200, courseMetadata);
      axiosMock.onGet(learningSequencesUrlRegExp).reply(200, simpleOutline);
      axiosMock.onGet(coursewareSidebarSettingsUrl).reply(200, {
-        enable_navigation_sidebar: false,
-        always_open_auxiliary_sidebar: false,
+        enable_completion_tracking: false,
      });

      await executeThunk(thunks.fetchCourse(courseId), store.dispatch);
@@ -152,8 +149,7 @@ describe('Data layer integration tests', () => {
      expect(state.courseware.sequenceStatus).toEqual('loading');
      expect(state.courseware.sequenceId).toEqual(null);
      expect(state.courseware.coursewareOutlineSidebarSettings).toEqual({
-        enableNavigationSidebar: false,
-        alwaysOpenAuxiliarySidebar: false,
+        enableCompletionTracking: false,
      });

      // check that at least one key camel cased, thus course data normalized
--- a/src/courseware/data/thunks.js
+++ b/src/courseware/data/thunks.js
@@ -88,10 +88,11 @@ export function fetchCourse(courseId) {

      if (fetchedCoursewareOutlineSidebarTogglesResult) {
        const {
-          enable_navigation_sidebar: enableNavigationSidebar,
-          always_open_auxiliary_sidebar: alwaysOpenAuxiliarySidebar,
+          enable_completion_tracking: enableCompletionTracking,
        } = coursewareOutlineSidebarTogglesResult.value;
-        dispatch(setCoursewareOutlineSidebarToggles({ enableNavigationSidebar, alwaysOpenAuxiliarySidebar }));
+        dispatch(setCoursewareOutlineSidebarToggles(
+          { enableCompletionTracking },
+        ));
      }

      // Log errors for each request if needed. Outline failures may occur
--- a/src/decode-page-route/snapshots/index.test.jsx.snap
+++ b/src/decode-page-route/snapshots/index.test.jsx.snap
@@ -1,17 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`DecodePageRoute should not modify the url if it does not need to be decoded 1`] = `
-<div>
-  PageWrap: {
-  "children": [
-    " ",
-    [
-      " ",
-      [],
-      " "
-    ],
-    " "
-  ]
-}
-</div>
-`;
--- a/src/decode-page-route/index.test.jsx
+++ b/src/decode-page-route/index.test.jsx
@@ -62,11 +62,10 @@ describe('DecodePageRoute', () => {
    const props = matchPath({
      path: '/course/:courseId/home',
    }, `/course/${decodedCourseId}/home`);
-    const { container } = renderPage(props);
+    renderPage(props);

    expect(props.pathname).toContain(decodedCourseId);
    expect(mockNavigate).not.toHaveBeenCalled();
-    expect(container).toMatchSnapshot();
  });

  it('should decode the url and replace the history if necessary', () => {
--- a/src/generic/assets/edX_certificate.png
+++ b/src/generic/assets/edX_certificate.png
--- a/src/generic/assets/edX_locked_certificate.png
+++ b/src/generic/assets/edX_locked_certificate.png
--- a/src/generic/assets/openedx_certificate.png
+++ b/src/generic/assets/openedx_certificate.png
--- a/src/generic/assets/openedx_locked_certificate.png
+++ b/src/generic/assets/openedx_locked_certificate.png
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
dependabot[bot]	a4afad3354	chore(deps): bump brace-expansion Bumps and [brace-expansion](https://github.com/juliangruber/brace-expansion). These dependencies needed to be updated together. Updates `brace-expansion` from 2.0.1 to 2.0.2 - [Release notes](https://github.com/juliangruber/brace-expansion/releases) - [Commits](https://github.com/juliangruber/brace-expansion/compare/v2.0.1...v2.0.2) Updates `brace-expansion` from 1.1.11 to 1.1.12 - [Release notes](https://github.com/juliangruber/brace-expansion/releases) - [Commits](https://github.com/juliangruber/brace-expansion/compare/v2.0.1...v2.0.2) --- updated-dependencies: - dependency-name: brace-expansion dependency-version: 2.0.2 dependency-type: indirect - dependency-name: brace-expansion dependency-version: 1.1.12 dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com>	2025-09-01 00:48:36 +00:00
edX requirements bot	d5140a6bf0	chore: update browserslist DB (#1784 ) Co-authored-by: abdullahwaheed <42172960+abdullahwaheed@users.noreply.github.com>	2025-09-01 00:46:51 +00:00
Isaac Lee	9bf5d01c41	chore: update learning assistant plugin 2.23.0 (#1781 )	2025-08-25 12:54:13 -04:00
edX requirements bot	f3334085d7	chore: update browserslist DB (#1783 ) Co-authored-by: abdullahwaheed <42172960+abdullahwaheed@users.noreply.github.com>	2025-08-25 00:41:09 +00:00
dependabot[bot]	4840fff44b	chore(deps): bump actions/download-artifact from 4 to 5 (#1779 ) Bumps [actions/download-artifact](https://github.com/actions/download-artifact) from 4 to 5. - [Release notes](https://github.com/actions/download-artifact/releases) - [Commits](https://github.com/actions/download-artifact/compare/v4...v5) --- updated-dependencies: - dependency-name: actions/download-artifact dependency-version: '5' dependency-type: direct:production update-type: version-update:semver-major ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>	2025-08-21 14:21:56 -07:00
Muhammad Adeel Tajamul	579bd0365b	feat: updated notification preferences unsubscribe flow (#1778 )	2025-08-21 14:09:28 -04:00
abdullahwaheed	2b4a9661a5	chore: update browserslist DB	2025-08-18 06:14:24 +05:30
dependabot[bot]	a6e4e28e58	chore(deps): bump actions/checkout from 4 to 5 Bumps [actions/checkout](https://github.com/actions/checkout) from 4 to 5. - [Release notes](https://github.com/actions/checkout/releases) - [Changelog](https://github.com/actions/checkout/blob/main/CHANGELOG.md) - [Commits](https://github.com/actions/checkout/compare/v4...v5) --- updated-dependencies: - dependency-name: actions/checkout dependency-version: '5' dependency-type: direct:production update-type: version-update:semver-major ... Signed-off-by: dependabot[bot] <support@github.com>	2025-08-13 14:33:52 -04:00
dependabot[bot]	e6f7588ccd	chore(deps): bump js-toml from 1.0.1 to 1.0.2 Bumps [js-toml](https://github.com/sunnyadn/js-toml) from 1.0.1 to 1.0.2. - [Release notes](https://github.com/sunnyadn/js-toml/releases) - [Commits](https://github.com/sunnyadn/js-toml/compare/v1.0.1...v1.0.2) --- updated-dependencies: - dependency-name: js-toml dependency-version: 1.0.2 dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com>	2025-08-06 16:44:33 +05:30
Muhammad Anas	db29e314c3	feat: customize proctoring review requirements link using externalLinkUrlOverrides (#1775 )	2025-08-04 10:36:44 -04:00
Diana Olarte	e9121f9261	feat: display the certificate available date if available in progress tab	2025-08-01 16:21:36 +05:30
Nawfal Ahmed	9cbc2276d6	feat: use discount info endpoint for streak discount information (#1763 ) * feat: use discount info endpoint for streak discount information * feat: pass course run key to discount code info call * feat: move changes behind a flag * fix: use async IIFE inside useEffect * fix: fix line length * fix: remove default value in dev * fix: improve coverage by adding conditional test based on env value * refactor: move logic inside function * refactor: move functions to utils * fix: ignore merge config	2025-07-31 14:53:18 -04:00
Maniraja Raman	4c8aa7c80c	feat: add FEATURE_ENABLE_CHAT_V2_ENDPOINT to environment files and update library version (#1768 )	2025-07-29 16:48:07 -04:00
Diana Villalvazo	68926334a1	test: transform snapshot into rtl test 1/2 (#1756 ) * test: remove snapshots and use rtl tests * test: improve coverage on search results test	2025-07-29 10:13:07 -04:00
Diana Villalvazo	56a73eee15	test: transform snapshot into rtl test 2/2 (#1757 ) * test: remove snapshots and use rtl tests * test: add expected result on map search	2025-07-29 10:03:07 -04:00
Jacobo Dominguez	bf95916063	docs: add comprehensive readme documentation for plugin slots (#1770 )	2025-07-28 14:10:49 -04:00
Diana Villalvazo	48270c35dd	chore: remove react-unit-test-utils package (#1758 )	2025-07-28 14:02:55 -04:00
Diana Villalvazo	33d7d669d9	test: deprecate react-unit-test-utils 1/2 (#1750 )	2025-07-28 12:48:53 -04:00
Diana Villalvazo	a75c89cd14	test: deprecate react-test-utils 2/2 (#1751 )	2025-07-28 12:12:32 -04:00
Ihor Romaniuk	06902d8ae8	feat: remove waffle flags for managing course outline sidebar (#1713 ) * feat: remove waffle flags for managing course outline sidebar * fix: flag and tests * fix: product-tours tests * fix: remove default content for SequenceNavigationSlot and update tests * fix: remove default content for CourseBreadcrumbsSlot * fix: update plugin-slots version and documentation * revert: update plugin-slots version * fix: update tests	2025-07-21 14:57:43 -04:00
edX requirements bot	e4134641e6	chore: update browserslist DB (#1755 ) Co-authored-by: abdullahwaheed <42172960+abdullahwaheed@users.noreply.github.com>	2025-07-07 00:44:46 +00:00
edX requirements bot	77fcc83efd	chore: update browserslist DB (#1744 ) Co-authored-by: abdullahwaheed <42172960+abdullahwaheed@users.noreply.github.com>	2025-06-30 00:43:50 +00:00
Farhaan Bukhsh	b0505352be	fix: Fixes the auto_advance feature for video XBlock The commit adds eventlistener which picks up the autoAdvance message and triggers the next sequence. This has the same effect of clicking the next button. Signed-off-by: Farhaan Bukhsh <farhaan@opencraft.com>	2025-06-24 19:22:33 +05:30
Brian Smith	ddbc2124ef	feat!: add design tokens support (#1737 ) BREAKING CHANGE: Pre-design-tokens theming is no longer supported. Co-authored-by: Diana Olarte <diana.olarte@edunext.co>	2025-06-18 12:07:01 -04:00
renovate[bot]	462e75f6a6	fix(deps): update dependency @edx/frontend-platform to v8.4.0 (#1739 ) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>	2025-06-18 14:03:53 +00:00
renovate[bot]	bc4c8c2dec	fix(deps): update dependency @edx/frontend-component-footer to v14.9.0 (#1736 ) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>	2025-06-18 05:29:53 +00:00
renovate[bot]	ecd5164806	fix(deps): update dependency @openedx/frontend-build to v14.6.1 (#1700 ) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>	2025-06-18 01:03:51 +00:00
edX requirements bot	44d952bef7	chore: update browserslist DB (#1734 ) Co-authored-by: abdullahwaheed <42172960+abdullahwaheed@users.noreply.github.com>	2025-06-16 00:42:49 +00:00
sundasnoreen12	7eddc918bb	fix: fixed right panel closing issue (#1732 ) * fix: fixed right panel closing issue * fix: fixed status of notificationTrayStatus in session storage * test: added test cases to close or open notification tray	2025-06-13 10:33:14 -04:00
edX requirements bot	f28528e813	chore: update browserslist DB (#1730 ) Co-authored-by: abdullahwaheed <42172960+abdullahwaheed@users.noreply.github.com>	2025-06-09 00:43:43 +00:00
wgu-jesse-stewart	ab3f5fd7bc	fix: ensure full-height layout (#1724 ) When content within a sequence was shorter than the height of the browser viewport, the `.sequence-container > .outline-sidebar-wrapper` element does not expand appropriately. This caused the course outline sidebar to be partially or completely hidden from view.	2025-06-06 15:55:15 -03:00
ayesha waris	73eaf61261	revert: "temp: reverse stack order of discussions and upsell in sidebar (#1705 )" (#1712 ) This reverts commit `2ce833341b`.	2025-06-05 13:25:22 -04:00
KristinAoki	db9663b664	feat: add start:with-theme command	2025-06-05 19:47:23 +05:30
jacobo-dominguez-wgu	7edac93752	fix: removing '-1 +' from media queries (#1727 )	2025-06-04 16:27:04 -07:00
Javier Ontiveros	d1dede568e	feat: hide sidebar on screen resize (#1720 ) Adds an event handler on the window resize to check if the sidebar isOpen and the size of the viewport is smaller than the sidebar display to hide the sidebar and prevent it from blocking the course view.	2025-06-04 16:22:01 -03:00
Javier Ontiveros	31b02d777f	feat: disable completion item icons on flag (#1714 ) * feat: base modifications to disable completion checks when flag enabled * chore: started updating tests * chore: udpated tests * chore: added missing negative test --------- Co-authored-by: Adolfo R. Brandes <adolfo@axim.org>	2025-06-04 15:33:12 -03:00
dependabot[bot]	67bb54a028	chore(deps): bump tar-fs Bumps and [tar-fs](https://github.com/mafintosh/tar-fs). These dependencies needed to be updated together. Updates `tar-fs` from 2.1.2 to 3.0.9 - [Commits](https://github.com/mafintosh/tar-fs/compare/v2.1.2...v3.0.9) Updates `tar-fs` from 3.0.8 to 3.0.9 - [Commits](https://github.com/mafintosh/tar-fs/compare/v2.1.2...v3.0.9) --- updated-dependencies: - dependency-name: tar-fs dependency-version: 3.0.9 dependency-type: indirect - dependency-name: tar-fs dependency-version: 3.0.9 dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com>	2025-06-04 20:32:27 +05:30
jacobo-dominguez-wgu	847d4e5ce6	fix: center and align previous and next buttons (#1718 ) * fix: prev and next buttons were not propertly centered and aligned * fix: removing flex-basis property for navigation buttons	2025-06-04 10:22:45 -03:00
edX requirements bot	b89cdb4a69	chore: update browserslist DB (#1723 ) Co-authored-by: abdullahwaheed <42172960+abdullahwaheed@users.noreply.github.com>	2025-06-02 00:42:51 +00:00
Maria Grimaldi	a1d0afff6c	refactor: move file to corresponding folder	2025-05-30 08:33:47 -04:00
Maria Grimaldi	1714f285b0	chore: add workflow to pull release testing issues into the BTR board Add GH workflow that includes issues into the BTR board after the issue is labeled with `release testing`. Also add label needs triage for bug triaging issues.	2025-05-30 08:18:57 -04:00
Jorg Are	03cda5326a	chore: add id to verified-upgrade-deadline link (#1719 )	2025-05-29 15:33:51 -04:00
Ihor Romaniuk	a71152b008	feat: move sequence navigation to plugin slot (#1716 )	2025-05-29 12:05:00 -04:00
wgu-jesse-stewart	d14c2a9ffd	fix: sidebar not showing sections on pending courses (#1679 )	2025-05-27 13:47:21 -04:00
Jorg Are	b6c29df0a0	chore: add identifiers to some upgrade links/buttons (#1686 )	2025-05-21 08:45:19 -04:00
ayesha waris	2ce833341b	temp: reverse stack order of discussions and upsell in sidebar (#1705 ) Co-authored-by: Ayesha Waris <ayesha.waris@192.168.10.27>	2025-05-19 11:45:32 -04:00
renovate[bot]	ff57a6b217	fix(deps): update dependency @edx/frontend-platform to v8.3.7 (#1710 ) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>	2025-05-19 13:58:38 +00:00
edX requirements bot	dc6ee749be	chore: update browserslist DB (#1709 ) Co-authored-by: abdullahwaheed <42172960+abdullahwaheed@users.noreply.github.com>	2025-05-19 00:42:52 +00:00
renovate[bot]	236fb57023	fix(deps): update dependency @edx/frontend-platform to v8.3.6 (#1707 ) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>	2025-05-15 16:38:56 +00:00
Nathan Sprenkle	d3d2f75c12	chore: re-add query-string dependency (#1703 ) Several of our plugins still rely on this, though it should be removed ASAP	2025-05-12 10:36:48 -04:00
edX requirements bot	8e9306d35a	chore: update browserslist DB (#1704 ) Co-authored-by: abdullahwaheed <42172960+abdullahwaheed@users.noreply.github.com>	2025-05-12 00:42:14 +00:00
Jansen Kantor	b1ee8a3713	feat: add course end dashboard plugin slots (#1658 ) * feat: add additional course end plugin slots * fix: bring plugin slot names in line with new naming scheme * refactor: change plugin files to tsx,remove propTypes * fixup! refactor: change plugin files to tsx,remove propTypes * fixup! fixup! refactor: change plugin files to tsx,remove propTypes * fixup! fixup! fixup! refactor: change plugin files to tsx,remove propTypes * fix: accidentally committed test code * fix: plugin-slot fixes * chore: add ENTERPRISE_LEARNER_PORTAL_URL env var	2025-05-08 14:23:41 -04:00
renovate[bot]	73406fbb31	fix(deps): update dependency @edx/openedx-atlas to ^0.7.0 (#1699 ) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>	2025-05-06 02:39:17 +00:00
renovate[bot]	f4ae1c51ff	fix(deps): update dependency @edx/frontend-component-footer to v14.7.1 (#1698 ) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>	2025-05-05 22:27:28 +00:00
renovate[bot]	7ef3892027	fix(deps): update dependency @edx/frontend-platform to v8.3.5 (#1697 ) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>	2025-05-05 17:04:09 +00:00
Braden MacDonald	1484bc50f7	refactor: replace query-string pkg, remove unused <ShareButton> (#1676 )	2025-05-05 09:56:09 -07:00
edX requirements bot	6b197aad27	chore: update browserslist DB (#1696 ) Co-authored-by: abdullahwaheed <42172960+abdullahwaheed@users.noreply.github.com>	2025-05-05 00:42:17 +00:00
Maxim Beder	1412bfe209	feat: update certificate icons Old certificates icons contained edX trademark logos, which were not suitable for the open source repos. Replaced with icons that contain Open edX logos.	2025-04-30 10:27:27 -03:00
Brian Smith	e8d3bd7c24	fix(docs): correct ProgressCertificateStatusSlot README title (#1689 )	2025-04-25 13:37:58 -04:00
Brian Smith	511091055b	fix(docs): correct CourseRecommendationsSlot README title (#1688 )	2025-04-25 13:37:02 -04:00