From 581e118532191a487bf6c3d3f872806c891bbff8 Mon Sep 17 00:00:00 2001
From: Bogdan <mynameisbogdan@users.noreply.github.com>
Date: Wed, 22 Apr 2026 16:59:45 +0300
Subject: [PATCH] Display 'None' for empty subtitles streams

---
 frontend/src/Episode/Summary/MediaInfo.tsx | 65 +++++++++++++---------
 1 file changed, 38 insertions(+), 27 deletions(-)

diff --git a/frontend/src/Episode/Summary/MediaInfo.tsx b/frontend/src/Episode/Summary/MediaInfo.tsx
index 72abcdb02..7b2e35b84 100644
--- a/frontend/src/Episode/Summary/MediaInfo.tsx
+++ b/frontend/src/Episode/Summary/MediaInfo.tsx
@@ -61,39 +61,50 @@ function MediaInfo(props: MediaInfoProps) {
             <DescriptionListItem
               key={key}
               title={translate('MediaInfoSubtitlesHeader')}
-              data={value.reduce(
-                (acc: React.ReactNode[] | null, subtitleStream, index) => {
-                  const language = getLanguageName(subtitleStream.language);
+              data={
+                value.length > 0
+                  ? value.reduce(
+                      (
+                        acc: React.ReactNode[] | null,
+                        subtitleStream,
+                        index
+                      ) => {
+                        const language = getLanguageName(
+                          subtitleStream.language
+                        );
 
-                  let line = `${
-                    subtitleStream.format?.toUpperCase() || translate('Unknown')
-                  }`;
+                        let line = `${
+                          subtitleStream.format?.toUpperCase() ||
+                          translate('Unknown')
+                        }`;
 
-                  if (
-                    subtitleStream.title !== undefined &&
-                    subtitleStream.title !== language
-                  ) {
-                    line += ` | ${subtitleStream.title}`;
-                  }
+                        if (
+                          subtitleStream.title !== undefined &&
+                          subtitleStream.title !== language
+                        ) {
+                          line += ` | ${subtitleStream.title}`;
+                        }
 
-                  if (subtitleStream.forced) {
-                    line += ` | ${translate('MediaInfoForced')}`;
-                  }
+                        if (subtitleStream.forced) {
+                          line += ` | ${translate('MediaInfoForced')}`;
+                        }
 
-                  if (subtitleStream.hearingImpaired) {
-                    line += ` | ${translate('MediaInfoHearingImpaired')}`;
-                  }
+                        if (subtitleStream.hearingImpaired) {
+                          line += ` | ${translate('MediaInfoHearingImpaired')}`;
+                        }
 
-                  const curr = (
-                    <span key={index} title={line}>
-                      {language}
-                    </span>
-                  );
+                        const curr = (
+                          <span key={index} title={line}>
+                            {language}
+                          </span>
+                        );
 
-                  return acc === null ? [curr] : [acc, ' / ', curr];
-                },
-                null
-              )}
+                        return acc === null ? [curr] : [acc, ' / ', curr];
+                      },
+                      null
+                    )
+                  : translate('None')
+              }
             />
           );
         }