From df129f723ae47e3f03ca795aa7061edb049a9d78 Mon Sep 17 00:00:00 2001 From: schroda <50052685+schroda@users.noreply.github.com> Date: Mon, 16 Sep 2024 11:35:55 +0200 Subject: [PATCH] Rename library option variable names --- .../context/LibraryOptionsContext.tsx | 14 +-- .../library/LibraryOptionsPanel.tsx | 45 +++++----- src/components/library/LibraryToolbarMenu.tsx | 8 +- .../library/useGetVisibleLibraryMangas.ts | 86 +++++++++++++------ src/typings.ts | 30 +++---- 5 files changed, 108 insertions(+), 75 deletions(-) diff --git a/src/components/context/LibraryOptionsContext.tsx b/src/components/context/LibraryOptionsContext.tsx index 56670a3f..ddbda8da 100644 --- a/src/components/context/LibraryOptionsContext.tsx +++ b/src/components/context/LibraryOptionsContext.tsx @@ -26,21 +26,21 @@ export const DefaultLibraryOptions: LibraryOptions = { showDownloadBadge: false, showUnreadBadge: false, gridLayout: GridLayout.Compact, - SourcegridLayout: GridLayout.Compact, + sourceGridLayout: GridLayout.Compact, showTabSize: false, // sort options sortDesc: undefined, - sorts: undefined, + sortBy: undefined, // filter options - downloaded: undefined, - bookmarked: undefined, - unread: undefined, + hasDownloadedChapters: undefined, + hasBookmarkedChapters: undefined, + hasUnreadChapters: undefined, hasDuplicateChapters: undefined, - tracker: {}, - status: {} as LibraryOptions['status'], + hasTrackerBinding: {}, + hasStatus: {} as LibraryOptions['hasStatus'], }; export const LibraryOptionsContext = React.createContext({ diff --git a/src/components/library/LibraryOptionsPanel.tsx b/src/components/library/LibraryOptionsPanel.tsx index 4fa3a60b..64523864 100644 --- a/src/components/library/LibraryOptionsPanel.tsx +++ b/src/components/library/LibraryOptionsPanel.tsx @@ -30,13 +30,13 @@ const TITLES: { [key in 'filter' | 'sort' | 'display']: TranslationKey } = { }; const SORT_OPTIONS: [LibrarySortMode, TranslationKey][] = [ - ['sortToRead', 'library.option.sort.label.by_unread_chapters'], - ['sortTotalChapters', 'library.option.sort.label.by_total_chapters'], - ['sortAlph', 'library.option.sort.label.alphabetically'], - ['sortDateAdded', 'library.option.sort.label.by_date_added'], - ['sortLastRead', 'library.option.sort.label.by_last_read'], - ['sortLatestFetchedChapter', 'library.option.sort.label.by_latest_fetched_chapter'], - ['sortLatestUploadedChapter', 'library.option.sort.label.by_latest_uploaded_chapter'], + ['unreadChapters', 'library.option.sort.label.by_unread_chapters'], + ['totalChapters', 'library.option.sort.label.by_total_chapters'], + ['alphabetically', 'library.option.sort.label.alphabetically'], + ['dateAdded', 'library.option.sort.label.by_date_added'], + ['lastRead', 'library.option.sort.label.by_last_read'], + ['latestFetchedChapter', 'library.option.sort.label.by_latest_fetched_chapter'], + ['latestUploadedChapter', 'library.option.sort.label.by_latest_uploaded_chapter'], ]; interface IProps { @@ -67,18 +67,18 @@ export const LibraryOptionsPanel: React.FC = ({ open, onClose }) => { <> handleFilterChange('unread', c)} + checked={options.hasUnreadChapters} + onChange={(c) => handleFilterChange('hasUnreadChapters', c)} /> handleFilterChange('downloaded', c)} + checked={options.hasDownloadedChapters} + onChange={(c) => handleFilterChange('hasDownloadedChapters', c)} /> handleFilterChange('bookmarked', c)} + checked={options.hasBookmarkedChapters} + onChange={(c) => handleFilterChange('hasBookmarkedChapters', c)} /> = ({ open, onClose }) => { {Object.values(MangaStatus).map((status) => ( - handleFilterChange('status', { - ...options.status, + handleFilterChange('hasStatus', { + ...options.hasStatus, [status]: checked, }) } @@ -103,9 +103,12 @@ export const LibraryOptionsPanel: React.FC = ({ open, onClose }) => { - handleFilterChange('tracker', { ...options.tracker, [tracker.id]: checked }) + handleFilterChange('hasTrackerBinding', { + ...options.hasTrackerBinding, + [tracker.id]: checked, + }) } /> ))} @@ -117,11 +120,11 @@ export const LibraryOptionsPanel: React.FC = ({ open, onClose }) => { - mode !== options.sorts - ? handleFilterChange('sorts', mode) + mode !== options.sortBy + ? handleFilterChange('sortBy', mode) : handleFilterChange('sortDesc', !options.sortDesc) } /> diff --git a/src/components/library/LibraryToolbarMenu.tsx b/src/components/library/LibraryToolbarMenu.tsx index fe8bfde3..6d2db0aa 100644 --- a/src/components/library/LibraryToolbarMenu.tsx +++ b/src/components/library/LibraryToolbarMenu.tsx @@ -11,8 +11,8 @@ import IconButton from '@mui/material/IconButton'; import Tooltip from '@mui/material/Tooltip'; import React, { useState } from 'react'; import { useTranslation } from 'react-i18next'; -import { useLibraryOptionsContext } from '@/components/context/LibraryOptionsContext'; import { LibraryOptionsPanel } from '@/components/library/LibraryOptionsPanel'; +import { useLibraryOptionsContext } from '@/components/context/LibraryOptionsContext.tsx'; export const LibraryToolbarMenu: React.FC = () => { const { t } = useTranslation(); @@ -20,9 +20,9 @@ export const LibraryToolbarMenu: React.FC = () => { const [open, setOpen] = useState(false); const { options } = useLibraryOptionsContext(); const active = - options.downloaded != null || - options.unread != null || - Object.values(options.tracker).some((trackerFilterStatus) => trackerFilterStatus != null); + options.hasDownloadedChapters != null || + options.hasUnreadChapters != null || + Object.values(options.hasTrackerBinding).some((trackerFilterStatus) => trackerFilterStatus != null); return ( <> diff --git a/src/components/library/useGetVisibleLibraryMangas.ts b/src/components/library/useGetVisibleLibraryMangas.ts index 19c64d61..9798f165 100644 --- a/src/components/library/useGetVisibleLibraryMangas.ts +++ b/src/components/library/useGetVisibleLibraryMangas.ts @@ -77,7 +77,7 @@ const querySearchManga = ( performSearch([query], [source?.displayName]); type TMangaTrackerFilter = { trackRecords: { nodes: Pick[] } }; -const trackerFilter = (trackFilters: LibraryOptions['tracker'], manga: TMangaTrackerFilter): boolean => +const trackerFilter = (trackFilters: LibraryOptions['hasTrackerBinding'], manga: TMangaTrackerFilter): boolean => Object.entries(trackFilters) .map(([trackFilterId, trackFilterState]) => { const isTrackerBound = manga.trackRecords.nodes.some( @@ -93,28 +93,40 @@ const trackerFilter = (trackFilters: LibraryOptions['tracker'], manga: TMangaTra .every(Boolean); type TMangaStatusFilter = Pick; -const statusFilter = (statusFilters: LibraryOptions['status'], manga: TMangaStatusFilter): boolean => +const statusFilter = (statusFilters: LibraryOptions['hasStatus'], manga: TMangaStatusFilter): boolean => Object.entries(statusFilters) .map(([status, statusFilterState]) => triStateFilterBoolean(statusFilterState, status === manga.status)) .every(Boolean); type TMangaFilterOptions = Pick< LibraryOptions, - 'unread' | 'downloaded' | 'bookmarked' | 'hasDuplicateChapters' | 'tracker' | 'status' + | 'hasUnreadChapters' + | 'hasDownloadedChapters' + | 'hasBookmarkedChapters' + | 'hasDuplicateChapters' + | 'hasTrackerBinding' + | 'hasStatus' >; type TMangaFilter = Pick & TMangaTrackerFilter & TMangaStatusFilter; const filterManga = ( manga: TMangaFilter, - { unread, downloaded, bookmarked, hasDuplicateChapters, tracker, status }: TMangaFilterOptions, + { + hasDownloadedChapters, + hasUnreadChapters, + hasBookmarkedChapters, + hasDuplicateChapters, + hasTrackerBinding, + hasStatus, + }: TMangaFilterOptions, ): boolean => - triStateFilterNumber(downloaded, manga.downloadCount) && - triStateFilterNumber(unread, manga.unreadCount) && - triStateFilterNumber(bookmarked, manga.bookmarkCount) && + triStateFilterNumber(hasDownloadedChapters, manga.downloadCount) && + triStateFilterNumber(hasUnreadChapters, manga.unreadCount) && + triStateFilterNumber(hasBookmarkedChapters, manga.bookmarkCount) && triStateFilterBoolean(hasDuplicateChapters, manga.hasDuplicateChapters) && - trackerFilter(tracker, manga) && - statusFilter(status, manga); + trackerFilter(hasTrackerBinding, manga) && + statusFilter(hasStatus, manga); type TMangasFilter = TMangaQueryFilter & TMangaFilter; const filterMangas = ( @@ -150,27 +162,27 @@ const sortManga = ( const result = [...manga]; switch (sort) { - case 'sortAlph': + case 'alphabetically': result.sort((a, b) => sortByString(a.title, b.title)); break; - case 'sortDateAdded': + case 'dateAdded': result.sort((a, b) => sortByNumber(a.inLibraryAt, b.inLibraryAt)); break; - case 'sortToRead': + case 'unreadChapters': result.sort((a, b) => sortByNumber(a.unreadCount, b.unreadCount)); break; - case 'sortLastRead': + case 'lastRead': result.sort((a, b) => sortByNumber(a.lastReadChapter?.lastReadAt, b.lastReadChapter?.lastReadAt)); break; - case 'sortLatestUploadedChapter': + case 'latestUploadedChapter': result.sort((a, b) => sortByNumber(a.latestUploadedChapter?.uploadDate, b.latestUploadedChapter?.uploadDate), ); break; - case 'sortLatestFetchedChapter': + case 'latestFetchedChapter': result.sort((a, b) => sortByNumber(a.latestFetchedChapter?.fetchedAt, b.latestFetchedChapter?.fetchedAt)); break; - case 'sortTotalChapters': + case 'totalChapters': result.sort((a, b) => sortByNumber(a.chapters.totalCount, b.chapters.totalCount)); break; default: @@ -192,30 +204,48 @@ export const useGetVisibleLibraryMangas = { const [query] = useQueryParam('query', StringParam); const { options } = useLibraryOptionsContext(); - const { unread, downloaded, bookmarked, tracker, hasDuplicateChapters, status } = options; + const { + hasUnreadChapters, + hasDownloadedChapters, + hasBookmarkedChapters, + hasTrackerBinding, + hasDuplicateChapters, + hasStatus, + } = options; const { settings } = useMetadataServerSettings(); const filteredMangas = useMemo( () => filterMangas(mangas, query, { - unread, - downloaded, - bookmarked, - hasDuplicateChapters, - tracker, - status, + ...options, ignoreFilters: settings.ignoreFilters, }), - [mangas, query, unread, downloaded, bookmarked, hasDuplicateChapters, tracker, settings.ignoreFilters], + [ + mangas, + query, + hasUnreadChapters, + hasDownloadedChapters, + hasBookmarkedChapters, + hasTrackerBinding, + hasDuplicateChapters, + hasStatus, + settings.ignoreFilters, + ], ); const sortedMangas = useMemo( - () => sortManga(filteredMangas, options.sorts, options.sortDesc), - [filteredMangas, options.sorts, options.sortDesc], + () => sortManga(filteredMangas, options.sortBy, options.sortDesc), + [filteredMangas, options.sortBy, options.sortDesc], ); - const isATrackFilterActive = Object.values(options.tracker).some((trackFilterState) => trackFilterState != null); + const isATrackFilterActive = Object.values(options.hasTrackerBinding).some( + (trackFilterState) => trackFilterState != null, + ); const showFilteredOutMessage = - (unread != null || downloaded != null || bookmarked != null || !!query || isATrackFilterActive) && + (hasUnreadChapters != null || + hasDownloadedChapters != null || + hasBookmarkedChapters != null || + !!query || + isATrackFilterActive) && filteredMangas.length === 0 && mangas.length > 0; diff --git a/src/typings.ts b/src/typings.ts index aadbc095..e9c54b9a 100644 --- a/src/typings.ts +++ b/src/typings.ts @@ -252,13 +252,13 @@ export type ChapterOptionsReducerAction = | { type: 'showChapterNumber' }; export type LibrarySortMode = - | 'sortToRead' - | 'sortAlph' - | 'sortDateAdded' - | 'sortLastRead' - | 'sortLatestFetchedChapter' - | 'sortLatestUploadedChapter' - | 'sortTotalChapters'; + | 'unreadChapters' + | 'totalChapters' + | 'alphabetically' + | 'dateAdded' + | 'lastRead' + | 'latestFetchedChapter' + | 'latestUploadedChapter'; enum GridLayout { Compact = 0, @@ -272,20 +272,20 @@ export interface LibraryOptions { showDownloadBadge: boolean; showUnreadBadge: boolean; gridLayout: GridLayout; - SourcegridLayout: GridLayout; + sourceGridLayout: GridLayout; + showTabSize: boolean; // sort options - sorts: NullAndUndefined; + sortBy: NullAndUndefined; sortDesc: NullAndUndefined; // filter options - downloaded: NullAndUndefined; - bookmarked: NullAndUndefined; - unread: NullAndUndefined; + hasDownloadedChapters: NullAndUndefined; + hasBookmarkedChapters: NullAndUndefined; + hasUnreadChapters: NullAndUndefined; hasDuplicateChapters: NullAndUndefined; - showTabSize: boolean; - tracker: Record>; - status: Record>; + hasTrackerBinding: Record>; + hasStatus: Record>; } export type ServerSettings = GetServerSettingsQuery['settings'];