diff --git a/.oxlintrc.jsonc b/.oxlintrc.jsonc index c7c7958e..597ef3e7 100644 --- a/.oxlintrc.jsonc +++ b/.oxlintrc.jsonc @@ -407,28 +407,16 @@ "overrides": [ { "files": [ - "src/base/components/settings/NumberSetting.tsx", "src/base/utils/MediaQuery.tsx", "src/features/authentication/AuthManager.ts", - "src/features/browse/extensions/components/ExtensionCard.tsx", "src/features/chapter/services/Chapters.ts", - "src/features/extension/info/components/ActionButton.tsx", - "src/features/manga/components/TrackMangaButton.tsx", - "src/features/manga/services/Mangas.ts", "src/features/metadata/services/MetadataMigrations.ts", - "src/features/migration/components/MigrateDialog.tsx", - "src/features/navigation-bar/components/MobileBottomBar.tsx", "src/features/reader/services/ReaderControls.ts", "src/features/reader/services/ReaderService.ts", - "src/features/settings/screens/ImageProcessingSetting.tsx", - "src/features/source/browse/components/SourceOptions.tsx", - "src/features/source/browse/components/filters/SelectFilter.tsx", "src/features/source/services/Sources.ts", - "src/lib/dayjs/LocaleImporter.ts", "src/lib/dnd-kit/DndKitUtil.ts", "src/lib/requests/RequestManager.ts", "src/lib/requests/client/GraphQLClient.ts", - "src/lib/service-worker/ImageCache.ts", "src/lib/virtuoso/Virtuoso.util.tsx" ], "rules": { diff --git a/src/features/manga/components/TrackMangaButton.tsx b/src/features/manga/components/TrackMangaButton.tsx index d4a9b825..57960215 100644 --- a/src/features/manga/components/TrackMangaButton.tsx +++ b/src/features/manga/components/TrackMangaButton.tsx @@ -27,6 +27,7 @@ import { MediaQuery } from '@/base/utils/MediaQuery.tsx'; export const TrackMangaButton = ({ manga }: { manga: MangaTrackRecordInfo & Pick }) => { const { t } = useLingui(); const navigate = useNavigate(); + const isMobileWidth = MediaQuery.useIsMobileWidth(); const trackerList = requestManager.useGetTrackerList(GET_TRACKERS_SETTINGS); const trackers = trackerList.data?.trackers.nodes ?? []; @@ -55,7 +56,7 @@ export const TrackMangaButton = ({ manga }: { manga: MangaTrackRecordInfo & Pick <> handleClick(popupState.open)} variant={trackersInUse.length ? 'contained' : 'outlined'} diff --git a/src/features/navigation-bar/components/MobileBottomBar.tsx b/src/features/navigation-bar/components/MobileBottomBar.tsx index 3aeb5a18..b17a41ae 100644 --- a/src/features/navigation-bar/components/MobileBottomBar.tsx +++ b/src/features/navigation-bar/components/MobileBottomBar.tsx @@ -20,8 +20,32 @@ import { useNavBarContext } from '@/features/navigation-bar/NavbarContext.tsx'; import type { NavbarItem } from '@/features/navigation-bar/NavigationBar.types.ts'; import type { StaticAppRoute } from '@/base/AppRoute.constants.ts'; -export const MobileBottomBar = ({ navBarItems }: { navBarItems: NavbarItem[] }) => { +const BottomNavigationItem = ({ + path, + title, + useBadge, + SelectedIconComponent, + IconComponent, + isActive, +}: NavbarItem & { isActive: boolean }) => { const { t } = useLingui(); + const count = useBadge?.()?.count; + + return ( + + {isActive ? : } + + } + /> + ); +}; + +export const MobileBottomBar = ({ navBarItems }: { navBarItems: NavbarItem[] }) => { const theme = useTheme(); const { setBottomBarHeight } = useNavBarContext(); const location = useLocation(); @@ -66,16 +90,11 @@ export const MobileBottomBar = ({ navBarItems }: { navBarItems: NavbarItem[] }) navigate(newValue); }} > - {navBarItems.map(({ path, title, IconComponent, SelectedIconComponent, useBadge }) => ( - - {selectedNavBarItem === path ? : } - - } + {navBarItems.map((navbarItem) => ( + ))} diff --git a/src/features/settings/screens/ImageProcessingSetting.tsx b/src/features/settings/screens/ImageProcessingSetting.tsx index 50d96722..fdb5e3f8 100644 --- a/src/features/settings/screens/ImageProcessingSetting.tsx +++ b/src/features/settings/screens/ImageProcessingSetting.tsx @@ -22,7 +22,6 @@ import { getErrorMessage } from '@/lib/HelperFunctions.ts'; import { LoadingPlaceholder } from '@/base/components/feedback/LoadingPlaceholder.tsx'; import { EmptyViewAbsoluteCentered } from '@/base/components/feedback/EmptyViewAbsoluteCentered.tsx'; import { defaultPromiseErrorHandler } from '@/lib/DefaultPromiseErrorHandler.ts'; -import { assertIsDefined } from '@/base/Asserts.ts'; import { useAppTitle } from '@/features/navigation-bar/hooks/useAppTitle.ts'; import { addStableIdToConversions, @@ -45,25 +44,9 @@ export const ImageProcessingSetting = ({ type }: { type: ImageProcessingType }) }); const [mutateSettings] = requestManager.useUpdateServerSettings(); - if (loading) { - return ; - } - - if (error) { - return ( - refetch().catch(defaultPromiseErrorHandler('ImageProcessingSetting::refetch'))} - /> - ); - } - const settingKey = IMAGE_PROCESSING_TYPE_TO_SETTING[type]; - assertIsDefined(data?.settings?.[settingKey]); - - const conversions = data?.settings?.[settingKey]; + const conversions = data?.settings?.[settingKey] ?? []; const [tmpConversions, setTmpConversions] = useState( normalizeConversions(maybeAddDefault(addStableIdToConversions(conversions))), @@ -90,6 +73,20 @@ export const ImageProcessingSetting = ({ type }: { type: ImageProcessingType }) } }; + if (loading) { + return ; + } + + if (error) { + return ( + refetch().catch(defaultPromiseErrorHandler('ImageProcessingSetting::refetch'))} + /> + ); + } + return ( diff --git a/src/features/source/browse/components/filters/SelectFilter.tsx b/src/features/source/browse/components/filters/SelectFilter.tsx index 85fc0acf..463bf163 100644 --- a/src/features/source/browse/components/filters/SelectFilter.tsx +++ b/src/features/source/browse/components/filters/SelectFilter.tsx @@ -6,7 +6,7 @@ * file, You can obtain one at https://mozilla.org/MPL/2.0/. */ -import React from 'react'; +import React, { useState } from 'react'; import InputLabel from '@mui/material/InputLabel'; import FormControl from '@mui/material/FormControl'; import MenuItem from '@mui/material/MenuItem'; @@ -23,7 +23,7 @@ interface Props { update: any; } -function noSelect( +function NoSelect( values: string[], name: string, state: number, @@ -32,7 +32,7 @@ function noSelect( update: any, group?: number, ) { - const [val, setval] = React.useState(state); + const [val, setval] = useState(state); if (values) { const handleChange = (event: { target: { name: any; value: any } }) => { @@ -62,4 +62,4 @@ function noSelect( } export const SelectFilter: React.FC = ({ values, name, state, position, updateFilterValue, update, group }) => - noSelect(values, name, state, position, updateFilterValue, update, group); + NoSelect(values, name, state, position, updateFilterValue, update, group);