diff --git a/invokeai/frontend/web/public/locales/en.json b/invokeai/frontend/web/public/locales/en.json
index ecd34fb3a6..8036669a25 100644
--- a/invokeai/frontend/web/public/locales/en.json
+++ b/invokeai/frontend/web/public/locales/en.json
@@ -1673,6 +1673,8 @@
},
"upscaling": {
"creativity": "Creativity",
+ "exceedsMaxSize": "Upscale settings exceed max size limit",
+ "exceedsMaxSizeDetails": "Max upscale limit is {{maxUpscaleDimension}}x{{maxUpscaleDimension}} pixels. Please try a smaller image or decrease your scale selection.",
"structure": "Structure",
"upscaleModel": "Upscale Model",
"postProcessingModel": "Post-Processing Model",
@@ -1680,8 +1682,6 @@
"postProcessingMissingModelWarning": "Visit the Model Manager to install a post-processing (image to image) model.",
"missingModelsWarning": "Visit the Model Manager to install the required models:",
"mainModelDesc": "Main model (SD1.5 or SDXL architecture)",
- "outputTooLargeShort": "Output is too large to upscale",
- "outputTooLarge": "Max upscale limit is 10,000x10,000 pixels. Please try a smaller image or decrease your scale selection.",
"tileControlNetModelDesc": "Tile ControlNet model for the chosen main model architecture",
"upscaleModelDesc": "Upscale (image to image) model",
"missingUpscaleInitialImage": "Missing initial image for upscaling",
diff --git a/invokeai/frontend/web/src/app/types/invokeai.ts b/invokeai/frontend/web/src/app/types/invokeai.ts
index a84cefabaa..901cfdf759 100644
--- a/invokeai/frontend/web/src/app/types/invokeai.ts
+++ b/invokeai/frontend/web/src/app/types/invokeai.ts
@@ -65,7 +65,7 @@ export type AppConfig = {
*/
shouldUpdateImagesOnConnect: boolean;
shouldFetchMetadataFromApi: boolean;
- maxUpscalePixels?: number;
+ maxUpscaleDimension?: number;
allowPrivateBoards: boolean;
disabledTabs: InvokeTabName[];
disabledFeatures: AppFeature[];
diff --git a/invokeai/frontend/web/src/common/hooks/useIsReadyToEnqueue.ts b/invokeai/frontend/web/src/common/hooks/useIsReadyToEnqueue.ts
index b0562f74dd..1985e1b57b 100644
--- a/invokeai/frontend/web/src/common/hooks/useIsReadyToEnqueue.ts
+++ b/invokeai/frontend/web/src/common/hooks/useIsReadyToEnqueue.ts
@@ -212,11 +212,11 @@ const createSelector = (templates: Templates) =>
} else if (activeTabName === 'upscaling') {
if (!upscale.upscaleInitialImage) {
reasons.push({ content: i18n.t('upscaling.missingUpscaleInitialImage') });
- } else if (config.maxUpscalePixels) {
+ } else if (config.maxUpscaleDimension) {
const upscaledPixels =
upscale.upscaleInitialImage.width * upscale.scale * upscale.upscaleInitialImage.height * upscale.scale;
- if (upscaledPixels > config.maxUpscalePixels) {
- reasons.push({ content: i18n.t('upscaling.outputTooLargeShort') });
+ if (upscaledPixels > config.maxUpscaleDimension) {
+ reasons.push({ content: i18n.t('upscaling.exceedsMaxSize') });
}
}
if (!upscale.upscaleModel) {
diff --git a/invokeai/frontend/web/src/features/parameters/hooks/useIsTooLargeToUpscale.ts b/invokeai/frontend/web/src/features/parameters/hooks/useIsTooLargeToUpscale.ts
index ab10949f55..c061086c4c 100644
--- a/invokeai/frontend/web/src/features/parameters/hooks/useIsTooLargeToUpscale.ts
+++ b/invokeai/frontend/web/src/features/parameters/hooks/useIsTooLargeToUpscale.ts
@@ -8,14 +8,14 @@ import type { ImageDTO } from 'services/api/types';
const createIsTooLargeToUpscaleSelector = (imageDTO?: ImageDTO) =>
createMemoizedSelector(selectUpscalelice, selectConfigSlice, (upscale, config) => {
const { upscaleModel, scale } = upscale;
- const { maxUpscalePixels } = config;
+ const { maxUpscaleDimension } = config;
- if (!maxUpscalePixels || !upscaleModel || !imageDTO) {
+ if (!maxUpscaleDimension || !upscaleModel || !imageDTO) {
return false;
}
const upscaledPixels = imageDTO.width * scale * imageDTO.height * scale;
- return upscaledPixels > maxUpscalePixels;
+ return upscaledPixels > maxUpscaleDimension * maxUpscaleDimension;
});
export const useIsTooLargeToUpscale = (imageDTO?: ImageDTO) => {
diff --git a/invokeai/frontend/web/src/features/settingsAccordions/components/UpscaleSettingsAccordion/UpscaleWarning.tsx b/invokeai/frontend/web/src/features/settingsAccordions/components/UpscaleSettingsAccordion/UpscaleWarning.tsx
index 40a8370d0c..18d63d4f74 100644
--- a/invokeai/frontend/web/src/features/settingsAccordions/components/UpscaleSettingsAccordion/UpscaleWarning.tsx
+++ b/invokeai/frontend/web/src/features/settingsAccordions/components/UpscaleSettingsAccordion/UpscaleWarning.tsx
@@ -18,6 +18,7 @@ export const UpscaleWarning = () => {
const [modelConfigs, { isLoading }] = useControlNetModels();
const disabledTabs = useAppSelector((s) => s.config.disabledTabs);
const shouldShowButton = useMemo(() => !disabledTabs.includes('models'), [disabledTabs]);
+ const maxUpscaleDimension = useAppSelector((s) => s.config.maxUpscaleDimension);
const isTooLargeToUpscale = useIsTooLargeToUpscale(upscaleInitialImage || undefined);
useEffect(() => {
@@ -43,11 +44,13 @@ export const UpscaleWarning = () => {
const otherWarnings = useMemo(() => {
const _warnings: string[] = [];
- if (isTooLargeToUpscale) {
- _warnings.push(t('upscaling.outputTooLarge'));
+ if (isTooLargeToUpscale && maxUpscaleDimension) {
+ _warnings.push(
+ t('upscaling.exceedsMaxSizeDetails', { maxUpscaleDimension: maxUpscaleDimension.toLocaleString() })
+ );
}
return _warnings;
- }, [isTooLargeToUpscale, t]);
+ }, [isTooLargeToUpscale, t, maxUpscaleDimension]);
const handleGoToModelManager = useCallback(() => {
dispatch(setActiveTab('models'));