add table row separator support

src/renderer/components/item-list/item-table-list/item-table-list-column.module.css

@@ -33,6 +33,10 @@
     padding: var(--theme-spacing-xs);
 }
 
+.container.with-row-border {
+    border-bottom: 1px solid var(--theme-colors-border);
+}
+
 .header-container {
     background: none;
 }

src/renderer/components/item-list/item-table-list/item-table-list-column.tsx

@@ -121,6 +121,8 @@ export const TableColumnTextContainer = (
                 [styles.compact]: props.size === 'compact',
                 [styles.left]: props.columns[props.columnIndex].align === 'start',
                 [styles.right]: props.columns[props.columnIndex].align === 'end',
+                [styles.withRowBorder]:
+                    props.enableRowBorders && props.enableHeader && props.rowIndex > 0,
             })}
             onClick={(e) => props.handleExpand(e, props.data[props.rowIndex], props.itemType)}
             style={props.style}
@@ -151,6 +153,8 @@ export const TableColumnContainer = (
                 [styles.compact]: props.size === 'compact',
                 [styles.left]: props.columns[props.columnIndex].align === 'start',
                 [styles.right]: props.columns[props.columnIndex].align === 'end',
+                [styles.withRowBorder]:
+                    props.enableRowBorders && props.enableHeader && props.rowIndex > 0,
             })}
             onClick={(e) => props.handleExpand(e, props.data[props.rowIndex], props.itemType)}
             style={props.style}

src/renderer/components/item-list/item-table-list/item-table-list.tsx

@@ -29,6 +29,7 @@ export interface CellProps {
     columns: ItemTableListColumnConfig[];
     data: unknown[];
     enableHeader?: boolean;
+    enableRowBorders?: boolean;
     handleExpand: (e: MouseEvent<HTMLDivElement>, item: unknown, itemType: LibraryItem) => void;
     itemType: LibraryItem;
     size?: 'compact' | 'default';
@@ -47,6 +48,7 @@ interface ItemTableListProps {
     data: unknown[];
     enableExpansion?: boolean;
     enableHeader?: boolean;
+    enableRowBorders?: boolean;
     enableSelection?: boolean;
     headerHeight?: number;
     initialTopMostItemIndex?:
@@ -92,6 +94,7 @@ export const ItemTableList = ({
     columns,
     data,
     enableHeader = true,
+    enableRowBorders = false,
     headerHeight = 40,
     initialTopMostItemIndex,
     itemType,
@@ -544,6 +547,7 @@ export const ItemTableList = ({
         columns: sortedColumns,
         data,
         enableHeader,
+        enableRowBorders,
         handleExpand,
         itemType,
         size,