diff --git a/invokeai/frontend/web/src/features/gallery/components/GallerySettingsPopover.tsx b/invokeai/frontend/web/src/features/gallery/components/GallerySettingsPopover.tsx index 21a580d9a9..04cc98edb7 100644 --- a/invokeai/frontend/web/src/features/gallery/components/GallerySettingsPopover.tsx +++ b/invokeai/frontend/web/src/features/gallery/components/GallerySettingsPopover.tsx @@ -8,6 +8,7 @@ import IAIPopover from 'common/components/IAIPopover'; import IAISimpleCheckbox from 'common/components/IAISimpleCheckbox'; import IAISlider from 'common/components/IAISlider'; import { + autoAssignBoardOnClickChanged, setGalleryImageMinimumWidth, shouldAutoSwitchChanged, } from 'features/gallery/store/gallerySlice'; @@ -19,11 +20,16 @@ import BoardAutoAddSelect from './Boards/BoardAutoAddSelect'; const selector = createSelector( [stateSelector], (state) => { - const { galleryImageMinimumWidth, shouldAutoSwitch } = state.gallery; + const { + galleryImageMinimumWidth, + shouldAutoSwitch, + autoAssignBoardOnClick, + } = state.gallery; return { galleryImageMinimumWidth, shouldAutoSwitch, + autoAssignBoardOnClick, }; }, defaultSelectorOptions @@ -33,7 +39,7 @@ const GallerySettingsPopover = () => { const dispatch = useAppDispatch(); const { t } = useTranslation(); - const { galleryImageMinimumWidth, shouldAutoSwitch } = + const { galleryImageMinimumWidth, shouldAutoSwitch, autoAssignBoardOnClick } = useAppSelector(selector); const handleChangeGalleryImageMinimumWidth = (v: number) => { @@ -69,7 +75,14 @@ const GallerySettingsPopover = () => { dispatch(shouldAutoSwitchChanged(e.target.checked)) } /> - + ) => + dispatch(autoAssignBoardOnClickChanged(e.target.checked)) + } + /> + {!autoAssignBoardOnClick && } ); diff --git a/invokeai/frontend/web/src/features/gallery/store/gallerySlice.ts b/invokeai/frontend/web/src/features/gallery/store/gallerySlice.ts index 5eabe5de26..851e1b6c3b 100644 --- a/invokeai/frontend/web/src/features/gallery/store/gallerySlice.ts +++ b/invokeai/frontend/web/src/features/gallery/store/gallerySlice.ts @@ -8,6 +8,7 @@ export const initialGalleryState: GalleryState = { selection: [], shouldAutoSwitch: true, autoAddBoardId: undefined, + autoAssignBoardOnClick: true, galleryImageMinimumWidth: 96, selectedBoardId: undefined, galleryView: 'images', @@ -66,9 +67,13 @@ export const gallerySlice = createSlice({ setGalleryImageMinimumWidth: (state, action: PayloadAction) => { state.galleryImageMinimumWidth = action.payload; }, + autoAssignBoardOnClickChanged: (state, action: PayloadAction) => { + state.autoAssignBoardOnClick = action.payload; + }, boardIdSelected: (state, action: PayloadAction) => { state.selectedBoardId = action.payload; state.galleryView = 'images'; + state.autoAssignBoardOnClick && (state.autoAddBoardId = action.payload); }, isBatchEnabledChanged: (state, action: PayloadAction) => { state.isBatchEnabled = action.payload; @@ -140,6 +145,7 @@ export const { imageSelectionToggled, imageSelected, shouldAutoSwitchChanged, + autoAssignBoardOnClickChanged, setGalleryImageMinimumWidth, boardIdSelected, isBatchEnabledChanged, diff --git a/invokeai/frontend/web/src/features/gallery/store/types.ts b/invokeai/frontend/web/src/features/gallery/store/types.ts index d19a6fded3..298b792362 100644 --- a/invokeai/frontend/web/src/features/gallery/store/types.ts +++ b/invokeai/frontend/web/src/features/gallery/store/types.ts @@ -18,6 +18,7 @@ export type GalleryState = { selection: string[]; shouldAutoSwitch: boolean; autoAddBoardId: string | undefined; + autoAssignBoardOnClick: boolean; galleryImageMinimumWidth: number; selectedBoardId: BoardId; galleryView: GalleryView;