More columns

stashapp · Dec 15, 2023 · 1e1d61a · 1e1d61a
1 parent 000c529
commit 1e1d61a
Show file tree

Hide file tree

Showing 2 changed files with 104 additions and 0 deletions.
diff --git a/ui/v2.5/src/components/Scenes/SceneDetails/SceneFileInfoPanel.tsx b/ui/v2.5/src/components/Scenes/SceneDetails/SceneFileInfoPanel.tsx
@@ -292,6 +292,7 @@ export const SceneFileInfoPanel: React.FC<ISceneFileInfoPanelProps> = (
       </Accordion>
     );
   }, [props.scene, loading, Toast, deletingFile, reassigningFile]);
+
   return (
     <>
       <dl className="container scene-file-info details-list">

diff --git a/ui/v2.5/src/components/Scenes/SceneListTable.tsx b/ui/v2.5/src/components/Scenes/SceneListTable.tsx
@@ -78,14 +78,30 @@ export const SceneListTable: React.FC<ISceneListTableProps> = (
     value: "play_duration",
     label: intl.formatMessage({ id: "play_duration" }),
   };
+  const oCounterCol = {
+    value: "o_counter",
+    label: intl.formatMessage({ id: "o_counter" }),
+  };
   const resolutionCol = {
     value: "resolution",
     label: intl.formatMessage({ id: "resolution" }),
   };
+  const frameRateCol = {
+    value: "framerate",
+    label: intl.formatMessage({ id: "framerate" }),
+  };
   const bitRateCol = {
     value: "bitrate",
     label: intl.formatMessage({ id: "bitrate" }),
   };
+  const videoCodecCol = {
+    value: "video_codec",
+    label: intl.formatMessage({ id: "video_codec" }),
+  };
+  const audioCodecCol = {
+    value: "audio_codec",
+    label: intl.formatMessage({ id: "audio_codec" }),
+  };
   const Column = [
     coverImageCol,
     titleCol,
@@ -100,8 +116,12 @@ export const SceneListTable: React.FC<ISceneListTableProps> = (
     galleriesCol,
     playCountCol,
     playDurationCol,
+    oCounterCol,
     resolutionCol,
+    frameRateCol,
     bitRateCol,
+    videoCodecCol,
+    audioCodecCol,
   ];
   const defaultColumn = uiConfig?.defaultSceneColumns
     ? uiConfig.defaultSceneColumns
@@ -400,6 +420,16 @@ export const SceneListTable: React.FC<ISceneListTableProps> = (
     }
   }
 
+  function maybeRenderOCounterCell(scene: GQL.SlimSceneDataFragment) {
+    if (
+      column.some(
+        (e: { value: string; label: string }) => e.value === oCounterCol.value
+      )
+    ) {
+      return <td className={`${oCounterCol.value}-data`}>{scene.o_counter}</td>;
+    }
+  }
+
   function maybeRenderResolutionCell(scene: GQL.SlimSceneDataFragment) {
     if (
       column.some(
@@ -420,6 +450,31 @@ export const SceneListTable: React.FC<ISceneListTableProps> = (
     }
   }
 
+  function maybeRenderFrameRateCell(scene: GQL.SlimSceneDataFragment) {
+    if (
+      column.some(
+        (e: { value: string; label: string }) => e.value === frameRateCol.value
+      )
+    ) {
+      return (
+        <td className={`${frameRateCol.value}-data`}>
+          <ul className="comma-list">
+            {scene.files.map((file) => (
+              <li key={file.id}>
+                <span>
+                  <FormattedMessage
+                    id="frames_per_second"
+                    values={{ value: intl.formatNumber(file.frame_rate ?? 0) }}
+                  />
+                </span>
+              </li>
+            ))}
+          </ul>
+        </td>
+      );
+    }
+  }
+
   function maybeRenderBitRateCell(scene: GQL.SlimSceneDataFragment) {
     if (
       column.some(
@@ -449,6 +504,46 @@ export const SceneListTable: React.FC<ISceneListTableProps> = (
     }
   }
 
+  function maybeRenderAudioCodecCell(scene: GQL.SlimSceneDataFragment) {
+    if (
+      column.some(
+        (e: { value: string; label: string }) => e.value === audioCodecCol.value
+      )
+    ) {
+      return (
+        <td className={`${audioCodecCol.value}-data`}>
+          <ul className="comma-list">
+            {scene.files.map((file) => (
+              <li key={file.id}>
+                <span>{file.audio_codec}</span>
+              </li>
+            ))}
+          </ul>
+        </td>
+      );
+    }
+  }
+
+  function maybeRenderVideoCodecCell(scene: GQL.SlimSceneDataFragment) {
+    if (
+      column.some(
+        (e: { value: string; label: string }) => e.value === videoCodecCol.value
+      )
+    ) {
+      return (
+        <td className={`${videoCodecCol.value}-data`}>
+          <ul className="comma-list">
+            {scene.files.map((file) => (
+              <li key={file.id}>
+                <span>{file.video_codec}</span>
+              </li>
+            ))}
+          </ul>
+        </td>
+      );
+    }
+  }
+
   const renderSceneRow = (scene: GQL.SlimSceneDataFragment, index: number) => {
     const sceneLink = props.queue
       ? props.queue.makeLink(scene.id, { sceneIndex: index })
@@ -493,8 +588,12 @@ export const SceneListTable: React.FC<ISceneListTableProps> = (
         {maybeRenderGalleriesCell(scene)}
         {maybeRenderPlayCountCell(scene)}
         {maybeRenderPlayDurationCell(scene)}
+        {maybeRenderOCounterCell(scene)}
         {maybeRenderResolutionCell(scene)}
+        {maybeRenderFrameRateCell(scene)}
         {maybeRenderBitRateCell(scene)}
+        {maybeRenderVideoCodecCell(scene)}
+        {maybeRenderAudioCodecCell(scene)}
       </tr>
     );
   };
@@ -531,8 +630,12 @@ export const SceneListTable: React.FC<ISceneListTableProps> = (
             {maybeRenderColHead(galleriesCol)}
             {maybeRenderColHead(playCountCol)}
             {maybeRenderColHead(playDurationCol)}
+            {maybeRenderColHead(oCounterCol)}
             {maybeRenderColHead(resolutionCol)}
+            {maybeRenderColHead(frameRateCol)}
             {maybeRenderColHead(bitRateCol)}
+            {maybeRenderColHead(videoCodecCol)}
+            {maybeRenderColHead(audioCodecCol)}
           </tr>
         </thead>
         <tbody>{props.scenes.map(renderSceneRow)}</tbody>