From f81b20b4fdec6956466e1adf60a999def4a2b174 Mon Sep 17 00:00:00 2001
From: schroda <50052685+schroda@users.noreply.github.com>
Date: Thu, 28 Dec 2023 16:07:50 +0100
Subject: [PATCH] Fix/library continue read button causes page refresh (#521)

* Use app routing to open reader

Otherwise, the app loses the navigation history and won't open the last page (library) when closing the reader

* Prevent setting 0 as grid width

After the change of 4ebe6494f6c97c0d064c617f70b36682e6aedcb2, closing the reader and coming back to the library resulted in a single manga per row, due to the grids width being 0.
---
 src/components/MangaGrid.tsx                   | 12 +++++++++++-
 src/components/manga/ContinueReadingButton.tsx |  5 ++++-
 2 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/src/components/MangaGrid.tsx b/src/components/MangaGrid.tsx
index 84a0133c..978dff63 100644
--- a/src/components/MangaGrid.tsx
+++ b/src/components/MangaGrid.tsx
@@ -223,7 +223,17 @@ export const MangaGrid: React.FC<IMangaGridProps> = (props) => {
     );
 
     const updateGridWidth = () => {
-        setDimensions(gridRef.current?.offsetWidth ?? document.documentElement.offsetWidth);
+        const getDimensions = () => {
+            const gridWidth = gridRef.current?.offsetWidth;
+
+            if (!gridWidth) {
+                return document.documentElement.offsetWidth;
+            }
+
+            return gridWidth;
+        };
+
+        setDimensions(getDimensions());
     };
 
     useLayoutEffect(updateGridWidth, []);
diff --git a/src/components/manga/ContinueReadingButton.tsx b/src/components/manga/ContinueReadingButton.tsx
index ff831dd2..f30a536a 100644
--- a/src/components/manga/ContinueReadingButton.tsx
+++ b/src/components/manga/ContinueReadingButton.tsx
@@ -10,6 +10,8 @@ import { useTranslation } from 'react-i18next';
 import { Button, Tooltip } from '@mui/material';
 import PlayArrowIcon from '@mui/icons-material/PlayArrow';
 
+import { Link } from 'react-router-dom';
+
 export const ContinueReadingButton = ({
     showContinueReadingButton,
     isLatestChapterRead,
@@ -35,7 +37,8 @@ export const ContinueReadingButton = ({
                 variant="contained"
                 size="small"
                 sx={{ minWidth: 'unset' }}
-                href={`${mangaLinkTo}chapter/${nextChapterIndexToRead}`}
+                component={Link}
+                to={`${mangaLinkTo}chapter/${nextChapterIndexToRead}`}
                 onClick={(e) => e.stopPropagation()}
                 onMouseDown={(e) => e.stopPropagation()}
             >