From f0a4de245dbb4a4c5f3f89fefbf2c55b096478f9 Mon Sep 17 00:00:00 2001 From: Kent Keirsey <31807370+hipsterusername@users.noreply.github.com> Date: Mon, 30 Jun 2025 10:14:21 -0400 Subject: [PATCH] Moved size constants to a reasonable spot... --- .../hooks/useExportCanvasToPSD.ts | 27 ++++++++++++------- .../layouts/use-collapsible-gridview-panel.ts | 4 --- 2 files changed, 18 insertions(+), 13 deletions(-) diff --git a/invokeai/frontend/web/src/features/controlLayers/hooks/useExportCanvasToPSD.ts b/invokeai/frontend/web/src/features/controlLayers/hooks/useExportCanvasToPSD.ts index 2fe70a157f..e5a6668fc9 100644 --- a/invokeai/frontend/web/src/features/controlLayers/hooks/useExportCanvasToPSD.ts +++ b/invokeai/frontend/web/src/features/controlLayers/hooks/useExportCanvasToPSD.ts @@ -1,4 +1,4 @@ -import { writePsd, type Layer, type Psd } from 'ag-psd'; +import { type Layer, type Psd, writePsd } from 'ag-psd'; import { logger } from 'app/logging/logger'; import { useCanvasManagerSafe } from 'features/controlLayers/contexts/CanvasManagerProviderGate'; import { downloadBlob } from 'features/controlLayers/konva/util'; @@ -9,6 +9,12 @@ import { serializeError } from 'serialize-error'; const log = logger('canvas'); +// Canvas size limits for PSD export +// These are conservative limits to prevent memory issues with large canvases +// The actual limit may be lower depending on available memory +const MAX_CANVAS_DIMENSION = 8192; // 8K resolution +const MAX_CANVAS_AREA = MAX_CANVAS_DIMENSION * MAX_CANVAS_DIMENSION; // ~64MP max + export const useExportCanvasToPSD = () => { const { t } = useTranslation(); const canvasManager = useCanvasManagerSafe(); @@ -52,7 +58,9 @@ export const useExportCanvasToPSD = () => { return; } - if (visibleRect.width > 30000 || visibleRect.height > 30000) { + // Check size constraints using area only + const canvasArea = visibleRect.width * visibleRect.height; + if (canvasArea > MAX_CANVAS_AREA) { toast({ id: 'CANVAS_TOO_LARGE', title: t('toast.canvasTooLarge'), @@ -91,7 +99,7 @@ export const useExportCanvasToPSD = () => { }) ); - // Create PSD document + // Create PSD document using proper types const psd: Psd = { width: visibleRect.width, height: visibleRect.height, @@ -103,12 +111,13 @@ export const useExportCanvasToPSD = () => { log.debug( { - layerCount: psdLayers.length, + layerCount: psd.children?.length ?? 0, canvasDimensions: { width: psd.width, height: psd.height }, - layers: psdLayers.map((l) => ({ - name: l.name, - bounds: { left: l.left, top: l.top, right: l.right, bottom: l.bottom }, - })), + layers: + psd.children?.map((l) => ({ + name: l.name, + bounds: { left: l.left, top: l.top, right: l.right, bottom: l.bottom }, + })) ?? [], }, 'Creating PSD with layers' ); @@ -124,7 +133,7 @@ export const useExportCanvasToPSD = () => { toast({ id: 'PSD_EXPORT_SUCCESS', title: t('toast.psdExportSuccess'), - description: t('toast.psdExportSuccessDesc', { count: psdLayers.length }), + description: t('toast.psdExportSuccessDesc', { count: psd.children?.length ?? 0 }), status: 'success', }); diff --git a/invokeai/frontend/web/src/features/ui/layouts/use-collapsible-gridview-panel.ts b/invokeai/frontend/web/src/features/ui/layouts/use-collapsible-gridview-panel.ts index 1e3faf1149..dc0887c76b 100644 --- a/invokeai/frontend/web/src/features/ui/layouts/use-collapsible-gridview-panel.ts +++ b/invokeai/frontend/web/src/features/ui/layouts/use-collapsible-gridview-panel.ts @@ -13,10 +13,6 @@ const getIsCollapsed = ( return panel.width <= (collapsedSize ?? panel.minimumWidth); }; -// More realistic limits based on typical browser memory constraints -const MAX_CANVAS_DIMENSION = 8192; // 8K resolution -const MAX_CANVAS_AREA = 8192 * 8192; // ~64MP max - export const useCollapsibleGridviewPanel = ( api: GridviewApi | null, panelId: string,