From 7a5fa25b48b368eead5217f75d85d61b91916110 Mon Sep 17 00:00:00 2001
From: psychedelicious <4822129+psychedelicious@users.noreply.github.com>
Date: Fri, 30 May 2025 21:30:06 +1000
Subject: [PATCH] feat(ui): support bookmarking an entity when adding it

---
 .../controlLayers/store/canvasSlice.ts        | 67 +++++++++++++++----
 1 file changed, 55 insertions(+), 12 deletions(-)

diff --git a/invokeai/frontend/web/src/features/controlLayers/store/canvasSlice.ts b/invokeai/frontend/web/src/features/controlLayers/store/canvasSlice.ts
index 1b135b0ce4..d3181c7e9c 100644
--- a/invokeai/frontend/web/src/features/controlLayers/store/canvasSlice.ts
+++ b/invokeai/frontend/web/src/features/controlLayers/store/canvasSlice.ts
@@ -109,10 +109,11 @@ export const canvasSlice = createSlice({
           id: string;
           overrides?: Partial<CanvasRasterLayerState>;
           isSelected?: boolean;
+          isBookmarked?: boolean;
           mergedEntitiesToDelete?: string[];
         }>
       ) => {
-        const { id, overrides, isSelected, mergedEntitiesToDelete = [] } = action.payload;
+        const { id, overrides, isSelected, isBookmarked, mergedEntitiesToDelete = [] } = action.payload;
         const entityState = getRasterLayerState(id, overrides);
 
         state.rasterLayers.entities.push(entityState);
@@ -123,13 +124,20 @@ export const canvasSlice = createSlice({
           );
         }
 
+        const entityIdentifier = getEntityIdentifier(entityState);
+
         if (isSelected || mergedEntitiesToDelete.length > 0) {
-          state.selectedEntityIdentifier = getEntityIdentifier(entityState);
+          state.selectedEntityIdentifier = entityIdentifier;
+        }
+
+        if (isBookmarked) {
+          state.bookmarkedEntityIdentifier = entityIdentifier;
         }
       },
       prepare: (payload: {
         overrides?: Partial<CanvasRasterLayerState>;
         isSelected?: boolean;
+        isBookmarked?: boolean;
         mergedEntitiesToDelete?: string[];
       }) => ({
         payload: { ...payload, id: getPrefixedId('raster_layer') },
@@ -262,10 +270,11 @@ export const canvasSlice = createSlice({
           id: string;
           overrides?: Partial<CanvasControlLayerState>;
           isSelected?: boolean;
+          isBookmarked?: boolean;
           mergedEntitiesToDelete?: string[];
         }>
       ) => {
-        const { id, overrides, isSelected, mergedEntitiesToDelete = [] } = action.payload;
+        const { id, overrides, isSelected, isBookmarked, mergedEntitiesToDelete = [] } = action.payload;
 
         const entityState = getControlLayerState(id, overrides);
 
@@ -276,14 +285,20 @@ export const canvasSlice = createSlice({
             (entity) => !mergedEntitiesToDelete.includes(entity.id)
           );
         }
+        const entityIdentifier = getEntityIdentifier(entityState);
 
         if (isSelected || mergedEntitiesToDelete.length > 0) {
-          state.selectedEntityIdentifier = getEntityIdentifier(entityState);
+          state.selectedEntityIdentifier = entityIdentifier;
+        }
+
+        if (isBookmarked) {
+          state.bookmarkedEntityIdentifier = entityIdentifier;
         }
       },
       prepare: (payload: {
         overrides?: Partial<CanvasControlLayerState>;
         isSelected?: boolean;
+        isBookmarked?: boolean;
         mergedEntitiesToDelete?: string[];
       }) => ({
         payload: { ...payload, id: getPrefixedId('control_layer') },
@@ -549,18 +564,32 @@ export const canvasSlice = createSlice({
     referenceImageAdded: {
       reducer: (
         state,
-        action: PayloadAction<{ id: string; overrides?: Partial<CanvasReferenceImageState>; isSelected?: boolean }>
+        action: PayloadAction<{
+          id: string;
+          overrides?: Partial<CanvasReferenceImageState>;
+          isSelected?: boolean;
+          isBookmarked?: boolean;
+        }>
       ) => {
-        const { id, overrides, isSelected } = action.payload;
+        const { id, overrides, isSelected, isBookmarked } = action.payload;
         const entityState = getReferenceImageState(id, overrides);
 
         state.referenceImages.entities.push(entityState);
+        const entityIdentifier = getEntityIdentifier(entityState);
 
         if (isSelected) {
-          state.selectedEntityIdentifier = getEntityIdentifier(entityState);
+          state.selectedEntityIdentifier = entityIdentifier;
+        }
+
+        if (isBookmarked) {
+          state.bookmarkedEntityIdentifier = entityIdentifier;
         }
       },
-      prepare: (payload?: { overrides?: Partial<CanvasReferenceImageState>; isSelected?: boolean }) => ({
+      prepare: (payload?: {
+        overrides?: Partial<CanvasReferenceImageState>;
+        isSelected?: boolean;
+        isBookmarked?: boolean;
+      }) => ({
         payload: { ...payload, id: getPrefixedId('reference_image') },
       }),
     },
@@ -737,10 +766,11 @@ export const canvasSlice = createSlice({
           id: string;
           overrides?: Partial<CanvasRegionalGuidanceState>;
           isSelected?: boolean;
+          isBookmarked?: boolean;
           mergedEntitiesToDelete?: string[];
         }>
       ) => {
-        const { id, overrides, isSelected, mergedEntitiesToDelete = [] } = action.payload;
+        const { id, overrides, isSelected, isBookmarked, mergedEntitiesToDelete = [] } = action.payload;
 
         const entityState = getRegionalGuidanceState(id, overrides);
 
@@ -751,14 +781,20 @@ export const canvasSlice = createSlice({
             (entity) => !mergedEntitiesToDelete.includes(entity.id)
           );
         }
+        const entityIdentifier = getEntityIdentifier(entityState);
 
         if (isSelected || mergedEntitiesToDelete.length > 0) {
-          state.selectedEntityIdentifier = getEntityIdentifier(entityState);
+          state.selectedEntityIdentifier = entityIdentifier;
+        }
+
+        if (isBookmarked) {
+          state.bookmarkedEntityIdentifier = entityIdentifier;
         }
       },
       prepare: (payload?: {
         overrides?: Partial<CanvasRegionalGuidanceState>;
         isSelected?: boolean;
+        isBookmarked?: boolean;
         mergedEntitiesToDelete?: string[];
       }) => ({
         payload: { ...payload, id: getPrefixedId('regional_guidance') },
@@ -1038,10 +1074,11 @@ export const canvasSlice = createSlice({
           id: string;
           overrides?: Partial<CanvasInpaintMaskState>;
           isSelected?: boolean;
+          isBookmarked?: boolean;
           mergedEntitiesToDelete?: string[];
         }>
       ) => {
-        const { id, overrides, isSelected, mergedEntitiesToDelete = [] } = action.payload;
+        const { id, overrides, isSelected, isBookmarked, mergedEntitiesToDelete = [] } = action.payload;
 
         const entityState = getInpaintMaskState(id, overrides);
 
@@ -1052,14 +1089,20 @@ export const canvasSlice = createSlice({
             (entity) => !mergedEntitiesToDelete.includes(entity.id)
           );
         }
+        const entityIdentifier = getEntityIdentifier(entityState);
 
         if (isSelected || mergedEntitiesToDelete.length > 0) {
-          state.selectedEntityIdentifier = getEntityIdentifier(entityState);
+          state.selectedEntityIdentifier = entityIdentifier;
+        }
+
+        if (isBookmarked) {
+          state.bookmarkedEntityIdentifier = entityIdentifier;
         }
       },
       prepare: (payload?: {
         overrides?: Partial<CanvasInpaintMaskState>;
         isSelected?: boolean;
+        isBookmarked?: boolean;
         mergedEntitiesToDelete?: string[];
       }) => ({
         payload: { ...payload, id: getPrefixedId('inpaint_mask') },