diff --git a/src/modules/category/components/CategorySettingsCard.tsx b/src/modules/category/components/CategorySettingsCard.tsx
index 99f5c1a1..eb977422 100644
--- a/src/modules/category/components/CategorySettingsCard.tsx
+++ b/src/modules/category/components/CategorySettingsCard.tsx
@@ -7,7 +7,6 @@
*/
import IconButton from '@mui/material/IconButton';
-import Tooltip from '@mui/material/Tooltip';
import { DraggableProvided } from 'react-beautiful-dnd';
import DragHandleIcon from '@mui/icons-material/DragHandle';
import EditIcon from '@mui/icons-material/Edit';
@@ -18,6 +17,7 @@ import Card from '@mui/material/Card';
import CardContent from '@mui/material/CardContent';
import Stack from '@mui/material/Stack';
import Typography from '@mui/material/Typography';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { requestManager } from '@/lib/requests/RequestManager.ts';
import { CategoryType } from '@/lib/graphql/generated/graphql.ts';
@@ -56,16 +56,16 @@ export const CategorySettingsCard = ({
{category.name}
-
+
-
-
+
+
-
+
diff --git a/src/modules/chapter/components/ChapterList.tsx b/src/modules/chapter/components/ChapterList.tsx
index 35cf04b8..98cb9414 100644
--- a/src/modules/chapter/components/ChapterList.tsx
+++ b/src/modules/chapter/components/ChapterList.tsx
@@ -8,7 +8,6 @@
import Box from '@mui/material/Box';
import Stack from '@mui/material/Stack';
-import Tooltip from '@mui/material/Tooltip';
import { styled } from '@mui/material/styles';
import Typography from '@mui/material/Typography';
import { ComponentProps, useCallback, useMemo, useState } from 'react';
@@ -19,6 +18,7 @@ import DownloadIcon from '@mui/icons-material/Download';
import DoneAllIcon from '@mui/icons-material/DoneAll';
import PopupState, { bindMenu, bindTrigger } from 'material-ui-popup-state';
import Menu from '@mui/material/Menu';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { requestManager } from '@/lib/requests/RequestManager.ts';
import { ChapterCard } from '@/modules/chapter/components/cards/ChapterCard.tsx';
import { ResumeFab } from '@/modules/manga/components/ResumeFAB.tsx';
@@ -186,7 +186,10 @@ export const ChapterList = ({
-
+
Chapters.markAsRead(Chapters.getNonRead(chapters), true, manga.id)}
@@ -194,11 +197,14 @@ export const ChapterList = ({
>
-
+
{(popupState) => (
<>
-
+
-
+
{popupState.isOpen && (
diff --git a/src/modules/core/components/buttons/ResetButton.tsx b/src/modules/core/components/buttons/ResetButton.tsx
index 9eb7c998..1d34ca84 100644
--- a/src/modules/core/components/buttons/ResetButton.tsx
+++ b/src/modules/core/components/buttons/ResetButton.tsx
@@ -9,8 +9,8 @@
import Button, { ButtonProps } from '@mui/material/Button';
import { useTranslation } from 'react-i18next';
import RestartAltIcon from '@mui/icons-material/RestartAlt';
-import Tooltip from '@mui/material/Tooltip';
import IconButton, { IconButtonProps } from '@mui/material/IconButton';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
type PropsIconButton = { asIconButton: true } & IconButtonProps;
type PropsButton = { asIconButton?: false } & ButtonProps;
@@ -21,11 +21,11 @@ export const ResetButton = ({ asIconButton, ...props }: Props) => {
if (asIconButton) {
return (
-
+
-
+
);
}
diff --git a/src/modules/core/components/buttons/ValueRotationButton.tsx b/src/modules/core/components/buttons/ValueRotationButton.tsx
index 0f38b02b..106c6d73 100644
--- a/src/modules/core/components/buttons/ValueRotationButton.tsx
+++ b/src/modules/core/components/buttons/ValueRotationButton.tsx
@@ -9,7 +9,7 @@
import { useTranslation } from 'react-i18next';
import { ReactNode, useMemo } from 'react';
import Button from '@mui/material/Button';
-import Tooltip from '@mui/material/Tooltip';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { MultiValueButtonProps } from '@/modules/core/Core.types.ts';
import { getNextRotationValue } from '@/modules/core/utils/ValueRotationButton.utils.ts';
import { Superscript } from '@/modules/core/components/Superscript.tsx';
@@ -37,7 +37,7 @@ export const ValueRotationButton = ({
}, [value, values]);
return (
-
+
{isDefault ? (
)}
-
+
);
};
diff --git a/src/modules/core/components/inputs/LangSelect.tsx b/src/modules/core/components/inputs/LangSelect.tsx
index e3e84950..a743d3b0 100644
--- a/src/modules/core/components/inputs/LangSelect.tsx
+++ b/src/modules/core/components/inputs/LangSelect.tsx
@@ -17,9 +17,9 @@ import IconButton from '@mui/material/IconButton';
import FilterListIcon from '@mui/icons-material/FilterList';
import List from '@mui/material/List';
import ListItemText from '@mui/material/ListItemText';
-import Tooltip from '@mui/material/Tooltip';
import ListItem from '@mui/material/ListItem';
import { useTranslation } from 'react-i18next';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { cloneObject } from '@/util/cloneObject.tsx';
import { translateExtensionLanguage } from '@/modules/extension/Extensions.utils.ts';
@@ -72,7 +72,7 @@ export function LangSelect(props: IProps) {
return (
<>
-
+
setOpen(true)}
aria-label="display more actions"
@@ -82,7 +82,7 @@ export function LangSelect(props: IProps) {
>
-
+
)}
-
+
-
+
);
};
diff --git a/src/modules/downloads/screens/DownloadQueue.tsx b/src/modules/downloads/screens/DownloadQueue.tsx
index 5a5f144f..bbac7688 100644
--- a/src/modules/downloads/screens/DownloadQueue.tsx
+++ b/src/modules/downloads/screens/DownloadQueue.tsx
@@ -14,7 +14,6 @@ import Card from '@mui/material/Card';
import CardActionArea from '@mui/material/CardActionArea';
import Stack from '@mui/material/Stack';
import Box, { BoxProps } from '@mui/material/Box';
-import Tooltip from '@mui/material/Tooltip';
import IconButton from '@mui/material/IconButton';
import React, { memo, useCallback, useEffect, useLayoutEffect } from 'react';
import { DragDropContext, Draggable, DraggableProvided, DropResult } from 'react-beautiful-dnd';
@@ -25,6 +24,7 @@ import DeleteSweepIcon from '@mui/icons-material/DeleteSweep';
import { Virtuoso } from 'react-virtuoso';
import CardContent from '@mui/material/CardContent';
import Refresh from '@mui/icons-material/Refresh';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { requestManager } from '@/lib/requests/RequestManager.ts';
import { StrictModeDroppable } from '@/modules/core/components/StrictModeDroppable.tsx';
import { makeToast } from '@/modules/core/utils/Toast.ts';
@@ -93,7 +93,7 @@ const DownloadChapterItem = memo(
{item.state === DownloadState.Error && (
-
+
{
e.preventDefault();
@@ -104,9 +104,9 @@ const DownloadChapterItem = memo(
>
-
+
)}
-
+
{
e.preventDefault();
@@ -117,7 +117,7 @@ const DownloadChapterItem = memo(
>
-
+
@@ -165,17 +165,20 @@ export const DownloadQueue: React.FC = () => {
setTitle(t('download.queue.title'));
setAction(
<>
-
+
-
+
-
+
{status === DownloaderState.Stopped ? : }
-
+
>,
);
diff --git a/src/modules/extension/screens/Extensions.tsx b/src/modules/extension/screens/Extensions.tsx
index c33eb059..d773ee75 100644
--- a/src/modules/extension/screens/Extensions.tsx
+++ b/src/modules/extension/screens/Extensions.tsx
@@ -13,10 +13,10 @@ import AddIcon from '@mui/icons-material/Add';
import { StringParam, useQueryParam } from 'use-query-params';
import Button from '@mui/material/Button';
import Stack from '@mui/material/Stack';
-import Tooltip from '@mui/material/Tooltip';
import Typography from '@mui/material/Typography';
import { useTranslation } from 'react-i18next';
import { Link } from 'react-router-dom';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { requestManager } from '@/lib/requests/RequestManager.ts';
import { extensionDefaultLangs } from '@/modules/core/utils/Languages.ts';
import { useLocalStorage } from '@/modules/core/hooks/useStorage.tsx';
@@ -134,11 +134,11 @@ export function Extensions({ tabsMenuHeight }: { tabsMenuHeight: number }) {
setAction(
<>
-
+
inputRef.current?.click()} size="large" color="inherit">
-
+
>,
diff --git a/src/modules/library/components/LibraryToolbarMenu.tsx b/src/modules/library/components/LibraryToolbarMenu.tsx
index 0403b810..73bfe716 100644
--- a/src/modules/library/components/LibraryToolbarMenu.tsx
+++ b/src/modules/library/components/LibraryToolbarMenu.tsx
@@ -8,9 +8,9 @@
import FilterList from '@mui/icons-material/FilterList';
import IconButton from '@mui/material/IconButton';
-import Tooltip from '@mui/material/Tooltip';
import { ComponentProps, useState } from 'react';
import { useTranslation } from 'react-i18next';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { LibraryOptionsPanel } from '@/modules/library/components/LibraryOptionsPanel.tsx';
import { useLibraryOptionsContext } from '@/modules/library/contexts/LibraryOptionsContext.tsx';
@@ -34,11 +34,11 @@ export const LibraryToolbarMenu = ({
return (
<>
-
+
setOpen(!open)} color={active ? 'warning' : 'inherit'}>
-
+
setOpen(false)} />
>
);
diff --git a/src/modules/manga/components/ContinueReadingButton.tsx b/src/modules/manga/components/ContinueReadingButton.tsx
index 8fdccea2..56c72ea3 100644
--- a/src/modules/manga/components/ContinueReadingButton.tsx
+++ b/src/modules/manga/components/ContinueReadingButton.tsx
@@ -8,9 +8,9 @@
import { useTranslation } from 'react-i18next';
import Button from '@mui/material/Button';
-import Tooltip from '@mui/material/Tooltip';
import PlayArrowIcon from '@mui/icons-material/PlayArrow';
import { Link } from 'react-router-dom';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { ChapterReadInfo, Chapters, ChapterSourceOrderInfo } from '@/modules/chapter/services/Chapters.ts';
export const ContinueReadingButton = ({
@@ -32,7 +32,7 @@ export const ContinueReadingButton = ({
const isFirstChapter = sourceOrder === 1;
return (
-
+
-
+
);
};
diff --git a/src/modules/manga/components/MangaDetails.tsx b/src/modules/manga/components/MangaDetails.tsx
index 47664be8..d8c4d656 100644
--- a/src/modules/manga/components/MangaDetails.tsx
+++ b/src/modules/manga/components/MangaDetails.tsx
@@ -15,7 +15,6 @@ import { t as translate } from 'i18next';
import Link from '@mui/material/Link';
import Typography from '@mui/material/Typography';
import Chip from '@mui/material/Chip';
-import Tooltip from '@mui/material/Tooltip';
import LaunchIcon from '@mui/icons-material/Launch';
import Collapse from '@mui/material/Collapse';
import Stack from '@mui/material/Stack';
@@ -28,6 +27,7 @@ import { bindPopover, bindTrigger, usePopupState } from 'material-ui-popup-state
import ContentCopyIcon from '@mui/icons-material/ContentCopy';
import { Vibrant } from 'node-vibrant/browser';
import { FastAverageColor } from 'fast-average-color';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { makeToast } from '@/modules/core/utils/Toast.ts';
import { Mangas } from '@/modules/manga/services/Mangas.ts';
import { SpinnerImage } from '@/modules/core/components/SpinnerImage.tsx';
@@ -129,7 +129,7 @@ const OpenSourceButton = ({ url }: { url?: string | null }) => {
const { t } = useTranslation();
return (
-
+
{
>
-
+
);
};
@@ -391,11 +391,11 @@ export const MangaDetails = ({
{manga.title}
-
+
-
+
diff --git a/src/modules/manga/components/MangaOptionButton.tsx b/src/modules/manga/components/MangaOptionButton.tsx
index 33ed83dc..03e54dda 100644
--- a/src/modules/manga/components/MangaOptionButton.tsx
+++ b/src/modules/manga/components/MangaOptionButton.tsx
@@ -9,12 +9,12 @@
import { useTranslation } from 'react-i18next';
import { BaseSyntheticEvent, MouseEvent, TouchEvent, ChangeEvent, useMemo, forwardRef, ForwardedRef } from 'react';
import Button from '@mui/material/Button';
-import Tooltip from '@mui/material/Tooltip';
import Checkbox from '@mui/material/Checkbox';
import IconButton from '@mui/material/IconButton';
import MoreVertIcon from '@mui/icons-material/MoreVert';
import { PopupState } from 'material-ui-popup-state/hooks';
import { bindTrigger } from 'material-ui-popup-state';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { SelectableCollectionReturnType } from '@/modules/collection/hooks/useSelectableCollection.ts';
import { MediaQuery } from '@/modules/core/utils/MediaQuery.tsx';
import { MangaType } from '@/lib/graphql/generated/graphql.ts';
@@ -71,15 +71,15 @@ export const MangaOptionButton = forwardRef(
}
return (
-
+
-
+
);
}
if (asCheckbox) {
return (
-
+
-
+
);
}
return (
-
+
-
+
);
},
);
diff --git a/src/modules/manga/components/MangaToolbarMenu.tsx b/src/modules/manga/components/MangaToolbarMenu.tsx
index f903f88b..1982ed9f 100644
--- a/src/modules/manga/components/MangaToolbarMenu.tsx
+++ b/src/modules/manga/components/MangaToolbarMenu.tsx
@@ -14,13 +14,13 @@ import ListItemIcon from '@mui/material/ListItemIcon';
import ListItemText from '@mui/material/ListItemText';
import Menu from '@mui/material/Menu';
import MenuItem from '@mui/material/MenuItem';
-import Tooltip from '@mui/material/Tooltip';
import React from 'react';
import { useTranslation } from 'react-i18next';
import { Link } from 'react-router-dom';
import SyncAltIcon from '@mui/icons-material/SyncAlt';
import { useTheme } from '@mui/material/styles';
import useMediaQuery from '@mui/material/useMediaQuery';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { useCategorySelect } from '@/modules/category/hooks/useCategorySelect.tsx';
import { MangaType } from '@/lib/graphql/generated/graphql.ts';
import { AppRoutes } from '@/modules/core/AppRoute.constants.ts';
@@ -51,7 +51,7 @@ export const MangaToolbarMenu = ({ manga, onRefresh, refreshing }: IProps) => {
<>
{isLargeScreen && (
<>
-
+
{
onRefresh();
@@ -61,10 +61,10 @@ export const MangaToolbarMenu = ({ manga, onRefresh, refreshing }: IProps) => {
>
-
+
{manga.inLibrary && (
<>
-
+
{
-
-
+
+
{
openCategorySelect(true);
@@ -84,7 +84,7 @@ export const MangaToolbarMenu = ({ manga, onRefresh, refreshing }: IProps) => {
>
-
+
>
)}
>
diff --git a/src/modules/manga/components/cards/MangaGridCard.tsx b/src/modules/manga/components/cards/MangaGridCard.tsx
index 332da8ef..26ce31bd 100644
--- a/src/modules/manga/components/cards/MangaGridCard.tsx
+++ b/src/modules/manga/components/cards/MangaGridCard.tsx
@@ -12,9 +12,9 @@ import Box from '@mui/material/Box';
import Card from '@mui/material/Card';
import CardActionArea from '@mui/material/CardActionArea';
import Stack from '@mui/material/Stack';
-import Tooltip from '@mui/material/Tooltip';
import { styled } from '@mui/material/styles';
import { memo, useRef } from 'react';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { SpinnerImage } from '@/modules/core/components/SpinnerImage.tsx';
import { MangaOptionButton } from '@/modules/manga/components/MangaOptionButton.tsx';
import { Mangas } from '@/modules/manga/services/Mangas.ts';
@@ -166,7 +166,7 @@ export const MangaGridCard = memo(
}}
>
{gridLayout !== GridLayout.Comfortable && (
-
+
{title}
-
+
)}
{continueReadingButton}
@@ -185,7 +185,7 @@ export const MangaGridCard = memo(
{gridLayout === GridLayout.Comfortable && (
-
+
{title}
-
+
)}
diff --git a/src/modules/manga/components/cards/MangaListCard.tsx b/src/modules/manga/components/cards/MangaListCard.tsx
index e0561c57..d9e01f44 100644
--- a/src/modules/manga/components/cards/MangaListCard.tsx
+++ b/src/modules/manga/components/cards/MangaListCard.tsx
@@ -12,9 +12,9 @@ import CardActionArea from '@mui/material/CardActionArea';
import Avatar from '@mui/material/Avatar';
import Box from '@mui/material/Box';
import Stack from '@mui/material/Stack';
-import Tooltip from '@mui/material/Tooltip';
import { Link as RouterLink } from 'react-router-dom';
import { memo, useRef } from 'react';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { SpinnerImage } from '@/modules/core/components/SpinnerImage.tsx';
import { TypographyMaxLines } from '@/modules/core/components/TypographyMaxLines.tsx';
import { SpecificMangaCardProps } from '@/modules/manga/Manga.types.ts';
@@ -103,11 +103,11 @@ export const MangaListCard = memo(
width: 'min-content',
}}
>
-
+
{title}
-
+
{
}}
>
{error && !isValidating && !refreshing && (
-
{t('manga.error.label.request_failure')}
@@ -90,7 +90,7 @@ export const Manga: React.FC = () => {
refetch()}>
-
+
)}
{manga && (refreshing || isValidating) && (
diff --git a/src/modules/migration/screens/Migration.tsx b/src/modules/migration/screens/Migration.tsx
index e4151057..6bcba65d 100644
--- a/src/modules/migration/screens/Migration.tsx
+++ b/src/modules/migration/screens/Migration.tsx
@@ -15,7 +15,7 @@ import SortByAlphaIcon from '@mui/icons-material/SortByAlpha';
import TagIcon from '@mui/icons-material/Tag';
import ArrowUpwardIcon from '@mui/icons-material/ArrowUpward';
import ArrowDownwardIcon from '@mui/icons-material/ArrowDownward';
-import Tooltip from '@mui/material/Tooltip';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { requestManager } from '@/lib/requests/RequestManager.ts';
import { LoadingPlaceholder } from '@/modules/core/components/placeholder/LoadingPlaceholder.tsx';
import { EmptyViewAbsoluteCentered } from '@/modules/core/components/placeholder/EmptyViewAbsoluteCentered.tsx';
@@ -123,7 +123,7 @@ export const Migration = ({ tabsMenuHeight }: { tabsMenuHeight: number }) => {
zIndex: 1,
}}
>
-
+
{
>
{sortBy ? : }
-
-
+
+
{
>
{sortOrder ? : }
-
+
{migratableSources.map((migratableSource) => (
diff --git a/src/modules/navigation-bar/components/DesktopSideBar.tsx b/src/modules/navigation-bar/components/DesktopSideBar.tsx
index 0fd8b400..e13790da 100644
--- a/src/modules/navigation-bar/components/DesktopSideBar.tsx
+++ b/src/modules/navigation-bar/components/DesktopSideBar.tsx
@@ -20,7 +20,7 @@ import { styled, useTheme } from '@mui/material/styles';
import { useCallback, useMemo, useRef } from 'react';
import Box from '@mui/material/Box';
import ListItem from '@mui/material/ListItem';
-import Tooltip from '@mui/material/Tooltip';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { ListItemLink } from '@/modules/core/components/ListItemLink.tsx';
import { useGetOptionForDirection } from '@/modules/theme/services/ThemeCreator.ts';
import { useNavBarContext } from '@/modules/navigation-bar/contexts/NavbarContext.tsx';
@@ -55,7 +55,7 @@ const NavigationBarItem = ({ path, title, IconComponent, SelectedIconComponent }
return (
-
+
-
+
);
};
diff --git a/src/modules/reader/components/overlay/ReaderOverlayHeaderMobile.tsx b/src/modules/reader/components/overlay/ReaderOverlayHeaderMobile.tsx
index 8084483c..0d92d8df 100644
--- a/src/modules/reader/components/overlay/ReaderOverlayHeaderMobile.tsx
+++ b/src/modules/reader/components/overlay/ReaderOverlayHeaderMobile.tsx
@@ -20,9 +20,9 @@ import Menu from '@mui/material/Menu';
import Link from '@mui/material/Link';
import { Link as RouterLink } from 'react-router-dom';
import { alpha } from '@mui/material/styles';
-import Tooltip from '@mui/material/Tooltip';
import Slide from '@mui/material/Slide';
import { forwardRef, memo } from 'react';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { useGetOptionForDirection } from '@/modules/theme/services/ThemeCreator.ts';
import { TypographyMaxLines } from '@/modules/core/components/TypographyMaxLines.tsx';
import { actionToTranslationKey, ChapterAction, Chapters } from '@/modules/chapter/services/Chapters.ts';
@@ -80,15 +80,15 @@ const BaseReaderOverlayHeaderMobile = forwardRef<
boxShadow: 2,
}}
>
-
+
{getOptionForDirection(, )}
-
+
{manga && currentChapter ? (
<>
-
+
-
-
+
+
{name}
-
+
>
) : (
)}
-
+
Chapters.performAction(bookmarkAction, [chapterId], {})} color="inherit">
{isBookmarked ? : }
-
+
diff --git a/src/modules/reader/components/overlay/navigation/desktop/ReaderNavBarDesktop.tsx b/src/modules/reader/components/overlay/navigation/desktop/ReaderNavBarDesktop.tsx
index 4c0d446a..5f429818 100644
--- a/src/modules/reader/components/overlay/navigation/desktop/ReaderNavBarDesktop.tsx
+++ b/src/modules/reader/components/overlay/navigation/desktop/ReaderNavBarDesktop.tsx
@@ -7,7 +7,6 @@
*/
import Stack from '@mui/material/Stack';
-import Tooltip from '@mui/material/Tooltip';
import { useTranslation } from 'react-i18next';
import IconButton from '@mui/material/IconButton';
import ArrowBack from '@mui/icons-material/ArrowBack';
@@ -17,6 +16,7 @@ import PushPinOutlinedIcon from '@mui/icons-material/PushPinOutlined';
import Divider from '@mui/material/Divider';
import { memo, useCallback, useLayoutEffect, useRef, useState } from 'react';
import Drawer from '@mui/material/Drawer';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { useGetOptionForDirection } from '@/modules/theme/services/ThemeCreator.ts';
import { ReaderNavBarDesktopProps } from '@/modules/reader/types/ReaderOverlay.types.ts';
import { ReaderNavContainer } from '@/modules/reader/components/overlay/navigation/desktop/ReaderNavContainer.tsx';
@@ -111,12 +111,12 @@ const BaseReaderNavBarDesktop = ({
-
+
{getOptionForDirection(, )}
-
-
+
+
{
setReaderNavBarWidth(0);
@@ -126,7 +126,7 @@ const BaseReaderNavBarDesktop = ({
>
{isStaticNav ? : }
-
+
{manga && currentChapter ? (
<>
diff --git a/src/modules/reader/components/overlay/navigation/desktop/ReaderNavBarDesktopActions.tsx b/src/modules/reader/components/overlay/navigation/desktop/ReaderNavBarDesktopActions.tsx
index 42276bae..f46bb4fd 100644
--- a/src/modules/reader/components/overlay/navigation/desktop/ReaderNavBarDesktopActions.tsx
+++ b/src/modules/reader/components/overlay/navigation/desktop/ReaderNavBarDesktopActions.tsx
@@ -7,7 +7,6 @@
*/
import Stack from '@mui/material/Stack';
-import Tooltip from '@mui/material/Tooltip';
import { useTranslation } from 'react-i18next';
import IconButton from '@mui/material/IconButton';
import BookmarkIcon from '@mui/icons-material/Bookmark';
@@ -17,6 +16,7 @@ import DownloadIcon from '@mui/icons-material/Download';
import ReplayIcon from '@mui/icons-material/Replay';
import { memo, useMemo, useRef } from 'react';
import DeleteIcon from '@mui/icons-material/Delete';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { actionToTranslationKey, ChapterAction, Chapters } from '@/modules/chapter/services/Chapters.ts';
import { ReaderStateChapters } from '@/modules/reader/types/Reader.types.ts';
import { DownloadStateIndicator } from '@/modules/core/components/DownloadStateIndicator.tsx';
@@ -32,11 +32,11 @@ const DownloadButton = ({ currentChapter }: Required
+
Chapters.performAction('delete', [currentChapter.id], {})} color="inherit">
-
+
);
}
@@ -45,7 +45,7 @@ const DownloadButton = ({ currentChapter }: Required
+
Chapters.performAction('download', [currentChapter?.id ?? -1], {})}
@@ -53,7 +53,7 @@ const DownloadButton = ({ currentChapter }: Required
-
+
);
};
@@ -82,12 +82,12 @@ const BaseReaderNavBarDesktopActions = memo(
return (
-
+
Chapters.performAction(bookmarkAction, [id], {})} color="inherit">
{isBookmarked ? : }
-
-
+
+
{
setPageLoadStates((statePageLoadStates) =>
@@ -104,9 +104,9 @@ const BaseReaderNavBarDesktopActions = memo(
>
-
+
-
+
-
+
);
},
diff --git a/src/modules/reader/components/overlay/navigation/desktop/ReaderNavBarDesktopMetadata.tsx b/src/modules/reader/components/overlay/navigation/desktop/ReaderNavBarDesktopMetadata.tsx
index 9131a179..3617b3ae 100644
--- a/src/modules/reader/components/overlay/navigation/desktop/ReaderNavBarDesktopMetadata.tsx
+++ b/src/modules/reader/components/overlay/navigation/desktop/ReaderNavBarDesktopMetadata.tsx
@@ -7,11 +7,11 @@
*/
import Stack from '@mui/material/Stack';
-import Tooltip from '@mui/material/Tooltip';
import Link from '@mui/material/Link';
import { Link as RouterLink } from 'react-router-dom';
import { memo } from 'react';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { TypographyMaxLines } from '@/modules/core/components/TypographyMaxLines';
import { AppRoutes } from '@/modules/core/AppRoute.constants.ts';
@@ -28,7 +28,7 @@ export const ReaderNavBarDesktopMetadata = memo(
scanlator?: string | null;
}) => (
-
+
-
-
+
+
{chapterTitle}
-
+
{scanlator && (
-
+
{scanlator}
-
+
)}
),
diff --git a/src/modules/reader/components/overlay/navigation/desktop/ReaderNavBarDesktopNextPreviousButton.tsx b/src/modules/reader/components/overlay/navigation/desktop/ReaderNavBarDesktopNextPreviousButton.tsx
index ddd21582..6e9145a9 100644
--- a/src/modules/reader/components/overlay/navigation/desktop/ReaderNavBarDesktopNextPreviousButton.tsx
+++ b/src/modules/reader/components/overlay/navigation/desktop/ReaderNavBarDesktopNextPreviousButton.tsx
@@ -6,23 +6,29 @@
* file, You can obtain one at https://mozilla.org/MPL/2.0/.
*/
-import Tooltip from '@mui/material/Tooltip';
import { ComponentProps } from 'react';
import KeyboardArrowLeftIcon from '@mui/icons-material/KeyboardArrowLeft';
import KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { CustomIconButton } from '@/modules/core/components/buttons/CustomIconButton';
export const ReaderNavBarDesktopNextPreviousButton = ({
title,
type,
+ disabled,
...customIconButtonProps
}: Omit, 'children'> & {
title: string;
type: 'previous' | 'next';
}) => (
-
-
+
+
{type === 'previous' ? : }
-
+
);
diff --git a/src/modules/reader/components/overlay/navigation/desktop/quick-settings/ReaderNavBarDesktopPageScale.tsx b/src/modules/reader/components/overlay/navigation/desktop/quick-settings/ReaderNavBarDesktopPageScale.tsx
index 784ebf83..94ba6b91 100644
--- a/src/modules/reader/components/overlay/navigation/desktop/quick-settings/ReaderNavBarDesktopPageScale.tsx
+++ b/src/modules/reader/components/overlay/navigation/desktop/quick-settings/ReaderNavBarDesktopPageScale.tsx
@@ -7,9 +7,9 @@
*/
import Stack from '@mui/material/Stack';
-import Tooltip from '@mui/material/Tooltip';
import { useTranslation } from 'react-i18next';
import FitScreenIcon from '@mui/icons-material/FitScreen';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { CustomIconButton } from '@/modules/core/components/buttons/CustomIconButton.tsx';
import { ValueRotationButton } from '@/modules/core/components/buttons/ValueRotationButton.tsx';
import {
@@ -51,7 +51,7 @@ export const ReaderNavBarDesktopPageScale = ({
defaultIcon={PAGE_SCALE_VALUE_TO_DISPLAY_DATA[pageScaleMode.value].icon}
/>
{READER_PAGE_SCALE_MODE_TO_SCALING_ALLOWED[pageScaleMode.value] && (
-
+
updateSetting('shouldStretchPage', !shouldStretchPage.value)}
sx={{ minWidth: 0 }}
@@ -60,7 +60,7 @@ export const ReaderNavBarDesktopPageScale = ({
>
-
+
)}
);
diff --git a/src/modules/reader/components/overlay/navigation/mobile/ReaderBottomBarMobile.tsx b/src/modules/reader/components/overlay/navigation/mobile/ReaderBottomBarMobile.tsx
index 0853095b..387e5197 100644
--- a/src/modules/reader/components/overlay/navigation/mobile/ReaderBottomBarMobile.tsx
+++ b/src/modules/reader/components/overlay/navigation/mobile/ReaderBottomBarMobile.tsx
@@ -15,10 +15,10 @@ import { alpha } from '@mui/material/styles';
import { bindDialog, bindTrigger, usePopupState } from 'material-ui-popup-state/hooks';
import Dialog from '@mui/material/Dialog';
import DialogContent from '@mui/material/DialogContent';
-import Tooltip from '@mui/material/Tooltip';
import { useTranslation } from 'react-i18next';
import Slide from '@mui/material/Slide';
import { memo, useCallback, useLayoutEffect, useRef, useState } from 'react';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { ReaderBottomBarMobileProps } from '@/modules/reader/types/ReaderOverlay.types.ts';
import { MobileReaderProgressBar } from '@/modules/reader/components/overlay/progress-bar/variants/MobileReaderProgressBar.tsx';
import { ReaderChapterList } from '@/modules/reader/components/overlay/navigation/ReaderChapterList.tsx';
@@ -89,21 +89,21 @@ const BaseReaderBottomBarMobile = ({
alignItems: 'center',
}}
>
-
+
-
-
+
+
-
-
+
+
-
+
diff --git a/src/modules/reader/components/overlay/progress-bar/ReaderProgressBarCurrentPageSlot.tsx b/src/modules/reader/components/overlay/progress-bar/ReaderProgressBarCurrentPageSlot.tsx
index bbdb92d6..2b1af0cc 100644
--- a/src/modules/reader/components/overlay/progress-bar/ReaderProgressBarCurrentPageSlot.tsx
+++ b/src/modules/reader/components/overlay/progress-bar/ReaderProgressBarCurrentPageSlot.tsx
@@ -7,8 +7,8 @@
*/
import Box from '@mui/material/Box';
-import Tooltip from '@mui/material/Tooltip';
import { ReactNode } from 'react';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { CurrentPageSlotProps } from '@/modules/reader/types/ReaderProgressBar.types.ts';
import { applyStyles } from '@/modules/core/utils/ApplyStyles.ts';
import { getProgressBarPositionInfo } from '@/modules/reader/utils/ReaderProgressBar.utils.tsx';
@@ -23,7 +23,7 @@ export const ReaderProgressBarCurrentPageSlot = ({
children,
progressBarPosition,
}: CurrentPageSlotProps & { children?: ReactNode }) => (
-
{children}
-
+
);
diff --git a/src/modules/reader/components/overlay/progress-bar/ReaderProgressBarSlot.tsx b/src/modules/reader/components/overlay/progress-bar/ReaderProgressBarSlot.tsx
index 86d1bcdb..e4cb10a7 100644
--- a/src/modules/reader/components/overlay/progress-bar/ReaderProgressBarSlot.tsx
+++ b/src/modules/reader/components/overlay/progress-bar/ReaderProgressBarSlot.tsx
@@ -7,15 +7,15 @@
*/
import Box from '@mui/material/Box';
-import Tooltip from '@mui/material/Tooltip';
import { memo, ReactNode } from 'react';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { ReaderProgressBarSlotProps } from '@/modules/reader/types/ReaderProgressBar.types.ts';
import { READER_PROGRESS_BAR_POSITION_TO_PLACEMENT } from '@/modules/reader/constants/ReaderSettings.constants.tsx';
export const ReaderProgressBarSlot = memo(
({ pageName, progressBarPosition, slotProps, children }: ReaderProgressBarSlotProps & { children?: ReactNode }) => (
-
{children}
-
+
),
);
diff --git a/src/modules/reader/components/settings/hotkeys/Hotkey.tsx b/src/modules/reader/components/settings/hotkeys/Hotkey.tsx
index 735c4aa8..ad854544 100644
--- a/src/modules/reader/components/settings/hotkeys/Hotkey.tsx
+++ b/src/modules/reader/components/settings/hotkeys/Hotkey.tsx
@@ -9,7 +9,7 @@
import { Fragment } from 'react';
import Stack from '@mui/material/Stack';
import { useTranslation } from 'react-i18next';
-import Tooltip from '@mui/material/Tooltip';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { Kbd } from '@/modules/core/components/Kbd.tsx';
export const Hotkey = ({ keys, removeKey }: { keys: string[]; removeKey?: (key: string) => void }) => {
@@ -19,7 +19,7 @@ export const Hotkey = ({ keys, removeKey }: { keys: string[]; removeKey?: (key:
{keys.map((key, index) => (
-
+
))}
-
+
{index === keys.length - 1 ? '' : ','}
))}
diff --git a/src/modules/reader/components/settings/hotkeys/ReaderSettingHotkey.tsx b/src/modules/reader/components/settings/hotkeys/ReaderSettingHotkey.tsx
index 2e0817d7..e52a206c 100644
--- a/src/modules/reader/components/settings/hotkeys/ReaderSettingHotkey.tsx
+++ b/src/modules/reader/components/settings/hotkeys/ReaderSettingHotkey.tsx
@@ -10,9 +10,9 @@ import Stack from '@mui/material/Stack';
import { useTranslation } from 'react-i18next';
import AddIcon from '@mui/icons-material/Add';
import Typography from '@mui/material/Typography';
-import Tooltip from '@mui/material/Tooltip';
import { bindTrigger, usePopupState } from 'material-ui-popup-state/hooks';
import IconButton from '@mui/material/IconButton';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { ReaderHotkey } from '@/modules/reader/types/Reader.types.ts';
import { DEFAULT_READER_SETTINGS } from '@/modules/reader/constants/ReaderSettings.constants.tsx';
import { TranslationKey } from '@/Base.types.ts';
@@ -60,11 +60,11 @@ export const ReaderSettingHotkey = ({
keys={keys}
removeKey={(keyToRemove) => updateSetting(keys.filter((key) => key !== keyToRemove))}
/>
-
+
-
+
updateSetting(DEFAULT_READER_SETTINGS.hotkeys[hotkey])} />
{popupState.isOpen && (
diff --git a/src/modules/source/components/SourceOptions.tsx b/src/modules/source/components/SourceOptions.tsx
index 93c8c095..2b9309a3 100644
--- a/src/modules/source/components/SourceOptions.tsx
+++ b/src/modules/source/components/SourceOptions.tsx
@@ -23,7 +23,7 @@ import DialogTitle from '@mui/material/DialogTitle';
import DialogActions from '@mui/material/DialogActions';
import DialogContent from '@mui/material/DialogContent';
import TextField from '@mui/material/TextField';
-import Tooltip from '@mui/material/Tooltip';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
import { OptionsPanel } from '@/modules/core/components/OptionsPanel.tsx';
import { CheckBoxFilter } from '@/modules/source/components/filters/CheckBoxFilter.tsx';
import { HeaderFilter } from '@/modules/source/components/filters/HeaderFilter.tsx';
@@ -199,11 +199,11 @@ export function SourceOptions({
{(popupState) => (
<>
-
+
-
+