diff --git a/src/features/chapter/Chapter.constants.ts b/src/features/chapter/Chapter.constants.ts
index 2b8927eb..b1b7725c 100644
--- a/src/features/chapter/Chapter.constants.ts
+++ b/src/features/chapter/Chapter.constants.ts
@@ -9,7 +9,7 @@
 import { ChapterAction, ChapterListOptions, ChapterSortMode } from '@/features/chapter/Chapter.types.ts';
 import { TranslationKey } from '@/base/Base.types.ts';
 
-export const FALLBACK_CHAPTER = { id: -1, name: '', realUrl: '', isBookmarked: false };
+export const FALLBACK_CHAPTER = { id: -1, name: '', realUrl: '', isDownloaded: false, isBookmarked: false };
 
 export const DEFAULT_CHAPTER_OPTIONS: ChapterListOptions = {
     unread: undefined,
diff --git a/src/features/reader/overlay/navigation/components/ReaderChapterList.tsx b/src/features/reader/overlay/navigation/components/ReaderChapterList.tsx
index b4f339eb..05a6a596 100644
--- a/src/features/reader/overlay/navigation/components/ReaderChapterList.tsx
+++ b/src/features/reader/overlay/navigation/components/ReaderChapterList.tsx
@@ -10,18 +10,23 @@ import { Virtuoso, VirtuosoProps } from 'react-virtuoso';
 import { useMemo } from 'react';
 import { ReaderStateChapters } from '@/features/reader/Reader.types.ts';
 import { ChapterListCard } from '@/features/chapter/components/cards/ChapterListCard.tsx';
+import { ChapterIdInfo } from '@/features/chapter/Chapter.types.ts';
 
 const onSelectNoop = () => {};
 
 export const ReaderChapterList = ({
-    currentChapter,
+    currentChapterId,
     chapters,
     style,
-}: Pick<ReaderStateChapters, 'chapters' | 'currentChapter'> & Pick<VirtuosoProps<any, any>, 'style'>) => {
-    const currentChapterIndex = useMemo(
-        () => currentChapter && chapters.findIndex((chapter) => chapter.id === currentChapter.id),
-        [currentChapter, chapters],
-    );
+}: { currentChapterId: ChapterIdInfo['id'] | undefined } & Pick<ReaderStateChapters, 'chapters'> &
+    Pick<VirtuosoProps<any, any>, 'style'>) => {
+    const currentChapterIndex = useMemo(() => {
+        if (currentChapterId === undefined) {
+            return 0;
+        }
+
+        return chapters.findIndex((chapter) => chapter.id === currentChapterId);
+    }, [currentChapterId, chapters]);
 
     return (
         <Virtuoso
@@ -29,7 +34,7 @@ export const ReaderChapterList = ({
                 height: `calc(${chapters.length} * 100px)`,
                 ...style,
             }}
-            initialTopMostItemIndex={currentChapterIndex ?? 0}
+            initialTopMostItemIndex={currentChapterIndex}
             totalCount={chapters.length}
             computeItemKey={(index) => chapters[index].id}
             itemContent={(index) => (
diff --git a/src/features/reader/overlay/navigation/desktop/ReaderNavBarDesktop.tsx b/src/features/reader/overlay/navigation/desktop/ReaderNavBarDesktop.tsx
index c0d87d75..0882bb44 100644
--- a/src/features/reader/overlay/navigation/desktop/ReaderNavBarDesktop.tsx
+++ b/src/features/reader/overlay/navigation/desktop/ReaderNavBarDesktop.tsx
@@ -60,9 +60,20 @@ const BaseReaderNavBarDesktop = ({
 }: ReaderNavBarDesktopProps & Pick<NavbarContextType, 'setReaderNavBarWidth'>) => {
     const { t } = useTranslation();
     const manga = useReaderStore((state) => state.manga);
-    const { chapters, currentChapter, previousChapter, nextChapter } = useReaderChaptersStore((state) => ({
+    const {
+        chapters,
+        currentChapterId,
+        currentChapterName,
+        currentChapterNumber,
+        currentChapterScanlator,
+        previousChapter,
+        nextChapter,
+    } = useReaderChaptersStore((state) => ({
         chapters: state.chapters.chapters,
-        currentChapter: state.chapters.currentChapter,
+        currentChapterId: state.chapters.currentChapter?.id,
+        currentChapterName: state.chapters.currentChapter?.name,
+        currentChapterNumber: state.chapters.currentChapter?.chapterNumber,
+        currentChapterScanlator: state.chapters.currentChapter?.scanlator,
         previousChapter: state.chapters.previousChapter,
         nextChapter: state.chapters.nextChapter,
     }));
@@ -113,13 +124,13 @@ const BaseReaderNavBarDesktop = ({
                             </IconButton>
                         </CustomTooltip>
                     </Stack>
-                    {manga && currentChapter ? (
+                    {manga && currentChapterId !== undefined ? (
                         <>
                             <ReaderNavBarDesktopMetadata
                                 mangaId={manga.id}
                                 mangaTitle={manga.title}
-                                chapterTitle={currentChapter.name}
-                                scanlator={currentChapter.scanlator}
+                                chapterTitle={currentChapterName ?? ''}
+                                scanlator={currentChapterScanlator}
                             />
                             <ReaderNavBarDesktopActions />
                         </>
@@ -132,7 +143,9 @@ const BaseReaderNavBarDesktop = ({
                         <ReaderNavBarDesktopPageNavigation />
                         <ReaderNavBarDesktopChapterNavigation
                             chapters={chapters}
-                            currentChapter={currentChapter}
+                            currentChapterId={currentChapterId}
+                            currentChapterName={currentChapterName}
+                            currentChapterNumber={currentChapterNumber}
                             nextChapter={nextChapter}
                             previousChapter={previousChapter}
                         />
diff --git a/src/features/reader/overlay/navigation/desktop/components/ReaderNavBarDesktopActions.tsx b/src/features/reader/overlay/navigation/desktop/components/ReaderNavBarDesktopActions.tsx
index 0df6f369..ebdc2384 100644
--- a/src/features/reader/overlay/navigation/desktop/components/ReaderNavBarDesktopActions.tsx
+++ b/src/features/reader/overlay/navigation/desktop/components/ReaderNavBarDesktopActions.tsx
@@ -25,19 +25,17 @@ import { requestManager } from '@/lib/requests/RequestManager.ts';
 import { useReaderChaptersStore, useReaderPagesStore } from '@/features/reader/stores/ReaderStore.ts';
 import { ChapterDownloadInfo, ChapterIdInfo } from '@/features/chapter/Chapter.types.ts';
 
-const DownloadButton = ({
-    currentChapter,
-}: {
-    currentChapter: NullAndUndefined<ChapterIdInfo & ChapterDownloadInfo>;
-}) => {
+const DownloadButton = ({ id = -1, isDownloaded }: ChapterIdInfo & ChapterDownloadInfo) => {
     const { t } = useTranslation();
 
-    const downloadStatus = Chapters.useDownloadStatusFromCache(currentChapter?.id ?? -1);
+    const downloadStatus = Chapters.useDownloadStatusFromCache(id);
 
-    if (currentChapter && Chapters.isDownloaded(currentChapter)) {
+    const isDisabled = id === undefined;
+
+    if (id !== undefined && isDownloaded) {
         return (
             <CustomTooltip title={t(CHAPTER_ACTION_TO_TRANSLATION.delete.action.single)}>
-                <IconButton onClick={() => Chapters.performAction('delete', [currentChapter.id], {})} color="inherit">
+                <IconButton onClick={() => Chapters.performAction('delete', [id], {})} color="inherit">
                     <DeleteIcon />
                 </IconButton>
             </CustomTooltip>
@@ -49,10 +47,10 @@ const DownloadButton = ({
     }
 
     return (
-        <CustomTooltip title={t(CHAPTER_ACTION_TO_TRANSLATION.download.action.single)} disabled={!currentChapter}>
+        <CustomTooltip title={t(CHAPTER_ACTION_TO_TRANSLATION.download.action.single)} disabled={isDisabled}>
             <IconButton
-                disabled={!currentChapter}
-                onClick={() => Chapters.performAction('download', [currentChapter?.id ?? -1], {})}
+                disabled={isDisabled}
+                onClick={() => Chapters.performAction('download', [id], {})}
                 color="inherit"
             >
                 <DownloadIcon />
@@ -62,9 +60,12 @@ const DownloadButton = ({
 };
 
 export const ReaderNavBarDesktopActions = memo(() => {
-    const currentChapter = useReaderChaptersStore((state) => state.chapters.currentChapter);
-
-    const { id, isBookmarked, realUrl } = currentChapter ?? FALLBACK_CHAPTER;
+    const { id, isDownloaded, isBookmarked, realUrl } = useReaderChaptersStore((state) => ({
+        id: state.chapters.currentChapter?.id ?? FALLBACK_CHAPTER.id,
+        isDownloaded: state.chapters.currentChapter?.isDownloaded ?? FALLBACK_CHAPTER.isDownloaded,
+        isBookmarked: state.chapters.currentChapter?.isBookmarked ?? FALLBACK_CHAPTER.isBookmarked,
+        realUrl: state.chapters.currentChapter?.realUrl ?? FALLBACK_CHAPTER.realUrl,
+    }));
 
     const { t } = useTranslation();
     const { pageLoadStates, setPageLoadStates, setRetryFailedPagesKeyPrefix } = useReaderPagesStore((state) => ({
@@ -102,7 +103,7 @@ export const ReaderNavBarDesktopActions = memo(() => {
                     <ReplayIcon />
                 </IconButton>
             </CustomTooltip>
-            <DownloadButton currentChapter={currentChapter} />
+            <DownloadButton id={id} isDownloaded={isDownloaded} />
             <CustomTooltip title={t('global.button.open_browser')} disabled={!realUrl}>
                 <IconButton disabled={!realUrl} href={realUrl ?? ''} rel="noreferrer" target="_blank" color="inherit">
                     <IconBrowser />
diff --git a/src/features/reader/overlay/navigation/desktop/components/ReaderNavBarDesktopChapterNavigation.tsx b/src/features/reader/overlay/navigation/desktop/components/ReaderNavBarDesktopChapterNavigation.tsx
index d0f3c6aa..9b4baa53 100644
--- a/src/features/reader/overlay/navigation/desktop/components/ReaderNavBarDesktopChapterNavigation.tsx
+++ b/src/features/reader/overlay/navigation/desktop/components/ReaderNavBarDesktopChapterNavigation.tsx
@@ -24,23 +24,30 @@ import { ReaderService } from '@/features/reader/services/ReaderService.ts';
 import { ReaderControls } from '@/features/reader/services/ReaderControls.ts';
 import { ReaderStateChapters } from '@/features/reader/Reader.types.ts';
 import { withPropsFrom } from '@/base/hoc/withPropsFrom.tsx';
+import { ChapterIdInfo } from '@/features/chapter/Chapter.types.ts';
 
 const BaseReaderNavBarDesktopChapterNavigation = ({
-    currentChapter,
+    currentChapterId,
+    currentChapterName,
+    currentChapterNumber,
     previousChapter,
     nextChapter,
     chapters = [],
     readerThemeDirection,
-}: Pick<ReaderStateChapters, 'chapters' | 'currentChapter' | 'previousChapter' | 'nextChapter'> & {
-    readerThemeDirection: ReturnType<typeof ReaderService.useGetThemeDirection>;
-}) => {
+}: {
+    currentChapterId: ChapterIdInfo['id'] | undefined;
+    currentChapterName: string | undefined;
+    currentChapterNumber: number | undefined;
+} & Pick<ReaderStateChapters, 'chapters' | 'previousChapter' | 'nextChapter'> & {
+        readerThemeDirection: ReturnType<typeof ReaderService.useGetThemeDirection>;
+    }) => {
     const { t } = useTranslation();
 
     const popupState = usePopupState({ variant: 'popover', popupId: 'reader-nav-bar-desktop-chapter-list' });
 
     useLayoutEffect(() => {
         popupState.close();
-    }, [currentChapter?.id]);
+    }, [currentChapterId]);
 
     return (
         <Stack sx={{ flexDirection: 'row', gap: 1 }} dir="ltr">
@@ -63,15 +70,15 @@ const BaseReaderNavBarDesktopChapterNavigation = ({
                 <Select
                     {...bindTrigger(popupState)}
                     open={popupState.isOpen}
-                    value={currentChapter?.id ?? 0}
+                    value={currentChapterId ?? 0}
                     // hide actual select menu
                     MenuProps={{ sx: { visibility: 'hidden' } }}
                     label={t('chapter.title_one')}
                     labelId="reader-nav-bar-desktop-chapter-select"
                 >
                     {/* hacky way to use the select component with a custom menu, the only possible value that is needed is the current chapter */}
-                    <MenuItem key={currentChapter?.id} value={currentChapter?.id ?? 0}>
-                        {currentChapter ? `#${currentChapter.chapterNumber} ${currentChapter.name}` : ''}
+                    <MenuItem key={currentChapterId} value={currentChapterId ?? 0}>
+                        {currentChapterNumber !== undefined ? `#${currentChapterNumber} ${currentChapterName}` : ''}
                     </MenuItem>
                 </Select>
             </FormControl>
@@ -105,7 +112,7 @@ const BaseReaderNavBarDesktopChapterNavigation = ({
                             minHeight: '150px',
                             maxHeight: '300px',
                         }}
-                        currentChapter={currentChapter}
+                        currentChapterId={currentChapterId}
                         chapters={chapters}
                     />
                 </Box>
diff --git a/src/features/reader/overlay/navigation/mobile/ReaderBottomBarMobile.tsx b/src/features/reader/overlay/navigation/mobile/ReaderBottomBarMobile.tsx
index 2cd99742..c4106830 100644
--- a/src/features/reader/overlay/navigation/mobile/ReaderBottomBarMobile.tsx
+++ b/src/features/reader/overlay/navigation/mobile/ReaderBottomBarMobile.tsx
@@ -32,8 +32,8 @@ const BaseReaderBottomBarMobile = ({
     topOffset = 0,
 }: ReaderBottomBarMobileProps & { topOffset?: number }) => {
     const { t } = useTranslation();
-    const { currentChapter, chapters } = useReaderChaptersStore((state) => ({
-        currentChapter: state.chapters.currentChapter,
+    const { currentChapterId, chapters } = useReaderChaptersStore((state) => ({
+        currentChapterId: state.chapters.currentChapter?.id,
         chapters: state.chapters.chapters,
     }));
 
@@ -50,7 +50,7 @@ const BaseReaderBottomBarMobile = ({
 
     useLayoutEffect(() => {
         chapterListPopupState.close();
-    }, [currentChapter?.id]);
+    }, [currentChapterId]);
 
     return (
         <>
@@ -112,7 +112,7 @@ const BaseReaderBottomBarMobile = ({
                                 minHeight: '15vh',
                                 maxHeight: '75vh',
                             }}
-                            currentChapter={currentChapter}
+                            currentChapterId={currentChapterId}
                             chapters={chapters}
                         />
                     </DialogContent>