From 63c1ac95eb25d7b80e5c7328159d1f896ab42146 Mon Sep 17 00:00:00 2001 From: schroda <50052685+schroda@users.noreply.github.com> Date: Thu, 8 Jun 2023 14:25:24 +0200 Subject: [PATCH] Feature/remove use back to util (#360) * Remove "useBackTo" Not needed * Use browser back navigation to close the reader This will cause the previous page (manga or updates) to be opened instead of always opening the manga page --- src/components/MangaCard.tsx | 3 +-- src/components/manga/ChapterCard.tsx | 2 -- src/components/manga/ResumeFAB.tsx | 9 +-------- src/components/navbar/DefaultNavBar.tsx | 10 ++++------ src/components/navbar/ReaderNavBar.tsx | 8 +++----- src/screens/DownloadQueue.tsx | 2 -- src/util/useBackTo.ts | 25 ------------------------- 7 files changed, 9 insertions(+), 50 deletions(-) delete mode 100644 src/util/useBackTo.ts diff --git a/src/components/MangaCard.tsx b/src/components/MangaCard.tsx index 851b36c4..f718a442 100644 --- a/src/components/MangaCard.tsx +++ b/src/components/MangaCard.tsx @@ -15,7 +15,6 @@ import { Avatar, Box, CardContent, Grid, styled } from '@mui/material'; import { useTranslation } from 'react-i18next'; import { IMangaCard } from '@/typings'; import requestManager from '@/lib/RequestManager'; -import { BACK } from '@/util/useBackTo'; import useLocalStorage from '@/util/useLocalStorage'; import { GridLayout, useLibraryOptionsContext } from '@/components/context/LibraryOptionsContext'; import SpinnerImage from '@/components/util/SpinnerImage'; @@ -89,7 +88,7 @@ const MangaCard = React.forwardRef((props: IProps, ref) const [ItemWidth] = useLocalStorage('ItemWidth', 300); - const mangaLinkTo = { pathname: `/manga/${id}/`, state: { backLink: BACK } }; + const mangaLinkTo = `/manga/${id}/`; if (gridLayout !== GridLayout.List) { const columns = Math.ceil(dimensions / ItemWidth); diff --git a/src/components/manga/ChapterCard.tsx b/src/components/manga/ChapterCard.tsx index aaeb7bc3..e6e492c4 100644 --- a/src/components/manga/ChapterCard.tsx +++ b/src/components/manga/ChapterCard.tsx @@ -30,7 +30,6 @@ import { useTranslation } from 'react-i18next'; import { IChapter, IDownloadChapter } from '@/typings'; import requestManager from '@/lib/RequestManager'; import { getUploadDateString } from '@/util/date'; -import { BACK } from '@/util/useBackTo'; import DownloadStateIndicator from '@/components/molecules/DownloadStateIndicator'; interface IProps { @@ -113,7 +112,6 @@ const ChapterCard: React.FC = (props: IProps) => { + {index === 1 ? t('global.button.start') : t('global.button.resume')} diff --git a/src/components/navbar/DefaultNavBar.tsx b/src/components/navbar/DefaultNavBar.tsx index 0cfd6859..11f9cf4b 100644 --- a/src/components/navbar/DefaultNavBar.tsx +++ b/src/components/navbar/DefaultNavBar.tsx @@ -27,7 +27,6 @@ import ArrowBack from '@mui/icons-material/ArrowBack'; import { Link, useLocation, useNavigate } from 'react-router-dom'; import { createPortal } from 'react-dom'; import { NavbarItem } from '@/typings'; -import useBackTo from '@/util/useBackTo'; import NavBarContext from '@/components/context/NavbarContext'; import ExtensionOutlinedIcon from '@/components/util/CustomExtensionOutlinedIcon'; import DesktopSideBar from '@/components/navbar/navigation/DesktopSideBar'; @@ -86,8 +85,7 @@ const navbarItems: Array = [ ]; export default function DefaultNavBar() { - const { title, action, override } = useContext(NavBarContext); - const backTo = useBackTo(); + const { title, action, override, defaultBackTo: backToUrl } = useContext(NavBarContext); const theme = useTheme(); const navigate = useNavigate(); @@ -109,7 +107,7 @@ export default function DefaultNavBar() { } const handleBack = () => { - if (backTo.url != null) return; + if (backToUrl != null) return; navigate(-1); }; @@ -119,8 +117,8 @@ export default function DefaultNavBar() { {!isMainRoute && ( ({ @@ -126,7 +125,6 @@ interface IProps { export default function ReaderNavBar(props: IProps) { const { t } = useTranslation(); const navigate = useNavigate(); - const backTo = useBackTo(); const location = useLocation<{ prevDrawerOpen?: boolean; prevSettingsCollapseOpen?: boolean; @@ -188,9 +186,9 @@ export default function ReaderNavBar(props: IProps) { }, [handleScroll]); // handleScroll changes on every render const handleClose = () => { - if (backTo.back) navigate(-1); - else if (backTo.url) navigate(backTo.url); - else navigate(`/manga/${manga.id}`); + // this works because opening previous/next chapter will replace the current history element. + // in case this gets changed this has to be updated + navigate(-1); }; return ( diff --git a/src/screens/DownloadQueue.tsx b/src/screens/DownloadQueue.tsx index c2d4e381..ea76fab4 100644 --- a/src/screens/DownloadQueue.tsx +++ b/src/screens/DownloadQueue.tsx @@ -21,7 +21,6 @@ import { useTranslation } from 'react-i18next'; import { IChapter, IQueue } from '@/typings'; import requestManager from '@/lib/RequestManager'; import StrictModeDroppable from '@/lib/StrictModeDroppable'; -import { BACK } from '@/util/useBackTo'; import makeToast from '@/components/util/Toast'; import { NavbarToolbar } from '@/components/navbar/DefaultNavBar'; import DownloadStateIndicator from '@/components/molecules/DownloadStateIndicator'; @@ -120,7 +119,6 @@ const DownloadQueue: React.FC = () => { { - const location = useLocation<{ backLink?: string }>(); - const { defaultBackTo } = useNavBarContext(); - - const url = location.state?.backLink ?? defaultBackTo; - return { - url: url === BACK ? undefined : url, - back: url === BACK, - }; -}; - -export default useBackTo;