fix(ui): canvas entity ids getting clobbered

invokeai/frontend/web/src/features/controlLayers/hooks/addLayerHooks.ts

@@ -1,10 +1,11 @@
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
+import { deepClone } from 'common/util/deepClone';
 import { caAdded, ipaAdded, rgIPAdapterAdded } from 'features/controlLayers/store/canvasV2Slice';
 import {
-  buildControlNet,
-  buildIPAdapter,
-  buildT2IAdapter,
   CA_PROCESSOR_DATA,
+  initialControlNetV2,
+  initialIPAdapterV2,
+  initialT2IAdapterV2,
   isProcessorTypeV2,
 } from 'features/controlLayers/store/types';
 import { zModelIdentifierField } from 'features/nodes/types/common';
@@ -28,19 +29,15 @@ export const useAddCALayer = () => {
       return;
     }
 
-    const id = uuidv4();
     const defaultPreprocessor = model.default_settings?.preprocessor;
     const processorConfig = isProcessorTypeV2(defaultPreprocessor)
       ? CA_PROCESSOR_DATA[defaultPreprocessor].buildDefaults(baseModel)
       : null;
 
-    const builder = model.type === 'controlnet' ? buildControlNet : buildT2IAdapter;
+    const initialConfig = deepClone(model.type === 'controlnet' ? initialControlNetV2 : initialT2IAdapterV2);
-    const controlAdapter = builder(id, {
+    const config = { ...initialConfig, model: zModelIdentifierField.parse(model), processorConfig };
-      model: zModelIdentifierField.parse(model),
-      processorConfig,
-    });
 
-    dispatch(caAdded(controlAdapter));
+    dispatch(caAdded({ config }));
   }, [dispatch, model, baseModel]);
 
   return [addCALayer, isDisabled] as const;
@@ -60,11 +57,10 @@ export const useAddIPALayer = () => {
     if (!model) {
       return;
     }
-    const id = uuidv4();
+
-    const ipAdapter = buildIPAdapter(id, {
+    const initialConfig = deepClone(initialIPAdapterV2);
-      model: zModelIdentifierField.parse(model),
+    const config = { ...initialConfig, model: zModelIdentifierField.parse(model) };
-    });
+    dispatch(ipaAdded({ config }));
-    dispatch(ipaAdded(ipAdapter));
   }, [dispatch, model]);
 
   return [addIPALayer, isDisabled] as const;
@@ -84,10 +80,9 @@ export const useAddIPAdapterToRGLayer = (id: string) => {
     if (!model) {
       return;
     }
-    const ipAdapter = buildIPAdapter(uuidv4(), {
+    const initialConfig = deepClone(initialIPAdapterV2);
-      model: zModelIdentifierField.parse(model),
+    const config = { ...initialConfig, model: zModelIdentifierField.parse(model) };
-    });
+    dispatch(rgIPAdapterAdded({ id, ipAdapter: { ...config, id: uuidv4(), type: 'ip_adapter', isEnabled: true } }));
-    dispatch(rgIPAdapterAdded({ id, ipAdapter: { ...ipAdapter, id: uuidv4(), type: 'ip_adapter', isEnabled: true } }));
   }, [model, dispatch, id]);
 
   return [addIPAdapter, isDisabled] as const;

invokeai/frontend/web/src/features/controlLayers/store/controlAdaptersReducers.ts

@@ -46,8 +46,8 @@ export const controlAdaptersReducers = {
       });
       state.selectedEntityIdentifier = { type: 'control_adapter', id };
     },
-    prepare: (config: ControlNetConfig | T2IAdapterConfig) => ({
+    prepare: (payload: { config: ControlNetConfig | T2IAdapterConfig }) => ({
-      payload: { id: uuidv4(), config },
+      payload: { id: uuidv4(), ...payload },
     }),
   },
   caRecalled: (state, action: PayloadAction<{ data: ControlAdapterData }>) => {

invokeai/frontend/web/src/features/controlLayers/store/ipAdaptersReducers.ts

@@ -27,7 +27,7 @@ export const ipAdaptersReducers = {
       state.ipAdapters.push(layer);
       state.selectedEntityIdentifier = { type: 'ip_adapter', id };
     },
-    prepare: (config: IPAdapterConfig) => ({ payload: { id: uuidv4(), config } }),
+    prepare: (payload: { config: IPAdapterConfig }) => ({ payload: { id: uuidv4(), ...payload } }),
   },
   ipaRecalled: (state, action: PayloadAction<{ data: IPAdapterData }>) => {
     const { data } = action.payload;

invokeai/frontend/web/src/features/controlLayers/store/types.ts

@@ -1,4 +1,3 @@
-import { deepClone } from 'common/util/deepClone';
 import { zModelIdentifierField } from 'features/nodes/types/common';
 import type { AspectRatioState } from 'features/parameters/components/ImageSize/types';
 import type {
@@ -28,7 +27,6 @@ import {
   zParameterPositivePrompt,
 } from 'features/parameters/types/parameterSchemas';
 import type { IRect } from 'konva/lib/types';
-import { merge } from 'lodash-es';
 import type {
   AnyInvocation,
   BaseModelType,
@@ -758,18 +756,6 @@ export const initialIPAdapterV2: IPAdapterConfig = {
   weight: 1,
 };
 
-export const buildControlNet = (id: string, overrides?: Partial<ControlNetConfig>): ControlNetConfig => {
-  return merge(deepClone(initialControlNetV2), { id, ...overrides });
-};
-
-export const buildT2IAdapter = (id: string, overrides?: Partial<T2IAdapterConfig>): T2IAdapterConfig => {
-  return merge(deepClone(initialT2IAdapterV2), { id, ...overrides });
-};
-
-export const buildIPAdapter = (id: string, overrides?: Partial<IPAdapterConfig>): IPAdapterConfig => {
-  return merge(deepClone(initialIPAdapterV2), { id, ...overrides });
-};
-
 export const buildControlAdapterProcessorV2 = (
   modelConfig: ControlNetModelConfig | T2IAdapterModelConfig
 ): ProcessorConfig | null => {