Don't show track view if there is only one track

editor-settings.toml

@@ -74,7 +74,7 @@
 
 [trackSelection]
 
-# If the track selection appears in the main menu
+# If the track selection appears in the main menu.
 # Type: boolean
 # Default: true
 #show = true

src/i18n/locales/en-US.json

@@ -241,7 +241,8 @@
       "cannotDeleteTrackText": "Cannot Delete Track",
       "deleteTrackTooltip": "Do not encode and publish this track.",
       "restoreTrackTooltip": "Encode and publish this track.",
-      "cannotDeleteTrackTooltip": "Cannot remove this track from publication."
+      "cannotDeleteTrackTooltip": "Cannot remove this track from publication.",
+      "noSelectionPossible": "Track selection is disabled for this video, because there are not enough tracks to deselect any."
     },
 
     "subtitles": {

src/main/TrackSelection.tsx

@@ -2,13 +2,13 @@
 import { css } from "@emotion/react";
 
 import { IconType } from "react-icons";
-import { LuTrash } from "react-icons/lu";
+import { LuTrash, LuInfo } from "react-icons/lu";
 import TrashRestore from "../img/trash-restore.svg?react";
 import ReactPlayer from "react-player";
 
 import { Track } from "../types";
 import { useAppDispatch, useAppSelector } from "../redux/store";
-import { selectVideos, setTrackEnabled } from "../redux/videoSlice";
+import { selectVideoCount, selectVideos, setTrackEnabled } from "../redux/videoSlice";
 import {
   backgroundBoxStyle,
   basicButtonStyle,
@@ -28,6 +28,8 @@
  */
 const TrackSelection: React.FC = () => {
 
+  const videoCount = useAppSelector(selectVideoCount);
+
   // Generate list of tracks
   const tracks: Track[] = useAppSelector(selectVideos);
   const enabledCount = tracks.filter(t => t.video_stream.enabled).length;
@@ -56,9 +58,12 @@
   return (
     <div css={trackSelectionStyle}>
       <Header />
-      <div css={trackAreaStyle}>
-        {trackItems}
-      </div>
+      {videoCount > 1 ?
+        <div css={trackAreaStyle}>
+          {trackItems}
+        </div>
+        : <InfoBox />
+      }
     </div>
   );
 };
@@ -78,6 +83,19 @@
   );
 };
 
+const InfoBox: React.FC = () => {
+
+  const { t } = useTranslation();
+  const theme = useTheme();
+
+  return (
+    <div css={backgroundBoxStyle(theme)}>
+      <LuInfo />
+      <span css={{marginLeft: "10px"}}>{t("trackSelection.noSelectionPossible")}</span>
+    </div>
+  )
+}
+
 
 const TrackItem: React.FC<{ track: Track, enabledCount: number; }> = ({ track, enabledCount }) => {