add support to delete all uncategorized images

Author: Mary Hipp

invokeai/app/api/routers/boards.py

@@ -146,7 +146,7 @@ async def list_boards(
     response_model=list[str],
 )
 async def list_all_board_image_names(
-    board_id: str = Path(description="The id of the board"),
+    board_id: str = Path(description="The id of the board or 'none' for uncategorized images"),
     categories: list[ImageCategory] | None = Query(default=None, description="The categories of image to include."),
     is_intermediate: bool | None = Query(default=None, description="Whether to list intermediate images."),
 ) -> list[str]:

invokeai/app/api/routers/images.py

@@ -395,6 +395,29 @@ async def delete_images_from_list(
         raise HTTPException(status_code=500, detail="Failed to delete images")
 
 
+@images_router.delete(
+    "/uncategorized", operation_id="delete_uncategorized_images", response_model=DeleteImagesFromListResult
+)
+async def delete_uncategorized_images() -> DeleteImagesFromListResult:
+    """Deletes all images that are uncategorized"""
+
+    image_names = ApiDependencies.invoker.services.board_images.get_all_board_image_names_for_board(
+        board_id="none", categories=None, is_intermediate=None
+    )
+
+    try:
+        deleted_images: list[str] = []
+        for image_name in image_names:
+            try:
+                ApiDependencies.invoker.services.images.delete(image_name)
+                deleted_images.append(image_name)
+            except Exception:
+                pass
+        return DeleteImagesFromListResult(deleted_images=deleted_images)
+    except Exception:
+        raise HTTPException(status_code=500, detail="Failed to delete images")
+
+
 class ImagesUpdatedFromListResult(BaseModel):
     updated_image_names: list[str] = Field(description="The image names that were updated")
 

invokeai/app/services/board_image_records/board_image_records_sqlite.py

@@ -98,9 +98,18 @@ def get_all_board_image_names_for_board(
                 FROM images
                 LEFT JOIN board_images ON board_images.image_name = images.image_name
                 WHERE 1=1
+                """
+
+        # Handle board_id filter
+        if board_id == "none":
+            stmt += """--sql
+                AND board_images.board_id IS NULL
+                """
+        else:
+            stmt += """--sql
                 AND board_images.board_id = ?
                 """
-        params.append(board_id)
+            params.append(board_id)
 
         # Add the category filter
         if categories is not None:

invokeai/frontend/web/public/locales/en.json

@@ -24,15 +24,18 @@
         "autoAddBoard": "Auto-Add Board",
         "boards": "Boards",
         "selectedForAutoAdd": "Selected for Auto-Add",
-        "bottomMessage": "Deleting this board and its images will reset any features currently using them.",
+        "bottomMessage": "Deleting images will reset any features currently using them.",
         "cancel": "Cancel",
         "changeBoard": "Change Board",
         "clearSearch": "Clear Search",
         "deleteBoard": "Delete Board",
         "deleteBoardAndImages": "Delete Board and Images",
         "deleteBoardOnly": "Delete Board Only",
-        "deletedBoardsCannotbeRestored": "Deleted boards cannot be restored. Selecting 'Delete Board Only' will move images to an uncategorized state.",
-        "deletedPrivateBoardsCannotbeRestored": "Deleted boards cannot be restored. Selecting 'Delete Board Only' will move images to a private uncategorized state for the image's creator.",
+        "deletedBoardsCannotbeRestored": "Deleted boards and images cannot be restored. Selecting 'Delete Board Only' will move images to an uncategorized state.",
+        "deletedPrivateBoardsCannotbeRestored": "Deleted boards and images cannot be restored. Selecting 'Delete Board Only' will move images to a private uncategorized state for the image's creator.",
+        "uncategorizedImages": "Uncategorized Images",
+        "deleteAllUncategorizedImages": "Delete All Uncategorized Images",
+        "deletedImagesCannotBeRestored": "Deleted images cannot be restored.",
         "hideBoards": "Hide Boards",
         "loading": "Loading...",
         "menuItemAutoAdd": "Auto-add to this Board",
@@ -46,7 +49,7 @@
         "searchBoard": "Search Boards...",
         "selectBoard": "Select a Board",
         "shared": "Shared Boards",
-        "topMessage": "This board contains images used in the following features:",
+        "topMessage": "This selection contains images used in the following features:",
         "unarchiveBoard": "Unarchive Board",
         "uncategorized": "Uncategorized",
         "viewBoards": "View Boards",

invokeai/frontend/web/src/features/gallery/components/Boards/DeleteBoardModal.tsx

@@ -26,19 +26,26 @@ import { atom } from 'nanostores';
 import { memo, useCallback, useMemo, useRef } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useListAllImageNamesForBoardQuery } from 'services/api/endpoints/boards';
-import { useDeleteBoardAndImagesMutation, useDeleteBoardMutation } from 'services/api/endpoints/images';
+import {
+  useDeleteBoardAndImagesMutation,
+  useDeleteBoardMutation,
+  useDeleteUncategorizedImagesMutation,
+} from 'services/api/endpoints/images';
 import type { BoardDTO } from 'services/api/types';
 
-export const $boardToDelete = atom<BoardDTO | null>(null);
+export const $boardToDelete = atom<BoardDTO | 'none' | null>(null);
 
 const DeleteBoardModal = () => {
   useAssertSingleton('DeleteBoardModal');
   const boardToDelete = useStore($boardToDelete);
   const { t } = useTranslation();
+
+  const boardId = useMemo(() => (boardToDelete === 'none' ? 'none' : boardToDelete?.board_id), [boardToDelete]);
+
   const { currentData: boardImageNames, isFetching: isFetchingBoardNames } = useListAllImageNamesForBoardQuery(
-    boardToDelete?.board_id
+    boardId
       ? {
-          board_id: boardToDelete?.board_id,
+          board_id: boardId,
           categories: undefined,
           is_intermediate: undefined,
         }
@@ -71,33 +78,48 @@ const DeleteBoardModal = () => {
 
   const [deleteBoardAndImages, { isLoading: isDeleteBoardAndImagesLoading }] = useDeleteBoardAndImagesMutation();
 
+  const [deleteUncategorizedImages, { isLoading: isDeleteUncategorizedImagesLoading }] =
+    useDeleteUncategorizedImagesMutation();
+
   const imageUsageSummary = useAppSelector(selectImageUsageSummary);
 
   const handleDeleteBoardOnly = useCallback(() => {
-    if (!boardToDelete) {
+    if (!boardToDelete || boardToDelete === 'none') {
       return;
     }
     deleteBoardOnly(boardToDelete.board_id);
     $boardToDelete.set(null);
   }, [boardToDelete, deleteBoardOnly]);
 
   const handleDeleteBoardAndImages = useCallback(() => {
-    if (!boardToDelete) {
+    if (!boardToDelete || boardToDelete === 'none') {
       return;
     }
     deleteBoardAndImages(boardToDelete.board_id);
     $boardToDelete.set(null);
   }, [boardToDelete, deleteBoardAndImages]);
 
+  const handleDeleteUncategorizedImages = useCallback(() => {
+    if (!boardToDelete || boardToDelete !== 'none') {
+      return;
+    }
+    deleteUncategorizedImages();
+    $boardToDelete.set(null);
+  }, [boardToDelete, deleteUncategorizedImages]);
+
   const handleClose = useCallback(() => {
     $boardToDelete.set(null);
   }, []);
 
   const cancelRef = useRef<HTMLButtonElement>(null);
 
   const isLoading = useMemo(
-    () => isDeleteBoardAndImagesLoading || isDeleteBoardOnlyLoading || isFetchingBoardNames,
-    [isDeleteBoardAndImagesLoading, isDeleteBoardOnlyLoading, isFetchingBoardNames]
+    () =>
+      isDeleteBoardAndImagesLoading ||
+      isDeleteBoardOnlyLoading ||
+      isFetchingBoardNames ||
+      isDeleteUncategorizedImagesLoading,
+    [isDeleteBoardAndImagesLoading, isDeleteBoardOnlyLoading, isFetchingBoardNames, isDeleteUncategorizedImagesLoading]
   );
 
   if (!boardToDelete) {
@@ -109,7 +131,7 @@ const DeleteBoardModal = () => {
       <AlertDialogOverlay>
         <AlertDialogContent>
           <AlertDialogHeader fontSize="lg" fontWeight="bold">
-            {t('common.delete')} {boardToDelete.board_name}
+            {t('common.delete')} {boardToDelete === 'none' ? t('boards.uncategorizedImages') : boardToDelete.board_name}
           </AlertDialogHeader>
 
           <AlertDialogBody>
@@ -126,9 +148,10 @@ const DeleteBoardModal = () => {
                 />
               )}
               <Text>
-                {boardToDelete.is_private
-                  ? t('boards.deletedPrivateBoardsCannotbeRestored')
-                  : t('boards.deletedBoardsCannotbeRestored')}
+                {boardToDelete !== 'none' &&
+                  (boardToDelete.is_private
+                    ? t('boards.deletedPrivateBoardsCannotbeRestored')
+                    : t('boards.deletedBoardsCannotbeRestored'))}
               </Text>
               <Text>{t('gallery.deleteImagePermanent')}</Text>
             </Flex>
@@ -138,12 +161,21 @@ const DeleteBoardModal = () => {
               <Button ref={cancelRef} onClick={handleClose}>
                 {t('boards.cancel')}
               </Button>
-              <Button colorScheme="warning" isLoading={isLoading} onClick={handleDeleteBoardOnly}>
-                {t('boards.deleteBoardOnly')}
-              </Button>
-              <Button colorScheme="error" isLoading={isLoading} onClick={handleDeleteBoardAndImages}>
-                {t('boards.deleteBoardAndImages')}
-              </Button>
+              {boardToDelete !== 'none' && (
+                <Button colorScheme="warning" isLoading={isLoading} onClick={handleDeleteBoardOnly}>
+                  {t('boards.deleteBoardOnly')}
+                </Button>
+              )}
+              {boardToDelete !== 'none' && (
+                <Button colorScheme="error" isLoading={isLoading} onClick={handleDeleteBoardAndImages}>
+                  {t('boards.deleteBoardAndImages')}
+                </Button>
+              )}
+              {boardToDelete === 'none' && (
+                <Button colorScheme="error" isLoading={isLoading} onClick={handleDeleteUncategorizedImages}>
+                  {t('boards.deleteAllUncategorizedImages')}
+                </Button>
+              )}
             </Flex>
           </AlertDialogFooter>
         </AlertDialogContent>

invokeai/frontend/web/src/features/gallery/components/Boards/NoBoardBoardContextMenu.tsx

@@ -7,9 +7,11 @@ import { autoAddBoardIdChanged } from 'features/gallery/store/gallerySlice';
 import { useFeatureStatus } from 'features/system/hooks/useFeatureStatus';
 import { memo, useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
-import { PiDownloadBold, PiPlusBold } from 'react-icons/pi';
+import { PiDownloadBold, PiPlusBold, PiTrashSimpleBold } from 'react-icons/pi';
 import { useBulkDownloadImagesMutation } from 'services/api/endpoints/images';
 
+import { $boardToDelete } from './DeleteBoardModal';
+
 type Props = {
   children: ContextMenuProps<HTMLDivElement>['children'];
 };
@@ -33,6 +35,10 @@ const NoBoardBoardContextMenu = ({ children }: Props) => {
     bulkDownload({ image_names: [], board_id: 'none' });
   }, [bulkDownload]);
 
+  const setUncategorizedImagesAsToBeDeleted = useCallback(() => {
+    $boardToDelete.set('none');
+  }, []);
+
   const renderMenuFunc = useCallback(
     () => (
       <MenuList visibility="visible">
@@ -47,10 +53,26 @@ const NoBoardBoardContextMenu = ({ children }: Props) => {
               {t('boards.downloadBoard')}
             </MenuItem>
           )}
+          <MenuItem
+            color="error.300"
+            icon={<PiTrashSimpleBold />}
+            onClick={setUncategorizedImagesAsToBeDeleted}
+            isDestructive
+          >
+            {t('boards.deleteAllUncategorizedImages')}
+          </MenuItem>
         </MenuGroup>
       </MenuList>
     ),
-    [autoAssignBoardOnClick, handleBulkDownload, handleSetAutoAdd, isBulkDownloadEnabled, isSelectedForAutoAdd, t]
+    [
+      autoAssignBoardOnClick,
+      handleBulkDownload,
+      handleSetAutoAdd,
+      isBulkDownloadEnabled,
+      isSelectedForAutoAdd,
+      t,
+      setUncategorizedImagesAsToBeDeleted,
+    ]
   );
 
   return <ContextMenu renderMenu={renderMenuFunc}>{children}</ContextMenu>;

invokeai/frontend/web/src/services/api/endpoints/images.ts

@@ -160,6 +160,42 @@ export const imagesApi = api.injectEndpoints({
         return [];
       },
     }),
+    deleteUncategorizedImages: build.mutation<components['schemas']['DeleteImagesFromListResult'], void>({
+      query: () => ({ url: buildImagesUrl('uncategorized'), method: 'DELETE' }),
+      invalidatesTags: (result) => {
+        if (result && result.deleted_images.length > 0) {
+          const boardId = 'none';
+
+          const tags: ApiTagDescription[] = [
+            {
+              type: 'ImageList',
+              id: getListImagesUrl({
+                board_id: boardId,
+                categories: IMAGE_CATEGORIES,
+              }),
+            },
+            {
+              type: 'ImageList',
+              id: getListImagesUrl({
+                board_id: boardId,
+                categories: ASSETS_CATEGORIES,
+              }),
+            },
+            {
+              type: 'Board',
+              id: boardId,
+            },
+            {
+              type: 'BoardImagesTotal',
+              id: boardId,
+            },
+          ];
+
+          return tags;
+        }
+        return [];
+      },
+    }),
     /**
      * Change an image's `is_intermediate` property.
      */
@@ -566,6 +602,7 @@ export const {
   useAddImagesToBoardMutation,
   useRemoveImagesFromBoardMutation,
   useDeleteBoardAndImagesMutation,
+  useDeleteUncategorizedImagesMutation,
   useDeleteBoardMutation,
   useStarImagesMutation,
   useUnstarImagesMutation,