From 62155005ab007cb02174a3cf6198a662aa950ed3 Mon Sep 17 00:00:00 2001
From: schroda <50052685+schroda@users.noreply.github.com>
Date: Thu, 2 Jan 2025 22:16:59 +0100
Subject: [PATCH] Apply auto vertical progress bar for BOTTOM position only

In case "auto vertical position" is not "OFF" but the main position is not "BOTTOM", the auto mode still should be considered to be "OFF"
---
 .../variants/MobileReaderProgressBar.tsx      | 13 ++++++------
 .../variants/StandardReaderProgressBar.tsx    | 16 +++-----------
 .../reader/utils/ReaderSettings.utils.tsx     | 21 +++++++++++++++++++
 3 files changed, 31 insertions(+), 19 deletions(-)

diff --git a/src/modules/reader/components/overlay/progress-bar/variants/MobileReaderProgressBar.tsx b/src/modules/reader/components/overlay/progress-bar/variants/MobileReaderProgressBar.tsx
index 354df094..182b4c25 100644
--- a/src/modules/reader/components/overlay/progress-bar/variants/MobileReaderProgressBar.tsx
+++ b/src/modules/reader/components/overlay/progress-bar/variants/MobileReaderProgressBar.tsx
@@ -22,7 +22,6 @@ import { getOptionForDirection } from '@/modules/theme/services/ThemeCreator.ts'
 import {
     IReaderSettings,
     ProgressBarPosition,
-    ProgressBarPositionAutoVertical,
     ReaderResumeMode,
     ReaderStateChapters,
 } from '@/modules/reader/types/Reader.types.ts';
@@ -36,6 +35,7 @@ import { ReaderProgressBarSlotMobile } from '@/modules/reader/components/overlay
 import { userReaderStatePagesContext } from '@/modules/reader/contexts/state/ReaderStatePagesContext.tsx';
 import { applyStyles } from '@/modules/core/utils/ApplyStyles.ts';
 import { useResizeObserver } from '@/modules/core/hooks/useResizeObserver.tsx';
