Show migration exclude/include button only with selected match

CHANGELOG.md

@@ -25,6 +25,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/).
 - (**Migration**) Abort active search when selecting a match through the manual search
 - (**Migration**) Sort unselected matched entries by 1. their latest chapter, 2. their source priority, 3. their title
 - (**Migration**) Change migration match exclude/include icons
+- (**Migration**) Show the exclude/include button only for an entry with a selected match
 
 ### Fixed
 

src/features/migration/components/migration-entry/MigrationEntry.tsx

@@ -91,7 +91,7 @@ const MigrationEntryMobile = memo(
 
                 {!isMigrating && (
                     <MigrationEntrySearchExcludeActions
-                        hasResults={!!destinationEntry}
+                        hasSelectedMatch={!!destinationEntry}
                         otherResultsCount={otherSearchMatches.length}
                         isExpanded={isExpanded}
                         setIsExpanded={setIsExpanded}
@@ -153,7 +153,7 @@ export const MigrationEntryDesktop = memo(
 
                         {!isMigrating && (
                             <MigrationEntrySearchExcludeActions
-                                hasResults={!!destinationEntry}
+                                hasSelectedMatch={!!destinationEntry}
                                 otherResultsCount={otherSearchMatches.length}
                                 isExpanded={isExpanded}
                                 setIsExpanded={setIsExpanded}

src/features/migration/components/migration-entry/MigrationEntrySearchExcludeActions.tsx

@@ -26,7 +26,7 @@ import RemoveCircleOutlineOutlinedIcon from '@mui/icons-material/RemoveCircleOut
 import AddCircleOutlineOutlinedIcon from '@mui/icons-material/AddCircleOutlineOutlined';
 
 export const MigrationEntrySearchExcludeActions = ({
-    hasResults,
+    hasSelectedMatch,
     otherResultsCount,
     isExpanded,
     setIsExpanded,
@@ -34,7 +34,7 @@ export const MigrationEntrySearchExcludeActions = ({
     mangaId,
     mangaTitle,
 }: {
-    hasResults: boolean;
+    hasSelectedMatch: boolean;
     otherResultsCount: number;
     isExpanded: boolean;
     setIsExpanded: (expanded: boolean) => void;
@@ -74,33 +74,39 @@ export const MigrationEntrySearchExcludeActions = ({
                         </CustomButtonIcon>
                     </CustomTooltip>
                 )}
-                <CustomTooltip title={isExcluded ? t`Include` : t`Exclude`}>
+                {hasSelectedMatch && (
-                    <CustomButtonIcon
+                    <CustomTooltip title={isExcluded ? t`Include` : t`Exclude`}>
-                        sx={{
+                        <CustomButtonIcon
-                            flexGrow: Number(!otherResultsCount),
+                            sx={{
-                        }}
+                                flexGrow: Number(!otherResultsCount),
-                        onClick={() =>
+                            }}
-                            isExcluded ? MigrationManager.includeManga(mangaId) : MigrationManager.excludeManga(mangaId)
+                            onClick={() =>
-                        }
+                                isExcluded
-                    >
+                                    ? MigrationManager.includeManga(mangaId)
-                        {isExcluded ? <AddCircleOutlineOutlinedIcon /> : <RemoveCircleOutlineOutlinedIcon />}
+                                    : MigrationManager.excludeManga(mangaId)
-                    </CustomButtonIcon>
+                            }
-                </CustomTooltip>
+                        >
+                            {isExcluded ? <AddCircleOutlineOutlinedIcon /> : <RemoveCircleOutlineOutlinedIcon />}
+                        </CustomButtonIcon>
+                    </CustomTooltip>
+                )}
             </ButtonGroup>
         );
     }
 
     return (
         <Stack sx={{ gap: 1, justifyContent: 'center' }}>
-            <CustomTooltip title={isExcluded ? t`Include` : t`Exclude`} placement="auto">
+            {hasSelectedMatch && (
-                <IconButton
+                <CustomTooltip title={isExcluded ? t`Include` : t`Exclude`} placement="auto">
-                    onClick={() =>
+                    <IconButton
-                        isExcluded ? MigrationManager.includeManga(mangaId) : MigrationManager.excludeManga(mangaId)
+                        onClick={() =>
-                    }
+                            isExcluded ? MigrationManager.includeManga(mangaId) : MigrationManager.excludeManga(mangaId)
-                >
+                        }
-                    {isExcluded ? <AddIcon /> : <CloseIcon />}
+                    >
-                </IconButton>
+                        {isExcluded ? <AddIcon /> : <CloseIcon />}
-            </CustomTooltip>
+                    </IconButton>
+                </CustomTooltip>
+            )}
             <CustomTooltip title={t`Manual search`} placement="auto">
                 <IconButton
                     onClick={() => {