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;