fix: username suggestions alignment (#1279 )

Co-authored-by: Kyrylo Hudym-Levkovych <kyr.hudym@kyrs-MacBook-Pro.local>
fix: add new entry for another US label (#1244 )
2025-08-08 16:55:59 +05:00 · 2024-05-03 10:27:32 +05:00 · 2024-05-02 08:55:56 +05:00 · 2024-04-19 10:55:48 +05:00 · 2024-04-11 09:20:07 +00:00 · 2024-04-11 06:45:25 +00:00
12 changed files with 645 additions and 229 deletions
--- a/.env
+++ b/.env
@@ -23,6 +23,7 @@ POST_REGISTRATION_REDIRECT_URL=''
 SEARCH_CATALOG_URL=''
 # ***** Features flags *****
 DISABLE_ENTERPRISE_LOGIN=''
+ENABLE_AUTO_GENERATED_USERNAME=''
 ENABLE_DYNAMIC_REGISTRATION_FIELDS=''
 ENABLE_PROGRESSIVE_PROFILING_ON_AUTHN=''
 ENABLE_POST_REGISTRATION_RECOMMENDATIONS=''
--- a/package-lock.json
+++ b/package-lock.json
@@ -10,11 +10,11 @@
      "license": "AGPL-3.0",
      "dependencies": {
        "@edx/brand": "npm:@openedx/brand-openedx@^1.2.2",
-        "@edx/frontend-platform": "7.1.2",
+        "@edx/frontend-platform": "7.1.3",
        "@edx/openedx-atlas": "^0.6.0",
-        "@fortawesome/fontawesome-svg-core": "6.5.1",
-        "@fortawesome/free-brands-svg-icons": "6.5.1",
-        "@fortawesome/free-solid-svg-icons": "6.5.1",
+        "@fortawesome/fontawesome-svg-core": "6.5.2",
+        "@fortawesome/free-brands-svg-icons": "6.5.2",
+        "@fortawesome/free-solid-svg-icons": "6.5.2",
        "@fortawesome/react-fontawesome": "0.2.0",
        "@openedx/paragon": "^22.1.1",
        "@optimizely/react-sdk": "^2.9.1",
@@ -50,8 +50,8 @@
      "devDependencies": {
        "@edx/browserslist-config": "^1.1.1",
        "@edx/reactifex": "1.1.0",
-        "@openedx/frontend-build": "13.0.28",
-        "babel-plugin-formatjs": "10.5.13",
+        "@openedx/frontend-build": "13.1.4",
+        "babel-plugin-formatjs": "10.5.14",
        "eslint-plugin-import": "2.29.1",
        "glob": "7.2.3",
        "history": "5.3.0",
@@ -69,74 +69,74 @@
      }
    },
    "node_modules/@algolia/cache-browser-local-storage": {
-      "version": "4.22.1",
-      "resolved": "https://registry.npmjs.org/@algolia/cache-browser-local-storage/-/cache-browser-local-storage-4.22.1.tgz",
-      "integrity": "sha512-Sw6IAmOCvvP6QNgY9j+Hv09mvkvEIDKjYW8ow0UDDAxSXy664RBNQk3i/0nt7gvceOJ6jGmOTimaZoY1THmU7g==",
+      "version": "4.23.3",
+      "resolved": "https://registry.npmjs.org/@algolia/cache-browser-local-storage/-/cache-browser-local-storage-4.23.3.tgz",
+      "integrity": "sha512-vRHXYCpPlTDE7i6UOy2xE03zHF2C8MEFjPN2v7fRbqVpcOvAUQK81x3Kc21xyb5aSIpYCjWCZbYZuz8Glyzyyg==",
      "dependencies": {
-        "@algolia/cache-common": "4.22.1"
+        "@algolia/cache-common": "4.23.3"
      }
    },
    "node_modules/@algolia/cache-common": {
-      "version": "4.22.1",
-      "resolved": "https://registry.npmjs.org/@algolia/cache-common/-/cache-common-4.22.1.tgz",
-      "integrity": "sha512-TJMBKqZNKYB9TptRRjSUtevJeQVXRmg6rk9qgFKWvOy8jhCPdyNZV1nB3SKGufzvTVbomAukFR8guu/8NRKBTA=="
+      "version": "4.23.3",
+      "resolved": "https://registry.npmjs.org/@algolia/cache-common/-/cache-common-4.23.3.tgz",
+      "integrity": "sha512-h9XcNI6lxYStaw32pHpB1TMm0RuxphF+Ik4o7tcQiodEdpKK+wKufY6QXtba7t3k8eseirEMVB83uFFF3Nu54A=="
    },
    "node_modules/@algolia/cache-in-memory": {
-      "version": "4.22.1",
-      "resolved": "https://registry.npmjs.org/@algolia/cache-in-memory/-/cache-in-memory-4.22.1.tgz",
-      "integrity": "sha512-ve+6Ac2LhwpufuWavM/aHjLoNz/Z/sYSgNIXsinGofWOysPilQZPUetqLj8vbvi+DHZZaYSEP9H5SRVXnpsNNw==",
+      "version": "4.23.3",
+      "resolved": "https://registry.npmjs.org/@algolia/cache-in-memory/-/cache-in-memory-4.23.3.tgz",
+      "integrity": "sha512-yvpbuUXg/+0rbcagxNT7un0eo3czx2Uf0y4eiR4z4SD7SiptwYTpbuS0IHxcLHG3lq22ukx1T6Kjtk/rT+mqNg==",
      "dependencies": {
-        "@algolia/cache-common": "4.22.1"
+        "@algolia/cache-common": "4.23.3"
      }
    },
    "node_modules/@algolia/client-account": {
-      "version": "4.22.1",
-      "resolved": "https://registry.npmjs.org/@algolia/client-account/-/client-account-4.22.1.tgz",
-      "integrity": "sha512-k8m+oegM2zlns/TwZyi4YgCtyToackkOpE+xCaKCYfBfDtdGOaVZCM5YvGPtK+HGaJMIN/DoTL8asbM3NzHonw==",
+      "version": "4.23.3",
+      "resolved": "https://registry.npmjs.org/@algolia/client-account/-/client-account-4.23.3.tgz",
+      "integrity": "sha512-hpa6S5d7iQmretHHF40QGq6hz0anWEHGlULcTIT9tbUssWUriN9AUXIFQ8Ei4w9azD0hc1rUok9/DeQQobhQMA==",
      "dependencies": {
-        "@algolia/client-common": "4.22.1",
-        "@algolia/client-search": "4.22.1",
-        "@algolia/transporter": "4.22.1"
+        "@algolia/client-common": "4.23.3",
+        "@algolia/client-search": "4.23.3",
+        "@algolia/transporter": "4.23.3"
      }
    },
    "node_modules/@algolia/client-analytics": {
-      "version": "4.22.1",
-      "resolved": "https://registry.npmjs.org/@algolia/client-analytics/-/client-analytics-4.22.1.tgz",
-      "integrity": "sha512-1ssi9pyxyQNN4a7Ji9R50nSdISIumMFDwKNuwZipB6TkauJ8J7ha/uO60sPJFqQyqvvI+px7RSNRQT3Zrvzieg==",
+      "version": "4.23.3",
+      "resolved": "https://registry.npmjs.org/@algolia/client-analytics/-/client-analytics-4.23.3.tgz",
+      "integrity": "sha512-LBsEARGS9cj8VkTAVEZphjxTjMVCci+zIIiRhpFun9jGDUlS1XmhCW7CTrnaWeIuCQS/2iPyRqSy1nXPjcBLRA==",
      "dependencies": {
-        "@algolia/client-common": "4.22.1",
-        "@algolia/client-search": "4.22.1",
-        "@algolia/requester-common": "4.22.1",
-        "@algolia/transporter": "4.22.1"
+        "@algolia/client-common": "4.23.3",
+        "@algolia/client-search": "4.23.3",
+        "@algolia/requester-common": "4.23.3",
+        "@algolia/transporter": "4.23.3"
      }
    },
    "node_modules/@algolia/client-common": {
-      "version": "4.22.1",
-      "resolved": "https://registry.npmjs.org/@algolia/client-common/-/client-common-4.22.1.tgz",
-      "integrity": "sha512-IvaL5v9mZtm4k4QHbBGDmU3wa/mKokmqNBqPj0K7lcR8ZDKzUorhcGp/u8PkPC/e0zoHSTvRh7TRkGX3Lm7iOQ==",
+      "version": "4.23.3",
+      "resolved": "https://registry.npmjs.org/@algolia/client-common/-/client-common-4.23.3.tgz",
+      "integrity": "sha512-l6EiPxdAlg8CYhroqS5ybfIczsGUIAC47slLPOMDeKSVXYG1n0qGiz4RjAHLw2aD0xzh2EXZ7aRguPfz7UKDKw==",
      "dependencies": {
-        "@algolia/requester-common": "4.22.1",
-        "@algolia/transporter": "4.22.1"
+        "@algolia/requester-common": "4.23.3",
+        "@algolia/transporter": "4.23.3"
      }
    },
    "node_modules/@algolia/client-personalization": {
-      "version": "4.22.1",
-      "resolved": "https://registry.npmjs.org/@algolia/client-personalization/-/client-personalization-4.22.1.tgz",
-      "integrity": "sha512-sl+/klQJ93+4yaqZ7ezOttMQ/nczly/3GmgZXJ1xmoewP5jmdP/X/nV5U7EHHH3hCUEHeN7X1nsIhGPVt9E1cQ==",
+      "version": "4.23.3",
+      "resolved": "https://registry.npmjs.org/@algolia/client-personalization/-/client-personalization-4.23.3.tgz",
+      "integrity": "sha512-3E3yF3Ocr1tB/xOZiuC3doHQBQ2zu2MPTYZ0d4lpfWads2WTKG7ZzmGnsHmm63RflvDeLK/UVx7j2b3QuwKQ2g==",
      "dependencies": {
-        "@algolia/client-common": "4.22.1",
-        "@algolia/requester-common": "4.22.1",
-        "@algolia/transporter": "4.22.1"
+        "@algolia/client-common": "4.23.3",
+        "@algolia/requester-common": "4.23.3",
+        "@algolia/transporter": "4.23.3"
      }
    },
    "node_modules/@algolia/client-search": {
-      "version": "4.22.1",
-      "resolved": "https://registry.npmjs.org/@algolia/client-search/-/client-search-4.22.1.tgz",
-      "integrity": "sha512-yb05NA4tNaOgx3+rOxAmFztgMTtGBi97X7PC3jyNeGiwkAjOZc2QrdZBYyIdcDLoI09N0gjtpClcackoTN0gPA==",
+      "version": "4.23.3",
+      "resolved": "https://registry.npmjs.org/@algolia/client-search/-/client-search-4.23.3.tgz",
+      "integrity": "sha512-P4VAKFHqU0wx9O+q29Q8YVuaowaZ5EM77rxfmGnkHUJggh28useXQdopokgwMeYw2XUht49WX5RcTQ40rZIabw==",
      "dependencies": {
-        "@algolia/client-common": "4.22.1",
-        "@algolia/requester-common": "4.22.1",
-        "@algolia/transporter": "4.22.1"
+        "@algolia/client-common": "4.23.3",
+        "@algolia/requester-common": "4.23.3",
+        "@algolia/transporter": "4.23.3"
      }
    },
    "node_modules/@algolia/events": {
@@ -145,47 +145,65 @@
      "integrity": "sha512-FQzvOCgoFXAbf5Y6mYozw2aj5KCJoA3m4heImceldzPSMbdyS4atVjJzXKMsfX3wnZTFYwkkt8/z8UesLHlSBQ=="
    },
    "node_modules/@algolia/logger-common": {
-      "version": "4.22.1",
-      "resolved": "https://registry.npmjs.org/@algolia/logger-common/-/logger-common-4.22.1.tgz",
-      "integrity": "sha512-OnTFymd2odHSO39r4DSWRFETkBufnY2iGUZNrMXpIhF5cmFE8pGoINNPzwg02QLBlGSaLqdKy0bM8S0GyqPLBg=="
+      "version": "4.23.3",
+      "resolved": "https://registry.npmjs.org/@algolia/logger-common/-/logger-common-4.23.3.tgz",
+      "integrity": "sha512-y9kBtmJwiZ9ZZ+1Ek66P0M68mHQzKRxkW5kAAXYN/rdzgDN0d2COsViEFufxJ0pb45K4FRcfC7+33YB4BLrZ+g=="
    },
    "node_modules/@algolia/logger-console": {
-      "version": "4.22.1",
-      "resolved": "https://registry.npmjs.org/@algolia/logger-console/-/logger-console-4.22.1.tgz",
-      "integrity": "sha512-O99rcqpVPKN1RlpgD6H3khUWylU24OXlzkavUAMy6QZd1776QAcauE3oP8CmD43nbaTjBexZj2nGsBH9Tc0FVA==",
+      "version": "4.23.3",
+      "resolved": "https://registry.npmjs.org/@algolia/logger-console/-/logger-console-4.23.3.tgz",
+      "integrity": "sha512-8xoiseoWDKuCVnWP8jHthgaeobDLolh00KJAdMe9XPrWPuf1by732jSpgy2BlsLTaT9m32pHI8CRfrOqQzHv3A==",
      "dependencies": {
-        "@algolia/logger-common": "4.22.1"
+        "@algolia/logger-common": "4.23.3"
+      }
+    },
+    "node_modules/@algolia/recommend": {
+      "version": "4.23.3",
+      "resolved": "https://registry.npmjs.org/@algolia/recommend/-/recommend-4.23.3.tgz",
+      "integrity": "sha512-9fK4nXZF0bFkdcLBRDexsnGzVmu4TSYZqxdpgBW2tEyfuSSY54D4qSRkLmNkrrz4YFvdh2GM1gA8vSsnZPR73w==",
+      "dependencies": {
+        "@algolia/cache-browser-local-storage": "4.23.3",
+        "@algolia/cache-common": "4.23.3",
+        "@algolia/cache-in-memory": "4.23.3",
+        "@algolia/client-common": "4.23.3",
+        "@algolia/client-search": "4.23.3",
+        "@algolia/logger-common": "4.23.3",
+        "@algolia/logger-console": "4.23.3",
+        "@algolia/requester-browser-xhr": "4.23.3",
+        "@algolia/requester-common": "4.23.3",
+        "@algolia/requester-node-http": "4.23.3",
+        "@algolia/transporter": "4.23.3"
      }
    },
    "node_modules/@algolia/requester-browser-xhr": {
-      "version": "4.22.1",
-      "resolved": "https://registry.npmjs.org/@algolia/requester-browser-xhr/-/requester-browser-xhr-4.22.1.tgz",
-      "integrity": "sha512-dtQGYIg6MteqT1Uay3J/0NDqD+UciHy3QgRbk7bNddOJu+p3hzjTRYESqEnoX/DpEkaNYdRHUKNylsqMpgwaEw==",
+      "version": "4.23.3",
+      "resolved": "https://registry.npmjs.org/@algolia/requester-browser-xhr/-/requester-browser-xhr-4.23.3.tgz",
+      "integrity": "sha512-jDWGIQ96BhXbmONAQsasIpTYWslyjkiGu0Quydjlowe+ciqySpiDUrJHERIRfELE5+wFc7hc1Q5hqjGoV7yghw==",
      "dependencies": {
-        "@algolia/requester-common": "4.22.1"
+        "@algolia/requester-common": "4.23.3"
      }
    },
    "node_modules/@algolia/requester-common": {
-      "version": "4.22.1",
-      "resolved": "https://registry.npmjs.org/@algolia/requester-common/-/requester-common-4.22.1.tgz",
-      "integrity": "sha512-dgvhSAtg2MJnR+BxrIFqlLtkLlVVhas9HgYKMk2Uxiy5m6/8HZBL40JVAMb2LovoPFs9I/EWIoFVjOrFwzn5Qg=="
+      "version": "4.23.3",
+      "resolved": "https://registry.npmjs.org/@algolia/requester-common/-/requester-common-4.23.3.tgz",
+      "integrity": "sha512-xloIdr/bedtYEGcXCiF2muajyvRhwop4cMZo+K2qzNht0CMzlRkm8YsDdj5IaBhshqfgmBb3rTg4sL4/PpvLYw=="
    },
    "node_modules/@algolia/requester-node-http": {
-      "version": "4.22.1",
-      "resolved": "https://registry.npmjs.org/@algolia/requester-node-http/-/requester-node-http-4.22.1.tgz",
-      "integrity": "sha512-JfmZ3MVFQkAU+zug8H3s8rZ6h0ahHZL/SpMaSasTCGYR5EEJsCc8SI5UZ6raPN2tjxa5bxS13BRpGSBUens7EA==",
+      "version": "4.23.3",
+      "resolved": "https://registry.npmjs.org/@algolia/requester-node-http/-/requester-node-http-4.23.3.tgz",
+      "integrity": "sha512-zgu++8Uj03IWDEJM3fuNl34s746JnZOWn1Uz5taV1dFyJhVM/kTNw9Ik7YJWiUNHJQXcaD8IXD1eCb0nq/aByA==",
      "dependencies": {
-        "@algolia/requester-common": "4.22.1"
+        "@algolia/requester-common": "4.23.3"
      }
    },
    "node_modules/@algolia/transporter": {
-      "version": "4.22.1",
-      "resolved": "https://registry.npmjs.org/@algolia/transporter/-/transporter-4.22.1.tgz",
-      "integrity": "sha512-kzWgc2c9IdxMa3YqA6TN0NW5VrKYYW/BELIn7vnLyn+U/RFdZ4lxxt9/8yq3DKV5snvoDzzO4ClyejZRdV3lMQ==",
+      "version": "4.23.3",
+      "resolved": "https://registry.npmjs.org/@algolia/transporter/-/transporter-4.23.3.tgz",
+      "integrity": "sha512-Wjl5gttqnf/gQKJA+dafnD0Y6Yw97yvfY8R9h0dQltX1GXTgNs1zWgvtWW0tHl1EgMdhAyw189uWiZMnL3QebQ==",
      "dependencies": {
-        "@algolia/cache-common": "4.22.1",
-        "@algolia/logger-common": "4.22.1",
-        "@algolia/requester-common": "4.22.1"
+        "@algolia/cache-common": "4.23.3",
+        "@algolia/logger-common": "4.23.3",
+        "@algolia/requester-common": "4.23.3"
      }
    },
    "node_modules/@ampproject/remapping": {
@@ -2167,9 +2185,9 @@
      }
    },
    "node_modules/@csstools/cascade-layer-name-parser": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/@csstools/cascade-layer-name-parser/-/cascade-layer-name-parser-1.0.7.tgz",
-      "integrity": "sha512-9J4aMRJ7A2WRjaRLvsMeWrL69FmEuijtiW1XlK/sG+V0UJiHVYUyvj9mY4WAXfU/hGIiGOgL8e0jJcRyaZTjDQ==",
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/@csstools/cascade-layer-name-parser/-/cascade-layer-name-parser-1.0.9.tgz",
+      "integrity": "sha512-RRqNjxTZDUhx7pxYOBG/AkCVmPS3zYzfE47GEhIGkFuWFTQGJBgWOUUkKNo5MfxIfjDz5/1L3F3rF1oIsYaIpw==",
      "funding": [
        {
          "type": "github",
@@ -2184,14 +2202,14 @@
        "node": "^14 || ^16 || >=18"
      },
      "peerDependencies": {
-        "@csstools/css-parser-algorithms": "^2.5.0",
-        "@csstools/css-tokenizer": "^2.2.3"
+        "@csstools/css-parser-algorithms": "^2.6.1",
+        "@csstools/css-tokenizer": "^2.2.4"
      }
    },
    "node_modules/@csstools/css-parser-algorithms": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-2.5.0.tgz",
-      "integrity": "sha512-abypo6m9re3clXA00eu5syw+oaPHbJTPapu9C4pzNsJ4hdZDzushT50Zhu+iIYXgEe1CxnRMn7ngsbV+MLrlpQ==",
+      "version": "2.6.1",
+      "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-2.6.1.tgz",
+      "integrity": "sha512-ubEkAaTfVZa+WwGhs5jbo5Xfqpeaybr/RvWzvFxRs4jfq16wH8l8Ty/QEEpINxll4xhuGfdMbipRyz5QZh9+FA==",
      "funding": [
        {
          "type": "github",
@@ -2206,13 +2224,13 @@
        "node": "^14 || ^16 || >=18"
      },
      "peerDependencies": {
-        "@csstools/css-tokenizer": "^2.2.3"
+        "@csstools/css-tokenizer": "^2.2.4"
      }
    },
    "node_modules/@csstools/css-tokenizer": {
-      "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-2.2.3.tgz",
-      "integrity": "sha512-pp//EvZ9dUmGuGtG1p+n17gTHEOqu9jO+FiCUjNN3BDmyhdA2Jq9QsVeR7K8/2QCK17HSsioPlTW9ZkzoWb3Lg==",
+      "version": "2.2.4",
+      "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-2.2.4.tgz",
+      "integrity": "sha512-PuWRAewQLbDhGeTvFuq2oClaSCKPIBmHyIobCV39JHRYN0byDcUWJl5baPeNUcqrjtdMNqFooE0FGl31I3JOqw==",
      "funding": [
        {
          "type": "github",
@@ -2228,9 +2246,9 @@
      }
    },
    "node_modules/@csstools/media-query-list-parser": {
-      "version": "2.1.7",
-      "resolved": "https://registry.npmjs.org/@csstools/media-query-list-parser/-/media-query-list-parser-2.1.7.tgz",
-      "integrity": "sha512-lHPKJDkPUECsyAvD60joYfDmp8UERYxHGkFfyLJFTVK/ERJe0sVlIFLXU5XFxdjNDTerp5L4KeaKG+Z5S94qxQ==",
+      "version": "2.1.9",
+      "resolved": "https://registry.npmjs.org/@csstools/media-query-list-parser/-/media-query-list-parser-2.1.9.tgz",
+      "integrity": "sha512-qqGuFfbn4rUmyOB0u8CVISIp5FfJ5GAR3mBrZ9/TKndHakdnm6pY0L/fbLcpPnrzwCyyTEZl1nUcXAYHEWneTA==",
      "funding": [
        {
          "type": "github",
@@ -2245,8 +2263,8 @@
        "node": "^14 || ^16 || >=18"
      },
      "peerDependencies": {
-        "@csstools/css-parser-algorithms": "^2.5.0",
-        "@csstools/css-tokenizer": "^2.2.3"
+        "@csstools/css-parser-algorithms": "^2.6.1",
+        "@csstools/css-tokenizer": "^2.2.4"
      }
    },
    "node_modules/@discoveryjs/json-ext": {
@@ -2283,9 +2301,9 @@
      }
    },
    "node_modules/@edx/frontend-platform": {
-      "version": "7.1.2",
-      "resolved": "https://registry.npmjs.org/@edx/frontend-platform/-/frontend-platform-7.1.2.tgz",
-      "integrity": "sha512-iKd8n6QoFjaATEfLOYe+gsJLHFoGWpZbX2Z4D6hM+OthTISE98K8+/7Gx7PAcT9vlJEA33OVIThncZYwYaaluw==",
+      "version": "7.1.3",
+      "resolved": "https://registry.npmjs.org/@edx/frontend-platform/-/frontend-platform-7.1.3.tgz",
+      "integrity": "sha512-klw0pvFnAo8k8iVPxcR9WCPLaYqV2AFdnz1COF6hJ6gOIFuj2Mb5cuEy9di89INpZFO/0FEHq1IBVojm1rbJcg==",
      "dependencies": {
        "@cospired/i18n-iso-languages": "4.2.0",
        "@formatjs/intl-pluralrules": "4.3.3",
@@ -2304,7 +2322,7 @@
        "lodash.merge": "4.6.2",
        "lodash.snakecase": "4.1.1",
        "pubsub-js": "1.9.4",
-        "react-intl": "6.6.2",
+        "react-intl": "6.6.3",
        "universal-cookie": "4.0.4"
      },
      "bin": {
@@ -2573,9 +2591,9 @@
      }
    },
    "node_modules/@formatjs/intl": {
-      "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/@formatjs/intl/-/intl-2.10.0.tgz",
-      "integrity": "sha512-X3xT9guVkKDS86EKV80lS0KxoazUglkJTGZO66sKY7otgl0VeStPA8B3u8UkKT47PexVV98fUzjpkchYmbe9nw==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@formatjs/intl/-/intl-2.10.1.tgz",
+      "integrity": "sha512-dsLG15U7xDi8yzKf4hcAWSsCaez3XrjTO2oaRHPyHtXLm1aEzYbDw6bClo/HMHu+iwS5GbDqT3DV+hYP2ylScg==",
      "dependencies": {
        "@formatjs/ecma402-abstract": "1.18.2",
        "@formatjs/fast-memoize": "2.2.0",
@@ -2694,45 +2712,45 @@
      }
    },
    "node_modules/@fortawesome/fontawesome-common-types": {
-      "version": "6.5.1",
-      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.5.1.tgz",
-      "integrity": "sha512-GkWzv+L6d2bI5f/Vk6ikJ9xtl7dfXtoRu3YGE6nq0p/FFqA1ebMOAWg3XgRyb0I6LYyYkiAo+3/KrwuBp8xG7A==",
+      "version": "6.5.2",
+      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.5.2.tgz",
+      "integrity": "sha512-gBxPg3aVO6J0kpfHNILc+NMhXnqHumFxOmjYCFfOiLZfwhnnfhtsdA2hfJlDnj+8PjAs6kKQPenOTKj3Rf7zHw==",
      "hasInstallScript": true,
      "engines": {
        "node": ">=6"
      }
    },
    "node_modules/@fortawesome/fontawesome-svg-core": {
-      "version": "6.5.1",
-      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.5.1.tgz",
-      "integrity": "sha512-MfRCYlQPXoLlpem+egxjfkEuP9UQswTrlCOsknus/NcMoblTH2g0jPrapbcIb04KGA7E2GZxbAccGZfWoYgsrQ==",
+      "version": "6.5.2",
+      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.5.2.tgz",
+      "integrity": "sha512-5CdaCBGl8Rh9ohNdxeeTMxIj8oc3KNBgIeLMvJosBMdslK/UnEB8rzyDRrbKdL1kDweqBPo4GT9wvnakHWucZw==",
      "hasInstallScript": true,
      "dependencies": {
-        "@fortawesome/fontawesome-common-types": "6.5.1"
+        "@fortawesome/fontawesome-common-types": "6.5.2"
      },
      "engines": {
        "node": ">=6"
      }
    },
    "node_modules/@fortawesome/free-brands-svg-icons": {
-      "version": "6.5.1",
-      "resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-6.5.1.tgz",
-      "integrity": "sha512-093l7DAkx0aEtBq66Sf19MgoZewv1zeY9/4C7vSKPO4qMwEsW/2VYTUTpBtLwfb9T2R73tXaRDPmE4UqLCYHfg==",
+      "version": "6.5.2",
+      "resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-6.5.2.tgz",
+      "integrity": "sha512-zi5FNYdmKLnEc0jc0uuHH17kz/hfYTg4Uei0wMGzcoCL/4d3WM3u1VMc0iGGa31HuhV5i7ZK8ZlTCQrHqRHSGQ==",
      "hasInstallScript": true,
      "dependencies": {
-        "@fortawesome/fontawesome-common-types": "6.5.1"
+        "@fortawesome/fontawesome-common-types": "6.5.2"
      },
      "engines": {
        "node": ">=6"
      }
    },
    "node_modules/@fortawesome/free-solid-svg-icons": {
-      "version": "6.5.1",
-      "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.5.1.tgz",
-      "integrity": "sha512-S1PPfU3mIJa59biTtXJz1oI0+KAXW6bkAb31XKhxdxtuXDiUIFsih4JR1v5BbxY7hVHsD1RKq+jRkVRaf773NQ==",
+      "version": "6.5.2",
+      "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.5.2.tgz",
+      "integrity": "sha512-QWFZYXFE7O1Gr1dTIp+D6UcFUF0qElOnZptpi7PBUMylJh+vFmIedVe1Ir6RM1t2tEQLLSV1k7bR4o92M+uqlw==",
      "hasInstallScript": true,
      "dependencies": {
-        "@fortawesome/fontawesome-common-types": "6.5.1"
+        "@fortawesome/fontawesome-common-types": "6.5.2"
      },
      "engines": {
        "node": ">=6"
@@ -3932,9 +3950,9 @@
      }
    },
    "node_modules/@openedx/frontend-build": {
-      "version": "13.0.28",
-      "resolved": "https://registry.npmjs.org/@openedx/frontend-build/-/frontend-build-13.0.28.tgz",
-      "integrity": "sha512-9CSTpA7EGlC5lHaH03X3E1YpCp2SPsJ5It7905KimacGlliK0yf8FZIyluOCm3jSGQ5u/xjvZyw6xbl0XJCKZA==",
+      "version": "13.1.4",
+      "resolved": "https://registry.npmjs.org/@openedx/frontend-build/-/frontend-build-13.1.4.tgz",
+      "integrity": "sha512-YqXU6KgFnmDD/vGLvq/A9NP6R8lHfaEx64ajQC50ebFMlF3J7HWUruct4PuroeTupq9UAfRZUilzQHYQZjV08A==",
      "dependencies": {
        "@babel/cli": "7.22.5",
        "@babel/core": "7.22.5",
@@ -3950,7 +3968,7 @@
        "@fullhuman/postcss-purgecss": "5.0.0",
        "@pmmmwh/react-refresh-webpack-plugin": "0.5.11",
        "@svgr/webpack": "8.1.0",
-        "autoprefixer": "10.4.16",
+        "autoprefixer": "10.4.19",
        "babel-jest": "26.6.3",
        "babel-loader": "9.1.3",
        "babel-plugin-formatjs": "^10.4.0",
@@ -3964,19 +3982,20 @@
        "dotenv-webpack": "8.0.1",
        "eslint": "8.44.0",
        "eslint-config-airbnb": "19.0.4",
+        "eslint-plugin-formatjs": "^4.12.2",
        "eslint-plugin-import": "2.27.5",
        "eslint-plugin-jsx-a11y": "6.7.1",
        "eslint-plugin-react": "7.32.2",
        "eslint-plugin-react-hooks": "4.6.0",
-        "express": "4.18.2",
+        "express": "^4.18.2",
        "file-loader": "6.2.0",
        "html-webpack-plugin": "5.6.0",
        "identity-obj-proxy": "3.0.0",
        "image-minimizer-webpack-plugin": "3.8.3",
        "jest": "26.6.3",
        "mini-css-extract-plugin": "1.6.2",
-        "postcss": "8.4.33",
-        "postcss-custom-media": "10.0.2",
+        "postcss": "8.4.38",
+        "postcss-custom-media": "10.0.4",
        "postcss-loader": "7.3.4",
        "postcss-rtlcss": "5.1.0",
        "react-dev-utils": "12.0.1",
@@ -3988,11 +4007,11 @@
        "source-map-loader": "4.0.2",
        "style-loader": "3.3.4",
        "url-loader": "4.1.1",
-        "webpack": "5.89.0",
-        "webpack-bundle-analyzer": "4.10.1",
-        "webpack-cli": "5.1.4",
-        "webpack-dev-server": "4.15.1",
-        "webpack-merge": "5.10.0"
+        "webpack": "^5.89.0",
+        "webpack-bundle-analyzer": "^4.10.1",
+        "webpack-cli": "^5.1.4",
+        "webpack-dev-server": "^4.15.1",
+        "webpack-merge": "^5.10.0"
      },
      "bin": {
        "fedx-scripts": "bin/fedx-scripts.js"
@@ -4792,9 +4811,9 @@
      }
    },
    "node_modules/@openedx/frontend-build/node_modules/jest-snapshot/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
      "dependencies": {
        "lru-cache": "^6.0.0"
      },
@@ -5054,9 +5073,16 @@
      }
    },
    "node_modules/@openedx/paragon": {
-      "version": "22.1.1",
-      "resolved": "https://registry.npmjs.org/@openedx/paragon/-/paragon-22.1.1.tgz",
-      "integrity": "sha512-XPRuV9zn7BeCIYfU5kE2XZ4YevjA0wfS/fuydB8Ta/aNY1dw9fQ7CjHOIfkZqDic4Jygusj/uhE/1WYJD8kvyw==",
+      "version": "22.2.1",
+      "resolved": "https://registry.npmjs.org/@openedx/paragon/-/paragon-22.2.1.tgz",
+      "integrity": "sha512-Dd7PzvHwNnUokqbFkuOpugJZ9dHaUBOcYwqAA2aMoN7tgi4xEZWsfDFyP1+se2UPuR7NvNGammEesLAwGQ0Ylw==",
+      "workspaces": [
+        "example",
+        "component-generator",
+        "www",
+        "icons",
+        "dependent-usage-analyzer"
+      ],
      "dependencies": {
        "@fortawesome/fontawesome-svg-core": "^6.1.1",
        "@fortawesome/react-fontawesome": "^0.1.18",
@@ -6007,6 +6033,11 @@
      "resolved": "https://registry.npmjs.org/@types/parse-json/-/parse-json-4.0.2.tgz",
      "integrity": "sha512-dISoDXWWQwUquiKsyZ4Ng+HX2KsPL7LyHKHQwgGFEA3IaKac4Obd+h2a/a6waisAoepJlBcx9paWqjA8/HVjCw=="
    },
+    "node_modules/@types/picomatch": {
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/@types/picomatch/-/picomatch-2.3.3.tgz",
+      "integrity": "sha512-Yll76ZHikRFCyz/pffKGjrCwe/le2CDwOP5F210KQo27kpRE46U2rDnzikNlVn6/ezH3Mhn46bJMTfeVTtcYMg=="
+    },
    "node_modules/@types/prettier": {
      "version": "2.7.3",
      "resolved": "https://registry.npmjs.org/@types/prettier/-/prettier-2.7.3.tgz",
@@ -6074,6 +6105,11 @@
      "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.8.tgz",
      "integrity": "sha512-WZLiwShhwLRmeV6zH+GkbOFT6Z6VklCItrDioxUnv+u4Ll+8vKeFySoFyK/0ctcRpOmwAicELfmys1sDc/Rw+A=="
    },
+    "node_modules/@types/semver": {
+      "version": "7.5.8",
+      "resolved": "https://registry.npmjs.org/@types/semver/-/semver-7.5.8.tgz",
+      "integrity": "sha512-I8EUhyrgfLrcTkzV3TSsGyl1tSuPrEDzr0yd5m90UgNxQkyDXULk3b6MlQqTCpZpNtWe1K0hzclnZkTcLBe2UQ=="
+    },
    "node_modules/@types/send": {
      "version": "0.17.4",
      "resolved": "https://registry.npmjs.org/@types/send/-/send-0.17.4.tgz",
@@ -6140,6 +6176,229 @@
      "resolved": "https://registry.npmjs.org/@types/yargs-parser/-/yargs-parser-21.0.3.tgz",
      "integrity": "sha512-I4q9QU9MQv4oEOz4tAHJtNz1cwuLxn2F3xcc2iV5WdqLPpUnj30aUuxt1mAxYTG+oe8CZMV/+6rU4S4gRDzqtQ=="
    },
+    "node_modules/@typescript-eslint/scope-manager": {
+      "version": "6.21.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-6.21.0.tgz",
+      "integrity": "sha512-OwLUIWZJry80O99zvqXVEioyniJMa+d2GrqpUTqi5/v5D5rOrppJVBPa0yKCblcigC0/aYAzxxqQ1B+DS2RYsg==",
+      "dependencies": {
+        "@typescript-eslint/types": "6.21.0",
+        "@typescript-eslint/visitor-keys": "6.21.0"
+      },
+      "engines": {
+        "node": "^16.0.0 || >=18.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/types": {
+      "version": "6.21.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-6.21.0.tgz",
+      "integrity": "sha512-1kFmZ1rOm5epu9NZEZm1kckCDGj5UJEf7P1kliH4LKu/RkwpsfqqGmY2OOcUs18lSlQBKLDYBOGxRVtrMN5lpg==",
+      "engines": {
+        "node": "^16.0.0 || >=18.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree": {
+      "version": "6.21.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-6.21.0.tgz",
+      "integrity": "sha512-6npJTkZcO+y2/kr+z0hc4HwNfrrP4kNYh57ek7yCNlrBjWQ1Y0OS7jiZTkgumrvkX5HkEKXFZkkdFNkaW2wmUQ==",
+      "dependencies": {
+        "@typescript-eslint/types": "6.21.0",
+        "@typescript-eslint/visitor-keys": "6.21.0",
+        "debug": "^4.3.4",
+        "globby": "^11.1.0",
+        "is-glob": "^4.0.3",
+        "minimatch": "9.0.3",
+        "semver": "^7.5.4",
+        "ts-api-utils": "^1.0.1"
+      },
+      "engines": {
+        "node": "^16.0.0 || >=18.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree/node_modules/array-union": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz",
+      "integrity": "sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree/node_modules/brace-expansion": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
+      "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
+      "dependencies": {
+        "balanced-match": "^1.0.0"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree/node_modules/globby": {
+      "version": "11.1.0",
+      "resolved": "https://registry.npmjs.org/globby/-/globby-11.1.0.tgz",
+      "integrity": "sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==",
+      "dependencies": {
+        "array-union": "^2.1.0",
+        "dir-glob": "^3.0.1",
+        "fast-glob": "^3.2.9",
+        "ignore": "^5.2.0",
+        "merge2": "^1.4.1",
+        "slash": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree/node_modules/lru-cache": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+      "dependencies": {
+        "yallist": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree/node_modules/minimatch": {
+      "version": "9.0.3",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz",
+      "integrity": "sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==",
+      "dependencies": {
+        "brace-expansion": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree/node_modules/semver": {
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
+      "dependencies": {
+        "lru-cache": "^6.0.0"
+      },
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree/node_modules/slash": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
+      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree/node_modules/yallist": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
+    },
+    "node_modules/@typescript-eslint/utils": {
+      "version": "6.21.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-6.21.0.tgz",
+      "integrity": "sha512-NfWVaC8HP9T8cbKQxHcsJBY5YE1O33+jpMwN45qzWWaPDZgLIbo12toGMWnmhvCpd3sIxkpDw3Wv1B3dYrbDQQ==",
+      "dependencies": {
+        "@eslint-community/eslint-utils": "^4.4.0",
+        "@types/json-schema": "^7.0.12",
+        "@types/semver": "^7.5.0",
+        "@typescript-eslint/scope-manager": "6.21.0",
+        "@typescript-eslint/types": "6.21.0",
+        "@typescript-eslint/typescript-estree": "6.21.0",
+        "semver": "^7.5.4"
+      },
+      "engines": {
+        "node": "^16.0.0 || >=18.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^7.0.0 || ^8.0.0"
+      }
+    },
+    "node_modules/@typescript-eslint/utils/node_modules/lru-cache": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+      "dependencies": {
+        "yallist": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@typescript-eslint/utils/node_modules/semver": {
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
+      "dependencies": {
+        "lru-cache": "^6.0.0"
+      },
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@typescript-eslint/utils/node_modules/yallist": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
+    },
+    "node_modules/@typescript-eslint/visitor-keys": {
+      "version": "6.21.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-6.21.0.tgz",
+      "integrity": "sha512-JJtkDduxLi9bivAB+cYOVMtbkqdPOhZ+ZI5LC47MIRrDV4Yn2o+ZnW10Nkmr28xRpSpdJ6Sm42Hjf2+REYXm0A==",
+      "dependencies": {
+        "@typescript-eslint/types": "6.21.0",
+        "eslint-visitor-keys": "^3.4.1"
+      },
+      "engines": {
+        "node": "^16.0.0 || >=18.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/visitor-keys/node_modules/eslint-visitor-keys": {
+      "version": "3.4.3",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz",
+      "integrity": "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==",
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
    "node_modules/@ungap/structured-clone": {
      "version": "1.2.0",
      "resolved": "https://registry.npmjs.org/@ungap/structured-clone/-/structured-clone-1.2.0.tgz",
@@ -6500,30 +6759,31 @@
      }
    },
    "node_modules/algoliasearch": {
-      "version": "4.22.1",
-      "resolved": "https://registry.npmjs.org/algoliasearch/-/algoliasearch-4.22.1.tgz",
-      "integrity": "sha512-jwydKFQJKIx9kIZ8Jm44SdpigFwRGPESaxZBaHSV0XWN2yBJAOT4mT7ppvlrpA4UGzz92pqFnVKr/kaZXrcreg==",
+      "version": "4.23.3",
+      "resolved": "https://registry.npmjs.org/algoliasearch/-/algoliasearch-4.23.3.tgz",
+      "integrity": "sha512-Le/3YgNvjW9zxIQMRhUHuhiUjAlKY/zsdZpfq4dlLqg6mEm0nL6yk+7f2hDOtLpxsgE4jSzDmvHL7nXdBp5feg==",
      "dependencies": {
-        "@algolia/cache-browser-local-storage": "4.22.1",
-        "@algolia/cache-common": "4.22.1",
-        "@algolia/cache-in-memory": "4.22.1",
-        "@algolia/client-account": "4.22.1",
-        "@algolia/client-analytics": "4.22.1",
-        "@algolia/client-common": "4.22.1",
-        "@algolia/client-personalization": "4.22.1",
-        "@algolia/client-search": "4.22.1",
-        "@algolia/logger-common": "4.22.1",
-        "@algolia/logger-console": "4.22.1",
-        "@algolia/requester-browser-xhr": "4.22.1",
-        "@algolia/requester-common": "4.22.1",
-        "@algolia/requester-node-http": "4.22.1",
-        "@algolia/transporter": "4.22.1"
+        "@algolia/cache-browser-local-storage": "4.23.3",
+        "@algolia/cache-common": "4.23.3",
+        "@algolia/cache-in-memory": "4.23.3",
+        "@algolia/client-account": "4.23.3",
+        "@algolia/client-analytics": "4.23.3",
+        "@algolia/client-common": "4.23.3",
+        "@algolia/client-personalization": "4.23.3",
+        "@algolia/client-search": "4.23.3",
+        "@algolia/logger-common": "4.23.3",
+        "@algolia/logger-console": "4.23.3",
+        "@algolia/recommend": "4.23.3",
+        "@algolia/requester-browser-xhr": "4.23.3",
+        "@algolia/requester-common": "4.23.3",
+        "@algolia/requester-node-http": "4.23.3",
+        "@algolia/transporter": "4.23.3"
      }
    },
    "node_modules/algoliasearch-helper": {
-      "version": "3.16.3",
-      "resolved": "https://registry.npmjs.org/algoliasearch-helper/-/algoliasearch-helper-3.16.3.tgz",
-      "integrity": "sha512-1OuJT6sONAa9PxcOmWo5WCAT3jQSpCR9/m5Azujja7nhUQwAUDvaaAYrcmUySsrvHh74usZHbE3jFfGnWtZj8w==",
+      "version": "3.17.0",
+      "resolved": "https://registry.npmjs.org/algoliasearch-helper/-/algoliasearch-helper-3.17.0.tgz",
+      "integrity": "sha512-R5422OiQjvjlK3VdpNQ/Qk7KsTIGeM5ACm8civGifOVWdRRV/3SgXuKmeNxe94Dz6fwj/IgpVmXbHutU4mHubg==",
      "dependencies": {
        "@algolia/events": "^4.0.1"
      },
@@ -6838,9 +7098,9 @@
      }
    },
    "node_modules/autoprefixer": {
-      "version": "10.4.16",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.16.tgz",
-      "integrity": "sha512-7vd3UC6xKp0HLfua5IjZlcXvGAGy7cBAXTg2lyQ/8WpNhd6SiZ8Be+xm3FyBSYJx5GKcpRCzBh7RH4/0dnY+uQ==",
+      "version": "10.4.19",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.19.tgz",
+      "integrity": "sha512-BaENR2+zBZ8xXhM4pUaKUxlVdxZ0EZhjvbopwnXmxRUfqDmwSpC2lAi/QXvx7NRdPCo1WKEcEF6mV64si1z4Ew==",
      "funding": [
        {
          "type": "opencollective",
@@ -6856,9 +7116,9 @@
        }
      ],
      "dependencies": {
-        "browserslist": "^4.21.10",
-        "caniuse-lite": "^1.0.30001538",
-        "fraction.js": "^4.3.6",
+        "browserslist": "^4.23.0",
+        "caniuse-lite": "^1.0.30001599",
+        "fraction.js": "^4.3.7",
        "normalize-range": "^0.1.2",
        "picocolors": "^1.0.0",
        "postcss-value-parser": "^4.2.0"
@@ -7022,9 +7282,9 @@
      }
    },
    "node_modules/babel-plugin-formatjs": {
-      "version": "10.5.13",
-      "resolved": "https://registry.npmjs.org/babel-plugin-formatjs/-/babel-plugin-formatjs-10.5.13.tgz",
-      "integrity": "sha512-0dtMhoa6q0P5lUHBphLd8/y+CRlh5IG3Rq+Wk64kOEDwUVZF8xq1qMSjC3iw1wH4tmP2qTzBL+Bz1xEjyBd/ew==",
+      "version": "10.5.14",
+      "resolved": "https://registry.npmjs.org/babel-plugin-formatjs/-/babel-plugin-formatjs-10.5.14.tgz",
+      "integrity": "sha512-F++4Txa2bxrjbvspLxIXBDwcbKOftUvGgBDlz0hGe/fp7eXSPBJcu49xWj0/5VyMgSad4gKmBzWE5bfC27x19Q==",
      "dependencies": {
        "@babel/core": "^7.10.4",
        "@babel/helper-plugin-utils": "^7.10.4",
@@ -7413,9 +7673,9 @@
      "integrity": "sha512-9o5UecI3GhkpM6DrXr69PblIuWxPKk9Y0jHBRhdocZ2y7YECBFCsHm79Pr3OyR2AvjhDkabFJaDJMYRazHgsow=="
    },
    "node_modules/browserslist": {
-      "version": "4.22.2",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.22.2.tgz",
-      "integrity": "sha512-0UgcrvQmBDvZHFGdYUehrCNIazki7/lUP3kkoi/r3YB2amZbFM9J43ZRkJTXBUZK4gmx56+Sqk9+Vs9mwZx9+A==",
+      "version": "4.23.0",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.23.0.tgz",
+      "integrity": "sha512-QW8HiM1shhT2GuzkvklfjcKDiWFXHOeFCIA/huJPwHsslwcydgk7X+z2zXpEijP98UCY7HbubZt5J2Zgvf0CaQ==",
      "funding": [
        {
          "type": "opencollective",
@@ -7431,8 +7691,8 @@
        }
      ],
      "dependencies": {
-        "caniuse-lite": "^1.0.30001565",
-        "electron-to-chromium": "^1.4.601",
+        "caniuse-lite": "^1.0.30001587",
+        "electron-to-chromium": "^1.4.668",
        "node-releases": "^2.0.14",
        "update-browserslist-db": "^1.0.13"
      },
@@ -7564,9 +7824,9 @@
      }
    },
    "node_modules/caniuse-lite": {
-      "version": "1.0.30001579",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001579.tgz",
-      "integrity": "sha512-u5AUVkixruKHJjw/pj9wISlcMpgFWzSrczLZbrqBSxukQixmg0SJ5sZTpvaFvxU0HoQKd4yoyAogyrAz9pzJnA==",
+      "version": "1.0.30001608",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001608.tgz",
+      "integrity": "sha512-cjUJTQkk9fQlJR2s4HMuPMvTiRggl0rAVMtthQuyOlDWuqHXqN8azLq+pi8B2TjwKJ32diHjUqRIKeFX4z1FoA==",
      "funding": [
        {
          "type": "opencollective",
@@ -9015,9 +9275,9 @@
      "integrity": "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow=="
    },
    "node_modules/electron-to-chromium": {
-      "version": "1.4.643",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.643.tgz",
-      "integrity": "sha512-QHscvvS7gt155PtoRC0dR2ilhL8E9LHhfTQEq1uD5AL0524rBLAwpAREFH06f87/e45B9XkR6Ki5dbhbCsVEIg=="
+      "version": "1.4.733",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.733.tgz",
+      "integrity": "sha512-gUI9nhI2iBGF0OaYYLKOaOtliFMl+Bt1rY7VmEjwxOxqoYLub/D9xmduPEhbw2imE6gYkJKhIE5it+KE2ulVxQ=="
    },
    "node_modules/email-prop-type": {
      "version": "3.0.1",
@@ -9427,6 +9687,59 @@
        "ms": "^2.1.1"
      }
    },
+    "node_modules/eslint-plugin-formatjs": {
+      "version": "4.13.0",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-formatjs/-/eslint-plugin-formatjs-4.13.0.tgz",
+      "integrity": "sha512-sxgHQNyVclNRO7aydGwxohwxYR03/oRDW0uUXFWayNMPTlnb9sET3LCovBjvQF7qAHDGFDcLwg4ECSyui4nG8A==",
+      "dependencies": {
+        "@formatjs/icu-messageformat-parser": "2.7.6",
+        "@formatjs/ts-transformer": "3.13.12",
+        "@types/eslint": "7 || 8",
+        "@types/picomatch": "^2.3.0",
+        "@typescript-eslint/utils": "^6.18.1",
+        "emoji-regex": "^10.2.1",
+        "magic-string": "^0.30.0",
+        "picomatch": "^2.3.1",
+        "tslib": "2.6.2",
+        "typescript": "5",
+        "unicode-emoji-utils": "^1.2.0"
+      },
+      "peerDependencies": {
+        "eslint": "7 || 8"
+      }
+    },
+    "node_modules/eslint-plugin-formatjs/node_modules/@formatjs/ts-transformer": {
+      "version": "3.13.12",
+      "resolved": "https://registry.npmjs.org/@formatjs/ts-transformer/-/ts-transformer-3.13.12.tgz",
+      "integrity": "sha512-uf1+DgbsCrzHAg7uIf0QlzpIkHYxRSRig5iJa9FaoUNIDZzNEE2oW/uLLLq7I9Z2FLIPhbmgq8hbW40FoQv+Fg==",
+      "dependencies": {
+        "@formatjs/icu-messageformat-parser": "2.7.6",
+        "@types/json-stable-stringify": "^1.0.32",
+        "@types/node": "14 || 16 || 17",
+        "chalk": "^4.0.0",
+        "json-stable-stringify": "^1.0.1",
+        "tslib": "^2.4.0",
+        "typescript": "5"
+      },
+      "peerDependencies": {
+        "ts-jest": ">=27"
+      },
+      "peerDependenciesMeta": {
+        "ts-jest": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/eslint-plugin-formatjs/node_modules/@types/node": {
+      "version": "17.0.45",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-17.0.45.tgz",
+      "integrity": "sha512-w+tIMs3rq2afQdsPJlODhoUEKzFP1ayaoyl1CcnwtIlsVe7K7bA1NGm4s3PraqTLlXnbIN84zuBlxBWo1u9BLw=="
+    },
+    "node_modules/eslint-plugin-formatjs/node_modules/emoji-regex": {
+      "version": "10.3.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.3.0.tgz",
+      "integrity": "sha512-QpLs9D9v9kArv4lfDEgg1X/gN5XLnf/A6l9cs8SPZLRZR3ZkY9+kwIQTxm+fsSej5UMYGE8fdoaZVIBlqG0XTw=="
+    },
    "node_modules/eslint-plugin-import": {
      "version": "2.29.1",
      "resolved": "https://registry.npmjs.org/eslint-plugin-import/-/eslint-plugin-import-2.29.1.tgz",
@@ -15628,6 +15941,17 @@
        "lz-string": "bin/bin.js"
      }
    },
+    "node_modules/magic-string": {
+      "version": "0.30.9",
+      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.9.tgz",
+      "integrity": "sha512-S1+hd+dIrC8EZqKyT9DstTH/0Z+f76kmmvZnkfQVmOpDEF9iVgdYif3Q/pIWHmCoo59bQVGW0kVL3e2nl+9+Sw==",
+      "dependencies": {
+        "@jridgewell/sourcemap-codec": "^1.4.15"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
    "node_modules/mailto-link": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/mailto-link/-/mailto-link-2.0.0.tgz",
@@ -16917,9 +17241,9 @@
      }
    },
    "node_modules/postcss": {
-      "version": "8.4.33",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.33.tgz",
-      "integrity": "sha512-Kkpbhhdjw2qQs2O2DGX+8m5OVqEcbB9HRBvuYM9pgrjEFUg30A9LmXNlTAUj4S9kgtGyrMbTzVjH7E+s5Re2yg==",
+      "version": "8.4.38",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.38.tgz",
+      "integrity": "sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A==",
      "funding": [
        {
          "type": "opencollective",
@@ -16937,7 +17261,7 @@
      "dependencies": {
        "nanoid": "^3.3.7",
        "picocolors": "^1.0.0",
-        "source-map-js": "^1.0.2"
+        "source-map-js": "^1.2.0"
      },
      "engines": {
        "node": "^10 || ^12 || >=14"
@@ -16991,9 +17315,9 @@
      }
    },
    "node_modules/postcss-custom-media": {
-      "version": "10.0.2",
-      "resolved": "https://registry.npmjs.org/postcss-custom-media/-/postcss-custom-media-10.0.2.tgz",
-      "integrity": "sha512-zcEFNRmDm2fZvTPdI1pIW3W//UruMcLosmMiCdpQnrCsTRzWlKQPYMa1ud9auL0BmrryKK1+JjIGn19K0UjO/w==",
+      "version": "10.0.4",
+      "resolved": "https://registry.npmjs.org/postcss-custom-media/-/postcss-custom-media-10.0.4.tgz",
+      "integrity": "sha512-Ubs7O3wj2prghaKRa68VHBvuy3KnTQ0zbGwqDYY1mntxJD0QL2AeiAy+AMfl3HBedTCVr2IcFNktwty9YpSskA==",
      "funding": [
        {
          "type": "github",
@@ -17005,10 +17329,10 @@
        }
      ],
      "dependencies": {
-        "@csstools/cascade-layer-name-parser": "^1.0.5",
-        "@csstools/css-parser-algorithms": "^2.3.2",
-        "@csstools/css-tokenizer": "^2.2.1",
-        "@csstools/media-query-list-parser": "^2.1.5"
+        "@csstools/cascade-layer-name-parser": "^1.0.9",
+        "@csstools/css-parser-algorithms": "^2.6.1",
+        "@csstools/css-tokenizer": "^2.2.4",
+        "@csstools/media-query-list-parser": "^2.1.9"
      },
      "engines": {
        "node": "^14 || ^16 || >=18"
@@ -18118,13 +18442,13 @@
      }
    },
    "node_modules/react-intl": {
-      "version": "6.6.2",
-      "resolved": "https://registry.npmjs.org/react-intl/-/react-intl-6.6.2.tgz",
-      "integrity": "sha512-IpW2IkLtGENSFlX3vfH11rjuCIsW0VyjT0Q1pPKMZPtT2z1FxLt4weFT5Ezti2TScT1xiyb3aQBFth9EB7jzAg==",
+      "version": "6.6.3",
+      "resolved": "https://registry.npmjs.org/react-intl/-/react-intl-6.6.3.tgz",
+      "integrity": "sha512-vLKI0f+Q3pXD5szmCUPikTY7CJDPtxCBMG5YABQZ3IGEKzNB47zlvXyasUFfT25zpgQXeOfhRCdx4q6ubuR6bA==",
      "dependencies": {
        "@formatjs/ecma402-abstract": "1.18.2",
        "@formatjs/icu-messageformat-parser": "2.7.6",
-        "@formatjs/intl": "2.10.0",
+        "@formatjs/intl": "2.10.1",
        "@formatjs/intl-displaynames": "6.6.6",
        "@formatjs/intl-listformat": "7.5.5",
        "@types/hoist-non-react-statics": "^3.3.1",
@@ -20042,9 +20366,9 @@
      }
    },
    "node_modules/source-map-js": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz",
-      "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==",
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz",
+      "integrity": "sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==",
      "engines": {
        "node": ">=0.10.0"
      }
@@ -20980,6 +21304,17 @@
        "node": ">=8"
      }
    },
+    "node_modules/ts-api-utils": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-1.3.0.tgz",
+      "integrity": "sha512-UQMIo7pb8WRomKR1/+MFVLTroIvDVtMX3K6OUir8ynLyzB8Jeriont2bTAtmNPa1ekAgN7YPDyf6V+ygrdU+eQ==",
+      "engines": {
+        "node": ">=16"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.2.0"
+      }
+    },
    "node_modules/tsconfig-paths": {
      "version": "3.15.0",
      "resolved": "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-3.15.0.tgz",
@@ -21211,6 +21546,19 @@
        "node": ">=4"
      }
    },
+    "node_modules/unicode-emoji-utils": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/unicode-emoji-utils/-/unicode-emoji-utils-1.2.0.tgz",
+      "integrity": "sha512-djUB91p/6oYpgps4W5K/MAvM+UspoAANHSUW495BrxeLRoned3iNPEDQgrKx9LbLq93VhNz0NWvI61vcfrwYoA==",
+      "dependencies": {
+        "emoji-regex": "10.3.0"
+      }
+    },
+    "node_modules/unicode-emoji-utils/node_modules/emoji-regex": {
+      "version": "10.3.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.3.0.tgz",
+      "integrity": "sha512-QpLs9D9v9kArv4lfDEgg1X/gN5XLnf/A6l9cs8SPZLRZR3ZkY9+kwIQTxm+fsSej5UMYGE8fdoaZVIBlqG0XTw=="
+    },
    "node_modules/unicode-match-property-ecmascript": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/unicode-match-property-ecmascript/-/unicode-match-property-ecmascript-2.0.0.tgz",
--- a/package.json
+++ b/package.json
@@ -33,11 +33,11 @@
  },
  "dependencies": {
    "@edx/brand": "npm:@openedx/brand-openedx@^1.2.2",
-    "@edx/frontend-platform": "7.1.2",
+    "@edx/frontend-platform": "7.1.3",
    "@edx/openedx-atlas": "^0.6.0",
-    "@fortawesome/fontawesome-svg-core": "6.5.1",
-    "@fortawesome/free-brands-svg-icons": "6.5.1",
-    "@fortawesome/free-solid-svg-icons": "6.5.1",
+    "@fortawesome/fontawesome-svg-core": "6.5.2",
+    "@fortawesome/free-brands-svg-icons": "6.5.2",
+    "@fortawesome/free-solid-svg-icons": "6.5.2",
    "@fortawesome/react-fontawesome": "0.2.0",
    "@openedx/paragon": "^22.1.1",
    "@optimizely/react-sdk": "^2.9.1",
@@ -73,8 +73,8 @@
  "devDependencies": {
    "@edx/browserslist-config": "^1.1.1",
    "@edx/reactifex": "1.1.0",
-    "@openedx/frontend-build": "13.0.28",
-    "babel-plugin-formatjs": "10.5.13",
+    "@openedx/frontend-build": "13.1.4",
+    "babel-plugin-formatjs": "10.5.14",
    "eslint-plugin-import": "2.29.1",
    "glob": "7.2.3",
    "history": "5.3.0",
--- a/src/common-components/ThirdPartyAuth.jsx
+++ b/src/common-components/ThirdPartyAuth.jsx
@@ -37,6 +37,7 @@ const ThirdPartyAuth = (props) => {
  const isSocialAuthActive = !!providers.length && !currentProvider;
  const isEnterpriseLoginDisabled = getConfig().DISABLE_ENTERPRISE_LOGIN;
  const enterpriseLoginURL = getConfig().LMS_BASE_URL + ENTERPRISE_LOGIN_URL;
+  const isThirdPartyAuthActive = isSocialAuthActive || (isEnterpriseLoginDisabled && isInstitutionAuthActive);

  return (
    <>
@@ -61,7 +62,7 @@ const ThirdPartyAuth = (props) => {
        </Hyperlink>
      )}

-      {thirdPartyAuthApiStatus === PENDING_STATE ? (
+      {thirdPartyAuthApiStatus === PENDING_STATE && isThirdPartyAuthActive ? (
        <div className="mt-4">
          <Skeleton className="tpa-skeleton" height={36} count={2} />
        </div>
--- a/src/config/index.js
+++ b/src/config/index.js
@@ -4,6 +4,7 @@ const configuration = {
  USER_RETENTION_COOKIE_NAME: process.env.USER_RETENTION_COOKIE_NAME || '',
  // Features
  DISABLE_ENTERPRISE_LOGIN: process.env.DISABLE_ENTERPRISE_LOGIN || '',
+  ENABLE_AUTO_GENERATED_USERNAME: process.env.ENABLE_AUTO_GENERATED_USERNAME || false,
  ENABLE_DYNAMIC_REGISTRATION_FIELDS: process.env.ENABLE_DYNAMIC_REGISTRATION_FIELDS || false,
  ENABLE_PROGRESSIVE_PROFILING_ON_AUTHN: process.env.ENABLE_PROGRESSIVE_PROFILING_ON_AUTHN || false,
  ENABLE_POST_REGISTRATION_RECOMMENDATIONS: process.env.ENABLE_POST_REGISTRATION_RECOMMENDATIONS || false,
--- a/src/register/RegistrationFields/CountryField/CountryField.jsx
+++ b/src/register/RegistrationFields/CountryField/CountryField.jsx
@@ -97,7 +97,7 @@ const CountryField = (props) => {
  };

  const getCountryList = () => countryList.map((country) => (
-    <FormAutosuggestOption key={country[COUNTRY_CODE_KEY]} id={country[COUNTRY_CODE_KEY]}>
+    <FormAutosuggestOption key={country[COUNTRY_DISPLAY_KEY]} id={country[COUNTRY_CODE_KEY]}>
      {country[COUNTRY_DISPLAY_KEY]}
    </FormAutosuggestOption>
  ));
--- a/src/register/RegistrationFields/UsernameField/UsernameField.jsx
+++ b/src/register/RegistrationFields/UsernameField/UsernameField.jsx
@@ -101,7 +101,7 @@ const UsernameField = (props) => {
  };

  const suggestedUsernames = () => (
-    <div className={className}>
+    <div className={className} role="listbox">
      <span className="text-gray username-suggestion--label">{formatMessage(messages['registration.username.suggestion.label'])}</span>
      <div className="username-scroll-suggested--form-field">
        {usernameSuggestions.map((username, index) => (
@@ -112,7 +112,9 @@ const UsernameField = (props) => {
            className="username-suggestions--chip data-hj-suppress"
            autoComplete={props.autoComplete}
            key={`suggestion-${index.toString()}`}
+            tabIndex={0}
            onClick={(e) => handleSuggestionClick(e, username)}
+            role="option"
          >
            {username}
          </Button>
@@ -123,7 +125,7 @@ const UsernameField = (props) => {
  );

  if (usernameSuggestions.length > 0 && errorMessage && value === ' ') {
-    className = 'username-suggestions__error';
+    className = 'username-suggestions';
    iconButton = <IconButton src={Close} iconAs={Icon} alt="Close" onClick={() => handleUsernameSuggestionClose()} variant="black" size="sm" className="username-suggestions__close__button" />;
    suggestedUsernameDiv = suggestedUsernames();
  } else if (usernameSuggestions.length > 0 && value === ' ') {
@@ -134,14 +136,15 @@ const UsernameField = (props) => {
    suggestedUsernameDiv = suggestedUsernames();
  }
  return (
-    <FormGroup
-      {...props}
-      handleChange={handleOnChange}
-      handleFocus={handleOnFocus}
-      handleBlur={handleOnBlur}
-    >
+    <div className="username__form-group-wrapper">
      {suggestedUsernameDiv}
-    </FormGroup>
+      <FormGroup
+        {...props}
+        handleChange={handleOnChange}
+        handleFocus={handleOnFocus}
+        handleBlur={handleOnBlur}
+      />
+    </div>
  );
 };

--- a/src/register/RegistrationPage.jsx
+++ b/src/register/RegistrationPage.jsx
@@ -60,6 +60,7 @@ const RegistrationPage = (props) => {
    showConfigurableEdxFields: getConfig().SHOW_CONFIGURABLE_EDX_FIELDS,
    showConfigurableRegistrationFields: getConfig().ENABLE_DYNAMIC_REGISTRATION_FIELDS,
    showMarketingEmailOptInCheckbox: getConfig().MARKETING_EMAILS_OPT_IN,
+    autoGeneratedUsernameEnabled: getConfig().ENABLE_AUTO_GENERATED_USERNAME,
  };
  const {
    handleInstitutionLogin,
@@ -215,6 +216,9 @@ const RegistrationPage = (props) => {
      delete payload.password;
      payload.social_auth_provider = currentProvider;
    }
+    if (flags.autoGeneratedUsernameEnabled) {
+      delete payload.username;
+    }

    // Validating form data before submitting
    const { isValid, fieldErrors, emailSuggestion } = isFormValid(
@@ -324,16 +328,18 @@ const RegistrationPage = (props) => {
                helpText={[formatMessage(messages['help.text.email'])]}
                floatingLabel={formatMessage(messages['registration.email.label'])}
              />
-              <UsernameField
-                name="username"
-                spellCheck="false"
-                value={formFields.username}
-                handleChange={handleOnChange}
-                handleErrorChange={handleErrorChange}
-                errorMessage={errors.username}
-                helpText={[formatMessage(messages['help.text.username.1']), formatMessage(messages['help.text.username.2'])]}
-                floatingLabel={formatMessage(messages['registration.username.label'])}
-              />
+              {!flags.autoGeneratedUsernameEnabled && (
+                <UsernameField
+                  name="username"
+                  spellCheck="false"
+                  value={formFields.username}
+                  handleChange={handleOnChange}
+                  handleErrorChange={handleErrorChange}
+                  errorMessage={errors.username}
+                  helpText={[formatMessage(messages['help.text.username.1']), formatMessage(messages['help.text.username.2'])]}
+                  floatingLabel={formatMessage(messages['registration.username.label'])}
+                />
+              )}
              {!currentProvider && (
                <PasswordField
                  name="password"
--- a/src/register/RegistrationPage.test.jsx
+++ b/src/register/RegistrationPage.test.jsx
@@ -134,9 +134,16 @@ describe('RegistrationPage', () => {
    jest.clearAllMocks();
  });

-  const populateRequiredFields = (getByLabelText, payload, isThirdPartyAuth = false) => {
+  const populateRequiredFields = (
+    getByLabelText,
+    payload,
+    isThirdPartyAuth = false,
+    autoGeneratedUsernameEnabled = false,
+  ) => {
    fireEvent.change(getByLabelText('Full name'), { target: { value: payload.name, name: 'name' } });
-    fireEvent.change(getByLabelText('Public username'), { target: { value: payload.username, name: 'username' } });
+    if (!autoGeneratedUsernameEnabled) {
+      fireEvent.change(getByLabelText('Public username'), { target: { value: payload.username, name: 'username' } });
+    }
    fireEvent.change(getByLabelText('Email'), { target: { value: payload.email, name: 'email' } });

    fireEvent.change(getByLabelText('Country/Region'), { target: { value: payload.country, name: 'country' } });
@@ -299,6 +306,44 @@ describe('RegistrationPage', () => {
      });
    });

+    it('should submit form without UsernameField when autoGeneratedUsernameEnabled is true', () => {
+      mergeConfig({
+        ENABLE_AUTO_GENERATED_USERNAME: true,
+      });
+      jest.spyOn(global.Date, 'now').mockImplementation(() => 0);
+      const payload = {
+        name: 'John Doe',
+        email: 'john.doe@gmail.com',
+        password: 'password1',
+        country: 'Pakistan',
+        honor_code: true,
+        totalRegistrationTime: 0,
+      };
+
+      store.dispatch = jest.fn(store.dispatch);
+      const { getByLabelText, container } = render(routerWrapper(reduxWrapper(<IntlRegistrationPage {...props} />)));
+      populateRequiredFields(getByLabelText, payload, false, true);
+      const button = container.querySelector('button.btn-brand');
+      fireEvent.click(button);
+      expect(store.dispatch).toHaveBeenCalledWith(registerNewUser({ ...payload, country: 'PK' }));
+      mergeConfig({
+        ENABLE_AUTO_GENERATED_USERNAME: false,
+      });
+    });
+
+    it('should not display UsernameField when ENABLE_AUTO_GENERATED_USERNAME is true', () => {
+      mergeConfig({
+        ENABLE_AUTO_GENERATED_USERNAME: true,
+      });
+
+      const { queryByLabelText } = render(routerWrapper(reduxWrapper(<IntlRegistrationPage {...props} />)));
+      expect(queryByLabelText('Username')).toBeNull();
+
+      mergeConfig({
+        ENABLE_AUTO_GENERATED_USERNAME: false,
+      });
+    });
+
    it('should not dispatch registerNewUser on empty form Submission', () => {
      store.dispatch = jest.fn(store.dispatch);

--- a/src/register/components/ConfigurableRegistrationForm.jsx
+++ b/src/register/components/ConfigurableRegistrationForm.jsx
@@ -33,7 +33,11 @@ const ConfigurableRegistrationForm = (props) => {
    autoSubmitRegistrationForm,
  } = props;

-  const countryList = useMemo(() => getCountryList(getLocale()), []);
+  /** The reason for adding the entry 'United States' is that Chrome browser aut-fill the form with the 'Unites
+  States' instead of 'United States of America' which does not exist in country dropdown list and gets the user
+  confused and unable to create an account. So we added the United States entry in the dropdown list.
+ */
+  const countryList = useMemo(() => getCountryList(getLocale()).concat([{ code: 'US', name: 'United States' }]), []);

  let showTermsOfServiceAndHonorCode = false;
  let showCountryField = false;
--- a/src/register/data/sagas.js
+++ b/src/register/data/sagas.js
@@ -1,11 +1,14 @@
 import { camelCaseObject } from '@edx/frontend-platform';
 import { logError, logInfo } from '@edx/frontend-platform/logging';
-import { call, put, takeEvery } from 'redux-saga/effects';
+import {
+  call, put, race, take, takeEvery,
+} from 'redux-saga/effects';

 import {
  fetchRealtimeValidationsBegin,
  fetchRealtimeValidationsFailure,
  fetchRealtimeValidationsSuccess,
+  REGISTER_CLEAR_USERNAME_SUGGESTIONS,
  REGISTER_FORM_VALIDATIONS,
  REGISTER_NEW_USER,
  registerNewUserBegin,
@@ -41,9 +44,15 @@ export function* handleNewUserRegistration(action) {
 export function* fetchRealtimeValidations(action) {
  try {
    yield put(fetchRealtimeValidationsBegin());
-    const { fieldValidations } = yield call(getFieldsValidations, action.payload.formPayload);

-    yield put(fetchRealtimeValidationsSuccess(camelCaseObject(fieldValidations)));
+    const { response } = yield race({
+      response: call(getFieldsValidations, action.payload.formPayload),
+      cancel: take(REGISTER_CLEAR_USERNAME_SUGGESTIONS),
+    });
+
+    if (response) {
+      yield put(fetchRealtimeValidationsSuccess(camelCaseObject(response.fieldValidations)));
+    }
  } catch (e) {
    if (e.response && e.response.status === 403) {
      yield put(fetchRealtimeValidationsFailure());
--- a/src/sass/_registration.scss
+++ b/src/sass/_registration.scss
@@ -65,10 +65,15 @@
  margin-right: 0.25rem;
 }

-.username-suggestions {
+.username__form-group-wrapper {
  position: relative;
-  margin-top: -2.5rem;
-  margin-left: 15px;
+}
+
+.username-suggestions {
+  position: absolute;
+  inset: 0;
+  padding-left: 15px;
+  z-index: 100;
 }

 .username-suggestions__close__button {
@@ -76,13 +81,6 @@
  position: absolute;
 }

-.username-suggestions__error {
-  position: relative;
-  margin-top: -13.7%;
-  margin-bottom: 11%;
-  margin-left: 15px;
-}
-
 .username-scroll-suggested--form-field {
  width: 20rem;
  white-space: nowrap;
Author	SHA1	Message	Date
Kyr	116830d2c9	fix: username suggestions alignment (#1279 ) Co-authored-by: Kyrylo Hudym-Levkovych <kyr.hudym@kyrs-MacBook-Pro.local>	2025-08-08 16:55:59 +05:00
Blue	8efb22595c	fix: add new entry for another US label (#1244 ) Add new entry for for another US label which is United States	2024-05-03 10:27:32 +05:00
Syed Sajjad Hussain Shah	73e8913f90	feat: remove username from the registration from (#1201 ) (#1241 ) Co-authored-by: Attiya Ishaque <atiya.ishaq@arbisoft.com>	2024-05-02 08:55:56 +05:00
Stanislav Lunyachek	3ddaf795f2	feat: Hide preloaders for third party auth providers if they are disabled	2024-04-19 10:55:48 +05:00
renovate[bot]	a18df02d37	fix(deps): update dependency algoliasearch-helper to v3.17.0	2024-04-11 09:20:07 +00:00
renovate[bot]	5a3cd93a09	fix(deps): update dependency algoliasearch to v4.23.3	2024-04-11 06:45:25 +00:00
renovate[bot]	d989eba0e1	fix(deps): update dependency @openedx/paragon to v22.2.1	2024-04-11 04:10:33 +00:00
renovate[bot]	00f8ee9c85	chore(deps): update dependency @openedx/frontend-build to v13.1.4	2024-04-11 01:50:57 +00:00
renovate[bot]	01b14d6d30	fix(deps): update font awesome to v6.5.2	2024-04-10 21:29:13 +00:00
renovate[bot]	35dbca7bd1	fix(deps): update dependency @edx/frontend-platform to v7.1.3	2024-04-10 19:15:33 +00:00
renovate[bot]	73579ec53d	chore(deps): update dependency babel-plugin-formatjs to v10.5.14	2024-04-10 17:38:23 +00:00