fix additional instances of JoinedArtists not truncating

This commit is contained in:
jeffvli
2026-07-17 11:10:56 -07:00
parent 0940a4d1f5
commit 235fb4d13f
9 changed files with 64 additions and 6 deletions
@@ -1,3 +1,4 @@
import styles from './artists-column.module.css';
import { ItemDetailListCellProps } from './types';
import {
@@ -17,7 +18,10 @@ export const AlbumArtistColumn = ({ isRowHovered, song }: ItemDetailListCellProp
artists={song.albumArtists ?? []}
linkProps={JOINED_ARTISTS_MUTED_PROPS.linkProps}
readOnly={!isRowHovered}
rootTextProps={JOINED_ARTISTS_MUTED_PROPS.rootTextProps}
rootTextProps={{
...JOINED_ARTISTS_MUTED_PROPS.rootTextProps,
className: styles.artists,
}}
/>
);
};
@@ -1,3 +1,4 @@
import styles from './artists-column.module.css';
import { ItemDetailListCellProps } from './types';
import {
@@ -17,7 +18,10 @@ export const ArtistColumn = ({ isRowHovered, song }: ItemDetailListCellProps) =>
artists={song.artists ?? []}
linkProps={JOINED_ARTISTS_MUTED_PROPS.linkProps}
readOnly={!isRowHovered}
rootTextProps={JOINED_ARTISTS_MUTED_PROPS.rootTextProps}
rootTextProps={{
...JOINED_ARTISTS_MUTED_PROPS.rootTextProps,
className: styles.artists,
}}
/>
);
};
@@ -0,0 +1,10 @@
.artists {
display: block;
overflow: hidden;
text-overflow: ellipsis;
}
.artists,
.artists > * {
white-space: nowrap;
}
@@ -59,6 +59,10 @@ a.title {
--text-text-wrap: nowrap;
}
.artists > * {
white-space: nowrap;
}
.folder-icon {
color: black;
fill: rgb(255 215 100);
@@ -61,7 +61,12 @@ export const DefaultTitleArtistColumn = (props: ItemTableListInnerColumn) => {
artistName={item.albumArtist}
artists={item.albumArtists}
linkProps={{ fw: 400, isMuted: true }}
rootTextProps={{ fw: 400, isMuted: true, size: 'sm' }}
rootTextProps={{
className: styles.artists,
fw: 400,
isMuted: true,
size: 'sm',
}}
/>
</div>
</div>
@@ -144,7 +149,12 @@ export const QueueSongTitleArtistColumn = (props: ItemTableListInnerColumn) => {
artistName={item.artistName}
artists={item.artists}
linkProps={{ fw: 400, isMuted: true }}
rootTextProps={{ fw: 400, isMuted: true, size: 'sm' }}
rootTextProps={{
className: styles.artists,
fw: 400,
isMuted: true,
size: 'sm',
}}
/>
</div>
</div>
@@ -75,6 +75,10 @@ a.title {
--text-text-wrap: nowrap;
}
.artists > * {
white-space: nowrap;
}
.folder-icon {
color: black;
fill: rgb(255 215 100);
@@ -165,7 +165,12 @@ export const DefaultTitleCombinedColumn = (props: ItemTableListInnerColumn) => {
artistName={item.albumArtist}
artists={item.albumArtists}
linkProps={{ fw: 400, isMuted: true }}
rootTextProps={{ fw: 400, isMuted: true, size: 'sm' }}
rootTextProps={{
className: styles.artists,
fw: 400,
isMuted: true,
size: 'sm',
}}
/>
</div>
</div>
@@ -337,7 +342,12 @@ export const QueueSongTitleCombinedColumn = (props: ItemTableListInnerColumn) =>
artistName={item.artistName}
artists={item.artists}
linkProps={{ fw: 400, isMuted: true }}
rootTextProps={{ fw: 400, isMuted: true, size: 'sm' }}
rootTextProps={{
className: styles.artists,
fw: 400,
isMuted: true,
size: 'sm',
}}
/>
</div>
</div>
@@ -72,6 +72,17 @@
}
}
.joined-artists {
display: block;
overflow: hidden;
text-overflow: ellipsis;
}
.joined-artists,
.joined-artists > * {
white-space: nowrap;
}
.left-controls-container {
display: flex;
width: 100%;
@@ -268,6 +268,7 @@ export const LeftControls = () => {
}}
rootTextProps={{
...JOINED_ARTISTS_MUTED_PROPS.rootTextProps,
className: styles.joinedArtists,
size: 'md',
}}
/>