fix: handle site lang with region subtags in text track sorting (#1163)

Co-authored-by: Maham Akif <maham.akif@A006-00821.local>
openedx · Aug 21, 2024 · 94a1676 · 94a1676
1 parent 9e9ef9b
commit 94a1676
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 3 deletions.
diff --git a/src/components/video/data/tests/hooks.test.js b/src/components/video/data/tests/hooks.test.js
@@ -30,7 +30,11 @@ describe('useTranscripts', () => {
     const textTracks = { en: 'https://example.com/transcript-en.txt' };
     fetchAndAddTranscripts.mockResolvedValueOnce(textTracks);
 
-    const { result, waitForNextUpdate } = renderHook(() => useTranscripts({ player: mockPlayer, customOptions }));
+    const { result, waitForNextUpdate } = renderHook(() => useTranscripts({
+      player: mockPlayer,
+      customOptions,
+      siteLanguage: 'en',
+    }));
 
     await waitForNextUpdate();
 

diff --git a/src/components/video/data/utils.js b/src/components/video/data/utils.js
@@ -28,9 +28,13 @@ export const createWebVttFile = (webVttContent) => {
 };
 
 export const sortTextTracks = (tracks, siteLanguage) => {
+  // Some language codes returned by getLocale include a hyphen, which may not match the codes in the text tracks.
+  // To ensure proper matching, the hyphen is removed from the site language code if present.
+  const preferredLanguage = siteLanguage?.includes('-') ? siteLanguage.split('-')[0].toLowerCase() : siteLanguage.toLowerCase();
+
   const sortedKeys = Object.keys(tracks).sort((a, b) => {
-    if (a === siteLanguage) { return -1; }
-    if (b === siteLanguage) { return 1; }
+    if (a === preferredLanguage) { return -1; }
+    if (b === preferredLanguage) { return 1; }
     return a.localeCompare(b);
   });