mirror of
https://github.com/antebudimir/feishin.git
synced 2026-01-01 18:33:33 +00:00
disable single attribute per line
This commit is contained in:
parent
92ed8e20c9
commit
8b141d652c
154 changed files with 390 additions and 1800 deletions
|
|
@ -15,21 +15,14 @@ export const AlbumArtistCell = ({ data, value }: ICellRendererParams) => {
|
|||
if (value === undefined) {
|
||||
return (
|
||||
<CellContainer position="left">
|
||||
<Skeleton
|
||||
height="1rem"
|
||||
width="80%"
|
||||
/>
|
||||
<Skeleton height="1rem" width="80%" />
|
||||
</CellContainer>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<CellContainer position="left">
|
||||
<Text
|
||||
isMuted
|
||||
overflow="hidden"
|
||||
size="md"
|
||||
>
|
||||
<Text isMuted overflow="hidden" size="md">
|
||||
{value?.map((item: AlbumArtist | Artist, index: number) => (
|
||||
<React.Fragment key={`row-${item.id}-${data.uniqueId}`}>
|
||||
{index > 0 && <Separator />}
|
||||
|
|
@ -47,11 +40,7 @@ export const AlbumArtistCell = ({ data, value }: ICellRendererParams) => {
|
|||
{item.name || '—'}
|
||||
</Text>
|
||||
) : (
|
||||
<Text
|
||||
isMuted
|
||||
overflow="hidden"
|
||||
size="md"
|
||||
>
|
||||
<Text isMuted overflow="hidden" size="md">
|
||||
{item.name || '—'}
|
||||
</Text>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -15,21 +15,14 @@ export const ArtistCell = ({ data, value }: ICellRendererParams) => {
|
|||
if (value === undefined) {
|
||||
return (
|
||||
<CellContainer position="left">
|
||||
<Skeleton
|
||||
height="1rem"
|
||||
width="80%"
|
||||
/>
|
||||
<Skeleton height="1rem" width="80%" />
|
||||
</CellContainer>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<CellContainer position="left">
|
||||
<Text
|
||||
isMuted
|
||||
overflow="hidden"
|
||||
size="md"
|
||||
>
|
||||
<Text isMuted overflow="hidden" size="md">
|
||||
{value?.map((item: AlbumArtist | Artist, index: number) => (
|
||||
<React.Fragment key={`row-${item.id}-${data.uniqueId}`}>
|
||||
{index > 0 && <Separator />}
|
||||
|
|
@ -47,11 +40,7 @@ export const ArtistCell = ({ data, value }: ICellRendererParams) => {
|
|||
{item.name || '—'}
|
||||
</Text>
|
||||
) : (
|
||||
<Text
|
||||
isMuted
|
||||
overflow="hidden"
|
||||
size="md"
|
||||
>
|
||||
<Text isMuted overflow="hidden" size="md">
|
||||
{item.name || '—'}
|
||||
</Text>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -41,11 +41,7 @@ export const CombinedTitleCell = ({
|
|||
>
|
||||
<Skeleton className={styles.image} />
|
||||
</div>
|
||||
<Skeleton
|
||||
className={styles.skeletonMetadata}
|
||||
height="1rem"
|
||||
width="80%"
|
||||
/>
|
||||
<Skeleton className={styles.skeletonMetadata} height="1rem" width="80%" />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -62,11 +58,7 @@ export const CombinedTitleCell = ({
|
|||
width: `${(node.rowHeight || 40) - 10}px`,
|
||||
}}
|
||||
>
|
||||
<Image
|
||||
alt="cover"
|
||||
className={styles.image}
|
||||
src={value.imageUrl}
|
||||
/>
|
||||
<Image alt="cover" className={styles.image} src={value.imageUrl} />
|
||||
|
||||
<ListCoverControls
|
||||
className={styles.playButton}
|
||||
|
|
@ -77,18 +69,10 @@ export const CombinedTitleCell = ({
|
|||
/>
|
||||
</div>
|
||||
<div className={styles.metadataWrapper}>
|
||||
<Text
|
||||
className="current-song-child"
|
||||
overflow="hidden"
|
||||
size="md"
|
||||
>
|
||||
<Text className="current-song-child" overflow="hidden" size="md">
|
||||
{value.name}
|
||||
</Text>
|
||||
<Text
|
||||
isMuted
|
||||
overflow="hidden"
|
||||
size="md"
|
||||
>
|
||||
<Text isMuted overflow="hidden" size="md">
|
||||
{artists?.length ? (
|
||||
artists.map((artist: AlbumArtist | Artist, index: number) => (
|
||||
<React.Fragment key={`queue-${rowIndex}-artist-${artist.id}`}>
|
||||
|
|
|
|||
|
|
@ -25,10 +25,7 @@ export const FullWidthDiscCell = ({ api, data, node }: ICellRendererParams) => {
|
|||
|
||||
return (
|
||||
<div className={styles.container}>
|
||||
<Group
|
||||
justify="space-between"
|
||||
w="100%"
|
||||
>
|
||||
<Group justify="space-between" w="100%">
|
||||
<Button
|
||||
leftSection={isSelected ? <Icon icon="squareCheck" /> : <Icon icon="square" />}
|
||||
onClick={handleToggleDiscNodes}
|
||||
|
|
|
|||
|
|
@ -23,10 +23,7 @@ export const GenericCell = ({ value, valueFormatted }: ICellRendererParams, opti
|
|||
if (value === undefined) {
|
||||
return (
|
||||
<CellContainer position={position || 'left'}>
|
||||
<Skeleton
|
||||
height="1rem"
|
||||
width="80%"
|
||||
/>
|
||||
<Skeleton height="1rem" width="80%" />
|
||||
</CellContainer>
|
||||
);
|
||||
}
|
||||
|
|
@ -45,12 +42,7 @@ export const GenericCell = ({ value, valueFormatted }: ICellRendererParams, opti
|
|||
{isLink ? displayedValue.value : displayedValue}
|
||||
</Text>
|
||||
) : (
|
||||
<Text
|
||||
isMuted={!primary}
|
||||
isNoSelect={false}
|
||||
overflow="hidden"
|
||||
size="md"
|
||||
>
|
||||
<Text isMuted={!primary} isNoSelect={false} overflow="hidden" size="md">
|
||||
{displayedValue}
|
||||
</Text>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -13,11 +13,7 @@ export const GenreCell = ({ data, value }: ICellRendererParams) => {
|
|||
const genrePath = useGenreRoute();
|
||||
return (
|
||||
<CellContainer position="left">
|
||||
<Text
|
||||
isMuted
|
||||
overflow="hidden"
|
||||
size="md"
|
||||
>
|
||||
<Text isMuted overflow="hidden" size="md">
|
||||
{value?.map((item: AlbumArtist | Artist, index: number) => (
|
||||
<React.Fragment key={`row-${item.id}-${data.uniqueId}`}>
|
||||
{index > 0 && <Separator />}
|
||||
|
|
|
|||
|
|
@ -19,20 +19,14 @@ export const NoteCell = ({ value }: ICellRendererParams) => {
|
|||
if (value === undefined) {
|
||||
return (
|
||||
<CellContainer position="left">
|
||||
<Skeleton
|
||||
height="1rem"
|
||||
width="80%"
|
||||
/>
|
||||
<Skeleton height="1rem" width="80%" />
|
||||
</CellContainer>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<CellContainer position="left">
|
||||
<Text
|
||||
isMuted
|
||||
overflow="hidden"
|
||||
>
|
||||
<Text isMuted overflow="hidden">
|
||||
{formattedValue}
|
||||
</Text>
|
||||
</CellContainer>
|
||||
|
|
|
|||
|
|
@ -26,11 +26,7 @@ export const RatingCell = ({ node, value }: ICellRendererParams) => {
|
|||
|
||||
return (
|
||||
<CellContainer position="center">
|
||||
<Rating
|
||||
onChange={handleUpdateRating}
|
||||
size="xs"
|
||||
value={value?.userRating}
|
||||
/>
|
||||
<Rating onChange={handleUpdateRating} size="xs" value={value?.userRating} />
|
||||
</CellContainer>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -144,15 +144,9 @@ export const RowIndexCell = ({ eGridCell, value }: ICellRendererParams) => {
|
|||
return (
|
||||
<CellContainer position="right">
|
||||
{isPlaying && isCurrentSong ? (
|
||||
<Icon
|
||||
fill="primary"
|
||||
icon="mediaPlay"
|
||||
/>
|
||||
<Icon fill="primary" icon="mediaPlay" />
|
||||
) : isCurrentSong ? (
|
||||
<Icon
|
||||
fill="primary"
|
||||
icon="mediaPause"
|
||||
/>
|
||||
<Icon fill="primary" icon="mediaPause" />
|
||||
) : (
|
||||
<Text
|
||||
className="current-song-child current-song-index"
|
||||
|
|
|
|||
|
|
@ -8,21 +8,14 @@ export const TitleCell = ({ value }: ICellRendererParams) => {
|
|||
if (value === undefined) {
|
||||
return (
|
||||
<CellContainer position="left">
|
||||
<Skeleton
|
||||
height="1rem"
|
||||
width="80%"
|
||||
/>
|
||||
<Skeleton height="1rem" width="80%" />
|
||||
</CellContainer>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<CellContainer position="left">
|
||||
<Text
|
||||
className="current-song-child"
|
||||
overflow="hidden"
|
||||
size="md"
|
||||
>
|
||||
<Text className="current-song-child" overflow="hidden" size="md">
|
||||
{value}
|
||||
</Text>
|
||||
</CellContainer>
|
||||
|
|
|
|||
|
|
@ -7,10 +7,5 @@ export interface ICustomHeaderParams extends IHeaderParams {
|
|||
}
|
||||
|
||||
export const DurationHeader = () => {
|
||||
return (
|
||||
<Icon
|
||||
icon="duration"
|
||||
size="sm"
|
||||
/>
|
||||
);
|
||||
return <Icon icon="duration" size="sm" />;
|
||||
};
|
||||
|
|
|
|||
|
|
@ -16,36 +16,11 @@ type Options = {
|
|||
type Presets = 'actions' | 'duration' | 'rowIndex' | 'userFavorite' | 'userRating';
|
||||
|
||||
const headerPresets = {
|
||||
actions: (
|
||||
<Icon
|
||||
icon="ellipsisHorizontal"
|
||||
size="sm"
|
||||
/>
|
||||
),
|
||||
duration: (
|
||||
<Icon
|
||||
icon="duration"
|
||||
size="sm"
|
||||
/>
|
||||
),
|
||||
rowIndex: (
|
||||
<Icon
|
||||
icon="hash"
|
||||
size="sm"
|
||||
/>
|
||||
),
|
||||
userFavorite: (
|
||||
<Icon
|
||||
icon="favorite"
|
||||
size="sm"
|
||||
/>
|
||||
),
|
||||
userRating: (
|
||||
<Icon
|
||||
icon="star"
|
||||
size="sm"
|
||||
/>
|
||||
),
|
||||
actions: <Icon icon="ellipsisHorizontal" size="sm" />,
|
||||
duration: <Icon icon="duration" size="sm" />,
|
||||
rowIndex: <Icon icon="hash" size="sm" />,
|
||||
userFavorite: <Icon icon="favorite" size="sm" />,
|
||||
userRating: <Icon icon="star" size="sm" />,
|
||||
};
|
||||
|
||||
export const GenericTableHeader = (
|
||||
|
|
|
|||
|
|
@ -635,15 +635,8 @@ export const VirtualTable = forwardRef(
|
|||
onNewColumnsLoaded={handleNewColumnsLoaded}
|
||||
/>
|
||||
{paginationProps && (
|
||||
<AnimatePresence
|
||||
initial={false}
|
||||
mode="wait"
|
||||
presenceAffectsLayout
|
||||
>
|
||||
<TablePagination
|
||||
{...paginationProps}
|
||||
tableRef={tableRef}
|
||||
/>
|
||||
<AnimatePresence initial={false} mode="wait" presenceAffectsLayout>
|
||||
<TablePagination {...paginationProps} tableRef={tableRef} />
|
||||
</AnimatePresence>
|
||||
)}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -76,10 +76,7 @@ export const TablePagination = ({
|
|||
ref={containerQuery.ref}
|
||||
style={{ borderTop: '1px solid var(--theme-generic-border-color)' }}
|
||||
>
|
||||
<Text
|
||||
isMuted
|
||||
size="md"
|
||||
>
|
||||
<Text isMuted size="md">
|
||||
{containerQuery.isMd ? (
|
||||
<>
|
||||
Showing <b>{currentPageStartIndex}</b> - <b>{currentPageStopIndex}</b> of{' '}
|
||||
|
|
@ -97,11 +94,7 @@ export const TablePagination = ({
|
|||
</>
|
||||
)}
|
||||
</Text>
|
||||
<Group
|
||||
gap="sm"
|
||||
ref={containerQuery.ref}
|
||||
wrap="nowrap"
|
||||
>
|
||||
<Group gap="sm" ref={containerQuery.ref} wrap="nowrap">
|
||||
<Popover
|
||||
onClose={() => handlers.close()}
|
||||
opened={isGoToPageOpen}
|
||||
|
|
@ -127,10 +120,7 @@ export const TablePagination = ({
|
|||
min={1}
|
||||
width={70}
|
||||
/>
|
||||
<Button
|
||||
type="submit"
|
||||
variant="filled"
|
||||
>
|
||||
<Button type="submit" variant="filled">
|
||||
Go
|
||||
</Button>
|
||||
</Group>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue