github/InvokeAI
1
1
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI.git synced 2026-04-23 03:00:31 -04:00
Code Issues Packages Projects Releases Wiki Activity

feat(ui): handle edge cases when archiving/deleting boards

Browse Source 
If the currently selected or auto-add board is archived or deleted, we should reset them. There are some edge cases taht weren't handled in the previous implementation.

All handling of this logic is moved to the (renamed) listener.
This commit is contained in:
psychedelicious
2024-06-28 09:53:11 +10:00
parent 15b9ece411
commit 0d4b80780b
7 changed files with 52 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
invokeai/frontend/web/src/features/gallery/components/Boards/BoardContextMenu.tsx
View File

@@ -2,7 +2,6 @@ import type { ContextMenuProps } from '@invoke-ai/ui-library';
import { ContextMenu, MenuGroup, MenuItem, MenuList } from '@invoke-ai/ui-library';
import { createSelector } from '@reduxjs/toolkit';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { checkAutoAddBoardVisible } from 'features/gallery/store/actions';
import { autoAddBoardIdChanged, selectGallerySlice } from 'features/gallery/store/gallerySlice';
import { useFeatureStatus } from 'features/system/hooks/useFeatureStatus';
import { toast } from 'features/toast/toast';
@@ -53,14 +52,13 @@ const BoardContextMenu = ({ board, setBoardToDelete, children }: Props) => {
board_id: board.board_id,
changes: { archived: true },
}).unwrap();
dispatch(checkAutoAddBoardVisible());
} catch (error) {
toast({
status: 'error',
title: 'Unable to archive board',
});
}
}, [board.board_id, updateBoard, dispatch]);
}, [board.board_id, updateBoard]);
const handleUnarchive = useCallback(() => {
updateBoard({

2
invokeai/frontend/web/src/features/gallery/components/GallerySettingsPopover.tsx
View File

@@ -14,7 +14,6 @@ import {
Switch,
} from '@invoke-ai/ui-library';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { checkAutoAddBoardVisible } from 'features/gallery/store/actions';
import {
alwaysShowImageSizeBadgeChanged,
autoAssignBoardOnClickChanged,
@@ -69,7 +68,6 @@ const GallerySettingsPopover = () => {
const handleChangeShouldShowArchivedBoardsChanged = useCallback(
(e: ChangeEvent<HTMLInputElement>) => {
dispatch(shouldShowArchivedBoardsChanged(e.target.checked));
dispatch(checkAutoAddBoardVisible());
},
[dispatch]
);

2
invokeai/frontend/web/src/features/gallery/store/actions.ts
View File

@@ -5,5 +5,3 @@ export const sentImageToCanvas = createAction('gallery/sentImageToCanvas');
export const sentImageToImg2Img = createAction('gallery/sentImageToImg2Img');
export const imageDownloaded = createAction('gallery/imageDownloaded');
export const checkAutoAddBoardVisible = createAction('gallery/checkAutoAddBoardVisible');

32
invokeai/frontend/web/src/features/gallery/store/gallerySlice.ts
View File

@@ -1,9 +1,7 @@
import type { PayloadAction } from '@reduxjs/toolkit';
import { createSlice, isAnyOf } from '@reduxjs/toolkit';
import { createSlice } from '@reduxjs/toolkit';
import type { PersistConfig, RootState } from 'app/store/store';
import { uniqBy } from 'lodash-es';
import { boardsApi } from 'services/api/endpoints/boards';
import { imagesApi } from 'services/api/endpoints/images';
import type { ImageDTO } from 'services/api/types';
import type { BoardId, ComparisonMode, GalleryState, GalleryView } from './types';
@@ -115,29 +113,6 @@ export const gallerySlice = createSlice({
state.shouldShowArchivedBoards = action.payload;
},
},
extraReducers: (builder) => {
builder.addMatcher(isAnyBoardDeleted, (state, action) => {
const deletedBoardId = action.meta.arg.originalArgs;
if (deletedBoardId === state.selectedBoardId) {
state.selectedBoardId = 'none';
state.galleryView = 'images';
}
if (deletedBoardId === state.autoAddBoardId) {
state.autoAddBoardId = 'none';
}
});
builder.addMatcher(boardsApi.endpoints.listAllBoards.matchFulfilled, (state, action) => {
const boards = action.payload;
if (!state.autoAddBoardId) {
return;
}
if (!boards.map((b) => b.board_id).includes(state.autoAddBoardId)) {
state.autoAddBoardId = 'none';
}
});
},
});
export const {
@@ -162,11 +137,6 @@ export const {
shouldShowArchivedBoardsChanged,
} = gallerySlice.actions;
const isAnyBoardDeleted = isAnyOf(
imagesApi.endpoints.deleteBoard.matchFulfilled,
imagesApi.endpoints.deleteBoardAndImages.matchFulfilled
);
export const selectGallerySlice = (state: RootState) => state.gallery;
/* eslint-disable-next-line @typescript-eslint/no-explicit-any */