Fix/manga migration opening search twice (#586)

* Update "MenuItem" props

* Navigate to manga migration only once

* Remove disabling migrate button on manga refresh

too much copy&paste

src/components/chapter/ChapterActionMenuItems.tsx

@@ -128,7 +128,7 @@ export const ChapterActionMenuItems = ({
             {shouldShowMenuItem(canBeDownloaded) && (
                 <MenuItem
                     Icon={Download}
-                    isDisabled={isMenuItemDisabled(!downloadableChapters.length)}
+                    disabled={isMenuItemDisabled(!downloadableChapters.length)}
                     onClick={() => performAction('download', downloadableChapters)}
                     title={getMenuItemTitle('download', downloadableChapters.length)}
                 />
@@ -136,7 +136,7 @@ export const ChapterActionMenuItems = ({
             {shouldShowMenuItem(isDownloaded) && (
                 <MenuItem
                     Icon={Delete}
-                    isDisabled={isMenuItemDisabled(!downloadedChapters.length)}
+                    disabled={isMenuItemDisabled(!downloadedChapters.length)}
                     onClick={() => performAction('delete', downloadedChapters)}
                     title={getMenuItemTitle('delete', downloadedChapters.length)}
                 />
@@ -144,7 +144,7 @@ export const ChapterActionMenuItems = ({
             {shouldShowMenuItem(!isBookmarked) && (
                 <MenuItem
                     Icon={BookmarkAdd}
-                    isDisabled={isMenuItemDisabled(!unbookmarkedChapters.length)}
+                    disabled={isMenuItemDisabled(!unbookmarkedChapters.length)}
                     onClick={() => performAction('bookmark', unbookmarkedChapters)}
                     title={getMenuItemTitle('bookmark', unbookmarkedChapters.length)}
                 />
@@ -152,7 +152,7 @@ export const ChapterActionMenuItems = ({
             {shouldShowMenuItem(isBookmarked) && (
                 <MenuItem
                     Icon={BookmarkRemove}
-                    isDisabled={isMenuItemDisabled(!bookmarkedChapters.length)}
+                    disabled={isMenuItemDisabled(!bookmarkedChapters.length)}
                     onClick={() => performAction('unbookmark', bookmarkedChapters)}
                     title={getMenuItemTitle('unbookmark', bookmarkedChapters.length)}
                 />
@@ -160,7 +160,7 @@ export const ChapterActionMenuItems = ({
             {shouldShowMenuItem(!isRead) && (
                 <MenuItem
                     Icon={Done}
-                    isDisabled={isMenuItemDisabled(!unreadChapters.length)}
+                    disabled={isMenuItemDisabled(!unreadChapters.length)}
                     onClick={() => performAction('mark_as_read', unreadChapters)}
                     title={getMenuItemTitle('mark_as_read', unreadChapters.length)}
                 />
@@ -168,7 +168,7 @@ export const ChapterActionMenuItems = ({
             {shouldShowMenuItem(isRead) && (
                 <MenuItem
                     Icon={RemoveDone}
-                    isDisabled={isMenuItemDisabled(!readChapters.length)}
+                    disabled={isMenuItemDisabled(!readChapters.length)}
                     onClick={() => performAction('mark_as_unread', readChapters)}
                     title={getMenuItemTitle('mark_as_unread', readChapters.length)}
                 />

src/components/manga/MangaActionMenuItems.tsx

@@ -16,7 +16,7 @@ import FavoriteBorderIcon from '@mui/icons-material/FavoriteBorder';
 import Label from '@mui/icons-material/Label';
 import { useMemo, useState } from 'react';
 import SyncAltIcon from '@mui/icons-material/SyncAlt';
-import { Link, useNavigate } from 'react-router-dom';
+import { Link } from 'react-router-dom';
 import { TManga } from '@/typings.ts';
 import { actionToTranslationKey, MangaAction, MangaDownloadInfo, Mangas, MangaUnreadInfo } from '@/lib/data/Mangas.ts';
 import { SelectableCollectionReturnType } from '@/components/collection/useSelectableCollection.ts';
@@ -51,8 +51,6 @@ export const MangaActionMenuItems = ({
 }: Props) => {
     const { t } = useTranslation();
 
-    const navigate = useNavigate();
-
     const [isCategorySelectOpen, setIsCategorySelectOpen] = useState(false);
 
     const isSingleMode = !!manga;
@@ -104,7 +102,7 @@ export const MangaActionMenuItems = ({
             {shouldShowMenuItem(!isFullyDownloaded) && (
                 <MenuItem
                     Icon={Download}
-                    isDisabled={isMenuItemDisabled(!downloadableMangas.length)}
+                    disabled={isMenuItemDisabled(!downloadableMangas.length)}
                     onClick={() => performAction('download', downloadableMangas)}
                     title={getMenuItemTitle('download', downloadableMangas.length)}
                 />
@@ -112,7 +110,7 @@ export const MangaActionMenuItems = ({
             {shouldShowMenuItem(hasDownloadedChapters) && (
                 <MenuItem
                     Icon={Delete}
-                    isDisabled={isMenuItemDisabled(!downloadedMangas.length)}
+                    disabled={isMenuItemDisabled(!downloadedMangas.length)}
                     onClick={() => performAction('delete', downloadedMangas)}
                     title={getMenuItemTitle('delete', downloadedMangas.length)}
                 />
@@ -120,7 +118,7 @@ export const MangaActionMenuItems = ({
             {shouldShowMenuItem(hasUnreadChapters) && (
                 <MenuItem
                     Icon={Done}
-                    isDisabled={isMenuItemDisabled(!unreadMangas.length)}
+                    disabled={isMenuItemDisabled(!unreadMangas.length)}
                     onClick={() => performAction('mark_as_read', unreadMangas)}
                     title={getMenuItemTitle('mark_as_read', unreadMangas.length)}
                 />
@@ -128,7 +126,7 @@ export const MangaActionMenuItems = ({
             {shouldShowMenuItem(hasReadChapters) && (
                 <MenuItem
                     Icon={RemoveDone}
-                    isDisabled={isMenuItemDisabled(!readMangas.length)}
+                    disabled={isMenuItemDisabled(!readMangas.length)}
                     onClick={() => performAction('mark_as_unread', readMangas)}
                     title={getMenuItemTitle('mark_as_unread', readMangas.length)}
                 />
@@ -139,15 +137,7 @@ export const MangaActionMenuItems = ({
                     state={{ mangaTitle: manga?.title }}
                     style={{ textDecoration: 'none', color: 'inherit' }}
                 >
-                    <MenuItem
-                        onClick={() =>
-                            navigate(
-                                `/migrate/source/${manga?.source?.id}/manga/${manga?.id}/search?query=${manga?.title}`,
-                            )
-                        }
-                        Icon={SyncAltIcon}
-                        title={getMenuItemTitle('migrate', selectedMangas.length)}
-                    />
+                    <MenuItem Icon={SyncAltIcon} title={getMenuItemTitle('migrate', selectedMangas.length)} />
                 </Link>
             )}
             <MenuItem

src/components/manga/MangaToolbarMenu.tsx

@@ -66,7 +66,7 @@ export const MangaToolbarMenu = ({ manga, onRefresh, refreshing }: IProps) => {
                             state={{ mangaTitle: manga.title }}
                             style={{ textDecoration: 'none', color: 'inherit' }}
                         >
-                            <IconButton disabled={refreshing}>
+                            <IconButton>
                                 <SyncAltIcon />
                             </IconButton>
                         </Link>

src/components/menu/MenuItem.tsx

@@ -6,19 +6,17 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import { ListItemIcon, ListItemText, MenuItem as MuiMenuItem } from '@mui/material';
+import { ListItemIcon, ListItemText, MenuItem as MuiMenuItem, MenuItemProps } from '@mui/material';
 import { OverridableComponent } from '@mui/material/OverridableComponent';
 import { SvgIconTypeMap } from '@mui/material/SvgIcon/SvgIcon';
 
-interface IProps {
+interface IProps extends MenuItemProps {
     title: string;
     Icon: OverridableComponent<SvgIconTypeMap> & { muiName: string };
-    onClick: () => void;
-    isDisabled?: boolean;
 }
 
-export const MenuItem = ({ onClick, title, Icon, isDisabled }: IProps) => (
-    <MuiMenuItem onClick={onClick} disabled={isDisabled}>
+export const MenuItem = ({ title, Icon, ...menuItemProps }: IProps) => (
+    <MuiMenuItem {...menuItemProps}>
         <ListItemIcon>
             <Icon fontSize="small" />
         </ListItemIcon>