diff --git a/invokeai/frontend/web/src/features/gallery/components/Boards/BoardAutoAddSelect.tsx b/invokeai/frontend/web/src/features/gallery/components/Boards/BoardAutoAddSelect.tsx index ad0e5ab80d..9f02a29f10 100644 --- a/invokeai/frontend/web/src/features/gallery/components/Boards/BoardAutoAddSelect.tsx +++ b/invokeai/frontend/web/src/features/gallery/components/Boards/BoardAutoAddSelect.tsx @@ -11,11 +11,14 @@ import { useListAllBoardsQuery } from 'services/api/endpoints/boards'; const selector = createSelector( [stateSelector], - ({ gallery }) => { - const { autoAddBoardId } = gallery; + ({ gallery, system }) => { + const { autoAddBoardId, autoAssignBoardOnClick } = gallery; + const { isProcessing } = system; return { autoAddBoardId, + autoAssignBoardOnClick, + isProcessing, }; }, defaultSelectorOptions @@ -23,7 +26,8 @@ const selector = createSelector( const BoardAutoAddSelect = () => { const dispatch = useAppDispatch(); - const { autoAddBoardId } = useAppSelector(selector); + const { autoAddBoardId, autoAssignBoardOnClick, isProcessing } = + useAppSelector(selector); const inputRef = useRef(null); const { boards, hasBoards } = useListAllBoardsQuery(undefined, { selectFromResult: ({ data }) => { @@ -67,7 +71,7 @@ const BoardAutoAddSelect = () => { data={boards} nothingFound="No matching Boards" itemComponent={IAIMantineSelectItemWithTooltip} - disabled={!hasBoards} + disabled={!hasBoards || autoAssignBoardOnClick || isProcessing} filter={(value, item: SelectItem) => item.label?.toLowerCase().includes(value.toLowerCase().trim()) || item.value.toLowerCase().includes(value.toLowerCase().trim()) diff --git a/invokeai/frontend/web/src/features/gallery/components/Boards/BoardsList/GalleryBoard.tsx b/invokeai/frontend/web/src/features/gallery/components/Boards/BoardsList/GalleryBoard.tsx index a4124e2393..3b591ee00f 100644 --- a/invokeai/frontend/web/src/features/gallery/components/Boards/BoardsList/GalleryBoard.tsx +++ b/invokeai/frontend/web/src/features/gallery/components/Boards/BoardsList/GalleryBoard.tsx @@ -27,7 +27,6 @@ import { useGetImageDTOQuery } from 'services/api/endpoints/images'; import { BoardDTO } from 'services/api/types'; import AutoAddIcon from '../AutoAddIcon'; import BoardContextMenu from '../BoardContextMenu'; -import { useIsReadyToInvoke } from 'common/hooks/useIsReadyToInvoke'; interface GalleryBoardProps { board: BoardDTO; @@ -42,19 +41,24 @@ const GalleryBoard = memo( () => createSelector( stateSelector, - ({ gallery }) => { + ({ gallery, system }) => { const isSelectedForAutoAdd = board.board_id === gallery.autoAddBoardId; const autoAssignBoardOnClick = gallery.autoAssignBoardOnClick; + const isProcessing = system.isProcessing; - return { isSelectedForAutoAdd, autoAssignBoardOnClick }; + return { + isSelectedForAutoAdd, + autoAssignBoardOnClick, + isProcessing, + }; }, defaultSelectorOptions ), [board.board_id] ); - const { isSelectedForAutoAdd, autoAssignBoardOnClick } = + const { isSelectedForAutoAdd, autoAssignBoardOnClick, isProcessing } = useAppSelector(selector); const [isHovered, setIsHovered] = useState(false); const handleMouseOver = useCallback(() => { @@ -70,14 +74,12 @@ const GalleryBoard = memo( const { board_name, board_id } = board; const [localBoardName, setLocalBoardName] = useState(board_name); - const isReady = useIsReadyToInvoke(); - const handleSelectBoard = useCallback(() => { dispatch(boardIdSelected(board_id)); - if (autoAssignBoardOnClick && isReady) { + if (autoAssignBoardOnClick && !isProcessing) { dispatch(autoAddBoardIdChanged(board_id)); } - }, [board_id, autoAssignBoardOnClick, isReady, dispatch]); + }, [board_id, autoAssignBoardOnClick, isProcessing, dispatch]); const [updateBoard, { isLoading: isUpdateBoardLoading }] = useUpdateBoardMutation(); diff --git a/invokeai/frontend/web/src/features/gallery/components/Boards/BoardsList/NoBoardBoard.tsx b/invokeai/frontend/web/src/features/gallery/components/Boards/BoardsList/NoBoardBoard.tsx index 3963fc04d9..118b2108f7 100644 --- a/invokeai/frontend/web/src/features/gallery/components/Boards/BoardsList/NoBoardBoard.tsx +++ b/invokeai/frontend/web/src/features/gallery/components/Boards/BoardsList/NoBoardBoard.tsx @@ -15,31 +15,31 @@ import { memo, useCallback, useMemo, useState } from 'react'; import { useBoardName } from 'services/api/hooks/useBoardName'; import AutoAddIcon from '../AutoAddIcon'; import BoardContextMenu from '../BoardContextMenu'; -import { useIsReadyToInvoke } from 'common/hooks/useIsReadyToInvoke'; interface Props { isSelected: boolean; } const selector = createSelector( stateSelector, - ({ gallery }) => { + ({ gallery, system }) => { const { autoAddBoardId, autoAssignBoardOnClick } = gallery; - return { autoAddBoardId, autoAssignBoardOnClick }; + const { isProcessing } = system; + return { autoAddBoardId, autoAssignBoardOnClick, isProcessing }; }, defaultSelectorOptions ); const NoBoardBoard = memo(({ isSelected }: Props) => { const dispatch = useAppDispatch(); - const { autoAddBoardId, autoAssignBoardOnClick } = useAppSelector(selector); + const { autoAddBoardId, autoAssignBoardOnClick, isProcessing } = + useAppSelector(selector); const boardName = useBoardName(undefined); - const isReady = useIsReadyToInvoke(); const handleSelectBoard = useCallback(() => { dispatch(boardIdSelected(undefined)); - if (autoAssignBoardOnClick && isReady) { + if (autoAssignBoardOnClick && !isProcessing) { dispatch(autoAddBoardIdChanged(undefined)); } - }, [dispatch, autoAssignBoardOnClick, isReady]); + }, [dispatch, autoAssignBoardOnClick, isProcessing]); const [isHovered, setIsHovered] = useState(false); const handleMouseOver = useCallback(() => { setIsHovered(true); diff --git a/invokeai/frontend/web/src/features/gallery/components/GallerySettingsPopover.tsx b/invokeai/frontend/web/src/features/gallery/components/GallerySettingsPopover.tsx index 04cc98edb7..796cc542e7 100644 --- a/invokeai/frontend/web/src/features/gallery/components/GallerySettingsPopover.tsx +++ b/invokeai/frontend/web/src/features/gallery/components/GallerySettingsPopover.tsx @@ -82,7 +82,7 @@ const GallerySettingsPopover = () => { dispatch(autoAssignBoardOnClickChanged(e.target.checked)) } /> - {!autoAssignBoardOnClick && } + );