diff --git a/src/renderer/components/item-list/item-table-list/columns/row-index-column.tsx b/src/renderer/components/item-list/item-table-list/columns/row-index-column.tsx
index fb2035438..55012eacb 100644
--- a/src/renderer/components/item-list/item-table-list/columns/row-index-column.tsx
+++ b/src/renderer/components/item-list/item-table-list/columns/row-index-column.tsx
@@ -29,7 +29,19 @@ export const RowIndexColumn = (props: ItemTableListInnerColumn) => {
};
const DefaultRowIndexColumn = (props: ItemTableListInnerColumn) => {
- const { controls, enableExpansion } = props;
+ const {
+ adjustedRowIndexMap,
+ controls,
+ data,
+ enableExpansion,
+ enableHeader,
+ internalState,
+ itemType,
+ rowIndex,
+ } = props;
+
+ const adjustedRowIndex =
+ adjustedRowIndexMap?.get(rowIndex) ?? (enableHeader ? rowIndex : rowIndex + 1);
if (enableExpansion) {
return (
@@ -41,28 +53,32 @@ const DefaultRowIndexColumn = (props: ItemTableListInnerColumn) => {
onClick={(e) =>
controls.onExpand?.({
event: e,
- internalState: props.internalState,
- item: props.data[props.rowIndex] as ItemListItem,
- itemType: props.itemType,
+ internalState,
+ item: data[rowIndex] as ItemListItem,
+ itemType,
})
}
size="xs"
variant="subtle"
/>
- {props.rowIndex}
+ {adjustedRowIndex}
);
}
- return {props.rowIndex};
+ return {adjustedRowIndex};
};
const QueueSongRowIndexColumn = (props: ItemTableListInnerColumn) => {
const status = usePlayerStatus();
const { isActive } = useIsCurrentSong(props.data[props.rowIndex] as QueueSong);
+ const adjustedRowIndex =
+ props.adjustedRowIndexMap?.get(props.rowIndex) ??
+ (props.enableHeader ? props.rowIndex : props.rowIndex + 1);
+
return (
{isActive ? (
@@ -76,7 +92,7 @@ const QueueSongRowIndexColumn = (props: ItemTableListInnerColumn) => {
)
) : (
- props.rowIndex
+ adjustedRowIndex
)}
);
diff --git a/src/renderer/components/item-list/item-table-list/item-table-list.tsx b/src/renderer/components/item-list/item-table-list/item-table-list.tsx
index 46d49bea8..53307558e 100644
--- a/src/renderer/components/item-list/item-table-list/item-table-list.tsx
+++ b/src/renderer/components/item-list/item-table-list/item-table-list.tsx
@@ -226,8 +226,52 @@ const VirtualizedTableGrid = React.memo(
return result;
}, [data, enableHeader, groups]);
+ const adjustedRowIndexMap = useMemo(() => {
+ const map = new Map();
+
+ if (!groups || groups.length === 0) {
+ const startIndex = enableHeader ? 1 : 0;
+ const endIndex = enableHeader ? dataWithGroups.length : dataWithGroups.length;
+ for (let rowIndex = startIndex; rowIndex < endIndex; rowIndex++) {
+ map.set(rowIndex, enableHeader ? rowIndex : rowIndex + 1);
+ }
+ return map;
+ }
+
+ const groupIndexes: number[] = [];
+ let cumulativeDataIndex = 0;
+ const headerOffset = enableHeader ? 1 : 0;
+
+ groups.forEach((group, groupIndex) => {
+ const groupHeaderIndex = headerOffset + cumulativeDataIndex + groupIndex;
+ groupIndexes.push(groupHeaderIndex);
+ cumulativeDataIndex += group.itemCount;
+ });
+
+ let adjustedIndex = 1;
+ const startIndex = enableHeader ? 0 : 0;
+ const endIndex = dataWithGroups.length;
+
+ for (let rowIndex = startIndex; rowIndex < endIndex; rowIndex++) {
+ if (enableHeader && rowIndex === 0) {
+ // Header row
+ map.set(rowIndex, 0);
+ } else if (groupIndexes.includes(rowIndex)) {
+ // Group header row - don't increment adjustedIndex
+ map.set(rowIndex, 0);
+ } else {
+ // Data row
+ map.set(rowIndex, adjustedIndex);
+ adjustedIndex++;
+ }
+ }
+
+ return map;
+ }, [dataWithGroups, enableHeader, groups]);
+
const itemProps: TableItemProps = useMemo(
() => ({
+ adjustedRowIndexMap,
calculatedColumnWidths,
cellPadding,
columns: parsedColumns,
@@ -256,6 +300,7 @@ const VirtualizedTableGrid = React.memo(
tableId,
}),
[
+ adjustedRowIndexMap,
calculatedColumnWidths,
cellPadding,
controls,
@@ -577,6 +622,7 @@ export interface TableGroupHeader {
}
export interface TableItemProps {
+ adjustedRowIndexMap?: Map; // Maps rowIndex to adjustedRowIndex (1-indexed, excluding group rows)
calculatedColumnWidths?: number[];
cellPadding?: ItemTableListProps['cellPadding'];
columns: ItemTableListColumnConfig[];