fix: respect RTL direction for reader arrow buttons and swipe navigation

Arrow buttons now swap next/previous in RTL mode. Swipe navigation
receives isRTL from parent state instead of creating its own independent
copy, so toggling direction takes effect immediately without reload.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-15 21:24:11 +01:00
parent 2174579cc1
commit d535f9f28e
3 changed files with 5 additions and 4 deletions

View File

@@ -76,6 +76,7 @@ export function PhotoswipeReader({ book, pages, onClose, nextBook }: BookReaderP
onPreviousPage: handlePreviousPage,
onNextPage: handleNextPage,
pswpRef,
isRTL,
});
// Activer le zoom dans le reader en enlevant la classe no-pinch-zoom

View File

@@ -173,7 +173,7 @@ export const ControlButtons = ({
icon={ChevronLeft}
onClick={(e) => {
e.stopPropagation();
onPreviousPage();
direction === "rtl" ? onNextPage() : onPreviousPage();
}}
tooltip={t("reader.controls.previousPage")}
iconClassName="h-8 w-8"
@@ -193,7 +193,7 @@ export const ControlButtons = ({
icon={ChevronRight}
onClick={(e) => {
e.stopPropagation();
onNextPage();
direction === "rtl" ? onPreviousPage() : onNextPage();
}}
tooltip={t("reader.controls.nextPage")}
iconClassName="h-8 w-8"

View File

@@ -1,18 +1,18 @@
import { useCallback, useRef, useEffect } from "react";
import { useReadingDirection } from "./useReadingDirection";
interface UseTouchNavigationProps {
onPreviousPage: () => void;
onNextPage: () => void;
pswpRef: React.MutableRefObject<unknown>;
isRTL: boolean;
}
export function useTouchNavigation({
onPreviousPage,
onNextPage,
pswpRef,
isRTL,
}: UseTouchNavigationProps) {
const { isRTL } = useReadingDirection();
const touchStartXRef = useRef<number | null>(null);
const touchStartYRef = useRef<number | null>(null);
const isPinchingRef = useRef(false);