diff --git a/invokeai/frontend/web/public/locales/en.json b/invokeai/frontend/web/public/locales/en.json index 5179f30002..04a96e5467 100644 --- a/invokeai/frontend/web/public/locales/en.json +++ b/invokeai/frontend/web/public/locales/en.json @@ -1962,7 +1962,7 @@ "recalculateRects": "Recalculate Rects", "clipToBbox": "Clip Strokes to Bbox", "outputOnlyMaskedRegions": "Output Only Generated Regions", - "saveAllStagingImagesToGallery": "Save All Staging Images to Gallery", + "saveAllImagesToGallery": "Save All Images to Gallery", "addLayer": "Add Layer", "duplicate": "Duplicate", "moveToFront": "Move to Front", @@ -2331,8 +2331,8 @@ "label": "Preserve Masked Region", "alert": "Preserving Masked Region" }, - "saveAllStagingImagesToGallery": { - "alert": "Saving All Staging Images to Gallery" + "saveAllImagesToGallery": { + "alert": "Saving All Images to Gallery" }, "isolatedStagingPreview": "Isolated Staging Preview", "isolatedPreview": "Isolated Preview", diff --git a/invokeai/frontend/web/src/features/controlLayers/components/CanvasAlerts/CanvasAlertsSaveAllImagesToGallery.tsx b/invokeai/frontend/web/src/features/controlLayers/components/CanvasAlerts/CanvasAlertsSaveAllImagesToGallery.tsx new file mode 100644 index 0000000000..a07f635ec6 --- /dev/null +++ b/invokeai/frontend/web/src/features/controlLayers/components/CanvasAlerts/CanvasAlertsSaveAllImagesToGallery.tsx @@ -0,0 +1,23 @@ +import { Alert, AlertIcon, AlertTitle } from '@invoke-ai/ui-library'; +import { useAppSelector } from 'app/store/storeHooks'; +import { selectSaveAllImagesToGallery } from 'features/controlLayers/store/canvasSettingsSlice'; +import { memo } from 'react'; +import { useTranslation } from 'react-i18next'; + +export const CanvasAlertsSaveAllImagesToGallery = memo(() => { + const { t } = useTranslation(); + const saveAllImagesToGallery = useAppSelector(selectSaveAllImagesToGallery); + + if (!saveAllImagesToGallery) { + return null; + } + + return ( + + + {t('controlLayers.settings.saveAllImagesToGallery.alert')} + + ); +}); + +CanvasAlertsSaveAllImagesToGallery.displayName = 'CanvasAlertsSaveAllImagesToGallery'; diff --git a/invokeai/frontend/web/src/features/controlLayers/components/CanvasAlerts/CanvasAlertsSaveAllStagingImagesToGallery.tsx b/invokeai/frontend/web/src/features/controlLayers/components/CanvasAlerts/CanvasAlertsSaveAllStagingImagesToGallery.tsx deleted file mode 100644 index 63faec7719..0000000000 --- a/invokeai/frontend/web/src/features/controlLayers/components/CanvasAlerts/CanvasAlertsSaveAllStagingImagesToGallery.tsx +++ /dev/null @@ -1,23 +0,0 @@ -import { Alert, AlertIcon, AlertTitle } from '@invoke-ai/ui-library'; -import { useAppSelector } from 'app/store/storeHooks'; -import { selectSaveAllStagingImagesToGallery } from 'features/controlLayers/store/canvasSettingsSlice'; -import { memo } from 'react'; -import { useTranslation } from 'react-i18next'; - -export const CanvasAlertsSaveAllStagingImagesToGallery = memo(() => { - const { t } = useTranslation(); - const saveAllStagingImagesToGallery = useAppSelector(selectSaveAllStagingImagesToGallery); - - if (!saveAllStagingImagesToGallery) { - return null; - } - - return ( - - - {t('controlLayers.settings.saveAllStagingImagesToGallery.alert')} - - ); -}); - -CanvasAlertsSaveAllStagingImagesToGallery.displayName = 'CanvasAlertsSaveAllStagingImagesToGallery'; diff --git a/invokeai/frontend/web/src/features/controlLayers/components/Settings/CanvasSettingsPopover.tsx b/invokeai/frontend/web/src/features/controlLayers/components/Settings/CanvasSettingsPopover.tsx index e5cd083eba..c2eba6db1d 100644 --- a/invokeai/frontend/web/src/features/controlLayers/components/Settings/CanvasSettingsPopover.tsx +++ b/invokeai/frontend/web/src/features/controlLayers/components/Settings/CanvasSettingsPopover.tsx @@ -26,7 +26,7 @@ import { CanvasSettingsPreserveMaskCheckbox } from 'features/controlLayers/compo import { CanvasSettingsPressureSensitivityCheckbox } from 'features/controlLayers/components/Settings/CanvasSettingsPressureSensitivity'; import { CanvasSettingsRecalculateRectsButton } from 'features/controlLayers/components/Settings/CanvasSettingsRecalculateRectsButton'; import { CanvasSettingsRuleOfThirdsSwitch } from 'features/controlLayers/components/Settings/CanvasSettingsRuleOfThirdsGuideSwitch'; -import { CanvasSettingsSaveAllStagingImagesToGalleryCheckbox } from 'features/controlLayers/components/Settings/CanvasSettingsSaveAllStagingImagesToGalleryCheckbox'; +import { CanvasSettingsSaveAllImagesToGalleryCheckbox } from 'features/controlLayers/components/Settings/CanvasSettingsSaveAllImagesToGalleryCheckbox'; import { CanvasSettingsShowHUDSwitch } from 'features/controlLayers/components/Settings/CanvasSettingsShowHUDSwitch'; import { CanvasSettingsShowProgressOnCanvas } from 'features/controlLayers/components/Settings/CanvasSettingsShowProgressOnCanvasSwitch'; import { memo } from 'react'; @@ -62,7 +62,7 @@ export const CanvasSettingsPopover = memo(() => { - + diff --git a/invokeai/frontend/web/src/features/controlLayers/components/Settings/CanvasSettingsSaveAllImagesToGalleryCheckbox.tsx b/invokeai/frontend/web/src/features/controlLayers/components/Settings/CanvasSettingsSaveAllImagesToGalleryCheckbox.tsx new file mode 100644 index 0000000000..cfd6a924f7 --- /dev/null +++ b/invokeai/frontend/web/src/features/controlLayers/components/Settings/CanvasSettingsSaveAllImagesToGalleryCheckbox.tsx @@ -0,0 +1,25 @@ +import { Checkbox, FormControl, FormLabel } from '@invoke-ai/ui-library'; +import { useAppDispatch, useAppSelector } from 'app/store/storeHooks'; +import { + selectSaveAllImagesToGallery, + settingsSaveAllImagesToGalleryToggled, +} from 'features/controlLayers/store/canvasSettingsSlice'; +import { memo, useCallback } from 'react'; +import { useTranslation } from 'react-i18next'; + +export const CanvasSettingsSaveAllImagesToGalleryCheckbox = memo(() => { + const { t } = useTranslation(); + const dispatch = useAppDispatch(); + const saveAllImagesToGallery = useAppSelector(selectSaveAllImagesToGallery); + const onChange = useCallback(() => { + dispatch(settingsSaveAllImagesToGalleryToggled()); + }, [dispatch]); + return ( + + {t('controlLayers.saveAllImagesToGallery')} + + + ); +}); + +CanvasSettingsSaveAllImagesToGalleryCheckbox.displayName = 'CanvasSettingsSaveAllImagesToGalleryCheckbox'; diff --git a/invokeai/frontend/web/src/features/controlLayers/components/Settings/CanvasSettingsSaveAllStagingImagesToGalleryCheckbox.tsx b/invokeai/frontend/web/src/features/controlLayers/components/Settings/CanvasSettingsSaveAllStagingImagesToGalleryCheckbox.tsx deleted file mode 100644 index 633056dfbb..0000000000 --- a/invokeai/frontend/web/src/features/controlLayers/components/Settings/CanvasSettingsSaveAllStagingImagesToGalleryCheckbox.tsx +++ /dev/null @@ -1,25 +0,0 @@ -import { Checkbox, FormControl, FormLabel } from '@invoke-ai/ui-library'; -import { useAppDispatch, useAppSelector } from 'app/store/storeHooks'; -import { - selectSaveAllStagingImagesToGallery, - settingsSaveAllStagingImagesToGalleryToggled, -} from 'features/controlLayers/store/canvasSettingsSlice'; -import { memo, useCallback } from 'react'; -import { useTranslation } from 'react-i18next'; - -export const CanvasSettingsSaveAllStagingImagesToGalleryCheckbox = memo(() => { - const { t } = useTranslation(); - const dispatch = useAppDispatch(); - const saveAllStagingImagesToGallery = useAppSelector(selectSaveAllStagingImagesToGallery); - const onChange = useCallback(() => { - dispatch(settingsSaveAllStagingImagesToGalleryToggled()); - }, [dispatch]); - return ( - - {t('controlLayers.saveAllStagingImagesToGallery')} - - - ); -}); - -CanvasSettingsSaveAllStagingImagesToGalleryCheckbox.displayName = 'CanvasSettingsSaveAllStagingImagesToGalleryCheckbox'; diff --git a/invokeai/frontend/web/src/features/controlLayers/store/canvasSettingsSlice.ts b/invokeai/frontend/web/src/features/controlLayers/store/canvasSettingsSlice.ts index ac24b0af82..444a421c05 100644 --- a/invokeai/frontend/web/src/features/controlLayers/store/canvasSettingsSlice.ts +++ b/invokeai/frontend/web/src/features/controlLayers/store/canvasSettingsSlice.ts @@ -80,7 +80,7 @@ type CanvasSettingsState = { /** * Whether to save all staging images to the gallery instead of keeping them as intermediate images. */ - saveAllStagingImagesToGallery: boolean; + saveAllImagesToGallery: boolean; }; const initialState: CanvasSettingsState = { @@ -101,7 +101,7 @@ const initialState: CanvasSettingsState = { isolatedLayerPreview: true, pressureSensitivity: true, ruleOfThirds: false, - saveAllStagingImagesToGallery: false, + saveAllImagesToGallery: false, }; export const canvasSettingsSlice = createSlice({ @@ -159,8 +159,8 @@ export const canvasSettingsSlice = createSlice({ settingsRuleOfThirdsToggled: (state) => { state.ruleOfThirds = !state.ruleOfThirds; }, - settingsSaveAllStagingImagesToGalleryToggled: (state) => { - state.saveAllStagingImagesToGallery = !state.saveAllStagingImagesToGallery; + settingsSaveAllImagesToGalleryToggled: (state) => { + state.saveAllImagesToGallery = !state.saveAllImagesToGallery; }, }, }); @@ -183,7 +183,7 @@ export const { settingsIsolatedLayerPreviewToggled, settingsPressureSensitivityToggled, settingsRuleOfThirdsToggled, - settingsSaveAllStagingImagesToGalleryToggled, + settingsSaveAllImagesToGalleryToggled, } = canvasSettingsSlice.actions; /* eslint-disable-next-line @typescript-eslint/no-explicit-any */ @@ -218,6 +218,4 @@ export const selectIsolatedStagingPreview = createCanvasSettingsSelector((settin export const selectIsolatedLayerPreview = createCanvasSettingsSelector((settings) => settings.isolatedLayerPreview); export const selectPressureSensitivity = createCanvasSettingsSelector((settings) => settings.pressureSensitivity); export const selectRuleOfThirds = createCanvasSettingsSelector((settings) => settings.ruleOfThirds); -export const selectSaveAllStagingImagesToGallery = createCanvasSettingsSelector( - (settings) => settings.saveAllStagingImagesToGallery -); +export const selectSaveAllImagesToGallery = createCanvasSettingsSelector((settings) => settings.saveAllImagesToGallery); diff --git a/invokeai/frontend/web/src/features/nodes/util/graph/graphBuilderUtils.ts b/invokeai/frontend/web/src/features/nodes/util/graph/graphBuilderUtils.ts index c273d16e19..86a401b199 100644 --- a/invokeai/frontend/web/src/features/nodes/util/graph/graphBuilderUtils.ts +++ b/invokeai/frontend/web/src/features/nodes/util/graph/graphBuilderUtils.ts @@ -1,7 +1,7 @@ import { createSelector } from '@reduxjs/toolkit'; import type { RootState } from 'app/store/store'; import { getPrefixedId } from 'features/controlLayers/konva/util'; -import { selectSaveAllStagingImagesToGallery } from 'features/controlLayers/store/canvasSettingsSlice'; +import { selectSaveAllImagesToGallery } from 'features/controlLayers/store/canvasSettingsSlice'; import { selectImg2imgStrength, selectMainModelConfig, @@ -45,11 +45,11 @@ export const selectCanvasOutputFields = (state: RootState) => { // Advanced session means working on canvas - images are not saved to gallery or added to a board. // Simple session means working in YOLO mode - images are saved to gallery & board. const tab = selectActiveTab(state); - const saveAllStagingImagesToGallery = selectSaveAllStagingImagesToGallery(state); + const saveAllImagesToGallery = selectSaveAllImagesToGallery(state); - // If we're on canvas and the save all staging images setting is enabled, save to gallery - const is_intermediate = tab === 'canvas' && !saveAllStagingImagesToGallery; - const board = tab === 'canvas' && !saveAllStagingImagesToGallery ? undefined : getBoardField(state); + // If we're on canvas and the save all images setting is enabled, save to gallery + const is_intermediate = tab === 'canvas' && !saveAllImagesToGallery; + const board = tab === 'canvas' && !saveAllImagesToGallery ? undefined : getBoardField(state); return { is_intermediate, diff --git a/invokeai/frontend/web/src/features/ui/layouts/CanvasWorkspacePanel.tsx b/invokeai/frontend/web/src/features/ui/layouts/CanvasWorkspacePanel.tsx index 3ff0ef6c2b..b47926981e 100644 --- a/invokeai/frontend/web/src/features/ui/layouts/CanvasWorkspacePanel.tsx +++ b/invokeai/frontend/web/src/features/ui/layouts/CanvasWorkspacePanel.tsx @@ -2,7 +2,7 @@ import { ContextMenu, Divider, Flex, IconButton, Menu, MenuButton, MenuList } fr import { useAppSelector } from 'app/store/storeHooks'; import { CanvasAlertsInvocationProgress } from 'features/controlLayers/components/CanvasAlerts/CanvasAlertsInvocationProgress'; import { CanvasAlertsPreserveMask } from 'features/controlLayers/components/CanvasAlerts/CanvasAlertsPreserveMask'; -import { CanvasAlertsSaveAllStagingImagesToGallery } from 'features/controlLayers/components/CanvasAlerts/CanvasAlertsSaveAllStagingImagesToGallery'; +import { CanvasAlertsSaveAllImagesToGallery } from 'features/controlLayers/components/CanvasAlerts/CanvasAlertsSaveAllImagesToGallery'; import { CanvasAlertsSelectedEntityStatus } from 'features/controlLayers/components/CanvasAlerts/CanvasAlertsSelectedEntityStatus'; import { CanvasBusySpinner } from 'features/controlLayers/components/CanvasBusySpinner'; import { CanvasContextMenuGlobalMenuItems } from 'features/controlLayers/components/CanvasContextMenu/CanvasContextMenuGlobalMenuItems'; @@ -89,7 +89,7 @@ export const CanvasWorkspacePanel = memo(() => { {showHUD && } - +