From f09a8e3306a741d3c366bebdaab463ff7aadb7e0 Mon Sep 17 00:00:00 2001
From: jeffvli <jeffvictorli@gmail.com>
Date: Tue, 7 Oct 2025 11:36:48 -0700
Subject: [PATCH] improve overflow for album artist column

---
 .../columns/album-artists-column.module.css              | 9 +++++++++
 .../item-table-list/columns/album-artists-column.tsx     | 7 +++----
 2 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/src/renderer/components/item-list/item-table-list/columns/album-artists-column.module.css b/src/renderer/components/item-list/item-table-list/columns/album-artists-column.module.css
index bcdaacda8..893343a7f 100644
--- a/src/renderer/components/item-list/item-table-list/columns/album-artists-column.module.css
+++ b/src/renderer/components/item-list/item-table-list/columns/album-artists-column.module.css
@@ -6,3 +6,12 @@
 .group a {
     cursor: pointer;
 }
+
+.artists-container {
+    display: -webkit-box;
+    overflow: hidden;
+    -webkit-line-clamp: 2;
+    line-height: 1.4;
+    -webkit-box-orient: vertical;
+    color: var(--theme-colors-foreground-muted);
+}
diff --git a/src/renderer/components/item-list/item-table-list/columns/album-artists-column.tsx b/src/renderer/components/item-list/item-table-list/columns/album-artists-column.tsx
index 7843a785c..d637abed3 100644
--- a/src/renderer/components/item-list/item-table-list/columns/album-artists-column.tsx
+++ b/src/renderer/components/item-list/item-table-list/columns/album-artists-column.tsx
@@ -9,7 +9,6 @@ import {
     TableColumnTextContainer,
 } from '/@/renderer/components/item-list/item-table-list/item-table-list-column';
 import { AppRoute } from '/@/renderer/router/routes';
-import { Group } from '/@/shared/components/group/group';
 import { Skeleton } from '/@/shared/components/skeleton/skeleton';
 import { Text } from '/@/shared/components/text/text';
 import { RelatedAlbumArtist } from '/@/shared/types/domain-types';
@@ -32,7 +31,7 @@ const AlbumArtistsColumn = (props: ItemTableListInnerColumn) => {
     if (Array.isArray(row)) {
         return (
             <TableColumnContainer {...props}>
-                <Group className={styles.group} wrap="wrap">
+                <div className={styles.artistsContainer}>
                     {albumArtists.map((albumArtist, index) => (
                         <Text
                             component={Link}
@@ -43,10 +42,10 @@ const AlbumArtistsColumn = (props: ItemTableListInnerColumn) => {
                             to={albumArtist.path}
                         >
                             {albumArtist.name}
-                            {index < albumArtists.length - 1 && ','}
+                            {index < albumArtists.length - 1 && ', '}
                         </Text>
                     ))}
-                </Group>
+                </div>
             </TableColumnContainer>
         );
     }