github/InvokeAI
1
1
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI.git synced 2026-02-19 09:54:24 -05:00
Code Issues Packages Projects Releases Wiki Activity

refactor(ui): canvas flow (wip)

Browse Source
This commit is contained in:
psychedelicious
2025-05-23 19:07:26 +10:00
parent aa3b2106d4
commit c0428ee7ef
14 changed files with 297 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
invokeai/frontend/web/src/services/events/onInvocationComplete.tsx
View File

@@ -1,12 +1,10 @@
import { logger } from 'app/logging/logger';
import type { AppDispatch, RootState } from 'app/store/store';
import { deepClone } from 'common/util/deepClone';
import { stagingAreaImageStaged } from 'features/controlLayers/store/canvasStagingAreaSlice';
import { boardIdSelected, galleryViewChanged, imageSelected, offsetChanged } from 'features/gallery/store/gallerySlice';
import { $nodeExecutionStates, upsertExecutionState } from 'features/nodes/hooks/useNodeExecutionState';
import { isImageField, isImageFieldCollection } from 'features/nodes/types/common';
import { zNodeStatus } from 'features/nodes/types/invocation';
import { CANVAS_OUTPUT_PREFIX } from 'features/nodes/util/graph/graphBuilderUtils';
import type { ApiTagDescription } from 'services/api';
import { boardsApi } from 'services/api/endpoints/boards';
import { getImageDTOSafe, imagesApi } from 'services/api/endpoints/images';
@@ -19,10 +17,6 @@ import type { JsonObject } from 'type-fest';
const log = logger('events');
const isCanvasOutputNode = (data: S['InvocationCompleteEvent']) => {
return data.invocation_source_id.split(':')[0] === CANVAS_OUTPUT_PREFIX;
};
const nodeTypeDenylist = ['load_image', 'image'];
export const buildOnInvocationComplete = (getState: () => RootState, dispatch: AppDispatch) => {
@@ -179,12 +173,12 @@ export const buildOnInvocationComplete = (getState: () => RootState, dispatch: A
if (data.destination === 'canvas') {
// TODO(psyche): Can/should we let canvas handle this itself?
if (isCanvasOutputNode(data)) {
if (data.result.type === 'image_output') {
dispatch(stagingAreaImageStaged({ stagingAreaImage: { imageDTO, offsetX: 0, offsetY: 0 } }));
}
addImagesToGallery(data, [imageDTO]);
}
// if (isCanvasOutputEvent(data)) {
// if (data.result.type === 'image_output') {
// dispatch(stagingAreaImageStaged({ stagingAreaImage: { imageDTO, offsetX: 0, offsetY: 0 } }));
// }
// addImagesToGallery(data, [imageDTO]);
// }
} else if (!imageDTO.is_intermediate) {
// Desintaion is gallery
addImagesToGallery(data, [imageDTO]);

12
invokeai/frontend/web/src/services/events/stores.ts
View File

@@ -9,6 +9,18 @@ export const $socketOptions = map<Partial<ManagerOptions & SocketOptions>>({});
export const $isConnected = atom<boolean>(false);
export const $lastProgressEvent = atom<S['InvocationProgressEvent'] | null>(null);
export const $progressImage = computed($lastProgressEvent, (val) => val?.image ?? null);
export const $canvasProgressImage = computed($lastProgressEvent, (event) => {
if (!event) {
return null;
}
if (event.origin !== 'canvas') {
return null;
}
if (!event.image) {
return null;
}
return event.image;
});
export const $hasProgressImage = computed($lastProgressEvent, (val) => Boolean(val?.image));
export const $isProgressFromCanvas = computed($lastProgressEvent, (val) => val?.destination === 'canvas');
export const $invocationProgressMessage = computed($lastProgressEvent, (val) => {