Move library display options to global metadata

- showContinueReadingButton
- showDownloadBadge
- showUnreadBadge

src/modules/category/services/CategoryMetadata.ts

@@ -25,9 +25,6 @@ import { GridLayout } from '@/modules/core/Core.types.ts';
 
 export const DEFAULT_CATEGORY_METADATA: ICategoryMetadata = {
     // display options
-    showContinueReadingButton: false,
-    showDownloadBadge: false,
-    showUnreadBadge: false,
     gridLayout: GridLayout.Compact,
 
     // sort options

src/modules/library/Library.types.ts

@@ -15,6 +15,9 @@ export type MetadataLibrarySettings = {
     ignoreFilters: boolean;
     removeMangaFromCategories: boolean;
     showTabSize: boolean;
+    showContinueReadingButton: boolean;
+    showDownloadBadge: boolean;
+    showUnreadBadge: boolean;
 };
 export type LibrarySortMode =
     | 'unreadChapters'
@@ -27,9 +30,6 @@ export type LibrarySortMode =
 
 export interface LibraryOptions {
     // display options
-    showContinueReadingButton: boolean;
-    showDownloadBadge: boolean;
-    showUnreadBadge: boolean;
     gridLayout: GridLayout;
 
     // sort options

src/modules/library/components/LibraryOptionsPanel.tsx

@@ -22,6 +22,7 @@ import { createUpdateCategoryMetadata, useGetCategoryMetadata } from '@/modules/
 import { makeToast } from '@/modules/core/utils/Toast.ts';
 import {
     createUpdateMetadataServerSettings,
+    updateMetadataServerSettings,
     useMetadataServerSettings,
 } from '@/modules/settings/services/ServerSettingsMetadata.ts';
 import { TranslationKey } from '@/Base.types.ts';
@@ -67,9 +68,9 @@ export const LibraryOptionsPanel = ({
     );
 
     const {
-        settings: { showTabSize },
+        settings: { showTabSize, showContinueReadingButton, showDownloadBadge, showUnreadBadge },
     } = useMetadataServerSettings();
-    const setSettingValue = createUpdateMetadataServerSettings<'showTabSize'>((e) =>
+    const setSettingValue = createUpdateMetadataServerSettings((e) =>
         makeToast(t('search.error.label.failed_to_save_settings'), 'error', getErrorMessage(e)),
     );
 
@@ -155,8 +156,7 @@ export const LibraryOptionsPanel = ({
                     ));
                 }
                 if (key === 'display') {
-                    const { gridLayout, showContinueReadingButton, showDownloadBadge, showUnreadBadge } =
-                        categoryLibraryOptions;
+                    const { gridLayout } = categoryLibraryOptions;
                     return (
                         <>
                             <FormLabel>{t('global.grid_layout.title')}</FormLabel>
@@ -185,12 +185,12 @@ export const LibraryOptionsPanel = ({
                             <CheckboxInput
                                 label={t('library.option.display.badge.label.unread_badges')}
                                 checked={showUnreadBadge}
-                                onChange={() => updateCategoryLibraryOptions('showUnreadBadge', !showUnreadBadge)}
+                                onChange={() => updateMetadataServerSettings('showUnreadBadge', !showUnreadBadge)}
                             />
                             <CheckboxInput
                                 label={t('library.option.display.badge.label.download_badges')}
                                 checked={showDownloadBadge}
-                                onChange={() => updateCategoryLibraryOptions('showDownloadBadge', !showDownloadBadge)}
+                                onChange={() => updateMetadataServerSettings('showDownloadBadge', !showDownloadBadge)}
                             />
 
                             <FormLabel sx={{ mt: 2 }}>{t('library.option.display.tab.title')}</FormLabel>
@@ -205,7 +205,7 @@ export const LibraryOptionsPanel = ({
                                 label={t('library.option.display.other.label.show_continue_reading_button')}
                                 checked={showContinueReadingButton}
                                 onChange={() =>
-                                    updateCategoryLibraryOptions(
+                                    updateMetadataServerSettings(
                                         'showContinueReadingButton',
                                         !showContinueReadingButton,
                                     )

src/modules/manga/components/MangaBadges.tsx

@@ -12,7 +12,7 @@ import Button from '@mui/material/Button';
 import Typography from '@mui/material/Typography';
 import { MangaCardMode } from '@/modules/manga/Manga.types.ts';
 import { MediaQuery } from '@/modules/core/utils/MediaQuery.tsx';
-import { useLibraryOptionsContext } from '@/modules/library/contexts/LibraryOptionsContext.tsx';
+import { useMetadataServerSettings } from '@/modules/settings/services/ServerSettingsMetadata.ts';
 
 const BadgeContainer = styled('div')(({ theme }) => ({
     display: 'flex',
@@ -46,8 +46,8 @@ export const MangaBadges = ({
     const isTouchDevice = MediaQuery.useIsTouchDevice();
 
     const {
-        options: { showUnreadBadge, showDownloadBadge },
-    } = useLibraryOptionsContext();
+        settings: { showUnreadBadge, showDownloadBadge },
+    } = useMetadataServerSettings();
 
     return (
         <BadgeContainer>

src/modules/manga/components/cards/MangaCard.tsx

@@ -9,7 +9,6 @@
 import PopupState, { bindMenu } from 'material-ui-popup-state';
 import { useMemo, useState } from 'react';
 import { useLongPress } from 'use-long-press';
-import { useLibraryOptionsContext } from '@/modules/library/contexts/LibraryOptionsContext.tsx';
 import { MangaActionMenuItems, SingleModeProps } from '@/modules/manga/components/MangaActionMenuItems.tsx';
 import { Menu } from '@/modules/core/components/menu/Menu.tsx';
 import { MigrateDialog } from '@/modules/migration/components/MigrateDialog.tsx';
@@ -21,6 +20,7 @@ import { ContinueReadingButton } from '@/modules/manga/components/ContinueReadin
 import { MangaBadges } from '@/modules/manga/components/MangaBadges.tsx';
 import { GridLayout } from '@/modules/core/Core.types.ts';
 import { AppRoutes } from '@/modules/core/AppRoute.constants.ts';
+import { useMetadataServerSettings } from '@/modules/settings/services/ServerSettingsMetadata.ts';
 
 const getMangaLinkTo = (
     mode: MangaCardMode,
@@ -46,8 +46,8 @@ export const MangaCard = (props: MangaCardProps) => {
     const { manga, gridLayout, inLibraryIndicator, selected, handleSelection, mode = 'default' } = props;
     const { id, firstUnreadChapter, downloadCount, unreadCount } = manga;
     const {
-        options: { showContinueReadingButton },
-    } = useLibraryOptionsContext();
+        settings: { showContinueReadingButton },
+    } = useMetadataServerSettings();
 
     const { CategorySelectComponent, updateLibraryState, isInLibrary } = useManageMangaLibraryState(
         manga,

src/modules/settings/Settings.constants.ts

@@ -22,6 +22,9 @@ export const SERVER_SETTINGS_METADATA_DEFAULT: MetadataServerSettings = {
     ignoreFilters: false,
     removeMangaFromCategories: false,
     showTabSize: false,
+    showContinueReadingButton: false,
+    showDownloadBadge: false,
+    showUnreadBadge: false,
 
     // client
     devices: [DEFAULT_DEVICE],