From 3dfca53c8301f643c94faa5d0f0e1f58cc18c791 Mon Sep 17 00:00:00 2001
From: Hafiz Mohsin Ayoob <41894237+mohsinayoob@users.noreply.github.com>
Date: Tue, 12 Nov 2024 03:54:02 +0500
Subject: [PATCH] fix: fixed undefined issue for unapproved translations
 (#2231)

---
 .../Navbar/SettingsDrawer/TranslationSection.tsx    | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

diff --git a/src/components/Navbar/SettingsDrawer/TranslationSection.tsx b/src/components/Navbar/SettingsDrawer/TranslationSection.tsx
index 69d0c84ee6..b5e57e40fe 100644
--- a/src/components/Navbar/SettingsDrawer/TranslationSection.tsx
+++ b/src/components/Navbar/SettingsDrawer/TranslationSection.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable max-lines */
 import { useCallback, useMemo } from 'react';
 
 import { Action } from '@reduxjs/toolkit';
@@ -67,19 +68,23 @@ const TranslationSection = () => {
 
   const renderTranslations = useCallback(
     (data: TranslationsResponse) => {
+      const availableTranslations = selectedTranslations.filter((selectedId) =>
+        data.translations.some((translation) => translation.id === selectedId),
+      );
+
       const firstSelectedTranslation = data.translations.find(
-        (translation) => translation.id === selectedTranslations[0],
+        (translation) => translation.id === availableTranslations[0],
       );
 
       let selectedValueString = t('settings.no-translation-selected');
-      if (selectedTranslations.length === 1) selectedValueString = firstSelectedTranslation?.name;
-      if (selectedTranslations.length === 2) {
+      if (availableTranslations.length === 1) selectedValueString = firstSelectedTranslation?.name;
+      if (availableTranslations.length === 2) {
         selectedValueString = t('settings.value-and-other', {
           value: firstSelectedTranslation?.name,
           othersCount: localizedSelectedTranslations,
         });
       }
-      if (selectedTranslations.length > 2) {
+      if (availableTranslations.length > 2) {
         selectedValueString = t('settings.value-and-others', {
           value: firstSelectedTranslation?.name,
           othersCount: localizedSelectedTranslations,