Remove "forwardRef" usage

src/features/reader/overlay/mobile/ReaderOverlayHeaderMobile.tsx

@@ -17,7 +17,7 @@ import Link from '@mui/material/Link';
 import { Link as RouterLink } from 'react-router-dom';
 import { alpha } from '@mui/material/styles';
 import Slide from '@mui/material/Slide';
-import { forwardRef, memo } from 'react';
+import { memo, Ref } from 'react';
 import { CustomTooltip } from '@/base/components/CustomTooltip.tsx';
 import { TypographyMaxLines } from '@/base/components/texts/TypographyMaxLines.tsx';
 import { makeToast } from '@/base/utils/Toast.ts';
@@ -38,7 +38,7 @@ import {
 
 const DEFAULT_MANGA = { ...FALLBACK_MANGA, title: '' };
 
-const BaseReaderOverlayHeaderMobile = forwardRef<HTMLDivElement, MobileHeaderProps>(({ isVisible }, ref) => {
+const BaseReaderOverlayHeaderMobile = ({ isVisible, ref }: MobileHeaderProps & { ref?: Ref<HTMLDivElement> }) => {
     const { t } = useTranslation();
     const popupState = usePopupState({ popupId: 'reader-overlay-more-menu', variant: 'popover' });
     const currentChapter = useReaderChaptersStore((state) => state.chapters.currentChapter);
@@ -126,6 +126,6 @@ const BaseReaderOverlayHeaderMobile = forwardRef<HTMLDivElement, MobileHeaderPro
             </Stack>
         </Slide>
     );
-});
+};
 
 export const ReaderOverlayHeaderMobile = memo(BaseReaderOverlayHeaderMobile);

src/features/reader/overlay/progress-bar/components/ReaderProgressBarDirectionWrapper.tsx

@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { forwardRef, useMemo } from 'react';
+import { useMemo } from 'react';
 import { CacheProvider } from '@emotion/react';
 import { ThemeProvider } from '@mui/material/styles';
 import Box, { BoxProps } from '@mui/material/Box';
@@ -17,12 +17,12 @@ import { ReaderService } from '@/features/reader/services/ReaderService.ts';
 import { DIRECTION_TO_CACHE } from '@/features/theme/ThemeDirectionCache.ts';
 import { withPropsFrom } from '@/base/hoc/withPropsFrom.tsx';
 
-const BaseReaderProgressBarDirectionWrapper = forwardRef<
-    HTMLElement,
-    BoxProps & {
-        direction: ReturnType<typeof ReaderService.useGetThemeDirection>;
-    }
->(({ direction, ...boxProps }, ref) => {
+const BaseReaderProgressBarDirectionWrapper = ({
+    direction,
+    ...boxProps
+}: BoxProps & {
+    direction: ReturnType<typeof ReaderService.useGetThemeDirection>;
+}) => {
     const {
         settings: { customThemes, appTheme, themeMode, shouldUsePureBlackMode },
     } = useMetadataServerSettings();
@@ -35,11 +35,11 @@ const BaseReaderProgressBarDirectionWrapper = forwardRef<
     return (
         <CacheProvider value={DIRECTION_TO_CACHE[direction]}>
             <ThemeProvider theme={readerTheme}>
-                <Box {...boxProps} ref={ref} dir={direction} />
+                <Box {...boxProps} dir={direction} />
             </ThemeProvider>
         </CacheProvider>
     );
-});
+};
 
 export const ReaderProgressBarDirectionWrapper = withPropsFrom(
     BaseReaderProgressBarDirectionWrapper,