mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
Merge pull request #4880 from grafixeyehero/sort-options
Use sort options based on view type
This commit is contained in:
commit
ad79f39910
2 changed files with 79 additions and 27 deletions
|
@ -16,7 +16,14 @@ import { LibraryTab } from 'types/libraryTab';
|
|||
import { ItemSortBy } from '@jellyfin/sdk/lib/models/api/item-sort-by';
|
||||
import { SortOrder } from '@jellyfin/sdk/lib/generated-client';
|
||||
|
||||
const sortMenuOptions = [
|
||||
type SortOption = {
|
||||
label: string;
|
||||
value: ItemSortBy;
|
||||
};
|
||||
|
||||
type SortOptionsMapping = Record<string, SortOption[]>;
|
||||
|
||||
const movieOrFavoriteOptions = [
|
||||
{ label: 'Name', value: ItemSortBy.SortName },
|
||||
{ label: 'OptionRandom', value: ItemSortBy.Random },
|
||||
{ label: 'OptionImdbRating', value: ItemSortBy.CommunityRating },
|
||||
|
@ -29,6 +36,66 @@ const sortMenuOptions = [
|
|||
{ label: 'Runtime', value: ItemSortBy.Runtime }
|
||||
];
|
||||
|
||||
const sortOptionsMapping: SortOptionsMapping = {
|
||||
[LibraryTab.Movies]: movieOrFavoriteOptions,
|
||||
[LibraryTab.Trailers]: [
|
||||
{ label: 'Name', value: ItemSortBy.SortName },
|
||||
{ label: 'OptionImdbRating', value: ItemSortBy.CommunityRating },
|
||||
{ label: 'OptionDateAdded', value: ItemSortBy.DateCreated },
|
||||
{ label: 'OptionDatePlayed', value: ItemSortBy.DatePlayed },
|
||||
{ label: 'OptionParentalRating', value: ItemSortBy.OfficialRating },
|
||||
{ label: 'OptionPlayCount', value: ItemSortBy.PlayCount },
|
||||
{ label: 'OptionReleaseDate', value: ItemSortBy.PremiereDate }
|
||||
],
|
||||
[LibraryTab.Favorites]: movieOrFavoriteOptions,
|
||||
[LibraryTab.Series]: [
|
||||
{ label: 'Name', value: ItemSortBy.SortName },
|
||||
{ label: 'OptionRandom', value: ItemSortBy.Random },
|
||||
{ label: 'OptionImdbRating', value: ItemSortBy.CommunityRating },
|
||||
{ label: 'OptionDateShowAdded', value: ItemSortBy.DateCreated },
|
||||
{ label: 'OptionDateEpisodeAdded', value: ItemSortBy.DateLastContentAdded },
|
||||
{ label: 'OptionDatePlayed', value: ItemSortBy.SeriesDatePlayed },
|
||||
{ label: 'OptionParentalRating', value: ItemSortBy.OfficialRating },
|
||||
{ label: 'OptionReleaseDate', value: ItemSortBy.PremiereDate }
|
||||
],
|
||||
[LibraryTab.Episodes]: [
|
||||
{ label: 'Name', value: ItemSortBy.SeriesSortName },
|
||||
{ label: 'OptionImdbRating', value: ItemSortBy.CommunityRating },
|
||||
{ label: 'OptionDateAdded', value: ItemSortBy.DateCreated },
|
||||
{ label: 'OptionReleaseDate', value: ItemSortBy.PremiereDate },
|
||||
{ label: 'OptionDatePlayed', value: ItemSortBy.DatePlayed },
|
||||
{ label: 'OptionParentalRating', value: ItemSortBy.OfficialRating },
|
||||
{ label: 'OptionPlayCount', value: ItemSortBy.PlayCount },
|
||||
{ label: 'Runtime', value: ItemSortBy.Runtime },
|
||||
{ label: 'OptionRandom', value: ItemSortBy.Random }
|
||||
],
|
||||
[LibraryTab.Albums]: [
|
||||
{ label: 'Name', value: ItemSortBy.SortName },
|
||||
{ label: 'OptionRandom', value: ItemSortBy.Random },
|
||||
{ label: 'AlbumArtist', value: ItemSortBy.AlbumArtist },
|
||||
{ label: 'OptionImdbRating', value: ItemSortBy.CommunityRating },
|
||||
{ label: 'OptionCriticRating', value: ItemSortBy.CriticRating },
|
||||
{ label: 'OptionReleaseDate', value: ItemSortBy.ProductionYear },
|
||||
{ label: 'OptionDateAdded', value: ItemSortBy.DateCreated }
|
||||
],
|
||||
[LibraryTab.Songs]: [
|
||||
{ label: 'Name', value: ItemSortBy.SortName },
|
||||
{ label: 'Album', value: ItemSortBy.Album },
|
||||
{ label: 'AlbumArtist', value: ItemSortBy.AlbumArtist },
|
||||
{ label: 'Artist', value: ItemSortBy.Artist },
|
||||
{ label: 'OptionDateAdded', value: ItemSortBy.DateCreated },
|
||||
{ label: 'OptionDatePlayed', value: ItemSortBy.DatePlayed },
|
||||
{ label: 'OptionPlayCount', value: ItemSortBy.PlayCount },
|
||||
{ label: 'OptionReleaseDate', value: ItemSortBy.PremiereDate },
|
||||
{ label: 'Runtime', value: ItemSortBy.Runtime },
|
||||
{ label: 'OptionRandom', value: ItemSortBy.Random }
|
||||
]
|
||||
};
|
||||
|
||||
const getSortMenuOptions = (viewType: LibraryTab): SortOption[] => {
|
||||
return sortOptionsMapping[viewType] || [];
|
||||
};
|
||||
|
||||
const sortOrderMenuOptions = [
|
||||
{ label: 'Ascending', value: SortOrder.Ascending },
|
||||
{ label: 'Descending', value: SortOrder.Descending }
|
||||
|
@ -72,25 +139,7 @@ const SortButton: FC<SortButtonProps> = ({
|
|||
[setLibraryViewSettings]
|
||||
);
|
||||
|
||||
const getVisibleSortMenu = () => {
|
||||
const visibleSortMenu: ItemSortBy[] = [ItemSortBy.SortName, ItemSortBy.Random, ItemSortBy.DateCreated];
|
||||
|
||||
if (
|
||||
viewType !== LibraryTab.Photos
|
||||
&& viewType !== LibraryTab.Videos
|
||||
&& viewType !== LibraryTab.Books
|
||||
) {
|
||||
visibleSortMenu.push(ItemSortBy.CommunityRating);
|
||||
visibleSortMenu.push(ItemSortBy.CriticRating);
|
||||
visibleSortMenu.push(ItemSortBy.DatePlayed);
|
||||
visibleSortMenu.push(ItemSortBy.OfficialRating);
|
||||
visibleSortMenu.push(ItemSortBy.PlayCount);
|
||||
visibleSortMenu.push(ItemSortBy.PremiereDate);
|
||||
visibleSortMenu.push(ItemSortBy.Runtime);
|
||||
}
|
||||
|
||||
return visibleSortMenu;
|
||||
};
|
||||
const sortMenuOptions = getSortMenuOptions(viewType);
|
||||
|
||||
return (
|
||||
<Box>
|
||||
|
@ -120,7 +169,6 @@ const SortButton: FC<SortButtonProps> = ({
|
|||
'& .MuiFormControl-root': { m: 1, width: 200 }
|
||||
}}
|
||||
>
|
||||
|
||||
<FormControl fullWidth>
|
||||
<InputLabel id='select-sort-label'>
|
||||
<Typography component='span'>
|
||||
|
@ -136,7 +184,6 @@ const SortButton: FC<SortButtonProps> = ({
|
|||
onChange={onSelectChange}
|
||||
>
|
||||
{sortMenuOptions
|
||||
.filter((option) => getVisibleSortMenu().includes(option.value))
|
||||
.map((option) => (
|
||||
<MenuItem
|
||||
key={option.value}
|
||||
|
@ -166,10 +213,7 @@ const SortButton: FC<SortButtonProps> = ({
|
|||
onChange={onSelectChange}
|
||||
>
|
||||
{sortOrderMenuOptions.map((option) => (
|
||||
<MenuItem
|
||||
key={option.value}
|
||||
value={option.value}
|
||||
>
|
||||
<MenuItem key={option.value} value={option.value}>
|
||||
<Typography component='span'>
|
||||
{option.label}
|
||||
</Typography>
|
||||
|
|
|
@ -144,6 +144,14 @@ export const getSettingsKey = (viewType: LibraryTab, parentId: ParentId) => {
|
|||
return `${viewType} - ${parentId}`;
|
||||
};
|
||||
|
||||
export const getDefaultSortBy = (viewType: LibraryTab) => {
|
||||
if (viewType === LibraryTab.Episodes) {
|
||||
return ItemSortBy.SeriesSortName;
|
||||
}
|
||||
|
||||
return ItemSortBy.SortName;
|
||||
};
|
||||
|
||||
export const getDefaultLibraryViewSettings = (viewType: LibraryTab): LibraryViewSettings => {
|
||||
return {
|
||||
ShowTitle: true,
|
||||
|
@ -151,7 +159,7 @@ export const getDefaultLibraryViewSettings = (viewType: LibraryTab): LibraryView
|
|||
ViewMode: viewType === LibraryTab.Songs ? ViewMode.ListView : ViewMode.GridView,
|
||||
ImageType: viewType === LibraryTab.Networks ? ImageType.Thumb : ImageType.Primary,
|
||||
CardLayout: false,
|
||||
SortBy: ItemSortBy.SortName,
|
||||
SortBy: getDefaultSortBy(viewType),
|
||||
SortOrder: SortOrder.Ascending,
|
||||
StartIndex: 0
|
||||
};
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue