Move browse files into new folder
This commit is contained in:
11
src/modules/browse/Browse.types.ts
Normal file
11
src/modules/browse/Browse.types.ts
Normal file
@@ -0,0 +1,11 @@
|
||||
/*
|
||||
* Copyright (C) Contributors to the Suwayomi project
|
||||
*
|
||||
* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at https://mozilla.org/MPL/2.0/.
|
||||
*/
|
||||
|
||||
export type MetadataBrowseSettings = {
|
||||
hideLibraryEntries: boolean;
|
||||
};
|
||||
73
src/modules/browse/screens/Browse.tsx
Normal file
73
src/modules/browse/screens/Browse.tsx
Normal file
@@ -0,0 +1,73 @@
|
||||
/*
|
||||
* Copyright (C) Contributors to the Suwayomi project
|
||||
*
|
||||
* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at https://mozilla.org/MPL/2.0/.
|
||||
*/
|
||||
|
||||
import { useCallback, useContext, useLayoutEffect, useRef, useState } from 'react';
|
||||
import Tab from '@mui/material/Tab';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { StringParam, useQueryParam } from 'use-query-params';
|
||||
import { Sources } from '@/modules/source/screens/Sources.tsx';
|
||||
import { Extensions } from '@/modules/extension/screens/Extensions.tsx';
|
||||
import { TabPanel } from '@/modules/core/components/tabs/TabPanel.tsx';
|
||||
import { TabsWrapper } from '@/modules/core/components/tabs/TabsWrapper.tsx';
|
||||
import { TabsMenu } from '@/modules/core/components/tabs/TabsMenu.tsx';
|
||||
import { Migration } from '@/modules/migration/screens/Migration.tsx';
|
||||
import { NavBarContext } from '@/modules/navigation-bar/contexts/NavbarContext.tsx';
|
||||
import { useResizeObserver } from '@/modules/core/hooks/useResizeObserver.tsx';
|
||||
|
||||
enum Tabs {
|
||||
SOURCE = 'source',
|
||||
EXTENSIONS = 'extensions',
|
||||
MIGRATE = 'migrate',
|
||||
}
|
||||
|
||||
export function Browse() {
|
||||
const { t } = useTranslation();
|
||||
const { setTitle } = useContext(NavBarContext);
|
||||
|
||||
useLayoutEffect(() => {
|
||||
setTitle(t('global.label.browse'));
|
||||
}, [t]);
|
||||
|
||||
const tabsMenuRef = useRef<HTMLDivElement | null>(null);
|
||||
const [tabsMenuHeight, setTabsMenuHeight] = useState(0);
|
||||
useResizeObserver(
|
||||
tabsMenuRef,
|
||||
useCallback(() => setTabsMenuHeight(tabsMenuRef.current!.offsetHeight), [tabsMenuRef.current]),
|
||||
);
|
||||
|
||||
const [tabSearchParam, setTabSearchParam] = useQueryParam('tab', StringParam, {});
|
||||
const tabName = (tabSearchParam as Tabs) ?? Tabs.SOURCE;
|
||||
|
||||
if (!tabSearchParam) {
|
||||
setTabSearchParam(tabName, 'replaceIn');
|
||||
}
|
||||
|
||||
return (
|
||||
<TabsWrapper>
|
||||
<TabsMenu
|
||||
ref={tabsMenuRef}
|
||||
variant="fullWidth"
|
||||
value={tabName}
|
||||
onChange={(_, newTab) => setTabSearchParam(newTab, 'replaceIn')}
|
||||
>
|
||||
<Tab value={Tabs.SOURCE} sx={{ textTransform: 'none' }} label={t('source.title_one')} />
|
||||
<Tab value={Tabs.EXTENSIONS} sx={{ textTransform: 'none' }} label={t('extension.title_other')} />
|
||||
<Tab value={Tabs.MIGRATE} sx={{ textTransform: 'none' }} label={t('migrate.title')} />
|
||||
</TabsMenu>
|
||||
<TabPanel index={Tabs.SOURCE} currentIndex={tabName}>
|
||||
<Sources />
|
||||
</TabPanel>
|
||||
<TabPanel index={Tabs.EXTENSIONS} currentIndex={tabName}>
|
||||
<Extensions tabsMenuHeight={tabsMenuHeight} />
|
||||
</TabPanel>
|
||||
<TabPanel index={Tabs.MIGRATE} currentIndex={tabName}>
|
||||
<Migration tabsMenuHeight={tabsMenuHeight} />
|
||||
</TabPanel>
|
||||
</TabsWrapper>
|
||||
);
|
||||
}
|
||||
157
src/modules/browse/screens/BrowseSettings.tsx
Normal file
157
src/modules/browse/screens/BrowseSettings.tsx
Normal file
@@ -0,0 +1,157 @@
|
||||
/*
|
||||
* Copyright (C) Contributors to the Suwayomi project
|
||||
*
|
||||
* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at https://mozilla.org/MPL/2.0/.
|
||||
*/
|
||||
|
||||
import { Trans, useTranslation } from 'react-i18next';
|
||||
import { useContext, useLayoutEffect } from 'react';
|
||||
import List from '@mui/material/List';
|
||||
import ListItem from '@mui/material/ListItem';
|
||||
import ListItemText from '@mui/material/ListItemText';
|
||||
import Switch from '@mui/material/Switch';
|
||||
import { NavBarContext } from '@/modules/navigation-bar/contexts/NavbarContext.tsx';
|
||||
import { requestManager } from '@/lib/requests/requests/RequestManager.ts';
|
||||
import { NumberSetting } from '@/modules/core/components/settings/NumberSetting.tsx';
|
||||
import { MutableListSetting } from '@/modules/core/components/settings/MutableListSetting.tsx';
|
||||
import { ServerSettings as GqlServerSettings } from '@/typings.ts';
|
||||
import { TextSetting } from '@/modules/core/components/settings/text/TextSetting.tsx';
|
||||
import { useLocalStorage } from '@/modules/core/hooks/useStorage.tsx';
|
||||
import {
|
||||
createUpdateMetadataServerSettings,
|
||||
useMetadataServerSettings,
|
||||
} from '@/lib/metadata/metadataServerSettings.ts';
|
||||
import { LoadingPlaceholder } from '@/modules/core/components/placeholder/LoadingPlaceholder.tsx';
|
||||
import { EmptyViewAbsoluteCentered } from '@/modules/core/components/placeholder/EmptyViewAbsoluteCentered.tsx';
|
||||
import { defaultPromiseErrorHandler } from '@/lib/DefaultPromiseErrorHandler.ts';
|
||||
import { makeToast } from '@/lib/ui/Toast.ts';
|
||||
import { MetadataBrowseSettings } from '@/modules/browse/Browse.types.ts';
|
||||
|
||||
type ExtensionsSettings = Pick<GqlServerSettings, 'maxSourcesInParallel' | 'localSourcePath' | 'extensionRepos'>;
|
||||
|
||||
const extractBrowseSettings = (settings: GqlServerSettings): ExtensionsSettings => ({
|
||||
maxSourcesInParallel: settings.maxSourcesInParallel,
|
||||
localSourcePath: settings.localSourcePath,
|
||||
extensionRepos: settings.extensionRepos,
|
||||
});
|
||||
|
||||
export const BrowseSettings = () => {
|
||||
const { t } = useTranslation();
|
||||
const { setTitle, setAction } = useContext(NavBarContext);
|
||||
|
||||
useLayoutEffect(() => {
|
||||
setTitle(t('settings.browse.title'));
|
||||
setAction(null);
|
||||
}, [t]);
|
||||
|
||||
const [showNsfw, setShowNsfw] = useLocalStorage<boolean>('showNsfw', true);
|
||||
|
||||
const { data, loading, error, refetch } = requestManager.useGetServerSettings({
|
||||
notifyOnNetworkStatusChange: true,
|
||||
});
|
||||
const [mutateSettings] = requestManager.useUpdateServerSettings();
|
||||
|
||||
const updateSetting = <Setting extends keyof ExtensionsSettings>(
|
||||
setting: Setting,
|
||||
value: ExtensionsSettings[Setting],
|
||||
) => {
|
||||
mutateSettings({ variables: { input: { settings: { [setting]: value } } } }).catch(() =>
|
||||
makeToast(t('global.error.label.failed_to_save_changes'), 'error'),
|
||||
);
|
||||
};
|
||||
|
||||
const {
|
||||
settings: { hideLibraryEntries },
|
||||
} = useMetadataServerSettings();
|
||||
const updateMetadataServerSettings = createUpdateMetadataServerSettings<keyof MetadataBrowseSettings>(() =>
|
||||
makeToast(t('global.error.label.failed_to_save_changes'), 'error'),
|
||||
);
|
||||
|
||||
if (loading) {
|
||||
return <LoadingPlaceholder />;
|
||||
}
|
||||
|
||||
if (error) {
|
||||
return (
|
||||
<EmptyViewAbsoluteCentered
|
||||
message={t('global.error.label.failed_to_load_data')}
|
||||
messageExtra={error.message}
|
||||
retry={() => refetch().catch(defaultPromiseErrorHandler('BrowseSettings::refetch'))}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
const serverSettings = extractBrowseSettings(data!.settings);
|
||||
|
||||
return (
|
||||
<List sx={{ pt: 0 }}>
|
||||
<ListItem>
|
||||
<ListItemText primary={t('settings.label.hide_library_entries')} />
|
||||
<Switch
|
||||
edge="end"
|
||||
checked={hideLibraryEntries}
|
||||
onChange={() => updateMetadataServerSettings('hideLibraryEntries', !hideLibraryEntries)}
|
||||
/>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<ListItemText
|
||||
primary={t('settings.label.show_nsfw')}
|
||||
secondary={t('settings.label.show_nsfw_description')}
|
||||
/>
|
||||
<Switch edge="end" checked={showNsfw} onChange={() => setShowNsfw(!showNsfw)} />
|
||||
</ListItem>
|
||||
<NumberSetting
|
||||
settingTitle={t('settings.server.requests.sources.parallel.label.title')}
|
||||
settingValue={t('settings.server.requests.sources.parallel.label.value', {
|
||||
value: serverSettings.maxSourcesInParallel,
|
||||
count: serverSettings.maxSourcesInParallel,
|
||||
})}
|
||||
valueUnit={t('source.title_one')}
|
||||
value={serverSettings.maxSourcesInParallel}
|
||||
defaultValue={6}
|
||||
minValue={1}
|
||||
maxValue={20}
|
||||
showSlider
|
||||
stepSize={1}
|
||||
handleUpdate={(parallelSources) => updateSetting('maxSourcesInParallel', parallelSources)}
|
||||
/>
|
||||
<MutableListSetting
|
||||
settingName={t('extension.settings.repositories.custom.label.title')}
|
||||
description={t('extension.settings.repositories.custom.label.description')}
|
||||
dialogDisclaimer={
|
||||
<Trans i18nKey="extension.settings.repositories.custom.label.disclaimer">
|
||||
<strong>Suwayomi does not provide any support for 3rd party repositories or extensions!</strong>
|
||||
<br />
|
||||
Use with caution as there could be malicious actors making those repositories.
|
||||
<br />
|
||||
You as the user need to verify the security and that you trust any repository or extension.
|
||||
</Trans>
|
||||
}
|
||||
handleChange={(repos) => {
|
||||
updateSetting('extensionRepos', repos);
|
||||
requestManager.clearExtensionCache();
|
||||
}}
|
||||
valueInfos={serverSettings.extensionRepos.map((extensionRepo) => [extensionRepo])}
|
||||
addItemButtonTitle={t('extension.settings.repositories.custom.dialog.action.button.add')}
|
||||
placeholder="https://github.com/MY_ACCOUNT/MY_REPO/tree/repo"
|
||||
validateItem={(repo) =>
|
||||
!!repo.match(
|
||||
/https:\/\/(www\.|raw\.)?(github|githubusercontent)\.com\/([^/]+)\/([^/]+)((\/tree|\/blob)?\/([^/\n]*))?(\/([^/\n]*\.json)?)?/g,
|
||||
)
|
||||
}
|
||||
invalidItemError={t('extension.settings.repositories.custom.error.label.invalid_url')}
|
||||
/>
|
||||
<TextSetting
|
||||
settingName={t('settings.server.local_source.path.label.title')}
|
||||
dialogDescription={t('settings.server.local_source.path.label.description')}
|
||||
value={serverSettings.localSourcePath}
|
||||
settingDescription={
|
||||
serverSettings.localSourcePath.length ? serverSettings.localSourcePath : t('global.label.default')
|
||||
}
|
||||
handleChange={(path) => updateSetting('localSourcePath', path)}
|
||||
/>
|
||||
</List>
|
||||
);
|
||||
};
|
||||
Reference in New Issue
Block a user