Extract app page history from nav bar context

src/modules/core/contexts/AppContext.tsx

@@ -27,6 +27,7 @@ import { ReaderContextProvider } from '@/modules/reader/contexts/ReaderContextPr
 import { DIRECTION_TO_CACHE } from '@/modules/theme/ThemeDirectionCache.ts';
 import { AppHotkeysProvider } from '@/modules/hotkeys/contexts/AppHotkeysProvider.tsx';
 import { SnackbarWithDescription } from '@/modules/core/components/snackbar/SnackbarWithDescription.tsx';
+import { AppPageHistoryContextProvider } from '@/modules/core/contexts/AppPageHistoryContextProvider.tsx';
 
 interface Props {
     children: React.ReactNode;
@@ -93,21 +94,23 @@ export const AppContext: React.FC<Props> = ({ children }) => {
                             <QueryParamProvider adapter={ReactRouter6Adapter}>
                                 <LibraryOptionsContextProvider>
                                     <NavBarContextProvider>
-                                        <ActiveDeviceContextProvider>
+                                        <AppPageHistoryContextProvider>
-                                            <SnackbarProvider
+                                            <ActiveDeviceContextProvider>
-                                                Components={{
+                                                <SnackbarProvider
-                                                    default: SnackbarWithDescription,
+                                                    Components={{
-                                                    info: SnackbarWithDescription,
+                                                        default: SnackbarWithDescription,
-                                                    success: SnackbarWithDescription,
+                                                        info: SnackbarWithDescription,
-                                                    warning: SnackbarWithDescription,
+                                                        success: SnackbarWithDescription,
-                                                    error: SnackbarWithDescription,
+                                                        warning: SnackbarWithDescription,
-                                                }}
+                                                        error: SnackbarWithDescription,
-                                            >
+                                                    }}
-                                                <ReaderContextProvider>
+                                                >
-                                                    <AppHotkeysProvider>{children}</AppHotkeysProvider>
+                                                    <ReaderContextProvider>
-                                                </ReaderContextProvider>
+                                                        <AppHotkeysProvider>{children}</AppHotkeysProvider>
-                                            </SnackbarProvider>
+                                                    </ReaderContextProvider>
-                                        </ActiveDeviceContextProvider>
+                                                </SnackbarProvider>
+                                            </ActiveDeviceContextProvider>
+                                        </AppPageHistoryContextProvider>
                                     </NavBarContextProvider>
                                 </LibraryOptionsContextProvider>
                             </QueryParamProvider>

src/modules/core/contexts/AppPageHistoryContext.tsx

@@ -0,0 +1,13 @@
+/*
+ * 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 { createContext, useContext } from 'react';
+
+export const AppPageHistoryContext = createContext<string[]>([]);
+
+export const useAppPageHistoryContext = () => useContext(AppPageHistoryContext);

src/modules/core/contexts/AppPageHistoryContextProvider.tsx

@@ -0,0 +1,17 @@
+/*
+ * 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 React from 'react';
+import { AppPageHistoryContext } from '@/modules/core/contexts/AppPageHistoryContext.tsx';
+import { useHistory } from '@/modules/core/hooks/useHistory.ts';
+
+export const AppPageHistoryContextProvider = ({ children }: { children: React.ReactNode }) => {
+    const history = useHistory();
+
+    return <AppPageHistoryContext.Provider value={history}>{children}</AppPageHistoryContext.Provider>;
+};

src/modules/core/hooks/useBackButton.ts

@@ -8,15 +8,15 @@
 
 import { useLocation, useNavigate } from 'react-router-dom';
 import { useCallback } from 'react';
-import { useNavBarContext } from '@/modules/navigation-bar/contexts/NavbarContext.tsx';
 import { AppRoutes } from '@/modules/core/AppRoute.constants.ts';
+import { useAppPageHistoryContext } from '@/modules/core/contexts/AppPageHistoryContext.tsx';
 
 const PAGES_TO_IGNORE: readonly RegExp[] = [/\/manga\/[0-9]+\/chapter\/[0-9]+/g];
 
 export const useBackButton = () => {
     const navigate = useNavigate();
     const location = useLocation();
-    const { history } = useNavBarContext();
+    const history = useAppPageHistoryContext();
 
     return useCallback(() => {
         const isHistoryEmpty = !history.length;

src/modules/navigation-bar/NavigationBar.types.ts

@@ -24,8 +24,6 @@ export interface NavbarItem {
 }
 
 export type NavbarContextType = {
-    history: string[];
-
     // AppBar title
     title: string | React.ReactNode;
     setTitle: (title: NavbarContextType['title'], browserTitle?: string) => void;

src/modules/navigation-bar/contexts/NavBarContextProvider.tsx

@@ -8,7 +8,6 @@
 
 import React, { useCallback, useMemo, useState } from 'react';
 import { NavBarContext } from '@/modules/navigation-bar/contexts/NavbarContext.tsx';
-import { useHistory } from '@/modules/core/hooks/useHistory.ts';
 import { useLocalStorage } from '@/modules/core/hooks/useStorage.tsx';
 import { INavbarOverride } from '@/modules/navigation-bar/NavigationBar.types.ts';
 
@@ -29,8 +28,6 @@ export function NavBarContextProvider({ children }: IProps) {
     const [readerNavBarWidth, setReaderNavBarWidth] = useState(0);
     const [bottomBarHeight, setBottomBarHeight] = useState(0);
 
-    const history = useHistory();
-
     const updateTitle = useCallback(
         (newTitle: string | React.ReactNode, browserTitle: string = typeof newTitle === 'string' ? newTitle : '') => {
             document.title = `${browserTitle} - Suwayomi`;
@@ -41,7 +38,6 @@ export function NavBarContextProvider({ children }: IProps) {
 
     const value = useMemo(
         () => ({
-            history,
             title,
             setTitle: updateTitle,
             appBarHeight,
@@ -60,7 +56,6 @@ export function NavBarContextProvider({ children }: IProps) {
             setBottomBarHeight,
         }),
         [
-            history,
             title,
             updateTitle,
             appBarHeight,

src/modules/navigation-bar/contexts/NavbarContext.tsx

@@ -11,7 +11,6 @@ import React, { useContext } from 'react';
 import { NavbarContextType } from '@/modules/navigation-bar/NavigationBar.types.ts';
 
 export const NavBarContext = React.createContext<NavbarContextType>({
-    history: [],
     title: 'Suwayomi',
     setTitle: (): void => {},
     appBarHeight: 0,