Merge branch 'main' into JPPhoto-fix-gguf-loading

invoke-ai · Dec 2, 2024 · cab2cdd · cab2cdd
2 parents 37083a9 + f8c7add
commit cab2cdd
Show file tree

Hide file tree

Showing 10 changed files with 213 additions and 125 deletions.
diff --git a/invokeai/frontend/web/public/locales/en.json b/invokeai/frontend/web/public/locales/en.json
@@ -1039,24 +1039,7 @@
             "canvasIsSelectingObject": "Canvas is busy (selecting object)",
             "noPrompts": "No prompts generated",
             "noNodesInGraph": "No nodes in graph",
-            "systemDisconnected": "System disconnected",
-            "layer": {
-                "unsupportedModel": "layer not supported for selected base model",
-                "controlAdapterNoModelSelected": "no Control Adapter model selected",
-                "controlAdapterIncompatibleBaseModel": "incompatible Control Adapter base model",
-                "t2iAdapterIncompatibleBboxWidth": "$t(parameters.invoke.layer.t2iAdapterRequiresDimensionsToBeMultipleOf) {{multiple}}, bbox width is {{width}}",
-                "t2iAdapterIncompatibleBboxHeight": "$t(parameters.invoke.layer.t2iAdapterRequiresDimensionsToBeMultipleOf) {{multiple}}, bbox height is {{height}}",
-                "t2iAdapterIncompatibleScaledBboxWidth": "$t(parameters.invoke.layer.t2iAdapterRequiresDimensionsToBeMultipleOf) {{multiple}}, scaled bbox width is {{width}}",
-                "t2iAdapterIncompatibleScaledBboxHeight": "$t(parameters.invoke.layer.t2iAdapterRequiresDimensionsToBeMultipleOf) {{multiple}}, scaled bbox height is {{height}}",
-                "ipAdapterNoModelSelected": "no IP adapter selected",
-                "ipAdapterIncompatibleBaseModel": "incompatible IP Adapter base model",
-                "ipAdapterNoImageSelected": "no IP Adapter image selected",
-                "rgNoPromptsOrIPAdapters": "no text prompts or IP Adapters",
-                "rgNegativePromptNotSupported": "negative prompt not supported for selected base model",
-                "rgReferenceImagesNotSupported": "regional reference images not supported for selected base model",
-                "rgAutoNegativeNotSupported": "auto-negative not supported for selected base model",
-                "emptyLayer": "empty layer"
-            }
+            "systemDisconnected": "System disconnected"
         },
         "maskBlur": "Mask Blur",
         "negativePromptPlaceholder": "Negative Prompt",
@@ -1718,6 +1701,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)",
@@ -1803,6 +1788,21 @@
         "replaceCurrent": "Replace Current",
         "controlLayerEmptyState": "<UploadButton>Upload an image</UploadButton>, drag an image from the <GalleryButton>gallery</GalleryButton> onto this layer, or draw on the canvas to get started.",
         "referenceImageEmptyState": "<UploadButton>Upload an image</UploadButton> or drag an image from the <GalleryButton>gallery</GalleryButton> onto this layer to get started.",
