From b2b03f83f2a6cd8e87cabf9896211c3673c0ac58 Mon Sep 17 00:00:00 2001
From: Shubham Oulkar <oulkarshubhu@gmail.com>
Date: Tue, 3 Mar 2026 12:37:47 +0530
Subject: [PATCH 1/3] fix(ui-components): implement hrefLang in language
 selector for better a11y

---
 packages/ui-components/src/Common/LanguageDropDown/index.tsx | 5 +++--
 packages/ui-components/src/types.ts                          | 1 +
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/packages/ui-components/src/Common/LanguageDropDown/index.tsx b/packages/ui-components/src/Common/LanguageDropDown/index.tsx
index 7f3ced3f2f8d3..88759bfe135bf 100644
--- a/packages/ui-components/src/Common/LanguageDropDown/index.tsx
+++ b/packages/ui-components/src/Common/LanguageDropDown/index.tsx
@@ -35,10 +35,11 @@ const LanguageDropdown: FC<LanguageDropDownProps> = ({
           sideOffset={5}
         >
           <div>
-            {availableLanguages.map(({ name, code, localName }) => (
+            {availableLanguages.map(({ name, code, localName, hrefLang }) => (
               <DropdownMenu.Item
                 key={code}
-                onClick={() => onChange({ name, code, localName })}
+                lang={hrefLang}
+                onClick={() => onChange({ name, code, localName, hrefLang })}
                 className={classNames(styles.dropDownItem, {
                   [styles.currentDropDown]: code === currentLanguage,
                 })}
diff --git a/packages/ui-components/src/types.ts b/packages/ui-components/src/types.ts
index 86088827f76e8..8d221532f9c8e 100644
--- a/packages/ui-components/src/types.ts
+++ b/packages/ui-components/src/types.ts
@@ -22,4 +22,5 @@ export type SimpleLocaleConfig = {
   code: string;
   localName: string;
   name: string;
+  hrefLang: string;
 };

From 5728559a689a3948c471e8c9621811633b446488 Mon Sep 17 00:00:00 2001
From: Shubham Oulkar <oulkarshubhu@gmail.com>
Date: Tue, 3 Mar 2026 12:41:52 +0530
Subject: [PATCH 2/3] test(ui-components): update language selector stories
 with localized examples

---
 .../Common/LanguageDropDown/index.stories.tsx | 26 ++++++++++++++++---
 1 file changed, 23 insertions(+), 3 deletions(-)

diff --git a/packages/ui-components/src/Common/LanguageDropDown/index.stories.tsx b/packages/ui-components/src/Common/LanguageDropDown/index.stories.tsx
index c9ceb9b82ae52..eaceb30eb01cd 100644
--- a/packages/ui-components/src/Common/LanguageDropDown/index.stories.tsx
+++ b/packages/ui-components/src/Common/LanguageDropDown/index.stories.tsx
@@ -8,12 +8,32 @@ type Meta = MetaObj<typeof LanguageDropDown>;
 export const Default: Story = {
   args: {
     availableLanguages: [
-      { name: 'English', code: 'en', localName: 'English' },
-      { name: 'French', code: 'fr', localName: 'Français' },
-      { name: 'Spanish', code: 'es', localName: 'Español' },
+      { name: 'English', code: 'en', localName: 'English', hrefLang: 'en-GB' },
+      { name: 'French', code: 'fr', localName: 'Français', hrefLang: 'fr' },
+      { name: 'Spanish', code: 'es', localName: 'Español', hrefLang: 'es-ES' },
+      { name: 'Japanese', code: 'ja', localName: '日本語', hrefLang: 'ja' },
+      {
+        name: 'Simplified Chinese',
+        code: 'zh-cn',
+        localName: '简体中文',
+        hrefLang: 'zh-Hans',
+      },
+      {
+        name: 'Traditional Chinese',
+        code: 'zh-tw',
+        localName: '繁體中文',
+        hrefLang: 'zh-Hant',
+      },
     ],
     currentLanguage: 'en',
   },
 };
 
+export const Japanese: Story = {
+  args: {
+    ...Default.args,
+    currentLanguage: 'ja',
+  },
+};
+
 export default { component: LanguageDropDown } as Meta;

From a3c3f22de1caafe9e4cb1361643f072c8b125c48 Mon Sep 17 00:00:00 2001
From: Shubham Oulkar <oulkarshubhu@gmail.com>
Date: Wed, 4 Mar 2026 20:04:48 +0530
Subject: [PATCH 3/3] fix(ui-components): refine language dropdown a11y for
 cross-browser consistency

---
 .../ui-components/src/Common/LanguageDropDown/index.tsx     | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/packages/ui-components/src/Common/LanguageDropDown/index.tsx b/packages/ui-components/src/Common/LanguageDropDown/index.tsx
index 88759bfe135bf..3b7b15a6ad115 100644
--- a/packages/ui-components/src/Common/LanguageDropDown/index.tsx
+++ b/packages/ui-components/src/Common/LanguageDropDown/index.tsx
@@ -38,13 +38,15 @@ const LanguageDropdown: FC<LanguageDropDownProps> = ({
             {availableLanguages.map(({ name, code, localName, hrefLang }) => (
               <DropdownMenu.Item
                 key={code}
-                lang={hrefLang}
+                aria-label={name}
                 onClick={() => onChange({ name, code, localName, hrefLang })}
                 className={classNames(styles.dropDownItem, {
                   [styles.currentDropDown]: code === currentLanguage,
                 })}
               >
-                {localName}
+                <span lang={hrefLang} aria-hidden="true">
+                  {localName}
+                </span>
               </DropdownMenu.Item>
             ))}
           </div>