feat(ui): add gallery image ctx menu items to create ref image from i…

…mage Appears these actions disappeared at some point. Restoring them.
invoke-ai · Dec 2, 2024 · 29c84cf · 29c84cf
1 parent 1e92bb4
commit 29c84cf
Show file tree

Hide file tree

Showing 2 changed files with 42 additions and 0 deletions.
diff --git a/invokeai/frontend/web/public/locales/en.json b/invokeai/frontend/web/public/locales/en.json
@@ -1718,6 +1718,8 @@
         "controlLayer": "Control Layer",
         "inpaintMask": "Inpaint Mask",
         "regionalGuidance": "Regional Guidance",
+        "referenceImageRegional": "Reference Image (Regional)",
+        "referenceImageGlobal": "Reference Image (Global)",
         "asRasterLayer": "As $t(controlLayers.rasterLayer)",
         "asRasterLayerResize": "As $t(controlLayers.rasterLayer) (Resize)",
         "asControlLayer": "As $t(controlLayers.controlLayer)",

diff --git a/...rc/features/gallery/components/ImageContextMenu/ImageMenuItemNewLayerFromImageSubMenu.tsx b/...rc/features/gallery/components/ImageContextMenu/ImageMenuItemNewLayerFromImageSubMenu.tsx
@@ -77,6 +77,32 @@ export const ImageMenuItemNewLayerFromImageSubMenu = memo(() => {
     });
   }, [imageDTO, imageViewer, store, t]);
 
+  const onClickNewRegionalReferenceImageFromImage = useCallback(() => {
+    const { dispatch, getState } = store;
+    createNewCanvasEntityFromImage({ imageDTO, type: 'reference_image', dispatch, getState });
+    dispatch(sentImageToCanvas());
+    dispatch(setActiveTab('canvas'));
+    imageViewer.close();
+    toast({
+      id: 'SENT_TO_CANVAS',
+      title: t('toast.sentToCanvas'),
+      status: 'success',
+    });
+  }, [imageDTO, imageViewer, store, t]);
+
+  const onClickNewGlobalReferenceImageFromImage = useCallback(() => {
+    const { dispatch, getState } = store;
+    createNewCanvasEntityFromImage({ imageDTO, type: 'regional_guidance_with_reference_image', dispatch, getState });
+    dispatch(sentImageToCanvas());
+    dispatch(setActiveTab('canvas'));
+    imageViewer.close();
+    toast({
+      id: 'SENT_TO_CANVAS',
+      title: t('toast.sentToCanvas'),
+      status: 'success',
+    });
+  }, [imageDTO, imageViewer, store, t]);
+
   return (
     <MenuItem {...subMenu.parentMenuItemProps} icon={<PiPlusBold />}>
       <Menu {...subMenu.menuProps}>
@@ -104,6 +130,20 @@ export const ImageMenuItemNewLayerFromImageSubMenu = memo(() => {
           <MenuItem icon={<NewLayerIcon />} onClickCapture={onClickNewRasterLayerFromImage} isDisabled={isBusy}>
             {t('controlLayers.rasterLayer')}
           </MenuItem>
+          <MenuItem
+            icon={<NewLayerIcon />}
+            onClickCapture={onClickNewRegionalReferenceImageFromImage}
+            isDisabled={isBusy}
+          >
+            {t('controlLayers.referenceImageRegional')}
+          </MenuItem>
+          <MenuItem
+            icon={<NewLayerIcon />}
+            onClickCapture={onClickNewGlobalReferenceImageFromImage}
+            isDisabled={isBusy}
+          >
+            {t('controlLayers.referenceImageGlobal')}
+          </MenuItem>
         </MenuList>
       </Menu>
     </MenuItem>