audio file info added, fixed right click selecting.

frontend/src/components/track-list/columns.ts

@@ -1,4 +1,11 @@
 import type { library } from '@go/models';
+import {
+    formatSampleRate,
+    formatBitDepth,
+    formatChannels,
+    formatBitrate,
+    formatFileSize,
+} from '@utils/format';
 import { formatMilliseconds } from '@utils/time';
 
 /** Compares two strings using locale-aware ordering. */
@@ -135,6 +142,50 @@ export const COLUMN_DEFS: Record<string, ColumnDef> = {
         comparator: (a, b) =>
             compareStr(a.FileType, b.FileType),
     },
+    sampleRate: {
+        id: 'sampleRate',
+        label: 'Sample Rate',
+        accessor: (t) => formatSampleRate(t.SampleRate),
+        defaultWidth: '100px',
+        align: 'right',
+        comparator: (a, b) =>
+            compareNum(a.SampleRate, b.SampleRate),
+    },
+    bitDepth: {
+        id: 'bitDepth',
+        label: 'Bit Depth',
+        accessor: (t) => formatBitDepth(t.BitDepth),
+        defaultWidth: '80px',
+        align: 'right',
+        comparator: (a, b) =>
+            compareNum(a.BitDepth, b.BitDepth),
+    },
+    channels: {
+        id: 'channels',
+        label: 'Channels',
+        accessor: (t) => formatChannels(t.Channels),
+        defaultWidth: '80px',
+        comparator: (a, b) =>
+            compareNum(a.Channels, b.Channels),
+    },
+    bitrate: {
+        id: 'bitrate',
+        label: 'Bitrate',
+        accessor: (t) => formatBitrate(t.Bitrate),
+        defaultWidth: '100px',
+        align: 'right',
+        comparator: (a, b) =>
+            compareNum(a.Bitrate, b.Bitrate),
+    },
+    fileSize: {
+        id: 'fileSize',
+        label: 'File Size',
+        accessor: (t) => formatFileSize(t.FileSize),
+        defaultWidth: '80px',
+        align: 'right',
+        comparator: (a, b) =>
+            compareNum(a.FileSize, b.FileSize),
+    },
 };
 
 /**

frontend/src/components/track-list/track-list.ts

@@ -894,6 +894,10 @@ export class TrackList extends LitElement implements SelectionHost {
       text-align: right;
     }
 
+    .cell-center {
+      text-align: center;
+    }
+
     #context-menu {
       z-index: 200;
     }
@@ -1540,13 +1544,21 @@ export class TrackList extends LitElement implements SelectionHost {
                 this.onTrackDragStart(e, track)}
         @dragend=${this.onTrackDragEnd}
       >
-        ${cols.map(
-                (col) => html`
-            <div class="cell ${col.align === 'right' ? 'cell-right' : ''}">
-              ${col.accessor(track)}
-            </div>
-          `,
-            )}
+        ${cols.map((col) => {
+                const val = col.accessor(track);
+                const centered = val === '\u2014';
+                const align = centered
+                    ? 'cell-center'
+                    : col.align === 'right'
+                      ? 'cell-right'
+                      : '';
+
+                return html`
+                    <div class="cell ${align}">
+                        ${val}
+                    </div>
+                `;
+            })}
       </div>
     `;
     };