+        "warnings": {
+            "problemsFound": "Problems found",
+            "unsupportedModel": "layer not supported for selected base model",
+            "controlAdapterNoModelSelected": "no Control Layer model selected",
+            "controlAdapterIncompatibleBaseModel": "incompatible Control Layer base model",
+            "controlAdapterNoControl": "no control selected/drawn",
+            "ipAdapterNoModelSelected": "no Reference Image model selected",
+            "ipAdapterIncompatibleBaseModel": "incompatible Reference Image base model",
+            "ipAdapterNoImageSelected": "no Reference Image image selected",
+            "rgNoPromptsOrIPAdapters": "no text prompts or Reference Images",
+            "rgNegativePromptNotSupported": "Negative Prompt not supported for selected base model",
+            "rgReferenceImagesNotSupported": "regional Reference Images not supported for selected base model",
+            "rgAutoNegativeNotSupported": "Auto-Negative not supported for selected base model",
+            "rgNoRegion": "no region drawn"
+        },
         "controlMode": {
             "controlMode": "Control Mode",
             "balanced": "Balanced (recommended)",

diff --git a/...controlLayers/components/RegionalGuidance/RegionalGuidanceIPAdapterSettingsEmptyState.tsx b/...controlLayers/components/RegionalGuidance/RegionalGuidanceIPAdapterSettingsEmptyState.tsx
@@ -1,7 +1,6 @@
-import { Button, Flex, Text } from '@invoke-ai/ui-library';
+import { Button, Flex, IconButton, Spacer, Text } from '@invoke-ai/ui-library';
 import { useAppDispatch } from 'app/store/storeHooks';
 import { useImageUploadButton } from 'common/hooks/useImageUploadButton';
-import { RegionalGuidanceDeletePromptButton } from 'features/controlLayers/components/RegionalGuidance/RegionalGuidanceDeletePromptButton';
 import { useEntityIdentifierContext } from 'features/controlLayers/contexts/EntityIdentifierContext';
 import { useCanvasIsBusy } from 'features/controlLayers/hooks/useCanvasIsBusy';
 import { rgIPAdapterDeleted } from 'features/controlLayers/store/canvasSlice';
@@ -12,6 +11,7 @@ import { setRegionalGuidanceReferenceImage } from 'features/imageActions/actions
 import { activeTabCanvasRightPanelChanged } from 'features/ui/store/uiSlice';
 import { memo, useCallback, useMemo } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
+import { PiXBold } from 'react-icons/pi';
 import type { ImageDTO } from 'services/api/types';
 
 type Props = {
@@ -47,27 +47,44 @@ export const RegionalGuidanceIPAdapterSettingsEmptyState = memo(({ referenceImag
   );
 
   return (
-    <Flex flexDir="column" gap={3} position="relative" w="full" p={4}>
-      <RegionalGuidanceDeletePromptButton onDelete={onDeleteIPAdapter} position="absolute" top={0} insetInlineEnd={0} />
-      <Text textAlign="center" color="base.300">
-        <Trans
-          i18nKey="controlLayers.referenceImageEmptyState"
-          components={{
-            UploadButton: (
-              <Button
-                isDisabled={isBusy}
-                size="sm"
-                variant="link"
-                color="base.300"
-                {...uploadApi.getUploadButtonProps()}
-              />
-            ),
-            GalleryButton: (
-              <Button onClick={onClickGalleryButton} isDisabled={isBusy} size="sm" variant="link" color="base.300" />
-            ),
-          }}
+    <Flex flexDir="column" gap={2} position="relative" w="full">
+      <Flex alignItems="center" gap={2}>
+        <Text fontWeight="semibold" color="base.400">
+          {t('controlLayers.referenceImage')}
+        </Text>
+        <Spacer />
+        <IconButton
+          size="sm"
+          variant="link"
+          alignSelf="stretch"
+          icon={<PiXBold />}
+          tooltip={t('controlLayers.deleteReferenceImage')}
+          aria-label={t('controlLayers.deleteReferenceImage')}
+          onClick={onDeleteIPAdapter}
+          colorScheme="error"
         />
-      </Text>
+      </Flex>
+      <Flex alignItems="center" gap={2} p={4}>
+        <Text textAlign="center" color="base.300">
+          <Trans
+            i18nKey="controlLayers.referenceImageEmptyState"
+            components={{
+              UploadButton: (
+                <Button
+                  isDisabled={isBusy}
+                  size="sm"
+                  variant="link"
+                  color="base.300"
+                  {...uploadApi.getUploadButtonProps()}
+                />
+              ),
+              GalleryButton: (
+                <Button onClick={onClickGalleryButton} isDisabled={isBusy} size="sm" variant="link" color="base.300" />
+              ),
+            }}
+          />
+        </Text>
+      </Flex>
       <input {...uploadApi.getUploadInputProps()} />
       <DndDropTarget
         dndTarget={setRegionalGuidanceReferenceImageDndTarget}

diff --git a/.../frontend/web/src/features/controlLayers/components/common/CanvasEntityHeaderWarnings.tsx b/.../frontend/web/src/features/controlLayers/components/common/CanvasEntityHeaderWarnings.tsx
@@ -89,7 +89,7 @@ const TooltipContent = memo((props: { warnings: string[] }) => {
   const { t } = useTranslation();
   return (
     <Flex flexDir="column">
-      <Text>{t('common.warnings')}:</Text>
+      <Text>{t('controlLayers.warnings.problemsFound')}:</Text>
       <UnorderedList>
         {props.warnings.map((warning, index) => (
           <ListItem key={index}>{warning}</ListItem>

diff --git a/invokeai/frontend/web/src/features/controlLayers/hooks/addLayerHooks.ts b/invokeai/frontend/web/src/features/controlLayers/hooks/addLayerHooks.ts
@@ -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;