auto change board waiting for isReady

This commit is contained in:
Kevin Brack 2023-07-30 18:35:18 -05:00 committed by psychedelicious
parent 0ba8a0ea6c
commit 450e95de59
3 changed files with 28 additions and 10 deletions

View File

@ -16,7 +16,10 @@ import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions'; import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions';
import IAIDroppable from 'common/components/IAIDroppable'; import IAIDroppable from 'common/components/IAIDroppable';
import SelectionOverlay from 'common/components/SelectionOverlay'; import SelectionOverlay from 'common/components/SelectionOverlay';
import { boardIdSelected } from 'features/gallery/store/gallerySlice'; import {
autoAddBoardIdChanged,
boardIdSelected,
} from 'features/gallery/store/gallerySlice';
import { memo, useCallback, useMemo, useState } from 'react'; import { memo, useCallback, useMemo, useState } from 'react';
import { FaUser } from 'react-icons/fa'; import { FaUser } from 'react-icons/fa';
import { useUpdateBoardMutation } from 'services/api/endpoints/boards'; import { useUpdateBoardMutation } from 'services/api/endpoints/boards';
@ -24,6 +27,7 @@ import { useGetImageDTOQuery } from 'services/api/endpoints/images';
import { BoardDTO } from 'services/api/types'; import { BoardDTO } from 'services/api/types';
import AutoAddIcon from '../AutoAddIcon'; import AutoAddIcon from '../AutoAddIcon';
import BoardContextMenu from '../BoardContextMenu'; import BoardContextMenu from '../BoardContextMenu';
import { useIsReadyToInvoke } from 'common/hooks/useIsReadyToInvoke';
interface GalleryBoardProps { interface GalleryBoardProps {
board: BoardDTO; board: BoardDTO;
@ -41,15 +45,17 @@ const GalleryBoard = memo(
({ gallery }) => { ({ gallery }) => {
const isSelectedForAutoAdd = const isSelectedForAutoAdd =
board.board_id === gallery.autoAddBoardId; board.board_id === gallery.autoAddBoardId;
const autoAssignBoardOnClick = gallery.autoAssignBoardOnClick;
return { isSelectedForAutoAdd }; return { isSelectedForAutoAdd, autoAssignBoardOnClick };
}, },
defaultSelectorOptions defaultSelectorOptions
), ),
[board.board_id] [board.board_id]
); );
const { isSelectedForAutoAdd } = useAppSelector(selector); const { isSelectedForAutoAdd, autoAssignBoardOnClick } =
useAppSelector(selector);
const [isHovered, setIsHovered] = useState(false); const [isHovered, setIsHovered] = useState(false);
const handleMouseOver = useCallback(() => { const handleMouseOver = useCallback(() => {
setIsHovered(true); setIsHovered(true);
@ -64,9 +70,14 @@ const GalleryBoard = memo(
const { board_name, board_id } = board; const { board_name, board_id } = board;
const [localBoardName, setLocalBoardName] = useState(board_name); const [localBoardName, setLocalBoardName] = useState(board_name);
const isReady = useIsReadyToInvoke();
const handleSelectBoard = useCallback(() => { const handleSelectBoard = useCallback(() => {
dispatch(boardIdSelected(board_id)); dispatch(boardIdSelected(board_id));
}, [board_id, dispatch]); if (autoAssignBoardOnClick && isReady) {
dispatch(autoAddBoardIdChanged(board_id));
}
}, [board_id, autoAssignBoardOnClick, isReady, dispatch]);
const [updateBoard, { isLoading: isUpdateBoardLoading }] = const [updateBoard, { isLoading: isUpdateBoardLoading }] =
useUpdateBoardMutation(); useUpdateBoardMutation();

View File

@ -7,11 +7,15 @@ import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions';
import InvokeAILogoImage from 'assets/images/logo.png'; import InvokeAILogoImage from 'assets/images/logo.png';
import IAIDroppable from 'common/components/IAIDroppable'; import IAIDroppable from 'common/components/IAIDroppable';
import SelectionOverlay from 'common/components/SelectionOverlay'; import SelectionOverlay from 'common/components/SelectionOverlay';
import { boardIdSelected } from 'features/gallery/store/gallerySlice'; import {
boardIdSelected,
autoAddBoardIdChanged,
} from 'features/gallery/store/gallerySlice';
import { memo, useCallback, useMemo, useState } from 'react'; import { memo, useCallback, useMemo, useState } from 'react';
import { useBoardName } from 'services/api/hooks/useBoardName'; import { useBoardName } from 'services/api/hooks/useBoardName';
import AutoAddIcon from '../AutoAddIcon'; import AutoAddIcon from '../AutoAddIcon';
import BoardContextMenu from '../BoardContextMenu'; import BoardContextMenu from '../BoardContextMenu';
import { useIsReadyToInvoke } from 'common/hooks/useIsReadyToInvoke';
interface Props { interface Props {
isSelected: boolean; isSelected: boolean;
} }
@ -19,19 +23,23 @@ interface Props {
const selector = createSelector( const selector = createSelector(
stateSelector, stateSelector,
({ gallery }) => { ({ gallery }) => {
const { autoAddBoardId } = gallery; const { autoAddBoardId, autoAssignBoardOnClick } = gallery;
return { autoAddBoardId }; return { autoAddBoardId, autoAssignBoardOnClick };
}, },
defaultSelectorOptions defaultSelectorOptions
); );
const NoBoardBoard = memo(({ isSelected }: Props) => { const NoBoardBoard = memo(({ isSelected }: Props) => {
const dispatch = useAppDispatch(); const dispatch = useAppDispatch();
const { autoAddBoardId } = useAppSelector(selector); const { autoAddBoardId, autoAssignBoardOnClick } = useAppSelector(selector);
const boardName = useBoardName(undefined); const boardName = useBoardName(undefined);
const isReady = useIsReadyToInvoke();
const handleSelectBoard = useCallback(() => { const handleSelectBoard = useCallback(() => {
dispatch(boardIdSelected(undefined)); dispatch(boardIdSelected(undefined));
}, [dispatch]); if (autoAssignBoardOnClick && isReady) {
dispatch(autoAddBoardIdChanged(undefined));
}
}, [dispatch, autoAssignBoardOnClick, isReady]);
const [isHovered, setIsHovered] = useState(false); const [isHovered, setIsHovered] = useState(false);
const handleMouseOver = useCallback(() => { const handleMouseOver = useCallback(() => {
setIsHovered(true); setIsHovered(true);

View File

@ -73,7 +73,6 @@ export const gallerySlice = createSlice({
boardIdSelected: (state, action: PayloadAction<BoardId>) => { boardIdSelected: (state, action: PayloadAction<BoardId>) => {
state.selectedBoardId = action.payload; state.selectedBoardId = action.payload;
state.galleryView = 'images'; state.galleryView = 'images';
state.autoAssignBoardOnClick && (state.autoAddBoardId = action.payload);
}, },
isBatchEnabledChanged: (state, action: PayloadAction<boolean>) => { isBatchEnabledChanged: (state, action: PayloadAction<boolean>) => {
state.isBatchEnabled = action.payload; state.isBatchEnabled = action.payload;