+import { getProgressBarPosition } from '@/modules/reader/utils/ReaderSettings.utils.tsx';
 
 const PROGRESS_BAR_POSITION_TO_SLIDE_DIRECTION: Record<ProgressBarPosition, SlideProps['direction']> = {
     [ProgressBarPosition.BOTTOM]: 'up',
@@ -74,11 +74,12 @@ const BaseMobileReaderProgressBar = ({
         useCallback(() => setRefreshProgressBarPosition({}), []),
     );
 
-    const finalProgressBarPosition =
-        window.innerHeight - topOffset - bottomOffset > window.innerWidth &&
-        progressBarPositionAutoVertical !== ProgressBarPositionAutoVertical.OFF
-            ? (progressBarPositionAutoVertical as unknown as ProgressBarPosition)
-            : progressBarPosition;
+    const finalProgressBarPosition = getProgressBarPosition(
+        progressBarPosition,
+        progressBarPositionAutoVertical,
+        topOffset,
+        bottomOffset,
+    );
 
     const { isLeft, isRight, isVertical, isHorizontal } = getProgressBarPositionInfo(finalProgressBarPosition);
     const finalReaderDirection = isHorizontal ? readerDirection : 'ltr';
diff --git a/src/modules/reader/components/overlay/progress-bar/variants/StandardReaderProgressBar.tsx b/src/modules/reader/components/overlay/progress-bar/variants/StandardReaderProgressBar.tsx
index 5b8369ef..42a666be 100644
--- a/src/modules/reader/components/overlay/progress-bar/variants/StandardReaderProgressBar.tsx
+++ b/src/modules/reader/components/overlay/progress-bar/variants/StandardReaderProgressBar.tsx
@@ -11,13 +11,7 @@ import { memo, useCallback, useState } from 'react';
 import { ReaderProgressBar } from '@/modules/reader/components/overlay/progress-bar/ReaderProgressBar.tsx';
 import { userReaderStatePagesContext } from '@/modules/reader/contexts/state/ReaderStatePagesContext.tsx';
 import { ReaderService } from '@/modules/reader/services/ReaderService.ts';
-import {
-    IReaderSettings,
-    ProgressBarPosition,
-    ProgressBarPositionAutoVertical,
-    ProgressBarType,
-    TReaderScrollbarContext,
-} from '@/modules/reader/types/Reader.types.ts';
+import { IReaderSettings, ProgressBarType, TReaderScrollbarContext } from '@/modules/reader/types/Reader.types.ts';
 import { applyStyles } from '@/modules/core/utils/ApplyStyles.ts';
 import { getProgressBarPositionInfo } from '@/modules/reader/utils/ReaderProgressBar.utils.tsx';
 import { ReaderProgressBarDirectionWrapper } from '@/modules/reader/components/overlay/progress-bar/ReaderProgressBarDirectionWrapper.tsx';
@@ -29,6 +23,7 @@ import { useReaderProgressBarContext } from '@/modules/reader/contexts/ReaderPro
 import { useReaderScrollbarContext } from '@/modules/reader/contexts/ReaderScrollbarContext.tsx';
 import { ReaderProgressBarSlotDesktop } from '@/modules/reader/components/overlay/progress-bar/desktop/ReaderProgressBarSlotDesktop.tsx';
 import { useResizeObserver } from '@/modules/core/hooks/useResizeObserver.tsx';
+import { getProgressBarPosition } from '@/modules/reader/utils/ReaderSettings.utils.tsx';
 
 const BaseStandardReaderProgressBar = ({
     readerNavBarWidth,
@@ -61,12 +56,7 @@ const BaseStandardReaderProgressBar = ({
         useCallback(() => setRefreshProgressBarPosition({}), []),
     );
 
-    const finalProgressBarPosition =
-        window.innerHeight > window.innerWidth &&
-        progressBarPositionAutoVertical !== ProgressBarPositionAutoVertical.OFF
-            ? (progressBarPositionAutoVertical as unknown as ProgressBarPosition)
-            : progressBarPosition;
-
+    const finalProgressBarPosition = getProgressBarPosition(progressBarPosition, progressBarPositionAutoVertical);
     const { isBottom, isLeft, isRight, isVertical, isHorizontal } =
         getProgressBarPositionInfo(finalProgressBarPosition);
 
diff --git a/src/modules/reader/utils/ReaderSettings.utils.tsx b/src/modules/reader/utils/ReaderSettings.utils.tsx
index 0cf56561..3302908d 100644
--- a/src/modules/reader/utils/ReaderSettings.utils.tsx
+++ b/src/modules/reader/utils/ReaderSettings.utils.tsx
@@ -10,6 +10,8 @@ import { ForwardRefExoticComponent, MemoExoticComponent, RefAttributes } from 'r
 import {
     IReaderSettings,
     IReaderSettingsWithDefaultFlag,
+    ProgressBarPosition,
+    ProgressBarPositionAutoVertical,
     ReaderPagerProps,
     ReaderPageScaleMode,
     ReadingMode,
@@ -56,3 +58,22 @@ export const getPagerForReadingMode = (
             throw new Error(`Unexpected "ReadingMode" (${readingMode})`);
     }
 };
+
+export const getProgressBarPosition = (
+    progressBarPosition: ProgressBarPosition,
+    progressBarPositionAutoVertical: ProgressBarPositionAutoVertical,
+    topOffset: number = 0,
+    bottomOffset: number = 0,
+): ProgressBarPosition => {
+    const isAutoVerticalEnabled =
+        progressBarPositionAutoVertical !== ProgressBarPositionAutoVertical.OFF &&
+        progressBarPosition === ProgressBarPosition.BOTTOM;
+    const isVerticalSpaceLarger = window.innerHeight - topOffset - bottomOffset > window.innerWidth;
+
+    const shouldUseVerticalPosition = isAutoVerticalEnabled && isVerticalSpaceLarger;
+    if (shouldUseVerticalPosition) {
+        return progressBarPositionAutoVertical as unknown as ProgressBarPosition;
+    }
+
+    return progressBarPosition;
+};