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

fix(ui): ref image defaults to prev ref image's image selection

Browse Source 
A redux selector is used to get the "default" IP Adapter. The selector uses the model list query result to select an IP Adapter model to be preset by default.

The selector is memoized, so if we mutate the returned default IP Adapter state, it mutates the result of the selector for all consumers.

For example, the `image` property of the default IP Adapter selector result is `null`. When we set the `image` property of the selector result while creating an IP Adapter, this does not trigger the selector to recompute its result. We end up setting the image for the selector result directly, and all other consumers now have that same image set.

Solution - we need to clone the selector result everywhere it is used. This was missed in a few spots, causing the issue.
This commit is contained in:
psychedelicious
2024-12-02 15:02:15 +10:00
committed by Kent Keirsey
parent db6398fdf6
commit 1e92bb4e94
2 changed files with 21 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
invokeai/frontend/web/src/features/controlLayers/hooks/addLayerHooks.ts
View File

@@ -29,7 +29,13 @@ import { modelConfigsAdapterSelectors, selectModelConfigsQuery } from 'services/
import type { ControlNetModelConfig, IPAdapterModelConfig, T2IAdapterModelConfig } from 'services/api/types';
import { isControlNetOrT2IAdapterModelConfig, isIPAdapterModelConfig } from 'services/api/types';
/** @knipignore */
/**
* Selects the default control adapter configuration based on the model configurations and the base.
*
* Be sure to clone the output of this selector before modifying it!
*
* @knipignore
*/
export const selectDefaultControlAdapter = createSelector(
selectModelConfigsQuery,
selectBase,
@@ -52,6 +58,11 @@ export const selectDefaultControlAdapter = createSelector(
}
);
/**
* Selects the default IP adapter configuration based on the model configurations and the base.
*
* Be sure to clone the output of this selector before modifying it!
*/
export const selectDefaultIPAdapter = createSelector(
selectModelConfigsQuery,
selectBase,
@@ -117,7 +128,9 @@ export const useAddRegionalReferenceImage = () => {
const func = useCallback(() => {
const overrides: Partial<CanvasRegionalGuidanceState> = {
referenceImages: [{ id: getPrefixedId('regional_guidance_reference_image'), ipAdapter: defaultIPAdapter }],
referenceImages: [
{ id: getPrefixedId('regional_guidance_reference_image'), ipAdapter: deepClone(defaultIPAdapter) },
],
};
dispatch(rgAdded({ isSelected: true, overrides }));
}, [defaultIPAdapter, dispatch]);
@@ -129,7 +142,7 @@ export const useAddGlobalReferenceImage = () => {
const dispatch = useAppDispatch();
const defaultIPAdapter = useAppSelector(selectDefaultIPAdapter);
const func = useCallback(() => {
const overrides = { ipAdapter: defaultIPAdapter };
const overrides = { ipAdapter: deepClone(defaultIPAdapter) };
dispatch(referenceImageAdded({ isSelected: true, overrides }));
}, [defaultIPAdapter, dispatch]);
@@ -140,7 +153,7 @@ export const useAddRegionalGuidanceIPAdapter = (entityIdentifier: CanvasEntityId
const dispatch = useAppDispatch();
const defaultIPAdapter = useAppSelector(selectDefaultIPAdapter);
const func = useCallback(() => {
dispatch(rgIPAdapterAdded({ entityIdentifier, overrides: { ipAdapter: defaultIPAdapter } }));
dispatch(rgIPAdapterAdded({ entityIdentifier, overrides: { ipAdapter: deepClone(defaultIPAdapter) } }));
}, [defaultIPAdapter, dispatch, entityIdentifier]);
return func;

8
invokeai/frontend/web/src/features/imageActions/actions.ts
View File

@@ -169,13 +169,13 @@ export const createNewCanvasEntityFromImage = (arg: {
break;
}
case 'reference_image': {
const ipAdapter = selectDefaultIPAdapter(getState());
const ipAdapter = deepClone(selectDefaultIPAdapter(getState()));
ipAdapter.image = imageDTOToImageWithDims(imageDTO);
dispatch(referenceImageAdded({ overrides: { ipAdapter }, isSelected: true }));
break;
}
case 'regional_guidance_with_reference_image': {
const ipAdapter = selectDefaultIPAdapter(getState());
const ipAdapter = deepClone(selectDefaultIPAdapter(getState()));
ipAdapter.image = imageDTOToImageWithDims(imageDTO);
const referenceImages = [{ id: getPrefixedId('regional_guidance_reference_image'), ipAdapter }];
dispatch(rgAdded({ overrides: { referenceImages }, isSelected: true }));
@@ -291,14 +291,14 @@ export const newCanvasFromImage = (arg: {
break;
}
case 'reference_image': {
const ipAdapter = selectDefaultIPAdapter(getState());
const ipAdapter = deepClone(selectDefaultIPAdapter(getState()));
ipAdapter.image = imageDTOToImageWithDims(imageDTO);
dispatch(canvasReset());
dispatch(referenceImageAdded({ overrides: { ipAdapter }, isSelected: true }));
break;
}
case 'regional_guidance_with_reference_image': {
const ipAdapter = selectDefaultIPAdapter(getState());
const ipAdapter = deepClone(selectDefaultIPAdapter(getState()));
ipAdapter.image = imageDTOToImageWithDims(imageDTO);
const referenceImages = [{ id: getPrefixedId('regional_guidance_reference_image'), ipAdapter }];
dispatch(canvasReset());