Add bulk migration

src/base/AppRoute.constants.ts

@@ -199,15 +199,19 @@ export const AppRoutes = {
             }),
     },
     migrate: {
-        match: 'migrate/source/:sourceId',
-        path: (sourceId: SourceType['id']) => `/migrate/source/${sourceId}`,
-
+        match: 'migrate/*',
+        path: '/migrate',
         childRoutes: {
-            search: {
-                match: 'manga/:mangaId/search',
+            singleMangaSearch: {
+                match: 'source/:sourceId/manga/:mangaId/search',
                 path: (sourceId: SourceType['id'], mangaId: MangaIdInfo['id'], query?: string | null | undefined) =>
                     UrlUtil.addQueryParam(`/migrate/source/${sourceId}/manga/${mangaId}/search`, query),
             },
+            manualSearch: {
+                match: 'manual-search/:mangaId',
+                path: (mangaId: MangaIdInfo['id'], query?: string | null | undefined) =>
+                    UrlUtil.addQueryParam(`/migrate/manual-search/${mangaId}`, query),
+            },
         },
     },
     tracker: {

src/base/collection/components/SelectableCollectionSelectMode.tsx

@@ -18,12 +18,14 @@ export const SelectableCollectionSelectMode = ({
     areNoItemsSelected,
     onSelectAll,
     onModeChange,
+    isCancelable = true,
 }: {
     isActive: boolean;
     areAllItemsSelected: boolean;
     areNoItemsSelected: boolean;
     onSelectAll: (selectAll: boolean) => void;
     onModeChange: (checked: boolean) => void;
+    isCancelable?: boolean;
 }) => {
     const { t } = useLingui();
 
@@ -36,20 +38,22 @@ export const SelectableCollectionSelectMode = ({
                     onChange={onSelectAll}
                 />
             )}
-            <CustomTooltip title={!isActive ? t`Select all` : t`Cancel`}>
-                <Checkbox
-                    checkedIcon={<ClearIcon />}
-                    sx={{
-                        padding: '8px',
-                        color: 'inherit',
-                        '&.Mui-checked': {
+            {isCancelable && (
+                <CustomTooltip title={!isActive ? t`Select all` : t`Cancel`}>
+                    <Checkbox
+                        checkedIcon={<ClearIcon />}
+                        sx={{
+                            padding: '8px',
                             color: 'inherit',
-                        },
-                    }}
-                    checked={isActive}
-                    onChange={(_, checked) => onModeChange(checked)}
-                />
-            </CustomTooltip>
+                            '&.Mui-checked': {
+                                color: 'inherit',
+                            },
+                        }}
+                        checked={isActive}
+                        onChange={(_, checked) => onModeChange(checked)}
+                    />
+                </CustomTooltip>
+            )}
         </>
     );
 };

src/base/components/feedback/LoadingPlaceholder.tsx

@@ -10,17 +10,21 @@ import React, { type JSX } from 'react';
 import CircularProgress from '@mui/material/CircularProgress';
 import Box from '@mui/material/Box';
 
-interface IProps {
+export function LoadingPlaceholder({
+    children,
+    shouldRender,
+    component,
+    componentProps,
+    usePadding,
+    size,
+}: {
     shouldRender?: boolean | (() => boolean);
     children?: React.ReactNode;
     component?: string | React.FunctionComponent<any> | React.ComponentClass<any, any>;
     componentProps?: any;
     usePadding?: boolean;
-}
-
-export function LoadingPlaceholder(props: IProps) {
-    const { children, shouldRender, component, componentProps, usePadding } = props;
-
+    size?: number;
+}) {
     let condition = true;
     if (shouldRender !== undefined) {
         condition = shouldRender instanceof Function ? shouldRender() : shouldRender;
@@ -47,7 +51,7 @@ export function LoadingPlaceholder(props: IProps) {
                 justifyContent: 'center',
             }}
         >
-            <CircularProgress thickness={5} />
+            <CircularProgress thickness={5} size={size} />
         </Box>
     );
 }

src/base/components/feedback/SnackbarWithDescription.tsx

@@ -83,7 +83,7 @@ export const SnackbarWithDescription = memo(
                 >
                     <TitleComponent>{message}</TitleComponent>
                     {actualDescription}
-                    {isDescriptionTooLong || (isGraphqlException && graphqlStackTrace) ? (
+                    {(isDescriptionTooLong || (isGraphqlException && graphqlStackTrace)) && (
                         <Button
                             onClick={() => {
                                 Confirmation.show({
@@ -108,8 +108,6 @@ export const SnackbarWithDescription = memo(
                         >
                             {t`Show more`}
                         </Button>
-                    ) : (
-                        ''
                     )}
                 </Alert>
             </SnackbarContent>