mirror of
https://github.com/invoke-ai/InvokeAI.git
synced 2026-02-12 18:14:56 -05:00
fix(ui): some progress image jank
This commit is contained in:
@@ -127,7 +127,7 @@ export const addEnqueueRequestedLinear = (startAppListening: AppStartListening)
|
||||
prepend,
|
||||
seedFieldIdentifier,
|
||||
positivePromptFieldIdentifier,
|
||||
origin: 'canvas',
|
||||
origin: tab,
|
||||
destination,
|
||||
})
|
||||
);
|
||||
|
||||
@@ -68,15 +68,14 @@ export const CurrentImagePreview = memo(({ imageDTO }: { imageDTO: ImageDTO | nu
|
||||
return;
|
||||
}
|
||||
|
||||
if (autoSwitch) {
|
||||
return;
|
||||
}
|
||||
// When auto-switch is enabled, we will get a load event as we switch to the new image. This in turn clears the progress image,
|
||||
// creating the illusion of the progress image turning into the new image.
|
||||
// But when auto-switch is disabled, we won't get that load event, so we need to clear the progress image manually.
|
||||
const onQueueItemStatusChanged = () => {
|
||||
$progressEvent.set(null);
|
||||
$progressImage.set(null);
|
||||
const onQueueItemStatusChanged = (data: S['QueueItemStatusChangedEvent']) => {
|
||||
// When auto-switch is enabled, we will get a load event as we switch to the new image. This in turn clears the progress image,
|
||||
// creating the illusion of the progress image turning into the new image.
|
||||
// But when auto-switch is disabled, we won't get that load event, so we need to clear the progress image manually.
|
||||
if (data.origin === 'canvas' || !autoSwitch) {
|
||||
$progressEvent.set(null);
|
||||
$progressImage.set(null);
|
||||
}
|
||||
};
|
||||
|
||||
socket.on('queue_item_status_changed', onQueueItemStatusChanged);
|
||||
|
||||
@@ -33,7 +33,7 @@ export const prepareLinearUIBatch = (arg: {
|
||||
prepend: boolean;
|
||||
seedFieldIdentifier?: FieldIdentifier;
|
||||
positivePromptFieldIdentifier: FieldIdentifier;
|
||||
origin: 'canvas' | 'workflows' | 'upscaling';
|
||||
origin: string;
|
||||
destination: string;
|
||||
}): EnqueueBatchArg => {
|
||||
const { state, g, prepend, seedFieldIdentifier, positivePromptFieldIdentifier, origin, destination } = arg;
|
||||
|
||||
@@ -12,6 +12,7 @@ import { createContext, memo, useCallback, useContext, useMemo, useState } from
|
||||
import { LEFT_PANEL_ID, LEFT_PANEL_MIN_SIZE_PX, RIGHT_PANEL_ID, RIGHT_PANEL_MIN_SIZE_PX } from './shared';
|
||||
|
||||
type AutoLayoutContextValue = {
|
||||
tab: TabName;
|
||||
isActiveTab: boolean;
|
||||
toggleLeftPanel: () => void;
|
||||
toggleRightPanel: () => void;
|
||||
@@ -137,6 +138,7 @@ export const AutoLayoutProvider = (
|
||||
|
||||
const value = useMemo<AutoLayoutContextValue>(
|
||||
() => ({
|
||||
tab,
|
||||
isActiveTab,
|
||||
toggleLeftPanel,
|
||||
toggleRightPanel,
|
||||
@@ -150,6 +152,7 @@ export const AutoLayoutProvider = (
|
||||
_$rightPanelApi: $rightApi,
|
||||
}),
|
||||
[
|
||||
tab,
|
||||
isActiveTab,
|
||||
$centerApi,
|
||||
$leftApi,
|
||||
|
||||
Reference in New Issue
Block a user