Add favorite/rating table columns
This commit is contained in:
parent
d1dfbaedaa
commit
ab031820f6
12 changed files with 158 additions and 29 deletions
|
@ -63,6 +63,7 @@ import {
|
||||||
albumArtistListSortMap,
|
albumArtistListSortMap,
|
||||||
UpdatePlaylistArgs,
|
UpdatePlaylistArgs,
|
||||||
UpdatePlaylistResponse,
|
UpdatePlaylistResponse,
|
||||||
|
LibraryItem,
|
||||||
} from '/@/renderer/api/types';
|
} from '/@/renderer/api/types';
|
||||||
import { useAuthStore } from '/@/renderer/store';
|
import { useAuthStore } from '/@/renderer/store';
|
||||||
import { ServerListItem, ServerType } from '/@/renderer/types';
|
import { ServerListItem, ServerType } from '/@/renderer/types';
|
||||||
|
@ -652,7 +653,7 @@ const normalizeSong = (
|
||||||
id: item.Id,
|
id: item.Id,
|
||||||
imagePlaceholderUrl: null,
|
imagePlaceholderUrl: null,
|
||||||
imageUrl: getSongCoverArtUrl({ baseUrl: server.url, item, size: imageSize || 300 }),
|
imageUrl: getSongCoverArtUrl({ baseUrl: server.url, item, size: imageSize || 300 }),
|
||||||
isFavorite: (item.UserData && item.UserData.IsFavorite) || false,
|
itemType: LibraryItem.SONG,
|
||||||
lastPlayedAt: null,
|
lastPlayedAt: null,
|
||||||
name: item.Name,
|
name: item.Name,
|
||||||
path: (item.MediaSources && item.MediaSources[0]?.Path) || null,
|
path: (item.MediaSources && item.MediaSources[0]?.Path) || null,
|
||||||
|
@ -661,6 +662,7 @@ const normalizeSong = (
|
||||||
releaseDate: null,
|
releaseDate: null,
|
||||||
releaseYear: (item.ProductionYear && String(item.ProductionYear)) || null,
|
releaseYear: (item.ProductionYear && String(item.ProductionYear)) || null,
|
||||||
serverId: server.id,
|
serverId: server.id,
|
||||||
|
serverType: ServerType.JELLYFIN,
|
||||||
size: item.MediaSources && item.MediaSources[0]?.Size,
|
size: item.MediaSources && item.MediaSources[0]?.Size,
|
||||||
streamUrl: getStreamUrl({
|
streamUrl: getStreamUrl({
|
||||||
container: item.MediaSources[0]?.Container,
|
container: item.MediaSources[0]?.Container,
|
||||||
|
@ -671,9 +673,10 @@ const normalizeSong = (
|
||||||
server,
|
server,
|
||||||
}),
|
}),
|
||||||
trackNumber: item.IndexNumber,
|
trackNumber: item.IndexNumber,
|
||||||
type: ServerType.JELLYFIN,
|
|
||||||
uniqueId: nanoid(),
|
uniqueId: nanoid(),
|
||||||
updatedAt: item.DateCreated,
|
updatedAt: item.DateCreated,
|
||||||
|
userFavorite: (item.UserData && item.UserData.IsFavorite) || false,
|
||||||
|
userRating: null,
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -697,19 +700,21 @@ const normalizeAlbum = (item: JFAlbum, server: ServerListItem, imageSize?: numbe
|
||||||
size: imageSize || 300,
|
size: imageSize || 300,
|
||||||
}),
|
}),
|
||||||
isCompilation: null,
|
isCompilation: null,
|
||||||
isFavorite: item.UserData?.IsFavorite || false,
|
itemType: LibraryItem.ALBUM,
|
||||||
lastPlayedAt: null,
|
lastPlayedAt: null,
|
||||||
name: item.Name,
|
name: item.Name,
|
||||||
playCount: item.UserData?.PlayCount || 0,
|
playCount: item.UserData?.PlayCount || 0,
|
||||||
rating: null,
|
|
||||||
releaseDate: item.PremiereDate?.split('T')[0] || null,
|
releaseDate: item.PremiereDate?.split('T')[0] || null,
|
||||||
releaseYear: item.ProductionYear,
|
releaseYear: item.ProductionYear,
|
||||||
|
serverId: server.id,
|
||||||
serverType: ServerType.JELLYFIN,
|
serverType: ServerType.JELLYFIN,
|
||||||
size: null,
|
size: null,
|
||||||
songCount: item?.ChildCount || null,
|
songCount: item?.ChildCount || null,
|
||||||
songs: item.songs?.map((song) => normalizeSong(song, server, '', imageSize)),
|
songs: item.songs?.map((song) => normalizeSong(song, server, '', imageSize)),
|
||||||
uniqueId: nanoid(),
|
uniqueId: nanoid(),
|
||||||
updatedAt: item?.DateLastMediaAdded || item.DateCreated,
|
updatedAt: item?.DateLastMediaAdded || item.DateCreated,
|
||||||
|
userFavorite: item.UserData?.IsFavorite || false,
|
||||||
|
userRating: null,
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -730,12 +735,15 @@ const normalizeAlbumArtist = (
|
||||||
item,
|
item,
|
||||||
size: imageSize || 300,
|
size: imageSize || 300,
|
||||||
}),
|
}),
|
||||||
isFavorite: item.UserData.IsFavorite || false,
|
itemType: LibraryItem.ALBUM_ARTIST,
|
||||||
lastPlayedAt: null,
|
lastPlayedAt: null,
|
||||||
name: item.Name,
|
name: item.Name,
|
||||||
playCount: item.UserData.PlayCount,
|
playCount: item.UserData.PlayCount,
|
||||||
rating: null,
|
serverId: server.id,
|
||||||
|
serverType: ServerType.JELLYFIN,
|
||||||
songCount: null,
|
songCount: null,
|
||||||
|
userFavorite: item.UserData.IsFavorite || false,
|
||||||
|
userRating: null,
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -759,11 +767,14 @@ const normalizePlaylist = (
|
||||||
id: item.Id,
|
id: item.Id,
|
||||||
imagePlaceholderUrl,
|
imagePlaceholderUrl,
|
||||||
imageUrl: imageUrl || null,
|
imageUrl: imageUrl || null,
|
||||||
|
itemType: LibraryItem.PLAYLIST,
|
||||||
name: item.Name,
|
name: item.Name,
|
||||||
owner: null,
|
owner: null,
|
||||||
ownerId: null,
|
ownerId: null,
|
||||||
public: null,
|
public: null,
|
||||||
rules: null,
|
rules: null,
|
||||||
|
serverId: server.id,
|
||||||
|
serverType: ServerType.JELLYFIN,
|
||||||
size: null,
|
size: null,
|
||||||
songCount: item?.ChildCount || null,
|
songCount: item?.ChildCount || null,
|
||||||
sync: null,
|
sync: null,
|
||||||
|
|
|
@ -72,6 +72,7 @@ import {
|
||||||
albumListSortMap,
|
albumListSortMap,
|
||||||
sortOrderMap,
|
sortOrderMap,
|
||||||
User,
|
User,
|
||||||
|
LibraryItem,
|
||||||
} from '/@/renderer/api/types';
|
} from '/@/renderer/api/types';
|
||||||
import { toast } from '/@/renderer/components/toast';
|
import { toast } from '/@/renderer/components/toast';
|
||||||
import { useAuthStore } from '/@/renderer/store';
|
import { useAuthStore } from '/@/renderer/store';
|
||||||
|
@ -526,7 +527,7 @@ const normalizeSong = (
|
||||||
id,
|
id,
|
||||||
imagePlaceholderUrl,
|
imagePlaceholderUrl,
|
||||||
imageUrl,
|
imageUrl,
|
||||||
isFavorite: item.starred,
|
itemType: LibraryItem.SONG,
|
||||||
lastPlayedAt: item.playDate.includes('0001-') ? null : item.playDate,
|
lastPlayedAt: item.playDate.includes('0001-') ? null : item.playDate,
|
||||||
name: item.title,
|
name: item.title,
|
||||||
path: item.path,
|
path: item.path,
|
||||||
|
@ -534,12 +535,14 @@ const normalizeSong = (
|
||||||
releaseDate: new Date(item.year, 0, 1).toISOString(),
|
releaseDate: new Date(item.year, 0, 1).toISOString(),
|
||||||
releaseYear: String(item.year),
|
releaseYear: String(item.year),
|
||||||
serverId: server.id,
|
serverId: server.id,
|
||||||
|
serverType: ServerType.NAVIDROME,
|
||||||
size: item.size,
|
size: item.size,
|
||||||
streamUrl: `${server.url}/rest/stream.view?id=${id}&v=1.13.0&c=feishin_${deviceId}&${server.credential}`,
|
streamUrl: `${server.url}/rest/stream.view?id=${id}&v=1.13.0&c=feishin_${deviceId}&${server.credential}`,
|
||||||
trackNumber: item.trackNumber,
|
trackNumber: item.trackNumber,
|
||||||
type: ServerType.NAVIDROME,
|
|
||||||
uniqueId: nanoid(),
|
uniqueId: nanoid(),
|
||||||
updatedAt: item.updatedAt,
|
updatedAt: item.updatedAt,
|
||||||
|
userFavorite: item.starred || false,
|
||||||
|
userRating: item.rating || null,
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -566,25 +569,25 @@ const normalizeAlbum = (item: NDAlbum, server: ServerListItem, imageSize?: numbe
|
||||||
imagePlaceholderUrl,
|
imagePlaceholderUrl,
|
||||||
imageUrl,
|
imageUrl,
|
||||||
isCompilation: item.compilation,
|
isCompilation: item.compilation,
|
||||||
isFavorite: item.starred,
|
itemType: LibraryItem.ALBUM,
|
||||||
lastPlayedAt: item.playDate.includes('0001-') ? null : item.playDate,
|
lastPlayedAt: item.playDate.includes('0001-') ? null : item.playDate,
|
||||||
name: item.name,
|
name: item.name,
|
||||||
playCount: item.playCount,
|
playCount: item.playCount,
|
||||||
rating: item.rating,
|
|
||||||
releaseDate: new Date(item.minYear, 0, 1).toISOString(),
|
releaseDate: new Date(item.minYear, 0, 1).toISOString(),
|
||||||
releaseYear: item.minYear,
|
releaseYear: item.minYear,
|
||||||
|
serverId: server.id,
|
||||||
serverType: ServerType.NAVIDROME,
|
serverType: ServerType.NAVIDROME,
|
||||||
size: item.size,
|
size: item.size,
|
||||||
songCount: item.songCount,
|
songCount: item.songCount,
|
||||||
songs: item.songs ? item.songs.map((song) => normalizeSong(song, server, '')) : undefined,
|
songs: item.songs ? item.songs.map((song) => normalizeSong(song, server, '')) : undefined,
|
||||||
uniqueId: nanoid(),
|
uniqueId: nanoid(),
|
||||||
updatedAt: item.updatedAt,
|
updatedAt: item.updatedAt,
|
||||||
|
userFavorite: item.starred,
|
||||||
|
userRating: item.rating,
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
const normalizeAlbumArtist = (item: NDAlbumArtist): AlbumArtist => {
|
const normalizeAlbumArtist = (item: NDAlbumArtist, server: ServerListItem): AlbumArtist => {
|
||||||
console.log('item :>> ', item);
|
|
||||||
|
|
||||||
return {
|
return {
|
||||||
albumCount: item.albumCount,
|
albumCount: item.albumCount,
|
||||||
backgroundImageUrl: null,
|
backgroundImageUrl: null,
|
||||||
|
@ -593,12 +596,15 @@ const normalizeAlbumArtist = (item: NDAlbumArtist): AlbumArtist => {
|
||||||
genres: item.genres,
|
genres: item.genres,
|
||||||
id: item.id,
|
id: item.id,
|
||||||
imageUrl: item.largeImageUrl || null,
|
imageUrl: item.largeImageUrl || null,
|
||||||
isFavorite: item.starred,
|
itemType: LibraryItem.ALBUM_ARTIST,
|
||||||
lastPlayedAt: item.playDate.includes('0001-') ? null : item.playDate,
|
lastPlayedAt: item.playDate.includes('0001-') ? null : item.playDate,
|
||||||
name: item.name,
|
name: item.name,
|
||||||
playCount: item.playCount,
|
playCount: item.playCount,
|
||||||
rating: item.rating,
|
serverId: server.id,
|
||||||
|
serverType: ServerType.NAVIDROME,
|
||||||
songCount: item.songCount,
|
songCount: item.songCount,
|
||||||
|
userFavorite: item.starred,
|
||||||
|
userRating: item.rating,
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -623,11 +629,14 @@ const normalizePlaylist = (
|
||||||
id: item.id,
|
id: item.id,
|
||||||
imagePlaceholderUrl,
|
imagePlaceholderUrl,
|
||||||
imageUrl,
|
imageUrl,
|
||||||
|
itemType: LibraryItem.PLAYLIST,
|
||||||
name: item.name,
|
name: item.name,
|
||||||
owner: item.ownerName,
|
owner: item.ownerName,
|
||||||
ownerId: item.ownerId,
|
ownerId: item.ownerId,
|
||||||
public: item.public,
|
public: item.public,
|
||||||
rules: item?.rules || null,
|
rules: item?.rules || null,
|
||||||
|
serverId: server.id,
|
||||||
|
serverType: ServerType.NAVIDROME,
|
||||||
size: item.size,
|
size: item.size,
|
||||||
songCount: item.songCount,
|
songCount: item.songCount,
|
||||||
sync: item.sync,
|
sync: item.sync,
|
||||||
|
|
|
@ -161,7 +161,9 @@ const albumArtistList = (
|
||||||
);
|
);
|
||||||
break;
|
break;
|
||||||
case 'navidrome':
|
case 'navidrome':
|
||||||
albumArtists = data?.items.map((item) => ndNormalize.albumArtist(item as NDAlbumArtist));
|
albumArtists = data?.items.map((item) =>
|
||||||
|
ndNormalize.albumArtist(item as NDAlbumArtist, server),
|
||||||
|
);
|
||||||
break;
|
break;
|
||||||
case 'subsonic':
|
case 'subsonic':
|
||||||
break;
|
break;
|
||||||
|
|
|
@ -163,19 +163,21 @@ export type Album = {
|
||||||
imagePlaceholderUrl: string | null;
|
imagePlaceholderUrl: string | null;
|
||||||
imageUrl: string | null;
|
imageUrl: string | null;
|
||||||
isCompilation: boolean | null;
|
isCompilation: boolean | null;
|
||||||
isFavorite: boolean;
|
itemType: LibraryItem.ALBUM;
|
||||||
lastPlayedAt: string | null;
|
lastPlayedAt: string | null;
|
||||||
name: string;
|
name: string;
|
||||||
playCount: number | null;
|
playCount: number | null;
|
||||||
rating: number | null;
|
|
||||||
releaseDate: string | null;
|
releaseDate: string | null;
|
||||||
releaseYear: number | null;
|
releaseYear: number | null;
|
||||||
|
serverId: string;
|
||||||
serverType: ServerType;
|
serverType: ServerType;
|
||||||
size: number | null;
|
size: number | null;
|
||||||
songCount: number | null;
|
songCount: number | null;
|
||||||
songs?: Song[];
|
songs?: Song[];
|
||||||
uniqueId: string;
|
uniqueId: string;
|
||||||
updatedAt: string;
|
updatedAt: string;
|
||||||
|
userFavorite: boolean;
|
||||||
|
userRating: number | null;
|
||||||
} & { songs?: Song[] };
|
} & { songs?: Song[] };
|
||||||
|
|
||||||
export type Song = {
|
export type Song = {
|
||||||
|
@ -197,7 +199,7 @@ export type Song = {
|
||||||
id: string;
|
id: string;
|
||||||
imagePlaceholderUrl: string | null;
|
imagePlaceholderUrl: string | null;
|
||||||
imageUrl: string | null;
|
imageUrl: string | null;
|
||||||
isFavorite: boolean;
|
itemType: LibraryItem.SONG;
|
||||||
lastPlayedAt: string | null;
|
lastPlayedAt: string | null;
|
||||||
name: string;
|
name: string;
|
||||||
path: string | null;
|
path: string | null;
|
||||||
|
@ -205,12 +207,14 @@ export type Song = {
|
||||||
releaseDate: string | null;
|
releaseDate: string | null;
|
||||||
releaseYear: string | null;
|
releaseYear: string | null;
|
||||||
serverId: string;
|
serverId: string;
|
||||||
|
serverType: ServerType;
|
||||||
size: number;
|
size: number;
|
||||||
streamUrl: string;
|
streamUrl: string;
|
||||||
trackNumber: number;
|
trackNumber: number;
|
||||||
type: ServerType;
|
|
||||||
uniqueId: string;
|
uniqueId: string;
|
||||||
updatedAt: string;
|
updatedAt: string;
|
||||||
|
userFavorite: boolean;
|
||||||
|
userRating: number | null;
|
||||||
};
|
};
|
||||||
|
|
||||||
export type AlbumArtist = {
|
export type AlbumArtist = {
|
||||||
|
@ -221,12 +225,15 @@ export type AlbumArtist = {
|
||||||
genres: Genre[];
|
genres: Genre[];
|
||||||
id: string;
|
id: string;
|
||||||
imageUrl: string | null;
|
imageUrl: string | null;
|
||||||
isFavorite: boolean;
|
itemType: LibraryItem.ALBUM_ARTIST;
|
||||||
lastPlayedAt: string | null;
|
lastPlayedAt: string | null;
|
||||||
name: string;
|
name: string;
|
||||||
playCount: number | null;
|
playCount: number | null;
|
||||||
rating: number | null;
|
serverId: string;
|
||||||
|
serverType: ServerType;
|
||||||
songCount: number | null;
|
songCount: number | null;
|
||||||
|
userFavorite: boolean;
|
||||||
|
userRating: number | null;
|
||||||
};
|
};
|
||||||
|
|
||||||
export type RelatedAlbumArtist = {
|
export type RelatedAlbumArtist = {
|
||||||
|
@ -238,9 +245,12 @@ export type Artist = {
|
||||||
biography: string | null;
|
biography: string | null;
|
||||||
createdAt: string;
|
createdAt: string;
|
||||||
id: string;
|
id: string;
|
||||||
|
itemType: LibraryItem.ARTIST;
|
||||||
name: string;
|
name: string;
|
||||||
remoteCreatedAt: string | null;
|
remoteCreatedAt: string | null;
|
||||||
serverFolderId: string;
|
serverFolderId: string;
|
||||||
|
serverId: string;
|
||||||
|
serverType: ServerType;
|
||||||
updatedAt: string;
|
updatedAt: string;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -261,11 +271,14 @@ export type Playlist = {
|
||||||
id: string;
|
id: string;
|
||||||
imagePlaceholderUrl: string | null;
|
imagePlaceholderUrl: string | null;
|
||||||
imageUrl: string | null;
|
imageUrl: string | null;
|
||||||
|
itemType: LibraryItem.PLAYLIST;
|
||||||
name: string;
|
name: string;
|
||||||
owner: string | null;
|
owner: string | null;
|
||||||
ownerId: string | null;
|
ownerId: string | null;
|
||||||
public: boolean | null;
|
public: boolean | null;
|
||||||
rules?: Record<string, any> | null;
|
rules?: Record<string, any> | null;
|
||||||
|
serverId: string;
|
||||||
|
serverType: ServerType;
|
||||||
size: number | null;
|
size: number | null;
|
||||||
songCount: number | null;
|
songCount: number | null;
|
||||||
sync?: boolean | null;
|
sync?: boolean | null;
|
||||||
|
|
|
@ -32,3 +32,4 @@ export * from './virtual-table';
|
||||||
export * from './motion';
|
export * from './motion';
|
||||||
export * from './context-menu';
|
export * from './context-menu';
|
||||||
export * from './query-builder';
|
export * from './query-builder';
|
||||||
|
export * from './rating';
|
||||||
|
|
10
src/renderer/components/rating/index.tsx
Normal file
10
src/renderer/components/rating/index.tsx
Normal file
|
@ -0,0 +1,10 @@
|
||||||
|
import { Rating as MantineRating, RatingProps as MantineRatingProps } from '@mantine/core';
|
||||||
|
import styled from 'styled-components';
|
||||||
|
|
||||||
|
type RatingProps = MantineRatingProps;
|
||||||
|
|
||||||
|
const StyledRating = styled(MantineRating)``;
|
||||||
|
|
||||||
|
export const Rating = ({ ...props }: RatingProps) => {
|
||||||
|
return <StyledRating {...props} />;
|
||||||
|
};
|
|
@ -0,0 +1,17 @@
|
||||||
|
import type { ICellRendererParams } from '@ag-grid-community/core';
|
||||||
|
import { RiHeartFill, RiHeartLine } from 'react-icons/ri';
|
||||||
|
import { Button } from '/@/renderer/components/button';
|
||||||
|
import { CellContainer } from '/@/renderer/components/virtual-table/cells/generic-cell';
|
||||||
|
|
||||||
|
export const FavoriteCell = ({ value }: ICellRendererParams) => {
|
||||||
|
return (
|
||||||
|
<CellContainer position="center">
|
||||||
|
<Button
|
||||||
|
compact
|
||||||
|
variant="subtle"
|
||||||
|
>
|
||||||
|
{!value ? <RiHeartLine /> : <RiHeartFill />}
|
||||||
|
</Button>
|
||||||
|
</CellContainer>
|
||||||
|
);
|
||||||
|
};
|
14
src/renderer/components/virtual-table/cells/rating-cell.tsx
Normal file
14
src/renderer/components/virtual-table/cells/rating-cell.tsx
Normal file
|
@ -0,0 +1,14 @@
|
||||||
|
import type { ICellRendererParams } from '@ag-grid-community/core';
|
||||||
|
import { Rating } from '/@/renderer/components/rating';
|
||||||
|
import { CellContainer } from '/@/renderer/components/virtual-table/cells/generic-cell';
|
||||||
|
|
||||||
|
export const RatingCell = ({ value }: ICellRendererParams) => {
|
||||||
|
return (
|
||||||
|
<CellContainer position="center">
|
||||||
|
<Rating
|
||||||
|
size="xs"
|
||||||
|
value={value}
|
||||||
|
/>
|
||||||
|
</CellContainer>
|
||||||
|
);
|
||||||
|
};
|
|
@ -2,10 +2,11 @@ import type { ReactNode } from 'react';
|
||||||
import type { IHeaderParams } from '@ag-grid-community/core';
|
import type { IHeaderParams } from '@ag-grid-community/core';
|
||||||
import { AiOutlineNumber } from 'react-icons/ai';
|
import { AiOutlineNumber } from 'react-icons/ai';
|
||||||
import { FiClock } from 'react-icons/fi';
|
import { FiClock } from 'react-icons/fi';
|
||||||
|
import { RiHeartLine, RiStarLine } from 'react-icons/ri';
|
||||||
import styled from 'styled-components';
|
import styled from 'styled-components';
|
||||||
import { _Text } from '/@/renderer/components/text';
|
import { _Text } from '/@/renderer/components/text';
|
||||||
|
|
||||||
type Presets = 'duration' | 'rowIndex';
|
type Presets = 'duration' | 'rowIndex' | 'userFavorite' | 'userRating';
|
||||||
|
|
||||||
type Options = {
|
type Options = {
|
||||||
children?: ReactNode;
|
children?: ReactNode;
|
||||||
|
@ -39,7 +40,12 @@ const TextHeaderWrapper = styled(_Text)<{ position: Options['position'] }>`
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
`;
|
`;
|
||||||
|
|
||||||
const headerPresets = { duration: <FiClock size={15} />, rowIndex: <AiOutlineNumber size={15} /> };
|
const headerPresets = {
|
||||||
|
duration: <FiClock size={15} />,
|
||||||
|
rowIndex: <AiOutlineNumber size={15} />,
|
||||||
|
userFavorite: <RiHeartLine size={15} />,
|
||||||
|
userRating: <RiStarLine size={15} />,
|
||||||
|
};
|
||||||
|
|
||||||
export const GenericTableHeader = (
|
export const GenericTableHeader = (
|
||||||
{ displayName }: IHeaderParams,
|
{ displayName }: IHeaderParams,
|
||||||
|
|
|
@ -1,5 +1,4 @@
|
||||||
import type { Ref } from 'react';
|
import { Ref, forwardRef, useRef } from 'react';
|
||||||
import { forwardRef, useRef } from 'react';
|
|
||||||
import type {
|
import type {
|
||||||
ICellRendererParams,
|
ICellRendererParams,
|
||||||
ValueGetterParams,
|
ValueGetterParams,
|
||||||
|
@ -25,6 +24,8 @@ import { GenericTableHeader } from '/@/renderer/components/virtual-table/headers
|
||||||
import { AppRoute } from '/@/renderer/router/routes';
|
import { AppRoute } from '/@/renderer/router/routes';
|
||||||
import { PersistedTableColumn } from '/@/renderer/store/settings.store';
|
import { PersistedTableColumn } from '/@/renderer/store/settings.store';
|
||||||
import { TableColumn } from '/@/renderer/types';
|
import { TableColumn } from '/@/renderer/types';
|
||||||
|
import { RatingCell } from '/@/renderer/components/virtual-table/cells/rating-cell';
|
||||||
|
import { FavoriteCell } from '/@/renderer/components/virtual-table/cells/favorite-cell';
|
||||||
|
|
||||||
export * from './table-config-dropdown';
|
export * from './table-config-dropdown';
|
||||||
export * from './table-pagination';
|
export * from './table-pagination';
|
||||||
|
@ -266,6 +267,31 @@ const tableColumns: { [key: string]: ColDef } = {
|
||||||
valueGetter: (params: ValueGetterParams) => (params.data ? params.data.trackNumber : undefined),
|
valueGetter: (params: ValueGetterParams) => (params.data ? params.data.trackNumber : undefined),
|
||||||
width: 80,
|
width: 80,
|
||||||
},
|
},
|
||||||
|
userFavorite: {
|
||||||
|
cellClass: (params) => (params.value ? 'visible ag-cell-favorite' : 'ag-cell-favorite'),
|
||||||
|
cellRenderer: FavoriteCell,
|
||||||
|
colId: TableColumn.USER_FAVORITE,
|
||||||
|
field: 'userFavorite',
|
||||||
|
headerComponent: (params: IHeaderParams) =>
|
||||||
|
GenericTableHeader(params, { position: 'center', preset: 'userFavorite' }),
|
||||||
|
headerName: 'Favorite',
|
||||||
|
suppressSizeToFit: true,
|
||||||
|
valueGetter: (params: ValueGetterParams) =>
|
||||||
|
params.data ? params.data.userFavorite : undefined,
|
||||||
|
width: 50,
|
||||||
|
},
|
||||||
|
userRating: {
|
||||||
|
cellClass: (params) => (params.value ? 'visible ag-cell-rating' : 'ag-cell-rating'),
|
||||||
|
cellRenderer: RatingCell,
|
||||||
|
colId: TableColumn.USER_RATING,
|
||||||
|
field: 'userRating',
|
||||||
|
headerComponent: (params: IHeaderParams) =>
|
||||||
|
GenericTableHeader(params, { position: 'center', preset: 'userRating' }),
|
||||||
|
headerName: 'Rating',
|
||||||
|
suppressSizeToFit: true,
|
||||||
|
valueGetter: (params: ValueGetterParams) => (params.data ? params.data.userRating : undefined),
|
||||||
|
width: 95,
|
||||||
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
export const getColumnDef = (column: TableColumn) => {
|
export const getColumnDef = (column: TableColumn) => {
|
||||||
|
|
|
@ -28,9 +28,9 @@ export const SONG_TABLE_COLUMNS = [
|
||||||
{ label: 'Date Added', value: TableColumn.DATE_ADDED },
|
{ label: 'Date Added', value: TableColumn.DATE_ADDED },
|
||||||
{ label: 'Path', value: TableColumn.PATH },
|
{ label: 'Path', value: TableColumn.PATH },
|
||||||
{ label: 'Plays', value: TableColumn.PLAY_COUNT },
|
{ label: 'Plays', value: TableColumn.PLAY_COUNT },
|
||||||
// { label: 'Favorite', value: TableColumn.FAVORITE },
|
{ label: 'Favorite', value: TableColumn.USER_FAVORITE },
|
||||||
// { label: 'Rating', value: TableColumn.RATING },
|
{ label: 'Rating', value: TableColumn.USER_RATING },
|
||||||
// { label: 'Size', value: TableColumn.SIZE },
|
{ label: 'Size', value: TableColumn.SIZE },
|
||||||
// { label: 'Skip', value: TableColumn.SKIP },
|
// { label: 'Skip', value: TableColumn.SKIP },
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|
|
@ -125,6 +125,26 @@
|
||||||
margin: 0.5rem 0.5rem;
|
margin: 0.5rem 0.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.ag-cell-rating,
|
||||||
|
.ag-cell-favorite {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ag-cell-rating.visible {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ag-cell-favorite.visible {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ag-row-hover {
|
||||||
|
.ag-cell-rating,
|
||||||
|
.ag-cell-favorite {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.ag-header-cell,
|
.ag-header-cell,
|
||||||
.ag-header-group-cell {
|
.ag-header-group-cell {
|
||||||
padding-left: 0.5rem;
|
padding-left: 0.5rem;
|
||||||
|
|
Reference in a new issue