vanja/feishin
1
0
Fork 0
mirror of https://github.com/jeffvli/feishin.git synced 2026-05-10 04:30:25 +02:00
Code Issues Packages Projects Releases Wiki Activity

handle favorite/rating column mutations

Browse Source
This commit is contained in:
jeffvli
2025-10-10 11:31:21 -07:00
parent b2dd3ed699
commit 241e265e02
12 changed files with 334 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/renderer/components/item-list/item-table-list/columns/album-artists-column.tsx
+6 -11
View File
@@ -1,5 +1,5 @@
import clsx from 'clsx';
import { memo, useMemo } from 'react';
import { Fragment, memo, useMemo } from 'react';
import { generatePath, Link } from 'react-router-dom';
import styles from './album-artists-column.module.css';
@@ -39,17 +39,12 @@ const AlbumArtistsColumn = (props: ItemTableListInnerColumn) => {
})}
>
{albumArtists.map((albumArtist, index) => (
<Text
component={Link}
isLink
isMuted
isNoSelect
key={albumArtist.id}
to={albumArtist.path}
>
{albumArtist.name}
<Fragment key={albumArtist.id}>
<Text component={Link} isLink isMuted isNoSelect to={albumArtist.path}>
{albumArtist.name}
</Text>
{index < albumArtists.length - 1 && ', '}
</Text>
</Fragment>
))}
</div>
</TableColumnContainer>
src/renderer/components/item-list/item-table-list/columns/artists-column.tsx
+6 -11
View File
@@ -1,5 +1,5 @@
import clsx from 'clsx';
import { memo, useMemo } from 'react';
import { Fragment, memo, useMemo } from 'react';
import { generatePath, Link } from 'react-router-dom';
import styles from './album-artists-column.module.css';
@@ -39,17 +39,12 @@ const ArtistsColumn = (props: ItemTableListInnerColumn) => {
})}
>
{artists.map((artist, index) => (
<Text
component={Link}
isLink
isMuted
isNoSelect
key={artist.id}
to={artist.path}
>
{artist.name}
<Fragment key={artist.id}>
<Text component={Link} isLink isMuted isNoSelect to={artist.path}>
{artist.name}
</Text>
{index < artists.length - 1 && ', '}
</Text>
</Fragment>
))}
</div>
</TableColumnContainer>
src/renderer/components/item-list/item-table-list/columns/favorite-column.tsx
+25
View File
@@ -2,13 +2,19 @@ import {
ItemTableListInnerColumn,
TableColumnContainer,
} from '/@/renderer/components/item-list/item-table-list/item-table-list-column';
import { useCreateFavorite } from '/@/renderer/features/shared/mutations/create-favorite-mutation';
import { useDeleteFavorite } from '/@/renderer/features/shared/mutations/delete-favorite-mutation';
import { ActionIcon } from '/@/shared/components/action-icon/action-icon';
import { LibraryItem } from '/@/shared/types/domain-types';
export const FavoriteColumn = (props: ItemTableListInnerColumn) => {
const row: boolean | undefined = (props.data as (any | undefined)[])[props.rowIndex]?.[
props.columns[props.columnIndex].id
];
const createFavorite = useCreateFavorite({});
const deleteFavorite = useDeleteFavorite({});
if (typeof row === 'boolean') {
return (
<TableColumnContainer {...props}>
@@ -20,6 +26,25 @@ export const FavoriteColumn = (props: ItemTableListInnerColumn) => {
fill: row ? 'primary' : undefined,
size: 'md',
}}
onClick={() => {
if (row) {
deleteFavorite.mutate({
query: {
id: [(props.data as any)?.[props.rowIndex]?.id as string],
type: (props.data as any)?.[props.rowIndex]
?.itemType as LibraryItem,
},
});
} else {
createFavorite.mutate({
query: {
id: [(props.data as any)?.[props.rowIndex]?.id as string],
type: (props.data as any)?.[props.rowIndex]
?.itemType as LibraryItem,
},
});
}
}}
size="xs"
variant="subtle"
/>
src/renderer/components/item-list/item-table-list/columns/genre-column.module.css
+2 -1
View File
@@ -2,8 +2,9 @@
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
color: var(--theme-colors-foreground-muted);
user-select: none;
-webkit-box-orient: vertical;
}
.genres-container.compact {
src/renderer/components/item-list/item-table-list/columns/genre-column.tsx
+6 -11
View File
@@ -1,5 +1,5 @@
import clsx from 'clsx';
import { memo, useMemo } from 'react';
import { Fragment, memo, useMemo } from 'react';
import { generatePath, Link } from 'react-router-dom';
import styles from './genre-column.module.css';
@@ -39,17 +39,12 @@ const GenreColumn = (props: ItemTableListInnerColumn) => {
})}
>
{genres.map((genre, index) => (
<Text
component={Link}
isLink
isMuted
isNoSelect
key={genre.id}
to={genre.path}
>
{genre.name}
<Fragment key={genre.id}>
<Text component={Link} isLink isMuted isNoSelect to={genre.path}>
{genre.name}
</Text>
{index < genres.length - 1 && ', '}
</Text>
</Fragment>
))}
</div>
</TableColumnContainer>
src/renderer/components/item-list/item-table-list/columns/rating-column.tsx
+24
View File
@@ -2,6 +2,7 @@ import {
ItemTableListInnerColumn,
TableColumnContainer,
} from '/@/renderer/components/item-list/item-table-list/item-table-list-column';
import { useSetRating } from '/@/renderer/features/shared/mutations/set-rating-mutation';
import { Rating } from '/@/shared/components/rating/rating';
export const RatingColumn = (props: ItemTableListInnerColumn) => {
@@ -9,11 +10,34 @@ export const RatingColumn = (props: ItemTableListInnerColumn) => {
props.columns[props.columnIndex].id
];
const setRatingMutation = useSetRating({});
const handleChangeRating = (rating: number) => {
const previousRating = row || 0;
let newRating = rating;
if (previousRating === rating) {
newRating = 0;
}
const item = props.data[props.rowIndex] as any;
setRatingMutation.mutate({
query: {
item: [item],
rating: newRating,
},
serverId: item.serverId as string,
});
};
if (typeof row === 'number' || row === null) {
return (
<TableColumnContainer {...props}>
<Rating
className={row ? undefined : 'hover-only-flex'}
onChange={handleChangeRating}
size="xs"
value={row || 0}
/>
src/renderer/components/item-list/item-table-list/columns/row-index-column.tsx
+1 -1
View File
@@ -30,7 +30,7 @@ export const RowIndexColumn = (props: ItemTableListInnerColumn) => {
size="xs"
variant="subtle"
/>
<Text className="hide-on-hover" isMuted>
<Text className="hide-on-hover" isMuted isNoSelect>
{props.rowIndex}
</Text>
</TableColumnContainer>