Update invocation_cache_memory.py

Remove extra arg

docs/installation/020_INSTALL_MANUAL.md

@@ -296,8 +296,18 @@ code for InvokeAI. For this to work, you will need to install the
 on your system, please see the [Git Installation
 Guide](https://github.com/git-guides/install-git)
 
+You will also need to install the [frontend development toolchain](https://github.com/invoke-ai/InvokeAI/blob/main/docs/contributing/contribution_guides/contributingToFrontend.md).
+
+If you have a "normal" installation, you should create a totally separate virtual environment for the git-based installation, else the two may interfere.
+
+> **Why do I need the frontend toolchain**?
+>
+> The InvokeAI project uses trunk-based development. That means our `main` branch is the development branch, and releases are tags on that branch. Because development is very active, we don't keep an updated build of the UI in `main` - we only build it for production releases.
+>
+> That means that between releases, to have a functioning application when running directly from the repo, you will need to run the UI in dev mode or build it regularly (any time the UI code changes).
+
 1. Create a fork of the InvokeAI repository through the GitHub UI or [this link](https://github.com/invoke-ai/InvokeAI/fork) 
-1. From the command line, run this command:
+2. From the command line, run this command:
    ```bash
    git clone https://github.com/<your_github_username>/InvokeAI.git
    ```
@@ -305,10 +315,10 @@ Guide](https://github.com/git-guides/install-git)
     This will create a directory named `InvokeAI` and populate it with the
     full source code from your fork of the InvokeAI repository.
 
-2. Activate the InvokeAI virtual environment as per step (4) of the manual
+3. Activate the InvokeAI virtual environment as per step (4) of the manual
 installation protocol (important!)
 
-3. Enter the InvokeAI repository directory and run one of these
+4. Enter the InvokeAI repository directory and run one of these
    commands, based on your GPU:
 
     === "CUDA (NVidia)"
@@ -334,11 +344,15 @@ installation protocol (important!)
     Be sure to pass `-e` (for an editable install) and don't forget the
     dot ("."). It is part of the command.
 
-    You can now run `invokeai` and its related commands. The code will be
+5.  Install the [frontend toolchain](https://github.com/invoke-ai/InvokeAI/blob/main/docs/contributing/contribution_guides/contributingToFrontend.md) and do a production build of the UI as described.
+
+6.  You can now run `invokeai` and its related commands. The code will be
     read from the repository, so that you can edit the .py source files
     and watch the code's behavior change.
 
-4.  If you wish to contribute to the InvokeAI project, you are
+    When you pull in new changes to the repo, be sure to re-build the UI.
+
+7.  If you wish to contribute to the InvokeAI project, you are
     encouraged to establish a GitHub account and "fork"
     https://github.com/invoke-ai/InvokeAI into your own copy of the
     repository. You can then use GitHub functions to create and submit

docs/nodes/communityNodes.md

@@ -121,18 +121,6 @@ To be imported, an .obj must use triangulated meshes, so make sure to enable tha
 **Example Usage:**
 ![depth from obj usage graph](https://raw.githubusercontent.com/dwringer/depth-from-obj-node/main/depth_from_obj_usage.jpg)
 
---------------------------------
-### Enhance Image (simple adjustments)
-
-**Description:** Boost or reduce color saturation, contrast, brightness, sharpness, or invert colors of any image at any stage with this simple wrapper for pillow [PIL]'s ImageEnhance module.
-
-Color inversion is toggled with a simple switch, while each of the four enhancer modes are activated by entering a value other than 1 in each corresponding input field. Values less than 1 will reduce the corresponding property, while values greater than 1 will enhance it.
-
-**Node Link:** https://github.com/dwringer/image-enhance-node
-
-**Example Usage:**
-![enhance image usage graph](https://raw.githubusercontent.com/dwringer/image-enhance-node/main/image_enhance_usage.jpg)
-
 --------------------------------
 ### Generative Grammar-Based Prompt Nodes
 
@@ -153,16 +141,26 @@ This includes 3 Nodes:
 
 **Description:** This is a pack of nodes for composing masks and images, including a simple text mask creator and both image and latent offset nodes. The offsets wrap around, so these can be used in conjunction with the Seamless node to progressively generate centered on different parts of the seamless tiling.
 
-This includes 4 Nodes:
-- *Text Mask (simple 2D)* - create and position a white on black (or black on white) line of text using any font locally available to Invoke.
+This includes 14 Nodes:
+- *Adjust Image Hue Plus* - Rotate the hue of an image in one of several different color spaces.
+- *Blend Latents/Noise (Masked)* - Use a mask to blend part of one latents tensor [including Noise outputs] into another. Can be used to "renoise" sections during a multi-stage [masked] denoising process.
+- *Enhance Image* - Boost or reduce color saturation, contrast, brightness, sharpness, or invert colors of any image at any stage with this simple wrapper for pillow [PIL]'s ImageEnhance module.
+- *Equivalent Achromatic Lightness* - Calculates image lightness accounting for Helmholtz-Kohlrausch effect based on a method described by High, Green, and Nussbaum (2023).
+- *Text to Mask (Clipseg)* - Input a prompt and an image to generate a mask representing areas of the image matched by the prompt.
+- *Text to Mask Advanced (Clipseg)* - Output up to four prompt masks combined with logical "and", logical "or", or as separate channels of an RGBA image.
+- *Image Layer Blend* - Perform a layered blend of two images using alpha compositing. Opacity of top layer is selectable, with optional mask and several different blend modes/color spaces.
 - *Image Compositor* - Take a subject from an image with a flat backdrop and layer it on another image using a chroma key or flood select background removal.
+- *Image Dilate or Erode* - Dilate or expand a mask (or any image!). This is equivalent to an expand/contract operation.
+- *Image Value Thresholds* - Clip an image to pure black/white beyond specified thresholds.
 - *Offset Latents* - Offset a latents tensor in the vertical and/or horizontal dimensions, wrapping it around.
 - *Offset Image* - Offset an image in the vertical and/or horizontal dimensions, wrapping it around.
+- *Shadows/Highlights/Midtones* - Extract three masks (with adjustable hard or soft thresholds) representing shadows, midtones, and highlights regions of an image.
+- *Text Mask (simple 2D)* - create and position a white on black (or black on white) line of text using any font locally available to Invoke.
 
 **Node Link:** https://github.com/dwringer/composition-nodes
 
-**Example Usage:**
-![composition nodes usage graph](https://raw.githubusercontent.com/dwringer/composition-nodes/main/composition_nodes_usage.jpg)
+**Nodes and Output Examples:**
+![composition nodes usage graph](https://raw.githubusercontent.com/dwringer/composition-nodes/main/composition_pack_overview.jpg)
 
 --------------------------------
 ### Size Stepper Nodes

invokeai/app/api/dependencies.py

@@ -49,7 +49,7 @@ def check_internet() -> bool:
         return False
 
 
-logger = InvokeAILogger.getLogger()
+logger = InvokeAILogger.get_logger()
 
 
 class ApiDependencies:

invokeai/app/api/routers/app_info.py

@@ -7,6 +7,7 @@ from fastapi.routing import APIRouter
 from pydantic import BaseModel, Field
 
 from invokeai.app.invocations.upscale import ESRGAN_MODELS
+from invokeai.app.services.invocation_cache.invocation_cache_common import InvocationCacheStatus
 from invokeai.backend.image_util.invisible_watermark import InvisibleWatermark
 from invokeai.backend.image_util.patchmatch import PatchMatch
 from invokeai.backend.image_util.safety_checker import SafetyChecker
@@ -113,3 +114,33 @@ async def set_log_level(
 async def clear_invocation_cache() -> None:
     """Clears the invocation cache"""
     ApiDependencies.invoker.services.invocation_cache.clear()
+
+
+@app_router.put(
+    "/invocation_cache/enable",
+    operation_id="enable_invocation_cache",
+    responses={200: {"description": "The operation was successful"}},
+)
+async def enable_invocation_cache() -> None:
+    """Clears the invocation cache"""
+    ApiDependencies.invoker.services.invocation_cache.enable()
+
+
+@app_router.put(
+    "/invocation_cache/disable",
+    operation_id="disable_invocation_cache",
+    responses={200: {"description": "The operation was successful"}},
+)
+async def disable_invocation_cache() -> None:
+    """Clears the invocation cache"""
+    ApiDependencies.invoker.services.invocation_cache.disable()
+
+
+@app_router.get(
+    "/invocation_cache/status",
+    operation_id="get_invocation_cache_status",
+    responses={200: {"model": InvocationCacheStatus}},
+)
+async def get_invocation_cache_status() -> InvocationCacheStatus:
+    """Clears the invocation cache"""
+    return ApiDependencies.invoker.services.invocation_cache.get_status()

invokeai/app/api/routers/models.py

@@ -146,7 +146,8 @@ async def update_model(
 async def import_model(
     location: str = Body(description="A model path, repo_id or URL to import"),
     prediction_type: Optional[Literal["v_prediction", "epsilon", "sample"]] = Body(
-        description="Prediction type for SDv2 checkpoint files", default="v_prediction"
+        description="Prediction type for SDv2 checkpoints and rare SDv1 checkpoints",
+        default=None,
     ),
 ) -> ImportModelResponse:
     """Add a model using its local path, repo_id, or remote URL. Model characteristics will be probed and configured automatically"""

invokeai/app/api_app.py

@@ -8,7 +8,6 @@ app_config.parse_args()
 
 if True:  # hack to make flake8 happy with imports coming after setting up the config
     import asyncio
-    import logging
     import mimetypes
     import socket
     from inspect import signature
@@ -41,7 +40,9 @@ if True:  # hack to make flake8 happy with imports coming after setting up the c
         import invokeai.backend.util.mps_fixes  # noqa: F401 (monkeypatching on import)
 
 
-logger = InvokeAILogger.getLogger(config=app_config)
+app_config = InvokeAIAppConfig.get_config()
+app_config.parse_args()
+logger = InvokeAILogger.get_logger(config=app_config)
 
 # fix for windows mimetypes registry entries being borked
 # see https://github.com/invoke-ai/InvokeAI/discussions/3684#discussioncomment-6391352
@@ -223,7 +224,7 @@ def invoke_api():
                 exc_info=e,
             )
         else:
-            jurigged.watch(logger=InvokeAILogger.getLogger(name="jurigged").info)
+            jurigged.watch(logger=InvokeAILogger.get_logger(name="jurigged").info)
 
     port = find_port(app_config.port)
     if port != app_config.port:
@@ -242,7 +243,7 @@ def invoke_api():
 
     # replace uvicorn's loggers with InvokeAI's for consistent appearance
     for logname in ["uvicorn.access", "uvicorn"]:
-        log = logging.getLogger(logname)
+        log = InvokeAILogger.get_logger(logname)
         log.handlers.clear()
         for ch in logger.handlers:
             log.addHandler(ch)

invokeai/app/cli_app.py

@@ -7,8 +7,6 @@ from .services.config import InvokeAIAppConfig
 # parse_args() must be called before any other imports. if it is not called first, consumers of the config
 # which are imported/used before parse_args() is called will get the default config values instead of the
 # values from the command line or config file.
-config = InvokeAIAppConfig.get_config()
-config.parse_args()
 
 if True:  # hack to make flake8 happy with imports coming after setting up the config
     import argparse
@@ -61,8 +59,9 @@ if True:  # hack to make flake8 happy with imports coming after setting up the c
     if torch.backends.mps.is_available():
         import invokeai.backend.util.mps_fixes  # noqa: F401 (monkeypatching on import)
 
-
-logger = InvokeAILogger().getLogger(config=config)
+config = InvokeAIAppConfig.get_config()
+config.parse_args()
+logger = InvokeAILogger().get_logger(config=config)
 
 
 class CliCommand(BaseModel):

invokeai/app/invocations/baseinvocation.py

@@ -88,6 +88,9 @@ class FieldDescriptions:
     num_1 = "The first number"
     num_2 = "The second number"
     mask = "The mask to use for the operation"
+    board = "The board to save the image to"
+    image = "The image to process"
+    tile_size = "Tile size"
 
 
 class Input(str, Enum):
@@ -173,6 +176,7 @@ class UIType(str, Enum):
     WorkflowField = "WorkflowField"
     IsIntermediate = "IsIntermediate"
     MetadataField = "MetadataField"
+    BoardField = "BoardField"
     # endregion
 
 
@@ -656,6 +660,8 @@ def invocation(
     :param Optional[str] title: Adds a title to the invocation. Use if the auto-generated title isn't quite right. Defaults to None.
     :param Optional[list[str]] tags: Adds tags to the invocation. Invocations may be searched for by their tags. Defaults to None.
     :param Optional[str] category: Adds a category to the invocation. Used to group the invocations in the UI. Defaults to None.
+    :param Optional[str] version: Adds a version to the invocation. Must be a valid semver string. Defaults to None.
+    :param Optional[bool] use_cache: Whether or not to use the invocation cache. Defaults to True. The user may override this in the workflow editor.
     """
 
     def wrapper(cls: Type[GenericBaseInvocation]) -> Type[GenericBaseInvocation]:

invokeai/app/invocations/controlnet_image_processors.py

@@ -559,3 +559,33 @@ class SamDetectorReproducibleColors(SamDetector):
             img[:, :] = ann_color
             final_img.paste(Image.fromarray(img, mode="RGB"), (0, 0), Image.fromarray(np.uint8(m * 255)))
         return np.array(final_img, dtype=np.uint8)
+
+
+@invocation(
+    "color_map_image_processor",
+    title="Color Map Processor",
+    tags=["controlnet"],
+    category="controlnet",
+    version="1.0.0",
+)
+class ColorMapImageProcessorInvocation(ImageProcessorInvocation):
+    """Generates a color map from the provided image"""
+
+    color_map_tile_size: int = InputField(default=64, ge=0, description=FieldDescriptions.tile_size)
+
+    def run_processor(self, image: Image.Image):
+        image = image.convert("RGB")
+        image = np.array(image, dtype=np.uint8)
+        height, width = image.shape[:2]
+
+        width_tile_size = min(self.color_map_tile_size, width)
+        height_tile_size = min(self.color_map_tile_size, height)
+
+        color_map = cv2.resize(
+            image,
+            (width // width_tile_size, height // height_tile_size),
+            interpolation=cv2.INTER_CUBIC,
+        )
+        color_map = cv2.resize(color_map, (width, height), interpolation=cv2.INTER_NEAREST)
+        color_map = Image.fromarray(color_map)
+        return color_map

invokeai/app/invocations/image.py

@@ -8,12 +8,12 @@ import numpy
 from PIL import Image, ImageChops, ImageFilter, ImageOps
 
 from invokeai.app.invocations.metadata import CoreMetadata
-from invokeai.app.invocations.primitives import ColorField, ImageField, ImageOutput
+from invokeai.app.invocations.primitives import BoardField, ColorField, ImageField, ImageOutput
 from invokeai.backend.image_util.invisible_watermark import InvisibleWatermark
 from invokeai.backend.image_util.safety_checker import SafetyChecker
 
 from ..models.image import ImageCategory, ResourceOrigin
-from .baseinvocation import BaseInvocation, FieldDescriptions, InputField, InvocationContext, invocation
+from .baseinvocation import BaseInvocation, FieldDescriptions, Input, InputField, InvocationContext, invocation
 
 
 @invocation("show_image", title="Show Image", tags=["image"], category="image", version="1.0.0")
@@ -972,13 +972,14 @@ class ImageChannelMultiplyInvocation(BaseInvocation):
     title="Save Image",
     tags=["primitives", "image"],
     category="primitives",
-    version="1.0.0",
+    version="1.0.1",
     use_cache=False,
 )
 class SaveImageInvocation(BaseInvocation):
     """Saves an image. Unlike an image primitive, this invocation stores a copy of the image."""
 
-    image: ImageField = InputField(description="The image to load")
+    image: ImageField = InputField(description=FieldDescriptions.image)
+    board: Optional[BoardField] = InputField(default=None, description=FieldDescriptions.board, input=Input.Direct)
     metadata: CoreMetadata = InputField(
         default=None,
         description=FieldDescriptions.core_metadata,
@@ -992,6 +993,7 @@ class SaveImageInvocation(BaseInvocation):
             image=image,
             image_origin=ResourceOrigin.INTERNAL,
             image_category=ImageCategory.GENERAL,
+            board_id=self.board.board_id if self.board else None,
             node_id=self.id,
             session_id=context.graph_execution_state_id,
             is_intermediate=self.is_intermediate,

invokeai/app/invocations/primitives.py

@@ -226,6 +226,12 @@ class ImageField(BaseModel):
     image_name: str = Field(description="The name of the image")
 
 
+class BoardField(BaseModel):
+    """A board primitive field"""
+
+    board_id: str = Field(description="The id of the board")
+
+
 @invocation_output("image_output")
 class ImageOutput(BaseInvocationOutput):
     """Base class for nodes that output a single image"""

invokeai/app/services/config/invokeai_config.py

@@ -277,6 +277,7 @@ class InvokeAIAppConfig(InvokeAISettings):
 
     class Config:
         validate_assignment = True
+        env_prefix = "INVOKEAI"
 
     def parse_args(self, argv: Optional[list[str]] = None, conf: Optional[DictConfig] = None, clobber=False):
         """

invokeai/app/services/graph.py

@@ -117,6 +117,10 @@ def are_connection_types_compatible(from_type: Any, to_type: Any) -> bool:
         if from_type is int and to_type is float:
             return True
 
+        # allow int|float -> str, pydantic will cast for us
+        if (from_type is int or from_type is float) and to_type is str:
+            return True
+
         # if not issubclass(from_type, to_type):
         if not is_union_subtype(from_type, to_type):
             return False

invokeai/app/services/invocation_cache/invocation_cache_base.py

@@ -2,6 +2,7 @@ from abc import ABC, abstractmethod
 from typing import Optional, Union
 
 from invokeai.app.invocations.baseinvocation import BaseInvocation, BaseInvocationOutput
+from invokeai.app.services.invocation_cache.invocation_cache_common import InvocationCacheStatus
 
 
 class InvocationCacheBase(ABC):
@@ -32,7 +33,7 @@ class InvocationCacheBase(ABC):
 
     @abstractmethod
     def delete(self, key: Union[int, str]) -> None:
-        """Deleteds an invocation output from the cache"""
+        """Deletes an invocation output from the cache"""
         pass
 
     @abstractmethod
@@ -44,3 +45,18 @@ class InvocationCacheBase(ABC):
     def create_key(self, invocation: BaseInvocation) -> int:
         """Gets the key for the invocation's cache item"""
         pass
+
+    @abstractmethod
+    def disable(self) -> None:
+        """Disables the cache, overriding the max cache size"""
+        pass
+
+    @abstractmethod
+    def enable(self) -> None:
+        """Enables the cache, letting the the max cache size take effect"""
+        pass
+
+    @abstractmethod
+    def get_status(self) -> InvocationCacheStatus:
+        """Returns the status of the cache"""
+        pass

invokeai/app/services/invocation_cache/invocation_cache_common.py

@@ -0,0 +1,9 @@
+from pydantic import BaseModel, Field
+
+
+class InvocationCacheStatus(BaseModel):
+    size: int = Field(description="The current size of the invocation cache")
+    hits: int = Field(description="The number of cache hits")
+    misses: int = Field(description="The number of cache misses")
+    enabled: bool = Field(description="Whether the invocation cache is enabled")
+    max_size: int = Field(description="The maximum size of the invocation cache")

invokeai/app/services/invocation_cache/invocation_cache_memory.py

@@ -1,81 +1,127 @@
-from queue import Queue
+from collections import OrderedDict
+from dataclasses import dataclass, field
+from threading import Lock
+from time import time
 from typing import Optional, Union
 
 from invokeai.app.invocations.baseinvocation import BaseInvocation, BaseInvocationOutput
 from invokeai.app.services.invocation_cache.invocation_cache_base import InvocationCacheBase
+from invokeai.app.services.invocation_cache.invocation_cache_common import InvocationCacheStatus
 from invokeai.app.services.invoker import Invoker
 
 
+@dataclass(order=True)
+class CachedItem:
+    invocation_output: BaseInvocationOutput = field(compare=False)
+    invocation_output_json: str = field(compare=False)
+
+
 class MemoryInvocationCache(InvocationCacheBase):
-    __cache: dict[Union[int, str], tuple[BaseInvocationOutput, str]]
-    __max_cache_size: int
-    __cache_ids: Queue
-    __invoker: Invoker
+    _cache: OrderedDict[Union[int, str], CachedItem]
+    _max_cache_size: int
+    _disabled: bool
+    _hits: int
+    _misses: int
+    _invoker: Invoker
+    _lock: Lock
 
     def __init__(self, max_cache_size: int = 0) -> None:
-        self.__cache = dict()
-        self.__max_cache_size = max_cache_size
-        self.__cache_ids = Queue()
+        self._cache = OrderedDict()
+        self._max_cache_size = max_cache_size
+        self._disabled = False
+        self._hits = 0
+        self._misses = 0
+        self._lock = Lock()
 
     def start(self, invoker: Invoker) -> None:
-        self.__invoker = invoker
-        if self.__max_cache_size == 0:
+        self._invoker = invoker
+        if self._max_cache_size == 0:
             return
-        self.__invoker.services.images.on_deleted(self._delete_by_match)
-        self.__invoker.services.latents.on_deleted(self._delete_by_match)
+        self._invoker.services.images.on_deleted(self._delete_by_match)
+        self._invoker.services.latents.on_deleted(self._delete_by_match)
 
     def get(self, key: Union[int, str]) -> Optional[BaseInvocationOutput]:
-        if self.__max_cache_size == 0:
-            return
-
-        item = self.__cache.get(key, None)
-        if item is not None:
-            return item[0]
+        with self._lock:
+            if self._max_cache_size == 0 or self._disabled:
+                return None
+            item = self._cache.get(key, None)
+            if item is not None:
+                self._hits += 1
+                self._cache.move_to_end(key)
+                return item.invocation_output
+            self._misses += 1
+            return None
 
     def save(self, key: Union[int, str], invocation_output: BaseInvocationOutput) -> None:
-        if self.__max_cache_size == 0:
-            return
+        with self._lock:
+            if self._max_cache_size == 0 or self._disabled or key in self._cache:
+                return
+            # If the cache is full, we need to remove the least used
+            number_to_delete = len(self._cache) + 1 - self._max_cache_size
+            self._delete_oldest_access(number_to_delete)
+            self._cache[key] = CachedItem(invocation_output, invocation_output.json())
 
-        if key not in self.__cache:
-            self.__cache[key] = (invocation_output, invocation_output.json())
-            self.__cache_ids.put(key)
-            if self.__cache_ids.qsize() > self.__max_cache_size:
-                try:
-                    self.__cache.pop(self.__cache_ids.get())
-                except KeyError:
-                    # this means the cache_ids are somehow out of sync w/ the cache
-                    pass
+    def _delete_oldest_access(self, number_to_delete: int) -> None:
+        number_to_delete = min(number_to_delete, len(self._cache))
+        for _ in range(number_to_delete):
+            self._cache.popitem(last=False)
+
+    def _delete(self, key: Union[int, str]) -> None:
+        if self._max_cache_size == 0:
+            return
+        if key in self._cache:
+            del self._cache[key]
 
     def delete(self, key: Union[int, str]) -> None:
-        if self.__max_cache_size == 0:
-            return
-
-        if key in self.__cache:
-            del self.__cache[key]
+        with self._lock:
+            return self._delete(key)
 
     def clear(self, *args, **kwargs) -> None:
-        if self.__max_cache_size == 0:
-            return
+        with self._lock:
+            if self._max_cache_size == 0:
+                return
+            self._cache.clear()
+            self._misses = 0
+            self._hits = 0
 
-        self.__cache.clear()
-        self.__cache_ids = Queue()
-
-    def create_key(self, invocation: BaseInvocation) -> int:
+    @staticmethod
+    def create_key(invocation: BaseInvocation) -> int:
         return hash(invocation.json(exclude={"id"}))
 
+    def disable(self) -> None:
+        with self._lock:
+            if self._max_cache_size == 0:
+                return
+            self._disabled = True
+
+    def enable(self) -> None:
+        with self._lock:
+            if self._max_cache_size == 0:
+                return
+            self._disabled = False
+
+    def get_status(self) -> InvocationCacheStatus:
+        with self._lock:
+            return InvocationCacheStatus(
+                hits=self._hits,
+                misses=self._misses,
+                enabled=not self._disabled and self._max_cache_size > 0,
+                size=len(self._cache),
+                max_size=self._max_cache_size,
+            )
+
     def _delete_by_match(self, to_match: str) -> None:
-        if self.__max_cache_size == 0:
-            return
-
-        keys_to_delete = set()
-        for key, value_tuple in self.__cache.items():
-            if to_match in value_tuple[1]:
-                keys_to_delete.add(key)
-
-        if not keys_to_delete:
-            return
-
-        for key in keys_to_delete:
-            self.delete(key)
-
-        self.__invoker.services.logger.debug(f"Deleted {len(keys_to_delete)} cached invocation outputs for {to_match}")
+        with self._lock:
+            if self._max_cache_size == 0:
+                return
+            keys_to_delete = set()
+            for key, cached_item in self._cache.items():
+                if to_match in cached_item.invocation_output_json:
+                    keys_to_delete.add(key)
+            if not keys_to_delete:
+                return
+            for key in keys_to_delete:
+                self._delete(key)
+            self._invoker.services.logger.debug(
+                f"Deleted {len(keys_to_delete)} cached invocation outputs for {to_match}"
+            )

invokeai/app/services/session_processor/session_processor_default.py

@@ -47,20 +47,27 @@ class DefaultSessionProcessor(SessionProcessorBase):
     async def _on_queue_event(self, event: FastAPIEvent) -> None:
         event_name = event[1]["event"]
 
-        match event_name:
-            case "graph_execution_state_complete" | "invocation_error" | "session_retrieval_error" | "invocation_retrieval_error":
-                self.__queue_item = None
-                self._poll_now()
-            case "session_canceled" if self.__queue_item is not None and self.__queue_item.session_id == event[1][
-                "data"
-            ]["graph_execution_state_id"]:
-                self.__queue_item = None
-                self._poll_now()
-            case "batch_enqueued":
-                self._poll_now()
-            case "queue_cleared":
-                self.__queue_item = None
-                self._poll_now()
+        # This was a match statement, but match is not supported on python 3.9
+        if event_name in [
+            "graph_execution_state_complete",
+            "invocation_error",
+            "session_retrieval_error",
+            "invocation_retrieval_error",
+        ]:
+            self.__queue_item = None
+            self._poll_now()
+        elif (
+            event_name == "session_canceled"
+            and self.__queue_item is not None
+            and self.__queue_item.session_id == event[1]["data"]["graph_execution_state_id"]
+        ):
+            self.__queue_item = None
+            self._poll_now()
+        elif event_name == "batch_enqueued":
+            self._poll_now()
+        elif event_name == "queue_cleared":
+            self.__queue_item = None
+            self._poll_now()
 
     def resume(self) -> SessionProcessorStatus:
         if not self.__resume_event.is_set():
@@ -92,30 +99,34 @@ class DefaultSessionProcessor(SessionProcessorBase):
             self.__invoker.services.logger
             while not stop_event.is_set():
                 poll_now_event.clear()
+                try:
+                    # do not dequeue if there is already a session running
+                    if self.__queue_item is None and resume_event.is_set():
+                        queue_item = self.__invoker.services.session_queue.dequeue()
 
-                # do not dequeue if there is already a session running
-                if self.__queue_item is None and resume_event.is_set():
-                    queue_item = self.__invoker.services.session_queue.dequeue()
+                        if queue_item is not None:
+                            self.__invoker.services.logger.debug(f"Executing queue item {queue_item.item_id}")
+                            self.__queue_item = queue_item
+                            self.__invoker.services.graph_execution_manager.set(queue_item.session)
+                            self.__invoker.invoke(
+                                session_queue_batch_id=queue_item.batch_id,
+                                session_queue_id=queue_item.queue_id,
+                                session_queue_item_id=queue_item.item_id,
+                                graph_execution_state=queue_item.session,
+                                invoke_all=True,
+                            )
+                            queue_item = None
 
-                    if queue_item is not None:
-                        self.__invoker.services.logger.debug(f"Executing queue item {queue_item.item_id}")
-                        self.__queue_item = queue_item
-                        self.__invoker.services.graph_execution_manager.set(queue_item.session)
-                        self.__invoker.invoke(
-                            session_queue_batch_id=queue_item.batch_id,
-                            session_queue_id=queue_item.queue_id,
-                            session_queue_item_id=queue_item.item_id,
-                            graph_execution_state=queue_item.session,
-                            invoke_all=True,
-                        )
-                        queue_item = None
-
-                if queue_item is None:
-                    self.__invoker.services.logger.debug("Waiting for next polling interval or event")
+                    if queue_item is None:
+                        self.__invoker.services.logger.debug("Waiting for next polling interval or event")
+                        poll_now_event.wait(POLLING_INTERVAL)
+                        continue
+                except Exception as e:
+                    self.__invoker.services.logger.error(f"Error in session processor: {e}")
                     poll_now_event.wait(POLLING_INTERVAL)
                     continue
         except Exception as e:
-            self.__invoker.services.logger.error(f"Error in session processor: {e}")
+            self.__invoker.services.logger.error(f"Fatal Error in session processor: {e}")
             pass
         finally:
             stop_event.clear()

invokeai/app/services/session_queue/session_queue_common.py

@@ -162,15 +162,15 @@ class SessionQueueItemWithoutGraph(BaseModel):
     session_id: str = Field(
         description="The ID of the session associated with this queue item. The session doesn't exist in graph_executions until the queue item is executed."
     )
-    field_values: Optional[list[NodeFieldValue]] = Field(
-        default=None, description="The field values that were used for this queue item"
-    )
-    queue_id: str = Field(description="The id of the queue with which this item is associated")
     error: Optional[str] = Field(default=None, description="The error message if this queue item errored")
     created_at: Union[datetime.datetime, str] = Field(description="When this queue item was created")
     updated_at: Union[datetime.datetime, str] = Field(description="When this queue item was updated")
     started_at: Optional[Union[datetime.datetime, str]] = Field(description="When this queue item was started")
     completed_at: Optional[Union[datetime.datetime, str]] = Field(description="When this queue item was completed")
+    queue_id: str = Field(description="The id of the queue with which this item is associated")
+    field_values: Optional[list[NodeFieldValue]] = Field(
+        default=None, description="The field values that were used for this queue item"
+    )
 
     @classmethod
     def from_dict(cls, queue_item_dict: dict) -> "SessionQueueItemDTO":

invokeai/app/services/session_queue/session_queue_sqlite.py

@@ -59,13 +59,14 @@ class SqliteSessionQueue(SessionQueueBase):
 
     async def _on_session_event(self, event: FastAPIEvent) -> FastAPIEvent:
         event_name = event[1]["event"]
-        match event_name:
-            case "graph_execution_state_complete":
-                await self._handle_complete_event(event)
-            case "invocation_error" | "session_retrieval_error" | "invocation_retrieval_error":
-                await self._handle_error_event(event)
-            case "session_canceled":
-                await self._handle_cancel_event(event)
+
+        # This was a match statement, but match is not supported on python 3.9
+        if event_name == "graph_execution_state_complete":
+            await self._handle_complete_event(event)
+        elif event_name in ["invocation_error", "session_retrieval_error", "invocation_retrieval_error"]:
+            await self._handle_error_event(event)
+        elif event_name == "session_canceled":
+            await self._handle_cancel_event(event)
         return event
 
     async def _handle_complete_event(self, event: FastAPIEvent) -> None:

invokeai/backend/install/invokeai_configure.py

@@ -93,7 +93,7 @@ INIT_FILE_PREAMBLE = """# InvokeAI initialization file
 # or renaming it and then running invokeai-configure again.
 """
 
-logger = InvokeAILogger.getLogger()
+logger = InvokeAILogger.get_logger()
 
 
 class DummyWidgetValue(Enum):
@@ -894,7 +894,7 @@ def main():
     if opt.full_precision:
         invoke_args.extend(["--precision", "float32"])
     config.parse_args(invoke_args)
-    logger = InvokeAILogger().getLogger(config=config)
+    logger = InvokeAILogger().get_logger(config=config)
 
     errors = set()
 

invokeai/backend/install/model_install_backend.py

@@ -30,7 +30,7 @@ warnings.filterwarnings("ignore")
 
 # --------------------------globals-----------------------
 config = InvokeAIAppConfig.get_config()
-logger = InvokeAILogger.getLogger(name="InvokeAI")
+logger = InvokeAILogger.get_logger(name="InvokeAI")
 
 # the initial "configs" dir is now bundled in the `invokeai.configs` package
 Dataset_path = Path(configs.__path__[0]) / "INITIAL_MODELS.yaml"
@@ -47,8 +47,14 @@ Config_preamble = """
 
 LEGACY_CONFIGS = {
     BaseModelType.StableDiffusion1: {
-        ModelVariantType.Normal: "v1-inference.yaml",
-        ModelVariantType.Inpaint: "v1-inpainting-inference.yaml",
+        ModelVariantType.Normal: {
+            SchedulerPredictionType.Epsilon: "v1-inference.yaml",
+            SchedulerPredictionType.VPrediction: "v1-inference-v.yaml",
+        },
+        ModelVariantType.Inpaint: {
+            SchedulerPredictionType.Epsilon: "v1-inpainting-inference.yaml",
+            SchedulerPredictionType.VPrediction: "v1-inpainting-inference-v.yaml",
+        },
     },
     BaseModelType.StableDiffusion2: {
         ModelVariantType.Normal: {
@@ -69,14 +75,6 @@ LEGACY_CONFIGS = {
 }
 
 
-@dataclass
-class ModelInstallList:
-    """Class for listing models to be installed/removed"""
-
-    install_models: List[str] = field(default_factory=list)
-    remove_models: List[str] = field(default_factory=list)
-
-
 @dataclass
 class InstallSelections:
     install_models: List[str] = field(default_factory=list)
@@ -94,6 +92,7 @@ class ModelLoadInfo:
     installed: bool = False
     recommended: bool = False
     default: bool = False
+    requires: Optional[List[str]] = field(default_factory=list)
 
 
 class ModelInstall(object):
@@ -131,8 +130,6 @@ class ModelInstall(object):
 
         # supplement with entries in models.yaml
         installed_models = [x for x in self.mgr.list_models()]
-        # suppresses autoloaded models
-        # installed_models = [x for x in self.mgr.list_models() if not self._is_autoloaded(x)]
 
         for md in installed_models:
             base = md["base_model"]
@@ -164,9 +161,12 @@ class ModelInstall(object):
 
     def list_models(self, model_type):
         installed = self.mgr.list_models(model_type=model_type)
+        print()
         print(f"Installed models of type `{model_type}`:")
+        print(f"{'Model Key':50} Model Path")
         for i in installed:
-            print(f"{i['model_name']}\t{i['base_model']}\t{i['path']}")
+            print(f"{'/'.join([i['base_model'],i['model_type'],i['model_name']]):50} {i['path']}")
+        print()
 
     # logic here a little reversed to maintain backward compatibility
     def starter_models(self, all_models: bool = False) -> Set[str]:
@@ -204,6 +204,8 @@ class ModelInstall(object):
             job += 1
 
         # add requested models
+        self._remove_installed(selections.install_models)
+        self._add_required_models(selections.install_models)
         for path in selections.install_models:
             logger.info(f"Installing {path} [{job}/{jobs}]")
             try:
@@ -263,6 +265,26 @@ class ModelInstall(object):
 
         return models_installed
 
+    def _remove_installed(self, model_list: List[str]):
+        all_models = self.all_models()
+        for path in model_list:
+            key = self.reverse_paths.get(path)
+            if key and all_models[key].installed:
+                logger.warning(f"{path} already installed. Skipping.")
+                model_list.remove(path)
+
+    def _add_required_models(self, model_list: List[str]):
+        additional_models = []
+        all_models = self.all_models()
+        for path in model_list:
+            if not (key := self.reverse_paths.get(path)):
+                continue
+            for requirement in all_models[key].requires:
+                requirement_key = self.reverse_paths.get(requirement)
+                if not all_models[requirement_key].installed:
+                    additional_models.append(requirement)
+        model_list.extend(additional_models)
+
     # install a model from a local path. The optional info parameter is there to prevent
     # the model from being probed twice in the event that it has already been probed.
     def _install_path(self, path: Path, info: ModelProbeInfo = None) -> AddModelResult:
@@ -286,7 +308,7 @@ class ModelInstall(object):
             location = download_with_resume(url, Path(staging))
             if not location:
                 logger.error(f"Unable to download {url}. Skipping.")
-            info = ModelProbe().heuristic_probe(location)
+            info = ModelProbe().heuristic_probe(location, self.prediction_helper)
             dest = self.config.models_path / info.base_type.value / info.model_type.value / location.name
             dest.parent.mkdir(parents=True, exist_ok=True)
             models_path = shutil.move(location, dest)
@@ -393,7 +415,7 @@ class ModelInstall(object):
                     possible_conf = path.with_suffix(".yaml")
                     if possible_conf.exists():
                         legacy_conf = str(self.relative_to_root(possible_conf))
-                    elif info.base_type == BaseModelType.StableDiffusion2:
+                    elif info.base_type in [BaseModelType.StableDiffusion1, BaseModelType.StableDiffusion2]:
                         legacy_conf = Path(
                             self.config.legacy_conf_dir,
                             LEGACY_CONFIGS[info.base_type][info.variant_type][info.prediction_type],
@@ -492,7 +514,7 @@ def yes_or_no(prompt: str, default_yes=True):
 
 # ---------------------------------------------
 def hf_download_from_pretrained(model_class: object, model_name: str, destination: Path, **kwargs):
-    logger = InvokeAILogger.getLogger("InvokeAI")
+    logger = InvokeAILogger.get_logger("InvokeAI")
     logger.addFilter(lambda x: "fp16 is not a valid" not in x.getMessage())
 
     model = model_class.from_pretrained(

invokeai/backend/model_management/convert_ckpt_to_diffusers.py

@@ -74,7 +74,7 @@ if is_accelerate_available():
     from accelerate import init_empty_weights
     from accelerate.utils import set_module_tensor_to_device
 
-logger = InvokeAILogger.getLogger(__name__)
+logger = InvokeAILogger.get_logger(__name__)
 CONVERT_MODEL_ROOT = InvokeAIAppConfig.get_config().models_path / "core/convert"
 
 
@@ -1279,12 +1279,12 @@ def download_from_original_stable_diffusion_ckpt(
         extract_ema = original_config["model"]["params"]["use_ema"]
 
     if (
-        model_version == BaseModelType.StableDiffusion2
+        model_version in [BaseModelType.StableDiffusion2, BaseModelType.StableDiffusion1]
         and original_config["model"]["params"].get("parameterization") == "v"
     ):
         prediction_type = "v_prediction"
         upcast_attention = True
-        image_size = 768
+        image_size = 768 if model_version == BaseModelType.StableDiffusion2 else 512
     else:
         prediction_type = "epsilon"
         upcast_attention = False

invokeai/backend/model_management/model_probe.py

@@ -90,8 +90,7 @@ class ModelProbe(object):
         to place it somewhere in the models directory hierarchy. If the model is
         already loaded into memory, you may provide it as model in order to avoid
         opening it a second time. The prediction_type_helper callable is a function that receives
-        the path to the model and returns the BaseModelType. It is called to distinguish
-        between V2-Base and V2-768 SD models.
+        the path to the model and returns the SchedulerPredictionType.
         """
         if model_path:
             format_type = "diffusers" if model_path.is_dir() else "checkpoint"
@@ -305,25 +304,36 @@ class PipelineCheckpointProbe(CheckpointProbeBase):
         else:
             raise InvalidModelException("Cannot determine base type")
 
-    def get_scheduler_prediction_type(self) -> SchedulerPredictionType:
+    def get_scheduler_prediction_type(self) -> Optional[SchedulerPredictionType]:
+        """Return model prediction type."""
+        # if there is a .yaml associated with this checkpoint, then we do not need
+        # to probe for the prediction type as it will be ignored.
+        if self.checkpoint_path and self.checkpoint_path.with_suffix(".yaml").exists():
+            return None
+
         type = self.get_base_type()
-        if type == BaseModelType.StableDiffusion1:
-            return SchedulerPredictionType.Epsilon
-        checkpoint = self.checkpoint
-        state_dict = self.checkpoint.get("state_dict") or checkpoint
-        key_name = "model.diffusion_model.input_blocks.2.1.transformer_blocks.0.attn2.to_k.weight"
-        if key_name in state_dict and state_dict[key_name].shape[-1] == 1024:
-            if "global_step" in checkpoint:
-                if checkpoint["global_step"] == 220000:
-                    return SchedulerPredictionType.Epsilon
-                elif checkpoint["global_step"] == 110000:
-                    return SchedulerPredictionType.VPrediction
-            if (
-                self.checkpoint_path and self.helper and not self.checkpoint_path.with_suffix(".yaml").exists()
-            ):  # if a .yaml config file exists, then this step not needed
-                return self.helper(self.checkpoint_path)
-            else:
-                return None
+        if type == BaseModelType.StableDiffusion2:
+            checkpoint = self.checkpoint
+            state_dict = self.checkpoint.get("state_dict") or checkpoint
+            key_name = "model.diffusion_model.input_blocks.2.1.transformer_blocks.0.attn2.to_k.weight"
+            if key_name in state_dict and state_dict[key_name].shape[-1] == 1024:
+                if "global_step" in checkpoint:
+                    if checkpoint["global_step"] == 220000:
+                        return SchedulerPredictionType.Epsilon
+                    elif checkpoint["global_step"] == 110000:
+                        return SchedulerPredictionType.VPrediction
+            if self.helper and self.checkpoint_path:
+                if helper_guess := self.helper(self.checkpoint_path):
+                    return helper_guess
+            return SchedulerPredictionType.VPrediction  # a guess for sd2 ckpts
+
+        elif type == BaseModelType.StableDiffusion1:
+            if self.helper and self.checkpoint_path:
+                if helper_guess := self.helper(self.checkpoint_path):
+                    return helper_guess
+            return SchedulerPredictionType.Epsilon  # a reasonable guess for sd1 ckpts
+        else:
+            return None
 
 
 class VaeCheckpointProbe(CheckpointProbeBase):

invokeai/backend/model_management/model_search.py

@@ -71,7 +71,13 @@ class ModelSearch(ABC):
                 if any(
                     [
                         (path / x).exists()
-                        for x in {"config.json", "model_index.json", "learned_embeds.bin", "pytorch_lora_weights.bin"}
+                        for x in {
+                            "config.json",
+                            "model_index.json",
+                            "learned_embeds.bin",
+                            "pytorch_lora_weights.bin",
+                            "image_encoder.txt",
+                        }
                     ]
                 ):
                     try:

invokeai/backend/util/hotfixes.py

@@ -24,7 +24,7 @@ from invokeai.backend.util.logging import InvokeAILogger
 # Modified ControlNetModel with encoder_attention_mask argument added
 
 
-logger = InvokeAILogger.getLogger(__name__)
+logger = InvokeAILogger.get_logger(__name__)
 
 
 class ControlNetModel(ModelMixin, ConfigMixin, FromOriginalControlnetMixin):

invokeai/backend/util/logging.py

@@ -1,7 +1,6 @@
 # Copyright (c) 2023 Lincoln D. Stein and The InvokeAI Development Team
 
-"""
-invokeai.backend.util.logging
+"""invokeai.backend.util.logging
 
 Logging class for InvokeAI that produces console messages
 
@@ -9,9 +8,9 @@ Usage:
 
 from invokeai.backend.util.logging import InvokeAILogger
 
-logger = InvokeAILogger.getLogger(name='InvokeAI') // Initialization
+logger = InvokeAILogger.get_logger(name='InvokeAI') // Initialization
 (or)
-logger = InvokeAILogger.getLogger(__name__) // To use the filename
+logger = InvokeAILogger.get_logger(__name__) // To use the filename
 logger.configure()
 
 logger.critical('this is critical') // Critical Message
@@ -34,13 +33,13 @@ IAILogger.debug('this is a debugging message')
 ## Configuration
 
 The default configuration will print to stderr on the console. To add
-additional logging handlers, call getLogger with an initialized InvokeAIAppConfig
+additional logging handlers, call get_logger with an initialized InvokeAIAppConfig
 object:
 
 
  config = InvokeAIAppConfig.get_config()
  config.parse_args()
- logger = InvokeAILogger.getLogger(config=config)
+ logger = InvokeAILogger.get_logger(config=config)
 
 ### Three command-line options control logging:
 
@@ -173,6 +172,7 @@ InvokeAI:
     log_level: info
     log_format: color
 ```
+
 """
 
 import logging.handlers
@@ -193,39 +193,35 @@ except ImportError:
 
 # module level functions
 def debug(msg, *args, **kwargs):
-    InvokeAILogger.getLogger().debug(msg, *args, **kwargs)
+    InvokeAILogger.get_logger().debug(msg, *args, **kwargs)
 
 
 def info(msg, *args, **kwargs):
-    InvokeAILogger.getLogger().info(msg, *args, **kwargs)
+    InvokeAILogger.get_logger().info(msg, *args, **kwargs)
 
 
 def warning(msg, *args, **kwargs):
-    InvokeAILogger.getLogger().warning(msg, *args, **kwargs)
+    InvokeAILogger.get_logger().warning(msg, *args, **kwargs)
 
 
 def error(msg, *args, **kwargs):
-    InvokeAILogger.getLogger().error(msg, *args, **kwargs)
+    InvokeAILogger.get_logger().error(msg, *args, **kwargs)
 
 
 def critical(msg, *args, **kwargs):
-    InvokeAILogger.getLogger().critical(msg, *args, **kwargs)
+    InvokeAILogger.get_logger().critical(msg, *args, **kwargs)
 
 
 def log(level, msg, *args, **kwargs):
-    InvokeAILogger.getLogger().log(level, msg, *args, **kwargs)
+    InvokeAILogger.get_logger().log(level, msg, *args, **kwargs)
 
 
 def disable(level=logging.CRITICAL):
-    InvokeAILogger.getLogger().disable(level)
+    InvokeAILogger.get_logger().disable(level)
 
 
 def basicConfig(**kwargs):
-    InvokeAILogger.getLogger().basicConfig(**kwargs)
-
-
-def getLogger(name: str = None) -> logging.Logger:
-    return InvokeAILogger.getLogger(name)
+    InvokeAILogger.get_logger().basicConfig(**kwargs)
 
 
 _FACILITY_MAP = (
@@ -351,7 +347,7 @@ class InvokeAILogger(object):
     loggers = dict()
 
     @classmethod
-    def getLogger(
+    def get_logger(
         cls, name: str = "InvokeAI", config: InvokeAIAppConfig = InvokeAIAppConfig.get_config()
     ) -> logging.Logger:
         if name in cls.loggers:
@@ -360,13 +356,13 @@ class InvokeAILogger(object):
         else:
             logger = logging.getLogger(name)
         logger.setLevel(config.log_level.upper())  # yes, strings work here
-        for ch in cls.getLoggers(config):
+        for ch in cls.get_loggers(config):
             logger.addHandler(ch)
             cls.loggers[name] = logger
         return cls.loggers[name]
 
     @classmethod
-    def getLoggers(cls, config: InvokeAIAppConfig) -> list[logging.Handler]:
+    def get_loggers(cls, config: InvokeAIAppConfig) -> list[logging.Handler]:
         handler_strs = config.log_handlers
         handlers = list()
         for handler in handler_strs:

invokeai/configs/INITIAL_MODELS.yaml

@@ -103,3 +103,35 @@ sd-1/lora/LowRA:
    recommended: True
 sd-1/lora/Ink scenery:
    path: https://civitai.com/api/download/models/83390
+sd-1/ip_adapter/ip_adapter_sd15:
+   repo_id: InvokeAI/ip_adapter_sd15
+   recommended: True
+   requires:
+      - InvokeAI/ip_adapter_sd_image_encoder
+   description: IP-Adapter for SD 1.5 models
+sd-1/ip_adapter/ip_adapter_plus_sd15:
+   repo_id: InvokeAI/ip_adapter_plus_sd15
+   recommended: False
+   requires:
+      - InvokeAI/ip_adapter_sd_image_encoder
+   description: Refined IP-Adapter for SD 1.5 models
+sd-1/ip_adapter/ip_adapter_plus_face_sd15:
+   repo_id: InvokeAI/ip_adapter_plus_face_sd15
+   recommended: False
+   requires:
+      - InvokeAI/ip_adapter_sd_image_encoder
+   description: Refined IP-Adapter for SD 1.5 models, adapted for faces
+sdxl/ip_adapter/ip_adapter_sdxl:
+   repo_id: InvokeAI/ip_adapter_sdxl
+   recommended: False
+   requires:
+      - InvokeAI/ip_adapter_sdxl_image_encoder
+   description: IP-Adapter for SDXL models
+any/clip_vision/ip_adapter_sd_image_encoder:
+   repo_id: InvokeAI/ip_adapter_sd_image_encoder
+   recommended: False
+   description: Required model for using IP-Adapters with SD-1/2 models
+any/clip_vision/ip_adapter_sdxl_image_encoder:
+   repo_id: InvokeAI/ip_adapter_sdxl_image_encoder
+   recommended: False
+   description: Required model for using IP-Adapters with SDXL models

invokeai/configs/stable-diffusion/v1-inference-v.yaml

@@ -0,0 +1,80 @@
+model:
+  base_learning_rate: 1.0e-04
+  target: invokeai.backend.models.diffusion.ddpm.LatentDiffusion
+  params:
+    parameterization: "v"
+    linear_start: 0.00085
+    linear_end: 0.0120
+    num_timesteps_cond: 1
+    log_every_t: 200
+    timesteps: 1000
+    first_stage_key: "jpg"
+    cond_stage_key: "txt"
+    image_size: 64
+    channels: 4
+    cond_stage_trainable: false   # Note: different from the one we trained before
+    conditioning_key: crossattn
+    monitor: val/loss_simple_ema
+    scale_factor: 0.18215
+    use_ema: False
+
+    scheduler_config: # 10000 warmup steps
+      target: invokeai.backend.stable_diffusion.lr_scheduler.LambdaLinearScheduler
+      params:
+        warm_up_steps: [ 10000 ]
+        cycle_lengths: [ 10000000000000 ] # incredibly large number to prevent corner cases
+        f_start: [ 1.e-6 ]
+        f_max: [ 1. ]
+        f_min: [ 1. ]
+
+    personalization_config:
+      target: invokeai.backend.stable_diffusion.embedding_manager.EmbeddingManager
+      params:
+        placeholder_strings: ["*"]
+        initializer_words: ['sculpture']
+        per_image_tokens: false
+        num_vectors_per_token: 1
+        progressive_words: False
+
+    unet_config:
+      target: invokeai.backend.stable_diffusion.diffusionmodules.openaimodel.UNetModel
+      params:
+        image_size: 32 # unused
+        in_channels: 4
+        out_channels: 4
+        model_channels: 320
+        attention_resolutions: [ 4, 2, 1 ]
+        num_res_blocks: 2
+        channel_mult: [ 1, 2, 4, 4 ]
+        num_heads: 8
+        use_spatial_transformer: True
+        transformer_depth: 1
+        context_dim: 768
+        use_checkpoint: True
+        legacy: False
+
+    first_stage_config:
+      target: invokeai.backend.stable_diffusion.autoencoder.AutoencoderKL
+      params:
+        embed_dim: 4
+        monitor: val/rec_loss
+        ddconfig:
+          double_z: true
+          z_channels: 4
+          resolution: 256
+          in_channels: 3
+          out_ch: 3
+          ch: 128
+          ch_mult:
+          - 1
+          - 2
+          - 4
+          - 4
+          num_res_blocks: 2
+          attn_resolutions: []
+          dropout: 0.0
+        lossconfig:
+          target: torch.nn.Identity
+
+    cond_stage_config:
+      target: invokeai.backend.stable_diffusion.encoders.modules.WeightedFrozenCLIPEmbedder

invokeai/frontend/install/model_install.py

@@ -45,7 +45,7 @@ from invokeai.frontend.install.widgets import (
 )
 
 config = InvokeAIAppConfig.get_config()
-logger = InvokeAILogger.getLogger()
+logger = InvokeAILogger.get_logger()
 
 # build a table mapping all non-printable characters to None
 # for stripping control characters
@@ -101,11 +101,12 @@ class addModelsForm(CyclingForm, npyscreen.FormMultiPage):
                 "STARTER MODELS",
                 "MAIN MODELS",
                 "CONTROLNETS",
+                "IP-ADAPTERS",
                 "LORA/LYCORIS",
                 "TEXTUAL INVERSION",
             ],
             value=[self.current_tab],
-            columns=5,
+            columns=6,
             max_height=2,
             relx=8,
             scroll_exit=True,
@@ -130,6 +131,13 @@ class addModelsForm(CyclingForm, npyscreen.FormMultiPage):
         )
         bottom_of_table = max(bottom_of_table, self.nextrely)
 
+        self.nextrely = top_of_table
+        self.ipadapter_models = self.add_model_widgets(
+            model_type=ModelType.IPAdapter,
+            window_width=window_width,
+        )
+        bottom_of_table = max(bottom_of_table, self.nextrely)
+
         self.nextrely = top_of_table
         self.lora_models = self.add_model_widgets(
             model_type=ModelType.Lora,
@@ -343,6 +351,7 @@ class addModelsForm(CyclingForm, npyscreen.FormMultiPage):
             self.starter_pipelines,
             self.pipeline_models,
             self.controlnet_models,
+            self.ipadapter_models,
             self.lora_models,
             self.ti_models,
         ]
@@ -532,6 +541,7 @@ class addModelsForm(CyclingForm, npyscreen.FormMultiPage):
             self.starter_pipelines,
             self.pipeline_models,
             self.controlnet_models,
+            self.ipadapter_models,
             self.lora_models,
             self.ti_models,
         ]
@@ -553,6 +563,25 @@ class addModelsForm(CyclingForm, npyscreen.FormMultiPage):
             if downloads := section.get("download_ids"):
                 selections.install_models.extend(downloads.value.split())
 
+        # NOT NEEDED - DONE IN BACKEND NOW
+        # # special case for the ipadapter_models. If any of the adapters are
+        # # chosen, then we add the corresponding encoder(s) to the install list.
+        # section = self.ipadapter_models
+        # if section.get("models_selected"):
+        #     selected_adapters = [
+        #         self.all_models[section["models"][x]].name for x in section.get("models_selected").value
+        #     ]
+        #     encoders = []
+        #     if any(["sdxl" in x for x in selected_adapters]):
+        #         encoders.append("ip_adapter_sdxl_image_encoder")
+        #     if any(["sd15" in x for x in selected_adapters]):
+        #         encoders.append("ip_adapter_sd_image_encoder")
+        #     for encoder in encoders:
+        #         key = f"any/clip_vision/{encoder}"
+        #         repo_id = f"InvokeAI/{encoder}"
+        #         if key not in self.all_models:
+        #             selections.install_models.append(repo_id)
+
 
 class AddModelApplication(npyscreen.NPSAppManaged):
     def __init__(self, opt):
@@ -652,7 +681,7 @@ def process_and_execute(
         translator = StderrToMessage(conn_out)
         sys.stderr = translator
         sys.stdout = translator
-        logger = InvokeAILogger.getLogger()
+        logger = InvokeAILogger.get_logger()
         logger.handlers.clear()
         logger.addHandler(logging.StreamHandler(translator))
 
@@ -765,7 +794,7 @@ def main():
     if opt.full_precision:
         invoke_args.extend(["--precision", "float32"])
     config.parse_args(invoke_args)
-    logger = InvokeAILogger().getLogger(config=config)
+    logger = InvokeAILogger().get_logger(config=config)
 
     if not config.model_conf_path.exists():
         logger.info("Your InvokeAI root directory is not set up. Calling invokeai-configure.")

invokeai/frontend/web/dist/locales/en.json

@@ -574,7 +574,7 @@
         "onnxModels": "Onnx",
         "pathToCustomConfig": "Path To Custom Config",
         "pickModelType": "Pick Model Type",
-        "predictionType": "Prediction Type (for Stable Diffusion 2.x Models only)",
+        "predictionType": "Prediction Type (for Stable Diffusion 2.x Models and occasional Stable Diffusion 1.x Models)",
         "quickAdd": "Quick Add",
         "repo_id": "Repo ID",
         "repoIDValidationMsg": "Online repository of your model",

invokeai/frontend/web/public/locales/en.json

@@ -79,8 +79,9 @@
         "lightMode": "Light Mode",
         "linear": "Linear",
         "load": "Load",
-        "loading": "Loading",
+        "loading": "Loading $t({{noun}})...",
         "loadingInvokeAI": "Loading Invoke AI",
+        "learnMore": "Learn More",
         "modelManager": "Model Manager",
         "nodeEditor": "Node Editor",
         "nodes": "Workflow Editor",
@@ -135,6 +136,8 @@
         "bgth": "bg_th",
         "canny": "Canny",
         "cannyDescription": "Canny edge detection",
+        "colorMap": "Color",
+        "colorMapDescription": "Generates a color map from the image",
         "coarse": "Coarse",
         "contentShuffle": "Content Shuffle",
         "contentShuffleDescription": "Shuffles the content in an image",
@@ -158,6 +161,7 @@
         "hideAdvanced": "Hide Advanced",
         "highThreshold": "High Threshold",
         "imageResolution": "Image Resolution",
+        "colorMapTileSize": "Tile Size",
         "importImageFromCanvas": "Import Image From Canvas",
         "importMaskFromCanvas": "Import Mask From Canvas",
         "incompatibleBaseModel": "Incompatible base model:",
@@ -264,6 +268,22 @@
         "graphQueued": "Graph queued",
         "graphFailedToQueue": "Failed to queue graph"
     },
+    "invocationCache": {
+        "invocationCache": "Invocation Cache",
+        "cacheSize": "Cache Size",
+        "maxCacheSize": "Max Cache Size",
+        "hits": "Cache Hits",
+        "misses": "Cache Misses",
+        "clear": "Clear",
+        "clearSucceeded": "Invocation Cache Cleared",
+        "clearFailed": "Problem Clearing Invocation Cache",
+        "enable": "Enable",
+        "enableSucceeded": "Invocation Cache Enabled",
+        "enableFailed": "Problem Enabling Invocation Cache",
+        "disable": "Disable",
+        "disableSucceeded": "Invocation Cache Disabled",
+        "disableFailed": "Problem Disabling Invocation Cache"
+    },
     "gallery": {
         "allImagesLoaded": "All Images Loaded",
         "assets": "Assets",
@@ -635,7 +655,7 @@
         "onnxModels": "Onnx",
         "pathToCustomConfig": "Path To Custom Config",
         "pickModelType": "Pick Model Type",
-        "predictionType": "Prediction Type (for Stable Diffusion 2.x Models only)",
+        "predictionType": "Prediction Type (for Stable Diffusion 2.x Models and occasional Stable Diffusion 1.x Models)",
         "quickAdd": "Quick Add",
         "repo_id": "Repo ID",
         "repoIDValidationMsg": "Online repository of your model",
@@ -685,6 +705,8 @@
         "addNodeToolTip": "Add Node (Shift+A, Space)",
         "animatedEdges": "Animated Edges",
         "animatedEdgesHelp": "Animate selected edges and edges connected to selected nodes",
+        "boardField": "Board",
+        "boardFieldDescription": "A gallery board",
         "boolean": "Booleans",
         "booleanCollection": "Boolean Collection",
         "booleanCollectionDescription": "A collection of booleans.",
@@ -872,7 +894,7 @@
         "zoomOutNodes": "Zoom Out"
     },
     "parameters": {
-        "aspectRatio": "Ratio",
+        "aspectRatio": "Aspect Ratio",
         "boundingBoxHeader": "Bounding Box",
         "boundingBoxHeight": "Bounding Box Height",
         "boundingBoxWidth": "Bounding Box Width",
@@ -1004,8 +1026,8 @@
             "label": "Seed Behaviour",
             "perIterationLabel": "Seed per Iteration",
             "perIterationDesc": "Use a different seed for each iteration",
-            "perPromptLabel": "Seed per Prompt",
-            "perPromptDesc": "Use a different seed for each prompt"
+            "perPromptLabel": "Seed per Image",
+            "perPromptDesc": "Use a different seed for each image"
         }
     },
     "sdxl": {
@@ -1157,131 +1179,205 @@
     "popovers": {
         "clipSkip": {
             "heading": "CLIP Skip",
-            "paragraph": "Choose how many layers of the CLIP model to skip. Certain models are better suited to be used with CLIP Skip."
-        },
-        "compositingBlur": {
-            "heading": "Blur",
-            "paragraph": "The blur radius of the mask."
-        },
-        "compositingBlurMethod": {
-            "heading": "Blur Method",
-            "paragraph": "The method of blur applied to the masked area."
-        },
-        "compositingCoherencePass": {
-            "heading": "Coherence Pass",
-            "paragraph": "Composite the Inpainted/Outpainted images."
-        },
-        "compositingCoherenceMode": {
-            "heading": "Mode",
-            "paragraph": "The mode of the Coherence Pass."
-        },
-        "compositingCoherenceSteps": {
-            "heading": "Steps",
-            "paragraph": "Number of steps in the Coherence Pass. Similar to Denoising Steps."
-        },
-        "compositingStrength": {
-            "heading": "Strength",
-            "paragraph": "Amount of noise added for the Coherence Pass. Similar to Denoising Strength."
-        },
-        "compositingMaskAdjustments": {
-            "heading": "Mask Adjustments",
-            "paragraph": "Adjust the mask."
-        },
-        "controlNetBeginEnd": {
-            "heading": "Begin / End Step Percentage",
-            "paragraph": "Which parts of the denoising process will have the ControlNet applied. ControlNets applied at the start of the process guide composition, and ControlNets applied at the end guide details."
-        },
-        "controlNetControlMode": {
-            "heading": "Control Mode",
-            "paragraph": "Lends more weight to either the prompt or ControlNet."
-        },
-        "controlNetResizeMode": {
-            "heading": "Resize Mode",
-            "paragraph": "How the ControlNet image will be fit to the image generation Ratio"
-        },
-        "controlNetToggle": {
-            "heading": "Enable ControlNet",
-            "paragraph": "ControlNets provide guidance to the generation process, helping create images with controlled composition, structure, or style, depending on the model selected."
-        },
-        "controlNetWeight": {
-            "heading": "Weight",
-            "paragraph": "How strongly the ControlNet will impact the generated image."
-        },
-        "dynamicPromptsToggle": {
-            "heading": "Enable Dynamic Prompts",
-            "paragraph": "Dynamic prompts allow multiple options within a prompt. Dynamic prompts can be used by: {option1|option2|option3}. Combinations of prompts will be randomly generated until the “Images” number has been reached."
-        },
-        "dynamicPromptsCombinatorial": {
-            "heading": "Combinatorial Generation",
-            "paragraph": "Generate an image for every possible combination of Dynamic Prompts until the Max Prompts is reached."
-        },
-        "infillMethod": {
-            "heading": "Infill Method",
-            "paragraph": "Method to infill the selected area."
-        },
-        "lora": {
-            "heading": "LoRA Weight",
-            "paragraph": "Weight of the LoRA. Higher weight will lead to larger impacts on the final image."
-        },
-        "noiseEnable": {
-            "heading": "Enable Noise Settings",
-            "paragraph": "Advanced control over noise generation."
-        },
-        "noiseUseCPU": {
-            "heading": "Use CPU Noise",
-            "paragraph": "Uses the CPU to generate random noise."
-        },
-        "paramCFGScale": {
-            "heading": "CFG Scale",
-            "paragraph": "Controls how much your prompt influences the generation process."
-        },
-        "paramDenoisingStrength": {
-            "heading": "Denoising Strength",
-            "paragraph": "How much noise is added to the input image. 0 will result in an identical image, while 1 will result in a completely new image."
-        },
-        "paramIterations": {
-            "heading": "Iterations",
-            "paragraph": "The number of images to generate. If Dynamic Prompts is enabled, each of the prompts will be generated this many times."
-        },
-        "paramModel": {
-            "heading": "Model",
-            "paragraph": "Model used for the denoising steps. Different models are trained to specialize in producing different aesthetic results and content."
+            "paragraphs": [
+                "Choose how many layers of the CLIP model to skip.",
+                "Some models work better with certain CLIP Skip settings.",
+                "A higher value typically results in a less detailed image."
+            ]
         },
         "paramNegativeConditioning": {
             "heading": "Negative Prompt",
-            "paragraph": "The generation process avoids the concepts in the negative prompt. Use this to exclude qualities or objects from the output. Supports Compel syntax and embeddings."
+            "paragraphs": [
+                "The generation process avoids the concepts in the negative prompt. Use this to exclude qualities or objects from the output.",
+                "Supports Compel syntax and embeddings."
+            ]
         },
         "paramPositiveConditioning": {
             "heading": "Positive Prompt",
-            "paragraph": "Guides the generation process. You may use any words or phrases. Supports Compel and Dynamic Prompts syntaxes and embeddings."
-        },
-        "paramRatio": {
-            "heading": "Ratio",
-            "paragraph": "The ratio of the dimensions of the image generated. An image size (in number of pixels) equivalent to 512x512 is recommended for SD1.5 models and a size equivalent to 1024x1024 is recommended for SDXL models."
+            "paragraphs": [
+                "Guides the generation process. You may use any words or phrases.",
+                "Compel and Dynamic Prompts syntaxes and embeddings."
+            ]
         },
         "paramScheduler": {
             "heading": "Scheduler",
-            "paragraph": "Scheduler defines how to iteratively add noise to an image or how to update a sample based on a model's output."
+            "paragraphs": [
+                "Scheduler defines how to iteratively add noise to an image or how to update a sample based on a model's output."
+            ]
+        },
+        "compositingBlur": {
+            "heading": "Blur",
+            "paragraphs": ["The blur radius of the mask."]
+        },
+        "compositingBlurMethod": {
+            "heading": "Blur Method",
+            "paragraphs": ["The method of blur applied to the masked area."]
+        },
+        "compositingCoherencePass": {
+            "heading": "Coherence Pass",
+            "paragraphs": [
+                "A second round of denoising helps to composite the Inpainted/Outpainted image."
+            ]
+        },
+        "compositingCoherenceMode": {
+            "heading": "Mode",
+            "paragraphs": ["The mode of the Coherence Pass."]
+        },
+        "compositingCoherenceSteps": {
+            "heading": "Steps",
+            "paragraphs": [
+                "Number of denoising steps used in the Coherence Pass.",
+                "Same as the main Steps parameter."
+            ]
+        },
+        "compositingStrength": {
+            "heading": "Strength",
+            "paragraphs": [
+                "Denoising strength for the Coherence Pass.",
+                "Same as the Image to Image Denoising Strength parameter."
+            ]
+        },
+        "compositingMaskAdjustments": {
+            "heading": "Mask Adjustments",
+            "paragraphs": ["Adjust the mask."]
+        },
+        "controlNetBeginEnd": {
+            "heading": "Begin / End Step Percentage",
+            "paragraphs": [
+                "Which steps of the denoising process will have the ControlNet applied.",
+                "ControlNets applied at the beginning of the process guide composition, and ControlNets applied at the end guide details."
+            ]
+        },
+        "controlNetControlMode": {
+            "heading": "Control Mode",
+            "paragraphs": [
+                "Lends more weight to either the prompt or ControlNet."
+            ]
+        },
+        "controlNetResizeMode": {
+            "heading": "Resize Mode",
+            "paragraphs": [
+                "How the ControlNet image will be fit to the image output size."
+            ]
+        },
+        "controlNet": {
+            "heading": "ControlNet",
+            "paragraphs": [
+                "ControlNets provide guidance to the generation process, helping create images with controlled composition, structure, or style, depending on the model selected."
+            ]
+        },
+        "controlNetWeight": {
+            "heading": "Weight",
+            "paragraphs": [
+                "How strongly the ControlNet will impact the generated image."
+            ]
+        },
+        "dynamicPrompts": {
+            "heading": "Dynamic Prompts",
+            "paragraphs": [
+                "Dynamic Prompts parses a single prompt into many.",
+                "The basic syntax is \"a {red|green|blue} ball\". This will produce three prompts: \"a red ball\", \"a green ball\" and \"a blue ball\".",
+                "You can use the syntax as many times as you like in a single prompt, but be sure to keep the number of prompts generated in check with the Max Prompts setting."
+            ]
+        },
+        "dynamicPromptsMaxPrompts": {
+            "heading": "Max Prompts",
+            "paragraphs": [
+                "Limits the number of prompts that can be generated by Dynamic Prompts."
+            ]
+        },
+        "dynamicPromptsSeedBehaviour": {
+            "heading": "Seed Behaviour",
+            "paragraphs": [
+                "Controls how the seed is used when generating prompts.",
+                "Per Iteration will use a unique seed for each iteration. Use this to explore prompt variations on a single seed.",
+                "For example, if you have 5 prompts, each image will use the same seed.",
+                "Per Image will use a unique seed for each image. This provides more variation."
+            ]
+        },
+        "infillMethod": {
+            "heading": "Infill Method",
+            "paragraphs": ["Method to infill the selected area."]
+        },
+        "lora": {
+            "heading": "LoRA Weight",
+            "paragraphs": [
+                "Higher LoRA weight will lead to larger impacts on the final image."
+            ]
+        },
+        "noiseUseCPU": {
+            "heading": "Use CPU Noise",
+            "paragraphs": [
+                "Controls whether noise is generated on the CPU or GPU.",
+                "With CPU Noise enabled, a particular seed will produce the same image on any machine.",
+                "There is no performance impact to enabling CPU Noise."
+            ]
+        },
+        "paramCFGScale": {
+            "heading": "CFG Scale",
+            "paragraphs": [
+                "Controls how much your prompt influences the generation process."
+            ]
+        },
+        "paramDenoisingStrength": {
+            "heading": "Denoising Strength",
+            "paragraphs": [
+                "How much noise is added to the input image.",
+                "0 will result in an identical image, while 1 will result in a completely new image."
+            ]
+        },
+        "paramIterations": {
+            "heading": "Iterations",
+            "paragraphs": [
+                "The number of images to generate.",
+                "If Dynamic Prompts is enabled, each of the prompts will be generated this many times."
+            ]
+        },
+        "paramModel": {
+            "heading": "Model",
+            "paragraphs": [
+                "Model used for the denoising steps.",
+                "Different models are typically trained to specialize in producing particular aesthetic results and content."
+            ]
+        },
+        "paramRatio": {
+            "heading": "Aspect Ratio",
+            "paragraphs": [
+                "The aspect ratio of the dimensions of the image generated.",
+                "An image size (in number of pixels) equivalent to 512x512 is recommended for SD1.5 models and a size equivalent to 1024x1024 is recommended for SDXL models."
+            ]
         },
         "paramSeed": {
             "heading": "Seed",
-            "paragraph": "Controls the starting noise used for generation. Disable “Random Seed” to produce identical results with the same generation settings."
+            "paragraphs": [
+                "Controls the starting noise used for generation.",
+                "Disable “Random Seed” to produce identical results with the same generation settings."
+            ]
         },
         "paramSteps": {
             "heading": "Steps",
-            "paragraph": "Number of steps that will be performed in each generation. Higher step counts will typically create better images but will require more generation time."
+            "paragraphs": [
+                "Number of steps that will be performed in each generation.",
+                "Higher step counts will typically create better images but will require more generation time."
+            ]
         },
         "paramVAE": {
             "heading": "VAE",
-            "paragraph": "Model used for translating AI output into the final image."
+            "paragraphs": [
+                "Model used for translating AI output into the final image."
+            ]
         },
         "paramVAEPrecision": {
             "heading": "VAE Precision",
-            "paragraph": "The precision used during VAE encoding and decoding. Fp16/Half precision is more efficient, at the expense of minor image variations."
+            "paragraphs": [
+                "The precision used during VAE encoding and decoding. FP16/half precision is more efficient, at the expense of minor image variations."
+            ]
         },
         "scaleBeforeProcessing": {
             "heading": "Scale Before Processing",
-            "paragraph": "Scales the selected area to the size best suited for the model before the image generation process."
+            "paragraphs": [
+                "Scales the selected area to the size best suited for the model before the image generation process."
+            ]
         }
     },
     "ui": {

invokeai/frontend/web/src/app/components/App.tsx

@@ -36,7 +36,8 @@ const App = ({ config = DEFAULT_CONFIG, selectedImage }: Props) => {
 
   const logger = useLogger('system');
   const dispatch = useAppDispatch();
-  const { handlePreselectedImage } = usePreselectedImage();
+  const { handleSendToCanvas, handleSendToImg2Img, handleUseAllMetadata } =
+    usePreselectedImage(selectedImage?.imageName);
   const handleReset = useCallback(() => {
     localStorage.clear();
     location.reload();
@@ -59,8 +60,22 @@ const App = ({ config = DEFAULT_CONFIG, selectedImage }: Props) => {
   }, [dispatch]);
 
   useEffect(() => {
-    handlePreselectedImage(selectedImage);
-  }, [handlePreselectedImage, selectedImage]);
+    if (selectedImage && selectedImage.action === 'sendToCanvas') {
+      handleSendToCanvas();
+    }
+  }, [selectedImage, handleSendToCanvas]);
+
+  useEffect(() => {
+    if (selectedImage && selectedImage.action === 'sendToImg2Img') {
+      handleSendToImg2Img();
+    }
+  }, [selectedImage, handleSendToImg2Img]);
+
+  useEffect(() => {
+    if (selectedImage && selectedImage.action === 'useAllParameters') {
+      handleUseAllMetadata();
+    }
+  }, [selectedImage, handleUseAllMetadata]);
 
   const headerComponent = useStore($headerComponent);
 

invokeai/frontend/web/src/app/components/InvokeAIUI.tsx

@@ -17,7 +17,10 @@ import '../../i18n';
 import AppDndContext from '../../features/dnd/components/AppDndContext';
 import { $customStarUI, CustomStarUi } from 'app/store/nanostores/customStarUI';
 import { $headerComponent } from 'app/store/nanostores/headerComponent';
-import { $queueId, DEFAULT_QUEUE_ID } from 'features/queue/store/nanoStores';
+import {
+  $queueId,
+  DEFAULT_QUEUE_ID,
+} from 'features/queue/store/queueNanoStore';
 
 const App = lazy(() => import('./App'));
 const ThemeLocaleProvider = lazy(() => import('./ThemeLocaleProvider'));

invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/socketio/socketInvocationComplete.ts

@@ -17,7 +17,8 @@ import {
 } from 'services/events/actions';
 import { startAppListening } from '../..';
 
-const nodeDenylist = ['load_image'];
+// These nodes output an image, but do not actually *save* an image, so we don't want to handle the gallery logic on them
+const nodeDenylist = ['load_image', 'image'];
 
 export const addInvocationCompleteEventListener = () => {
   startAppListening({
@@ -37,6 +38,7 @@ export const addInvocationCompleteEventListener = () => {
         const { image_name } = result.image;
         const { canvas, gallery } = getState();
 
+        // This populates the `getImageDTO` cache
         const imageDTO = await dispatch(
           imagesApi.endpoints.getImageDTO.initiate(image_name)
         ).unwrap();
@@ -52,54 +54,36 @@ export const addInvocationCompleteEventListener = () => {
         if (!imageDTO.is_intermediate) {
           /**
            * Cache updates for when an image result is received
-           * - *add* to getImageDTO
-           * - IF `autoAddBoardId` is set:
-           *    - THEN add it to the board_id/images
-           * - ELSE (`autoAddBoardId` is not set):
-           *    - THEN add it to the no_board/images
+           * - add it to the no_board/images
            */
 
-          const { autoAddBoardId } = gallery;
-          if (autoAddBoardId && autoAddBoardId !== 'none') {
-            dispatch(
-              imagesApi.endpoints.addImageToBoard.initiate({
-                board_id: autoAddBoardId,
-                imageDTO,
-              })
-            );
-          } else {
-            dispatch(
-              imagesApi.util.updateQueryData(
-                'listImages',
-                {
-                  board_id: 'none',
-                  categories: IMAGE_CATEGORIES,
-                },
-                (draft) => {
-                  imagesAdapter.addOne(draft, imageDTO);
-                }
-              )
-            );
-          }
+          dispatch(
+            imagesApi.util.updateQueryData(
+              'listImages',
+              {
+                board_id: imageDTO.board_id ?? 'none',
+                categories: IMAGE_CATEGORIES,
+              },
+              (draft) => {
+                imagesAdapter.addOne(draft, imageDTO);
+              }
+            )
+          );
 
           dispatch(
             imagesApi.util.invalidateTags([
-              { type: 'BoardImagesTotal', id: autoAddBoardId },
-              { type: 'BoardAssetsTotal', id: autoAddBoardId },
+              { type: 'BoardImagesTotal', id: imageDTO.board_id },
+              { type: 'BoardAssetsTotal', id: imageDTO.board_id },
             ])
           );
 
-          const { selectedBoardId, shouldAutoSwitch } = gallery;
+          const { shouldAutoSwitch } = gallery;
 
           // If auto-switch is enabled, select the new image
           if (shouldAutoSwitch) {
             // if auto-add is enabled, switch the board as the image comes in
-            if (autoAddBoardId && autoAddBoardId !== selectedBoardId) {
-              dispatch(boardIdSelected(autoAddBoardId));
-              dispatch(galleryViewChanged('images'));
-            } else if (!autoAddBoardId) {
-              dispatch(galleryViewChanged('images'));
-            }
+            dispatch(galleryViewChanged('images'));
+            dispatch(boardIdSelected(imageDTO.board_id ?? 'none'));
             dispatch(imageSelected(imageDTO));
           }
         }

invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/upscaleRequested.ts

@@ -18,11 +18,14 @@ export const addUpscaleRequestedListener = () => {
       const log = logger('session');
 
       const { image_name } = action.payload;
-      const { esrganModelName } = getState().postprocessing;
+      const state = getState();
+      const { esrganModelName } = state.postprocessing;
+      const { autoAddBoardId } = state.gallery;
 
       const graph = buildAdHocUpscaleGraph({
         image_name,
         esrganModelName,
+        autoAddBoardId,
       });
 
       try {

invokeai/frontend/web/src/app/types/invokeai.ts

@@ -21,7 +21,8 @@ export type AppFeature =
   | 'multiselect'
   | 'pauseQueue'
   | 'resumeQueue'
-  | 'prependQueue';
+  | 'prependQueue'
+  | 'invocationCache';
 
 /**
  * A disable-able Stable Diffusion feature

invokeai/frontend/web/src/common/components/IAIImageFallback.tsx

@@ -81,3 +81,38 @@ export const IAINoContentFallback = (props: IAINoImageFallbackProps) => {
     </Flex>
   );
 };
+
+type IAINoImageFallbackWithSpinnerProps = FlexProps & {
+  label?: string;
+};
+
+export const IAINoContentFallbackWithSpinner = (
+  props: IAINoImageFallbackWithSpinnerProps
+) => {
+  const { sx, ...rest } = props;
+
+  return (
+    <Flex
+      sx={{
+        w: 'full',
+        h: 'full',
+        alignItems: 'center',
+        justifyContent: 'center',
+        borderRadius: 'base',
+        flexDir: 'column',
+        gap: 2,
+        userSelect: 'none',
+        opacity: 0.7,
+        color: 'base.700',
+        _dark: {
+          color: 'base.500',
+        },
+        ...sx,
+      }}
+      {...rest}
+    >
+      <Spinner size="xl" />
+      {props.label && <Text textAlign="center">{props.label}</Text>}
+    </Flex>
+  );
+};

invokeai/frontend/web/src/common/components/IAIInformationalPopover.tsx

@@ -1,124 +0,0 @@
-import {
-  Box,
-  Button,
-  Divider,
-  Flex,
-  Heading,
-  Image,
-  Popover,
-  PopoverArrow,
-  PopoverBody,
-  PopoverCloseButton,
-  PopoverContent,
-  PopoverProps,
-  PopoverTrigger,
-  Portal,
-  Text,
-} from '@chakra-ui/react';
-import { ReactNode, memo } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useAppSelector } from '../../app/store/storeHooks';
-
-const OPEN_DELAY = 1500;
-
-type Props = Omit<PopoverProps, 'children'> & {
-  details: string;
-  children: ReactNode;
-  image?: string;
-  buttonLabel?: string;
-  buttonHref?: string;
-  placement?: PopoverProps['placement'];
-};
-
-const IAIInformationalPopover = ({
-  details,
-  image,
-  buttonLabel,
-  buttonHref,
-  children,
-  placement,
-}: Props) => {
-  const shouldEnableInformationalPopovers = useAppSelector(
-    (state) => state.system.shouldEnableInformationalPopovers
-  );
-  const { t } = useTranslation();
-
-  const heading = t(`popovers.${details}.heading`);
-  const paragraph = t(`popovers.${details}.paragraph`);
-
-  if (!shouldEnableInformationalPopovers) {
-    return <>{children}</>;
-  }
-
-  return (
-    <Popover
-      placement={placement || 'top'}
-      closeOnBlur={false}
-      trigger="hover"
-      variant="informational"
-      openDelay={OPEN_DELAY}
-    >
-      <PopoverTrigger>
-        <Box w="full">{children}</Box>
-      </PopoverTrigger>
-      <Portal>
-        <PopoverContent>
-          <PopoverArrow />
-          <PopoverCloseButton />
-
-          <PopoverBody>
-            <Flex
-              sx={{
-                gap: 3,
-                flexDirection: 'column',
-                width: '100%',
-                alignItems: 'center',
-              }}
-            >
-              {image && (
-                <Image
-                  sx={{
-                    objectFit: 'contain',
-                    maxW: '60%',
-                    maxH: '60%',
-                    backgroundColor: 'white',
-                  }}
-                  src={image}
-                  alt="Optional Image"
-                />
-              )}
-              <Flex
-                sx={{
-                  gap: 3,
-                  flexDirection: 'column',
-                  width: '100%',
-                }}
-              >
-                {heading && (
-                  <>
-                    <Heading size="sm">{heading}</Heading>
-                    <Divider />
-                  </>
-                )}
-                <Text>{paragraph}</Text>
-                {buttonLabel && (
-                  <Flex justifyContent="flex-end">
-                    <Button
-                      onClick={() => window.open(buttonHref)}
-                      size="sm"
-                      variant="invokeAIOutline"
-                    >
-                      {buttonLabel}
-                    </Button>
-                  </Flex>
-                )}
-              </Flex>
-            </Flex>
-          </PopoverBody>
-        </PopoverContent>
-      </Portal>
-    </Popover>
-  );
-};
-
-export default memo(IAIInformationalPopover);

invokeai/frontend/web/src/common/components/IAIInformationalPopover/IAIInformationalPopover.tsx

@@ -0,0 +1,155 @@
+import {
+  Box,
+  BoxProps,
+  Button,
+  Divider,
+  Flex,
+  Heading,
+  Image,
+  Popover,
+  PopoverBody,
+  PopoverCloseButton,
+  PopoverContent,
+  PopoverProps,
+  PopoverTrigger,
+  Portal,
+  Text,
+  forwardRef,
+} from '@chakra-ui/react';
+import { merge, omit } from 'lodash-es';
+import { PropsWithChildren, memo, useCallback, useMemo } from 'react';
+import { useTranslation } from 'react-i18next';
+import { FaExternalLinkAlt } from 'react-icons/fa';
+import { useAppSelector } from '../../../app/store/storeHooks';
+import {
+  Feature,
+  OPEN_DELAY,
+  POPOVER_DATA,
+  POPPER_MODIFIERS,
+} from './constants';
+
+type Props = PropsWithChildren & {
+  feature: Feature;
+  wrapperProps?: BoxProps;
+  popoverProps?: PopoverProps;
+};
+
+const IAIInformationalPopover = forwardRef(
+  ({ feature, children, wrapperProps, ...rest }: Props, ref) => {
+    const { t } = useTranslation();
+    const shouldEnableInformationalPopovers = useAppSelector(
+      (state) => state.system.shouldEnableInformationalPopovers
+    );
+
+    const data = useMemo(() => POPOVER_DATA[feature], [feature]);
+
+    const popoverProps = useMemo(
+      () => merge(omit(data, ['image', 'href', 'buttonLabel']), rest),
+      [data, rest]
+    );
+
+    const heading = useMemo<string | undefined>(
+      () => t(`popovers.${feature}.heading`),
+      [feature, t]
+    );
+
+    const paragraphs = useMemo<string[]>(
+      () =>
+        t(`popovers.${feature}.paragraphs`, {
+          returnObjects: true,
+        }) ?? [],
+      [feature, t]
+    );
+
+    const handleClick = useCallback(() => {
+      if (!data?.href) {
+        return;
+      }
+      window.open(data.href);
+    }, [data?.href]);
+
+    if (!shouldEnableInformationalPopovers) {
+      return (
+        <Box ref={ref} w="full" {...wrapperProps}>
+          {children}
+        </Box>
+      );
+    }
+
+    return (
+      <Popover
+        isLazy
+        closeOnBlur={false}
+        trigger="hover"
+        variant="informational"
+        openDelay={OPEN_DELAY}
+        modifiers={POPPER_MODIFIERS}
+        placement="top"
+        {...popoverProps}
+      >
+        <PopoverTrigger>
+          <Box ref={ref} w="full" {...wrapperProps}>
+            {children}
+          </Box>
+        </PopoverTrigger>
+        <Portal>
+          <PopoverContent w={96}>
+            <PopoverCloseButton />
+            <PopoverBody>
+              <Flex
+                sx={{
+                  gap: 2,
+                  flexDirection: 'column',
+                  alignItems: 'flex-start',
+                }}
+              >
+                {heading && (
+                  <>
+                    <Heading size="sm">{heading}</Heading>
+                    <Divider />
+                  </>
+                )}
+                {data?.image && (
+                  <>
+                    <Image
+                      sx={{
+                        objectFit: 'contain',
+                        maxW: '60%',
+                        maxH: '60%',
+                        backgroundColor: 'white',
+                      }}
+                      src={data.image}
+                      alt="Optional Image"
+                    />
+                    <Divider />
+                  </>
+                )}
+                {paragraphs.map((p) => (
+                  <Text key={p}>{p}</Text>
+                ))}
+                {data?.href && (
+                  <>
+                    <Divider />
+                    <Button
+                      pt={1}
+                      onClick={handleClick}
+                      leftIcon={<FaExternalLinkAlt />}
+                      alignSelf="flex-end"
+                      variant="link"
+                    >
+                      {t('common.learnMore') ?? heading}
+                    </Button>
+                  </>
+                )}
+              </Flex>
+            </PopoverBody>
+          </PopoverContent>
+        </Portal>
+      </Popover>
+    );
+  }
+);
+
+IAIInformationalPopover.displayName = 'IAIInformationalPopover';
+
+export default memo(IAIInformationalPopover);

invokeai/frontend/web/src/common/components/IAIInformationalPopover/constants.ts

@@ -0,0 +1,98 @@
+import { PopoverProps } from '@chakra-ui/react';
+
+export type Feature =
+  | 'clipSkip'
+  | 'paramNegativeConditioning'
+  | 'paramPositiveConditioning'
+  | 'paramScheduler'
+  | 'compositingBlur'
+  | 'compositingBlurMethod'
+  | 'compositingCoherencePass'
+  | 'compositingCoherenceMode'
+  | 'compositingCoherenceSteps'
+  | 'compositingStrength'
+  | 'compositingMaskAdjustments'
+  | 'controlNetBeginEnd'
+  | 'controlNetControlMode'
+  | 'controlNetResizeMode'
+  | 'controlNet'
+  | 'controlNetWeight'
+  | 'dynamicPrompts'
+  | 'dynamicPromptsMaxPrompts'
+  | 'dynamicPromptsSeedBehaviour'
+  | 'infillMethod'
+  | 'lora'
+  | 'noiseUseCPU'
+  | 'paramCFGScale'
+  | 'paramDenoisingStrength'
+  | 'paramIterations'
+  | 'paramModel'
+  | 'paramRatio'
+  | 'paramSeed'
+  | 'paramSteps'
+  | 'paramVAE'
+  | 'paramVAEPrecision'
+  | 'scaleBeforeProcessing';
+
+export type PopoverData = PopoverProps & {
+  image?: string;
+  href?: string;
+  buttonLabel?: string;
+};
+
+export const POPOVER_DATA: { [key in Feature]?: PopoverData } = {
+  paramNegativeConditioning: {
+    placement: 'right',
+  },
+  controlNet: {
+    href: 'https://support.invoke.ai/support/solutions/articles/151000105880',
+  },
+  lora: {
+    href: 'https://support.invoke.ai/support/solutions/articles/151000159072',
+  },
+  compositingCoherenceMode: {
+    href: 'https://support.invoke.ai/support/solutions/articles/151000158838',
+  },
+  infillMethod: {
+    href: 'https://support.invoke.ai/support/solutions/articles/151000158841',
+  },
+  scaleBeforeProcessing: {
+    href: 'https://support.invoke.ai/support/solutions/articles/151000158841',
+  },
+  paramIterations: {
+    href: 'https://support.invoke.ai/support/solutions/articles/151000159073',
+  },
+  paramPositiveConditioning: {
+    href: 'https://support.invoke.ai/support/solutions/articles/151000096606-tips-on-crafting-prompts',
+    placement: 'right',
+  },
+  paramScheduler: {
+    placement: 'right',
+    href: 'https://support.invoke.ai/support/solutions/articles/151000159073',
+  },
+  paramModel: {
+    placement: 'right',
+    href: 'https://support.invoke.ai/support/solutions/articles/151000096601-what-is-a-model-which-should-i-use-',
+  },
+  paramRatio: {
+    gutter: 16,
+  },
+  controlNetControlMode: {
+    placement: 'right',
+  },
+  controlNetResizeMode: {
+    placement: 'right',
+  },
+  paramVAE: {
+    placement: 'right',
+  },
+  paramVAEPrecision: {
+    placement: 'right',
+  },
+} as const;
+
+export const OPEN_DELAY = 1000; // in milliseconds
+
+export const POPPER_MODIFIERS: PopoverProps['modifiers'] = [
+  { name: 'preventOverflow', options: { padding: 10 } },
+];

invokeai/frontend/web/src/common/components/IAIMantineMultiSelect.tsx

@@ -44,23 +44,19 @@ const IAIMantineMultiSelect = forwardRef((props: IAIMultiSelectProps, ref) => {
 
   return (
     <Tooltip label={tooltip} placement="top" hasArrow isOpen={true}>
-      <MultiSelect
-        label={
-          label ? (
-            <FormControl ref={ref} isDisabled={disabled}>
-              <FormLabel>{label}</FormLabel>
-            </FormControl>
-          ) : undefined
-        }
-        ref={inputRef}
-        disabled={disabled}
-        onKeyDown={handleKeyDown}
-        onKeyUp={handleKeyUp}
-        searchable={searchable}
-        maxDropdownHeight={300}
-        styles={styles}
-        {...rest}
-      />
+      <FormControl ref={ref} isDisabled={disabled} position="static">
+        {label && <FormLabel>{label}</FormLabel>}
+        <MultiSelect
+          ref={inputRef}
+          disabled={disabled}
+          onKeyDown={handleKeyDown}
+          onKeyUp={handleKeyUp}
+          searchable={searchable}
+          maxDropdownHeight={300}
+          styles={styles}
+          {...rest}
+        />
+      </FormControl>
     </Tooltip>
   );
 });

invokeai/frontend/web/src/common/components/IAIMantineSearchableSelect.tsx

@@ -70,26 +70,22 @@ const IAIMantineSearchableSelect = forwardRef((props: IAISelectProps, ref) => {
 
   return (
     <Tooltip label={tooltip} placement="top" hasArrow>
-      <Select
-        ref={inputRef}
-        label={
-          label ? (
-            <FormControl ref={ref} isDisabled={disabled}>
-              <FormLabel>{label}</FormLabel>
-            </FormControl>
-          ) : undefined
-        }
-        disabled={disabled}
-        searchValue={searchValue}
-        onSearchChange={setSearchValue}
-        onChange={handleChange}
-        onKeyDown={handleKeyDown}
-        onKeyUp={handleKeyUp}
-        searchable={searchable}
-        maxDropdownHeight={300}
-        styles={styles}
-        {...rest}
-      />
+      <FormControl ref={ref} isDisabled={disabled} position="static">
+        {label && <FormLabel>{label}</FormLabel>}
+        <Select
+          ref={inputRef}
+          disabled={disabled}
+          searchValue={searchValue}
+          onSearchChange={setSearchValue}
+          onChange={handleChange}
+          onKeyDown={handleKeyDown}
+          onKeyUp={handleKeyUp}
+          searchable={searchable}
+          maxDropdownHeight={300}
+          styles={styles}
+          {...rest}
+        />
+      </FormControl>
     </Tooltip>
   );
 });

invokeai/frontend/web/src/common/components/IAIMantineSelect.tsx

@@ -22,19 +22,15 @@ const IAIMantineSelect = forwardRef((props: IAISelectProps, ref) => {
 
   return (
     <Tooltip label={tooltip} placement="top" hasArrow>
-      <Select
-        label={
-          label ? (
-            <FormControl ref={ref} isRequired={required} isDisabled={disabled}>
-              <FormLabel>{label}</FormLabel>
-            </FormControl>
-          ) : undefined
-        }
-        disabled={disabled}
-        ref={inputRef}
-        styles={styles}
-        {...rest}
-      />
+      <FormControl
+        ref={ref}
+        isRequired={required}
+        isDisabled={disabled}
+        position="static"
+      >
+        <FormLabel>{label}</FormLabel>
+        <Select disabled={disabled} ref={inputRef} styles={styles} {...rest} />
+      </FormControl>
     </Tooltip>
   );
 });

invokeai/frontend/web/src/features/controlNet/components/ControlNetProcessorComponent.tsx

@@ -1,6 +1,7 @@
 import { memo } from 'react';
 import { ControlNetConfig } from '../store/controlNetSlice';
 import CannyProcessor from './processors/CannyProcessor';
+import ColorMapProcessor from './processors/ColorMapProcessor';
 import ContentShuffleProcessor from './processors/ContentShuffleProcessor';
 import HedProcessor from './processors/HedProcessor';
 import LineartAnimeProcessor from './processors/LineartAnimeProcessor';
@@ -30,6 +31,16 @@ const ControlNetProcessorComponent = (props: ControlNetProcessorProps) => {
     );
   }
 
+  if (processorNode.type === 'color_map_image_processor') {
+    return (
+      <ColorMapProcessor
+        controlNetId={controlNetId}
+        processorNode={processorNode}
+        isEnabled={isEnabled}
+      />
+    );
+  }
+
   if (processorNode.type === 'hed_image_processor') {
     return (
       <HedProcessor

invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetBeginEnd.tsx

@@ -10,7 +10,7 @@ import {
   Tooltip,
 } from '@chakra-ui/react';
 import { useAppDispatch } from 'app/store/storeHooks';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import {
   ControlNetConfig,
   controlNetBeginStepPctChanged,
@@ -50,7 +50,7 @@ const ParamControlNetBeginEnd = (props: Props) => {
   );
 
   return (
-    <IAIInformationalPopover details="controlNetBeginEnd">
+    <IAIInformationalPopover feature="controlNetBeginEnd">
       <FormControl isDisabled={!isEnabled}>
         <FormLabel>{t('controlnet.beginEndStepPercent')}</FormLabel>
         <HStack w="100%" gap={2} alignItems="center">

invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetControlMode.tsx

@@ -1,5 +1,5 @@
 import { useAppDispatch } from 'app/store/storeHooks';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import IAIMantineSelect from 'common/components/IAIMantineSelect';
 import {
   ControlModes,
@@ -35,7 +35,7 @@ export default function ParamControlNetControlMode(
   );
 
   return (
-    <IAIInformationalPopover details="controlNetControlMode">
+    <IAIInformationalPopover feature="controlNetControlMode">
       <IAIMantineSelect
         disabled={!isEnabled}
         label={t('controlnet.controlMode')}

invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetFeatureToggle.tsx

@@ -3,7 +3,7 @@ import { createSelector } from '@reduxjs/toolkit';
 import { stateSelector } from 'app/store/store';
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
 import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import IAISwitch from 'common/components/IAISwitch';
 import { isControlNetEnabledToggled } from 'features/controlNet/store/controlNetSlice';
 import { memo, useCallback } from 'react';
@@ -28,7 +28,7 @@ const ParamControlNetFeatureToggle = () => {
 
   return (
     <Box width="100%">
-      <IAIInformationalPopover details="controlNetToggle">
+      <IAIInformationalPopover feature="controlNet">
         <IAISwitch
           label="Enable ControlNet"
           isChecked={isEnabled}

invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetResizeMode.tsx

@@ -1,5 +1,5 @@
 import { useAppDispatch } from 'app/store/storeHooks';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import IAIMantineSelect from 'common/components/IAIMantineSelect';
 import {
   ControlNetConfig,
@@ -34,7 +34,7 @@ export default function ParamControlNetResizeMode(
   );
 
   return (
-    <IAIInformationalPopover details="controlNetResizeMode">
+    <IAIInformationalPopover feature="controlNetResizeMode">
       <IAIMantineSelect
         disabled={!isEnabled}
         label={t('controlnet.resizeMode')}

invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetWeight.tsx

@@ -1,5 +1,5 @@
 import { useAppDispatch } from 'app/store/storeHooks';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import IAISlider from 'common/components/IAISlider';
 import {
   ControlNetConfig,
@@ -24,7 +24,7 @@ const ParamControlNetWeight = (props: ParamControlNetWeightProps) => {
   );
 
   return (
-    <IAIInformationalPopover details="controlNetWeight">
+    <IAIInformationalPopover feature="controlNetWeight">
       <IAISlider
         isDisabled={!isEnabled}
         label={t('controlnet.weight')}

invokeai/frontend/web/src/features/controlNet/components/processors/ColorMapProcessor.tsx

@@ -0,0 +1,59 @@
+import IAISlider from 'common/components/IAISlider';
+import { CONTROLNET_PROCESSORS } from 'features/controlNet/store/constants';
+import { RequiredColorMapImageProcessorInvocation } from 'features/controlNet/store/types';
+import { memo, useCallback } from 'react';
+import { useTranslation } from 'react-i18next';
+import { useProcessorNodeChanged } from '../hooks/useProcessorNodeChanged';
+import ProcessorWrapper from './common/ProcessorWrapper';
+
+const DEFAULTS = CONTROLNET_PROCESSORS.color_map_image_processor
+  .default as RequiredColorMapImageProcessorInvocation;
+
+type ColorMapProcessorProps = {
+  controlNetId: string;
+  processorNode: RequiredColorMapImageProcessorInvocation;
+  isEnabled: boolean;
+};
+
+const ColorMapProcessor = (props: ColorMapProcessorProps) => {
+  const { controlNetId, processorNode, isEnabled } = props;
+  const { color_map_tile_size } = processorNode;
+  const processorChanged = useProcessorNodeChanged();
+  const { t } = useTranslation();
+
+  const handleColorMapTileSizeChanged = useCallback(
+    (v: number) => {
+      processorChanged(controlNetId, { color_map_tile_size: v });
+    },
+    [controlNetId, processorChanged]
+  );
+
+  const handleColorMapTileSizeReset = useCallback(() => {
+    processorChanged(controlNetId, {
+      color_map_tile_size: DEFAULTS.color_map_tile_size,
+    });
+  }, [controlNetId, processorChanged]);
+
+  return (
+    <ProcessorWrapper>
+      <IAISlider
+        isDisabled={!isEnabled}
+        label={t('controlnet.colorMapTileSize')}
+        value={color_map_tile_size}
+        onChange={handleColorMapTileSizeChanged}
+        handleReset={handleColorMapTileSizeReset}
+        withReset
+        min={1}
+        max={256}
+        step={1}
+        withInput
+        withSliderMarks
+        sliderNumberInputProps={{
+          max: 4096,
+        }}
+      />
+    </ProcessorWrapper>
+  );
+};
+
+export default memo(ColorMapProcessor);

invokeai/frontend/web/src/features/controlNet/components/processors/common/ProcessorWrapper.tsx

@@ -4,5 +4,9 @@ import { PropsWithChildren } from 'react';
 type Props = PropsWithChildren;
 
 export default function ProcessorWrapper(props: Props) {
-  return <Flex sx={{ flexDirection: 'column', gap: 2 }}>{props.children}</Flex>;
+  return (
+    <Flex sx={{ flexDirection: 'column', gap: 2, pb: 2 }}>
+      {props.children}
+    </Flex>
+  );
 }

invokeai/frontend/web/src/features/controlNet/store/constants.ts

@@ -1,8 +1,8 @@
+import i18n from 'i18next';
 import {
   ControlNetProcessorType,
   RequiredControlNetProcessorNode,
 } from './types';
-import i18n from 'i18next';
 
 type ControlNetProcessorsDict = Record<
   ControlNetProcessorType,
@@ -50,6 +50,20 @@ export const CONTROLNET_PROCESSORS: ControlNetProcessorsDict = {
       high_threshold: 200,
     },
   },
+  color_map_image_processor: {
+    type: 'color_map_image_processor',
+    get label() {
+      return i18n.t('controlnet.colorMap');
+    },
+    get description() {
+      return i18n.t('controlnet.colorMapDescription');
+    },
+    default: {
+      id: 'color_map_image_processor',
+      type: 'color_map_image_processor',
+      color_map_tile_size: 64,
+    },
+  },
   content_shuffle_image_processor: {
     type: 'content_shuffle_image_processor',
     get label() {
@@ -240,4 +254,5 @@ export const CONTROLNET_MODEL_DEFAULT_PROCESSORS: {
   mediapipe: 'mediapipe_face_processor',
   pidi: 'pidi_image_processor',
   zoe: 'zoe_depth_image_processor',
+  color: 'color_map_image_processor',
 };

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

@@ -1,6 +1,7 @@
 import { isObject } from 'lodash-es';
 import {
   CannyImageProcessorInvocation,
+  ColorMapImageProcessorInvocation,
   ContentShuffleImageProcessorInvocation,
   HedImageProcessorInvocation,
   LineartAnimeImageProcessorInvocation,
@@ -20,6 +21,7 @@ import { O } from 'ts-toolbelt';
  */
 export type ControlNetProcessorNode =
   | CannyImageProcessorInvocation
+  | ColorMapImageProcessorInvocation
   | ContentShuffleImageProcessorInvocation
   | HedImageProcessorInvocation
   | LineartAnimeImageProcessorInvocation
@@ -47,6 +49,14 @@ export type RequiredCannyImageProcessorInvocation = O.Required<
   'type' | 'low_threshold' | 'high_threshold'
 >;
 
+/**
+ * The Color Map processor node, with parameters flagged as required
+ */
+export type RequiredColorMapImageProcessorInvocation = O.Required<
+  ColorMapImageProcessorInvocation,
+  'type' | 'color_map_tile_size'
+>;
+
 /**
  * The ContentShuffle processor node, with parameters flagged as required
  */
@@ -140,6 +150,7 @@ export type RequiredZoeDepthImageProcessorInvocation = O.Required<
  */
 export type RequiredControlNetProcessorNode = O.Required<
   | RequiredCannyImageProcessorInvocation
+  | RequiredColorMapImageProcessorInvocation
   | RequiredContentShuffleImageProcessorInvocation
   | RequiredHedImageProcessorInvocation
   | RequiredLineartAnimeImageProcessorInvocation
@@ -166,6 +177,22 @@ export const isCannyImageProcessorInvocation = (
   return false;
 };
 
+/**
+ * Type guard for ColorMapImageProcessorInvocation
+ */
+export const isColorMapImageProcessorInvocation = (
+  obj: unknown
+): obj is ColorMapImageProcessorInvocation => {
+  if (
+    isObject(obj) &&
+    'type' in obj &&
+    obj.type === 'color_map_image_processor'
+  ) {
+    return true;
+  }
+  return false;
+};
+
 /**
  * Type guard for ContentShuffleImageProcessorInvocation
  */

invokeai/frontend/web/src/features/dynamicPrompts/components/ParamDynamicPromptsCollapse.tsx

@@ -43,8 +43,8 @@ const ParamDynamicPromptsCollapse = () => {
       activeLabel={activeLabel}
     >
       <Flex sx={{ gap: 2, flexDir: 'column' }}>
-        <ParamDynamicPromptsSeedBehaviour />
         <ParamDynamicPromptsPreview />
+        <ParamDynamicPromptsSeedBehaviour />
         <ParamDynamicPromptsMaxPrompts />
       </Flex>
     </IAICollapse>

invokeai/frontend/web/src/features/dynamicPrompts/components/ParamDynamicPromptsCombinatorial.tsx

@@ -4,9 +4,8 @@ import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
 import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions';
 import IAISwitch from 'common/components/IAISwitch';
 import { memo, useCallback } from 'react';
-import { combinatorialToggled } from '../store/dynamicPromptsSlice';
 import { useTranslation } from 'react-i18next';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import { combinatorialToggled } from '../store/dynamicPromptsSlice';
 
 const selector = createSelector(
   stateSelector,
@@ -28,13 +27,11 @@ const ParamDynamicPromptsCombinatorial = () => {
   }, [dispatch]);
 
   return (
-    <IAIInformationalPopover details="dynamicPromptsCombinatorial">
-      <IAISwitch
-        label={t('dynamicPrompts.combinatorial')}
-        isChecked={combinatorial}
-        onChange={handleChange}
-      />
-    </IAIInformationalPopover>
+    <IAISwitch
+      label={t('dynamicPrompts.combinatorial')}
+      isChecked={combinatorial}
+      onChange={handleChange}
+    />
   );
 };
 

invokeai/frontend/web/src/features/dynamicPrompts/components/ParamDynamicPromptsMaxPrompts.tsx

@@ -9,6 +9,7 @@ import {
   maxPromptsReset,
 } from '../store/dynamicPromptsSlice';
 import { useTranslation } from 'react-i18next';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 
 const selector = createSelector(
   stateSelector,
@@ -46,19 +47,21 @@ const ParamDynamicPromptsMaxPrompts = () => {
   }, [dispatch]);
 
   return (
-    <IAISlider
-      label={t('dynamicPrompts.maxPrompts')}
-      isDisabled={isDisabled}
-      min={min}
-      max={sliderMax}
-      value={maxPrompts}
-      onChange={handleChange}
-      sliderNumberInputProps={{ max: inputMax }}
-      withSliderMarks
-      withInput
-      withReset
-      handleReset={handleReset}
-    />
+    <IAIInformationalPopover feature="dynamicPromptsMaxPrompts">
+      <IAISlider
+        label={t('dynamicPrompts.maxPrompts')}
+        isDisabled={isDisabled}
+        min={min}
+        max={sliderMax}
+        value={maxPrompts}
+        onChange={handleChange}
+        sliderNumberInputProps={{ max: inputMax }}
+        withSliderMarks
+        withInput
+        withReset
+        handleReset={handleReset}
+      />
+    </IAIInformationalPopover>
   );
 };
 

invokeai/frontend/web/src/features/dynamicPrompts/components/ParamDynamicPromptsPreview.tsx

@@ -13,6 +13,7 @@ import { stateSelector } from 'app/store/store';
 import { useAppSelector } from 'app/store/storeHooks';
 import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions';
 import { IAINoContentFallback } from 'common/components/IAIImageFallback';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import ScrollableContent from 'features/nodes/components/sidePanel/ScrollableContent';
 import { memo } from 'react';
 import { FaCircleExclamation } from 'react-icons/fa6';
@@ -42,58 +43,73 @@ const ParamDynamicPromptsPreview = () => {
 
   if (isError) {
     return (
-      <Flex
-        w="full"
-        h="full"
-        layerStyle="second"
-        alignItems="center"
-        justifyContent="center"
-        p={8}
-      >
-        <IAINoContentFallback
-          icon={FaCircleExclamation}
-          label="Problem generating prompts"
-        />
-      </Flex>
+      <IAIInformationalPopover feature="dynamicPrompts">
+        <Flex
+          w="full"
+          h="full"
+          layerStyle="second"
+          alignItems="center"
+          justifyContent="center"
+          p={8}
+        >
+          <IAINoContentFallback
+            icon={FaCircleExclamation}
+            label="Problem generating prompts"
+          />
+        </Flex>
+      </IAIInformationalPopover>
     );
   }
 
   return (
-    <FormControl isInvalid={Boolean(parsingError)}>
-      <FormLabel whiteSpace="nowrap" overflow="hidden" textOverflow="ellipsis">
-        Prompts Preview ({prompts.length}){parsingError && ` - ${parsingError}`}
-      </FormLabel>
-      <Flex h={64} pos="relative" layerStyle="third" borderRadius="base" p={2}>
-        <ScrollableContent>
-          <OrderedList stylePosition="inside" ms={0}>
-            {prompts.map((prompt, i) => (
-              <ListItem
-                fontSize="sm"
-                key={`${prompt}.${i}`}
-                sx={listItemStyles}
-              >
-                <Text as="span">{prompt}</Text>
-              </ListItem>
-            ))}
-          </OrderedList>
-        </ScrollableContent>
-        {isLoading && (
-          <Flex
-            pos="absolute"
-            w="full"
-            h="full"
-            top={0}
-            insetInlineStart={0}
-            layerStyle="second"
-            opacity={0.7}
-            alignItems="center"
-            justifyContent="center"
-          >
-            <Spinner />
-          </Flex>
-        )}
-      </Flex>
-    </FormControl>
+    <IAIInformationalPopover feature="dynamicPrompts">
+      <FormControl isInvalid={Boolean(parsingError)}>
+        <FormLabel
+          whiteSpace="nowrap"
+          overflow="hidden"
+          textOverflow="ellipsis"
+        >
+          Prompts Preview ({prompts.length})
+          {parsingError && ` - ${parsingError}`}
+        </FormLabel>
+        <Flex
+          h={64}
+          pos="relative"
+          layerStyle="third"
+          borderRadius="base"
+          p={2}
+        >
+          <ScrollableContent>
+            <OrderedList stylePosition="inside" ms={0}>
+              {prompts.map((prompt, i) => (
+                <ListItem
+                  fontSize="sm"
+                  key={`${prompt}.${i}`}
+                  sx={listItemStyles}
+                >
+                  <Text as="span">{prompt}</Text>
+                </ListItem>
+              ))}
+            </OrderedList>
+          </ScrollableContent>
+          {isLoading && (
+            <Flex
+              pos="absolute"
+              w="full"
+              h="full"
+              top={0}
+              insetInlineStart={0}
+              layerStyle="second"
+              opacity={0.7}
+              alignItems="center"
+              justifyContent="center"
+            >
+              <Spinner />
+            </Flex>
+          )}
+        </Flex>
+      </FormControl>
+    </IAIInformationalPopover>
   );
 };
 

invokeai/frontend/web/src/features/dynamicPrompts/components/ParamDynamicPromptsSeedBehaviour.tsx

@@ -7,6 +7,7 @@ import {
   seedBehaviourChanged,
 } from '../store/dynamicPromptsSlice';
 import IAIMantineSelectItemWithDescription from 'common/components/IAIMantineSelectItemWithDescription';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 
 type Item = {
   label: string;
@@ -47,13 +48,15 @@ const ParamDynamicPromptsSeedBehaviour = () => {
   );
 
   return (
-    <IAIMantineSelect
-      label={t('dynamicPrompts.seedBehaviour.label')}
-      value={seedBehaviour}
-      data={data}
-      itemComponent={IAIMantineSelectItemWithDescription}
-      onChange={handleChange}
-    />
+    <IAIInformationalPopover feature="dynamicPromptsSeedBehaviour">
+      <IAIMantineSelect
+        label={t('dynamicPrompts.seedBehaviour.label')}
+        value={seedBehaviour}
+        data={data}
+        itemComponent={IAIMantineSelectItemWithDescription}
+        onChange={handleChange}
+      />
+    </IAIInformationalPopover>
   );
 };
 

invokeai/frontend/web/src/features/gallery/components/CurrentImage/CurrentImageButtons.tsx

@@ -287,7 +287,7 @@ const CurrentImageButtons = (props: CurrentImageButtonsProps) => {
             icon={<FaSeedling />}
             tooltip={`${t('parameters.useSeed')} (S)`}
             aria-label={`${t('parameters.useSeed')} (S)`}
-            isDisabled={!metadata?.seed}
+            isDisabled={metadata?.seed === null || metadata?.seed === undefined}
             onClick={handleUseSeed}
           />
           <IAIIconButton

invokeai/frontend/web/src/features/lora/components/ParamLora.tsx

@@ -10,7 +10,7 @@ import {
   loraWeightChanged,
   loraWeightReset,
 } from '../store/loraSlice';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 
 type Props = {
   lora: LoRA;
@@ -36,7 +36,7 @@ const ParamLora = (props: Props) => {
   }, [dispatch, lora.id]);
 
   return (
-    <IAIInformationalPopover details="lora">
+    <IAIInformationalPopover feature="lora">
       <Flex sx={{ gap: 2.5, alignItems: 'flex-end' }}>
         <IAISlider
           label={lora.model_name}

invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/InvocationNode.tsx

@@ -8,6 +8,7 @@ import InvocationNodeFooter from './InvocationNodeFooter';
 import InvocationNodeHeader from './InvocationNodeHeader';
 import InputField from './fields/InputField';
 import OutputField from './fields/OutputField';
+import { useWithFooter } from 'features/nodes/hooks/useWithFooter';
 
 type Props = {
   nodeId: string;
@@ -20,6 +21,7 @@ type Props = {
 const InvocationNode = ({ nodeId, isOpen, label, type, selected }: Props) => {
   const inputConnectionFieldNames = useConnectionInputFieldNames(nodeId);
   const inputAnyOrDirectFieldNames = useAnyOrDirectInputFieldNames(nodeId);
+  const withFooter = useWithFooter(nodeId);
   const outputFieldNames = useOutputFieldNames(nodeId);
 
   return (
@@ -41,7 +43,7 @@ const InvocationNode = ({ nodeId, isOpen, label, type, selected }: Props) => {
               h: 'full',
               py: 2,
               gap: 1,
-              borderBottomRadius: 0,
+              borderBottomRadius: withFooter ? 0 : 'base',
             }}
           >
             <Flex sx={{ flexDir: 'column', px: 2, w: 'full', h: 'full' }}>
@@ -74,7 +76,7 @@ const InvocationNode = ({ nodeId, isOpen, label, type, selected }: Props) => {
               ))}
             </Flex>
           </Flex>
-          <InvocationNodeFooter nodeId={nodeId} />
+          {withFooter && <InvocationNodeFooter nodeId={nodeId} />}
         </>
       )}
     </NodeWrapper>

invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/InvocationNodeFooter.tsx

@@ -5,6 +5,7 @@ import EmbedWorkflowCheckbox from './EmbedWorkflowCheckbox';
 import SaveToGalleryCheckbox from './SaveToGalleryCheckbox';
 import UseCacheCheckbox from './UseCacheCheckbox';
 import { useHasImageOutput } from 'features/nodes/hooks/useHasImageOutput';
+import { useFeatureStatus } from '../../../../../system/hooks/useFeatureStatus';
 
 type Props = {
   nodeId: string;
@@ -12,6 +13,7 @@ type Props = {
 
 const InvocationNodeFooter = ({ nodeId }: Props) => {
   const hasImageOutput = useHasImageOutput(nodeId);
+  const isCacheEnabled = useFeatureStatus('invocationCache').isFeatureEnabled;
   return (
     <Flex
       className={DRAG_HANDLE_CLASSNAME}
@@ -25,8 +27,8 @@ const InvocationNodeFooter = ({ nodeId }: Props) => {
         justifyContent: 'space-between',
       }}
     >
+      {isCacheEnabled && <UseCacheCheckbox nodeId={nodeId} />}
       {hasImageOutput && <EmbedWorkflowCheckbox nodeId={nodeId} />}
-      <UseCacheCheckbox nodeId={nodeId} />
       {hasImageOutput && <SaveToGalleryCheckbox nodeId={nodeId} />}
     </Flex>
   );

invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/fields/InputFieldRenderer.tsx

@@ -16,6 +16,7 @@ import SchedulerInputField from './inputs/SchedulerInputField';
 import StringInputField from './inputs/StringInputField';
 import VaeModelInputField from './inputs/VaeModelInputField';
 import IPAdapterModelInputField from './inputs/IPAdapterModelInputField';
+import BoardInputField from './inputs/BoardInputField';
 
 type InputFieldProps = {
   nodeId: string;
@@ -99,6 +100,16 @@ const InputFieldRenderer = ({ nodeId, fieldName }: InputFieldProps) => {
     );
   }
 
+  if (field?.type === 'BoardField' && fieldTemplate?.type === 'BoardField') {
+    return (
+      <BoardInputField
+        nodeId={nodeId}
+        field={field}
+        fieldTemplate={fieldTemplate}
+      />
+    );
+  }
+
   if (
     field?.type === 'MainModelField' &&
     fieldTemplate?.type === 'MainModelField'

invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/fields/inputs/BoardInputField.tsx

@@ -0,0 +1,64 @@
+import { SelectItem } from '@mantine/core';
+import { useAppDispatch } from 'app/store/storeHooks';
+import IAIMantineSearchableSelect from 'common/components/IAIMantineSearchableSelect';
+import { fieldBoardValueChanged } from 'features/nodes/store/nodesSlice';
+import {
+  BoardInputFieldTemplate,
+  BoardInputFieldValue,
+  FieldComponentProps,
+} from 'features/nodes/types/types';
+import { memo, useCallback } from 'react';
+import { useListAllBoardsQuery } from 'services/api/endpoints/boards';
+
+const BoardInputFieldComponent = (
+  props: FieldComponentProps<BoardInputFieldValue, BoardInputFieldTemplate>
+) => {
+  const { nodeId, field } = props;
+  const dispatch = useAppDispatch();
+
+  const { data, hasBoards } = useListAllBoardsQuery(undefined, {
+    selectFromResult: ({ data }) => {
+      const boards: SelectItem[] = [
+        {
+          label: 'None',
+          value: 'none',
+        },
+      ];
+      data?.forEach(({ board_id, board_name }) => {
+        boards.push({
+          label: board_name,
+          value: board_id,
+        });
+      });
+      return {
+        data: boards,
+        hasBoards: boards.length > 1,
+      };
+    },
+  });
+
+  const handleChange = useCallback(
+    (v: string | null) => {
+      dispatch(
+        fieldBoardValueChanged({
+          nodeId,
+          fieldName: field.name,
+          value: v && v !== 'none' ? { board_id: v } : undefined,
+        })
+      );
+    },
+    [dispatch, field.name, nodeId]
+  );
+
+  return (
+    <IAIMantineSearchableSelect
+      className="nowheel nodrag"
+      value={field.value?.board_id ?? 'none'}
+      data={data}
+      onChange={handleChange}
+      disabled={!hasBoards}
+    />
+  );
+};
+
+export default memo(BoardInputFieldComponent);

invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/fields/inputs/SchedulerInputField.tsx

@@ -65,11 +65,6 @@ const SchedulerInputField = (
   return (
     <IAIMantineSearchableSelect
       className="nowheel nodrag"
-      sx={{
-        '.mantine-Select-dropdown': {
-          width: '14rem !important',
-        },
-      }}
       value={field.value}
       data={data}
       onChange={handleChange}

invokeai/frontend/web/src/features/nodes/components/sidePanel/NodeEditorPanelGroup.tsx

@@ -45,6 +45,7 @@ const NodeEditorPanelGroup = () => {
       <PanelGroup
         ref={panelGroupRef}
         id="workflow-panel-group"
+        autoSaveId="workflow-panel-group"
         direction="vertical"
         style={{ height: '100%', width: '100%' }}
         storage={panelStorage}

invokeai/frontend/web/src/features/nodes/hooks/useBuildNodeData.ts

@@ -143,7 +143,7 @@ export const useBuildNodeData = () => {
           notes: '',
           isOpen: true,
           embedWorkflow: false,
-          isIntermediate: true,
+          isIntermediate: type === 'save_image' ? false : true,
           inputs,
           outputs,
           useCache: template.useCache,

invokeai/frontend/web/src/features/nodes/hooks/useHasImageOutput.ts

@@ -17,8 +17,12 @@ export const useHasImageOutput = (nodeId: string) => {
           if (!isInvocationNode(node)) {
             return false;
           }
-          return some(node.data.outputs, (output) =>
-            IMAGE_FIELDS.includes(output.type)
+          return some(
+            node.data.outputs,
+            (output) =>
+              IMAGE_FIELDS.includes(output.type) &&
+              // the image primitive node does not actually save the image, do not show the image-saving checkboxes
+              node.data.type !== 'image'
           );
         },
         defaultSelectorOptions

invokeai/frontend/web/src/features/nodes/hooks/useIsValidConnection.ts

@@ -3,12 +3,7 @@ import graphlib from '@dagrejs/graphlib';
 import { useAppSelector } from 'app/store/storeHooks';
 import { useCallback } from 'react';
 import { Connection, Edge, Node, useReactFlow } from 'reactflow';
-import {
-  COLLECTION_MAP,
-  COLLECTION_TYPES,
-  POLYMORPHIC_TO_SINGLE_MAP,
-  POLYMORPHIC_TYPES,
-} from '../types/constants';
+import { validateSourceAndTargetTypes } from '../store/util/validateSourceAndTargetTypes';
 import { InvocationNodeData } from '../types/types';
 
 /**
@@ -23,11 +18,6 @@ export const useIsValidConnection = () => {
   );
   const isValidConnection = useCallback(
     ({ source, sourceHandle, target, targetHandle }: Connection): boolean => {
-      if (!shouldValidateGraph) {
-        // manual override!
-        return true;
-      }
-
       const edges = flow.getEdges();
       const nodes = flow.getNodes();
       // Connection must have valid targets
@@ -52,6 +42,16 @@ export const useIsValidConnection = () => {
         return false;
       }
 
+      if (source === target) {
+        // Don't allow nodes to connect to themselves, even if validation is disabled
+        return false;
+      }
+
+      if (!shouldValidateGraph) {
+        // manual override!
+        return true;
+      }
+
       if (
         edges
           .filter((edge) => {
@@ -76,60 +76,8 @@ export const useIsValidConnection = () => {
         return false;
       }
 
-      /**
-       * Connection types must be the same for a connection, with exceptions:
-       * - CollectionItem can connect to any non-Collection
-       * - Non-Collections can connect to CollectionItem
-       * - Anything (non-Collections, Collections, Polymorphics) can connect to Polymorphics of the same base type
-       * - Generic Collection can connect to any other Collection or Polymorphic
-       * - Any Collection can connect to a Generic Collection
-       */
-
-      if (sourceType !== targetType) {
-        const isCollectionItemToNonCollection =
-          sourceType === 'CollectionItem' &&
-          !COLLECTION_TYPES.includes(targetType);
-
-        const isNonCollectionToCollectionItem =
-          targetType === 'CollectionItem' &&
-          !COLLECTION_TYPES.includes(sourceType) &&
-          !POLYMORPHIC_TYPES.includes(sourceType);
-
-        const isAnythingToPolymorphicOfSameBaseType =
-          POLYMORPHIC_TYPES.includes(targetType) &&
-          (() => {
-            if (!POLYMORPHIC_TYPES.includes(targetType)) {
-              return false;
-            }
-            const baseType =
-              POLYMORPHIC_TO_SINGLE_MAP[
-                targetType as keyof typeof POLYMORPHIC_TO_SINGLE_MAP
-              ];
-
-            const collectionType =
-              COLLECTION_MAP[baseType as keyof typeof COLLECTION_MAP];
-
-            return sourceType === baseType || sourceType === collectionType;
-          })();
-
-        const isGenericCollectionToAnyCollectionOrPolymorphic =
-          sourceType === 'Collection' &&
-          (COLLECTION_TYPES.includes(targetType) ||
-            POLYMORPHIC_TYPES.includes(targetType));
-
-        const isCollectionToGenericCollection =
-          targetType === 'Collection' && COLLECTION_TYPES.includes(sourceType);
-
-        const isIntToFloat = sourceType === 'integer' && targetType === 'float';
-
-        return (
-          isCollectionItemToNonCollection ||
-          isNonCollectionToCollectionItem ||
-          isAnythingToPolymorphicOfSameBaseType ||
-          isGenericCollectionToAnyCollectionOrPolymorphic ||
-          isCollectionToGenericCollection ||
-          isIntToFloat
-        );
+      if (!validateSourceAndTargetTypes(sourceType, targetType)) {
+        return false;
       }
 
       // Graphs much be acyclic (no loops!)

invokeai/frontend/web/src/features/nodes/hooks/useWithFooter.ts

@@ -1,31 +1,14 @@
-import { createSelector } from '@reduxjs/toolkit';
-import { stateSelector } from 'app/store/store';
-import { useAppSelector } from 'app/store/storeHooks';
-import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions';
-import { some } from 'lodash-es';
+import { useFeatureStatus } from 'features/system/hooks/useFeatureStatus';
 import { useMemo } from 'react';
-import { FOOTER_FIELDS } from '../types/constants';
-import { isInvocationNode } from '../types/types';
+import { useHasImageOutput } from './useHasImageOutput';
 
-export const useHasImageOutputs = (nodeId: string) => {
-  const selector = useMemo(
-    () =>
-      createSelector(
-        stateSelector,
-        ({ nodes }) => {
-          const node = nodes.nodes.find((node) => node.id === nodeId);
-          if (!isInvocationNode(node)) {
-            return false;
-          }
-          return some(node.data.outputs, (output) =>
-            FOOTER_FIELDS.includes(output.type)
-          );
-        },
-        defaultSelectorOptions
-      ),
-    [nodeId]
+export const useWithFooter = (nodeId: string) => {
+  const hasImageOutput = useHasImageOutput(nodeId);
+  const isCacheEnabled = useFeatureStatus('invocationCache').isFeatureEnabled;
+
+  const withFooter = useMemo(
+    () => hasImageOutput || isCacheEnabled,
+    [hasImageOutput, isCacheEnabled]
   );
-
-  const withFooter = useAppSelector(selector);
   return withFooter;
 };

invokeai/frontend/web/src/features/nodes/store/nodesSlice.ts

@@ -1,5 +1,5 @@
 import { createSlice, PayloadAction } from '@reduxjs/toolkit';
-import { cloneDeep, forEach, isEqual, map, uniqBy } from 'lodash-es';
+import { cloneDeep, forEach, isEqual, uniqBy } from 'lodash-es';
 import {
   addEdge,
   applyEdgeChanges,
@@ -19,7 +19,6 @@ import {
   XYPosition,
 } from 'reactflow';
 import { receivedOpenAPISchema } from 'services/api/thunks/schema';
-import { sessionCanceled, sessionInvoked } from 'services/api/thunks/session';
 import { ImageField } from 'services/api/types';
 import {
   appSocketGeneratorProgress,
@@ -31,6 +30,7 @@ import {
 import { v4 as uuidv4 } from 'uuid';
 import { DRAG_HANDLE_CLASSNAME } from '../types/constants';
 import {
+  BoardInputFieldValue,
   BooleanInputFieldValue,
   ColorInputFieldValue,
   ControlNetModelInputFieldValue,
@@ -495,6 +495,12 @@ const nodesSlice = createSlice({
     ) => {
       fieldValueReducer(state, action);
     },
+    fieldBoardValueChanged: (
+      state,
+      action: FieldValueAction<BoardInputFieldValue>
+    ) => {
+      fieldValueReducer(state, action);
+    },
     fieldImageValueChanged: (
       state,
       action: FieldValueAction<ImageInputFieldValue>
@@ -869,26 +875,8 @@ const nodesSlice = createSlice({
         node.progressImage = progress_image ?? null;
       }
     });
-    builder.addCase(sessionInvoked.fulfilled, (state) => {
-      forEach(state.nodeExecutionStates, (nes) => {
-        nes.status = NodeStatus.PENDING;
-        nes.error = null;
-        nes.progress = null;
-        nes.progressImage = null;
-        nes.outputs = [];
-      });
-    });
-    builder.addCase(sessionCanceled.fulfilled, (state) => {
-      map(state.nodeExecutionStates, (nes) => {
-        if (nes.status === NodeStatus.IN_PROGRESS) {
-          nes.status = NodeStatus.PENDING;
-        }
-      });
-    });
     builder.addCase(appSocketQueueItemStatusChanged, (state, action) => {
-      if (
-        ['completed', 'canceled', 'failed'].includes(action.payload.data.status)
-      ) {
+      if (['in_progress'].includes(action.payload.data.status)) {
         forEach(state.nodeExecutionStates, (nes) => {
           nes.status = NodeStatus.PENDING;
           nes.error = null;
@@ -916,6 +904,7 @@ export const {
   imageCollectionFieldValueChanged,
   fieldStringValueChanged,
   fieldNumberValueChanged,
+  fieldBoardValueChanged,
   fieldBooleanValueChanged,
   fieldImageValueChanged,
   fieldColorValueChanged,

invokeai/frontend/web/src/features/nodes/store/util/makeIsConnectionValidSelector.ts

@@ -1,15 +1,10 @@
 import { createSelector } from '@reduxjs/toolkit';
 import { stateSelector } from 'app/store/store';
 import { getIsGraphAcyclic } from 'features/nodes/hooks/useIsValidConnection';
-import {
-  COLLECTION_MAP,
-  COLLECTION_TYPES,
-  POLYMORPHIC_TO_SINGLE_MAP,
-  POLYMORPHIC_TYPES,
-} from 'features/nodes/types/constants';
 import { FieldType } from 'features/nodes/types/types';
-import { HandleType } from 'reactflow';
 import i18n from 'i18next';
+import { HandleType } from 'reactflow';
+import { validateSourceAndTargetTypes } from './validateSourceAndTargetTypes';
 
 /**
  * NOTE: The logic here must be duplicated in `invokeai/frontend/web/src/features/nodes/hooks/useIsValidConnection.ts`
@@ -70,64 +65,8 @@ export const makeConnectionErrorSelector = (
       return i18n.t('nodes.inputMayOnlyHaveOneConnection');
     }
 
-    /**
-     * Connection types must be the same for a connection, with exceptions:
-     * - CollectionItem can connect to any non-Collection
-     * - Non-Collections can connect to CollectionItem
-     * - Anything (non-Collections, Collections, Polymorphics) can connect to Polymorphics of the same base type
-     * - Generic Collection can connect to any other Collection or Polymorphic
-     * - Any Collection can connect to a Generic Collection
-     */
-
-    if (sourceType !== targetType) {
-      const isCollectionItemToNonCollection =
-        sourceType === 'CollectionItem' &&
-        !COLLECTION_TYPES.includes(targetType);
-
-      const isNonCollectionToCollectionItem =
-        targetType === 'CollectionItem' &&
-        !COLLECTION_TYPES.includes(sourceType) &&
-        !POLYMORPHIC_TYPES.includes(sourceType);
-
-      const isAnythingToPolymorphicOfSameBaseType =
-        POLYMORPHIC_TYPES.includes(targetType) &&
-        (() => {
-          if (!POLYMORPHIC_TYPES.includes(targetType)) {
-            return false;
-          }
-          const baseType =
-            POLYMORPHIC_TO_SINGLE_MAP[
-              targetType as keyof typeof POLYMORPHIC_TO_SINGLE_MAP
-            ];
-
-          const collectionType =
-            COLLECTION_MAP[baseType as keyof typeof COLLECTION_MAP];
-
-          return sourceType === baseType || sourceType === collectionType;
-        })();
-
-      const isGenericCollectionToAnyCollectionOrPolymorphic =
-        sourceType === 'Collection' &&
-        (COLLECTION_TYPES.includes(targetType) ||
-          POLYMORPHIC_TYPES.includes(targetType));
-
-      const isCollectionToGenericCollection =
-        targetType === 'Collection' && COLLECTION_TYPES.includes(sourceType);
-
-      const isIntToFloat = sourceType === 'integer' && targetType === 'float';
-
-      if (
-        !(
-          isCollectionItemToNonCollection ||
-          isNonCollectionToCollectionItem ||
-          isAnythingToPolymorphicOfSameBaseType ||
-          isGenericCollectionToAnyCollectionOrPolymorphic ||
-          isCollectionToGenericCollection ||
-          isIntToFloat
-        )
-      ) {
-        return i18n.t('nodes.fieldTypesMustMatch');
-      }
+    if (!validateSourceAndTargetTypes(sourceType, targetType)) {
+      return i18n.t('nodes.fieldTypesMustMatch');
     }
 
     const isGraphAcyclic = getIsGraphAcyclic(

invokeai/frontend/web/src/features/nodes/store/util/validateSourceAndTargetTypes.ts

@@ -0,0 +1,74 @@
+import {
+  COLLECTION_MAP,
+  COLLECTION_TYPES,
+  POLYMORPHIC_TO_SINGLE_MAP,
+  POLYMORPHIC_TYPES,
+} from 'features/nodes/types/constants';
+import { FieldType } from 'features/nodes/types/types';
+
+export const validateSourceAndTargetTypes = (
+  sourceType: FieldType,
+  targetType: FieldType
+) => {
+  if (sourceType === targetType) {
+    return true;
+  }
+
+  /**
+   * Connection types must be the same for a connection, with exceptions:
+   * - CollectionItem can connect to any non-Collection
+   * - Non-Collections can connect to CollectionItem
+   * - Anything (non-Collections, Collections, Polymorphics) can connect to Polymorphics of the same base type
+   * - Generic Collection can connect to any other Collection or Polymorphic
+   * - Any Collection can connect to a Generic Collection
+   */
+
+  const isCollectionItemToNonCollection =
+    sourceType === 'CollectionItem' && !COLLECTION_TYPES.includes(targetType);
+
+  const isNonCollectionToCollectionItem =
+    targetType === 'CollectionItem' &&
+    !COLLECTION_TYPES.includes(sourceType) &&
+    !POLYMORPHIC_TYPES.includes(sourceType);
+
+  const isAnythingToPolymorphicOfSameBaseType =
+    POLYMORPHIC_TYPES.includes(targetType) &&
+    (() => {
+      if (!POLYMORPHIC_TYPES.includes(targetType)) {
+        return false;
+      }
+      const baseType =
+        POLYMORPHIC_TO_SINGLE_MAP[
+          targetType as keyof typeof POLYMORPHIC_TO_SINGLE_MAP
+        ];
+
+      const collectionType =
+        COLLECTION_MAP[baseType as keyof typeof COLLECTION_MAP];
+
+      return sourceType === baseType || sourceType === collectionType;
+    })();
+
+  const isGenericCollectionToAnyCollectionOrPolymorphic =
+    sourceType === 'Collection' &&
+    (COLLECTION_TYPES.includes(targetType) ||
+      POLYMORPHIC_TYPES.includes(targetType));
+
+  const isCollectionToGenericCollection =
+    targetType === 'Collection' && COLLECTION_TYPES.includes(sourceType);
+
+  const isIntToFloat = sourceType === 'integer' && targetType === 'float';
+
+  const isIntOrFloatToString =
+    (sourceType === 'integer' || sourceType === 'float') &&
+    targetType === 'string';
+
+  return (
+    isCollectionItemToNonCollection ||
+    isNonCollectionToCollectionItem ||
+    isAnythingToPolymorphicOfSameBaseType ||
+    isGenericCollectionToAnyCollectionOrPolymorphic ||
+    isCollectionToGenericCollection ||
+    isIntToFloat ||
+    isIntOrFloatToString
+  );
+};

invokeai/frontend/web/src/features/nodes/types/constants.ts

@@ -1,4 +1,9 @@
-import { FieldType, FieldUIConfig } from './types';
+import {
+  FieldType,
+  FieldTypeMap,
+  FieldTypeMapWithNumber,
+  FieldUIConfig,
+} from './types';
 import { t } from 'i18next';
 
 export const HANDLE_TOOLTIP_OPEN_DELAY = 500;
@@ -28,7 +33,7 @@ export const COLLECTION_TYPES: FieldType[] = [
   'ColorCollection',
 ];
 
-export const POLYMORPHIC_TYPES = [
+export const POLYMORPHIC_TYPES: FieldType[] = [
   'IntegerPolymorphic',
   'BooleanPolymorphic',
   'FloatPolymorphic',
@@ -40,7 +45,7 @@ export const POLYMORPHIC_TYPES = [
   'ColorPolymorphic',
 ];
 
-export const MODEL_TYPES = [
+export const MODEL_TYPES: FieldType[] = [
   'IPAdapterModelField',
   'ControlNetModelField',
   'LoRAModelField',
@@ -54,7 +59,7 @@ export const MODEL_TYPES = [
   'ClipField',
 ];
 
-export const COLLECTION_MAP = {
+export const COLLECTION_MAP: FieldTypeMapWithNumber = {
   integer: 'IntegerCollection',
   boolean: 'BooleanCollection',
   number: 'FloatCollection',
@@ -71,7 +76,7 @@ export const isCollectionItemType = (
 ): itemType is keyof typeof COLLECTION_MAP =>
   Boolean(itemType && itemType in COLLECTION_MAP);
 
-export const SINGLE_TO_POLYMORPHIC_MAP = {
+export const SINGLE_TO_POLYMORPHIC_MAP: FieldTypeMapWithNumber = {
   integer: 'IntegerPolymorphic',
   boolean: 'BooleanPolymorphic',
   number: 'FloatPolymorphic',
@@ -84,7 +89,7 @@ export const SINGLE_TO_POLYMORPHIC_MAP = {
   ColorField: 'ColorPolymorphic',
 };
 
-export const POLYMORPHIC_TO_SINGLE_MAP = {
+export const POLYMORPHIC_TO_SINGLE_MAP: FieldTypeMap = {
   IntegerPolymorphic: 'integer',
   BooleanPolymorphic: 'boolean',
   FloatPolymorphic: 'float',
@@ -96,7 +101,7 @@ export const POLYMORPHIC_TO_SINGLE_MAP = {
   ColorPolymorphic: 'ColorField',
 };
 
-export const TYPES_WITH_INPUT_COMPONENTS = [
+export const TYPES_WITH_INPUT_COMPONENTS: FieldType[] = [
   'string',
   'StringPolymorphic',
   'boolean',
@@ -117,6 +122,7 @@ export const TYPES_WITH_INPUT_COMPONENTS = [
   'SDXLMainModelField',
   'Scheduler',
   'IPAdapterModelField',
+  'BoardField',
 ];
 
 export const isPolymorphicItemType = (
@@ -240,6 +246,11 @@ export const FIELDS: Record<FieldType, FieldUIConfig> = {
     description: t('nodes.imageFieldDescription'),
     title: t('nodes.imageField'),
   },
+  BoardField: {
+    color: 'purple.500',
+    description: t('nodes.imageFieldDescription'),
+    title: t('nodes.imageField'),
+  },
   ImagePolymorphic: {
     color: 'purple.500',
     description: t('nodes.imagePolymorphicDescription'),

invokeai/frontend/web/src/features/nodes/types/types.ts

@@ -72,6 +72,7 @@ export type FieldUIConfig = {
 
 // TODO: Get this from the OpenAPI schema? may be tricky...
 export const zFieldType = z.enum([
+  'BoardField',
   'boolean',
   'BooleanCollection',
   'BooleanPolymorphic',
@@ -119,6 +120,10 @@ export const zFieldType = z.enum([
 ]);
 
 export type FieldType = z.infer<typeof zFieldType>;
+export type FieldTypeMap = { [key in FieldType]?: FieldType };
+export type FieldTypeMapWithNumber = {
+  [key in FieldType | 'number']?: FieldType;
+};
 
 export const zReservedFieldType = z.enum([
   'WorkflowField',
@@ -187,6 +192,11 @@ export const zImageField = z.object({
 });
 export type ImageField = z.infer<typeof zImageField>;
 
+export const zBoardField = z.object({
+  board_id: z.string().trim().min(1),
+});
+export type BoardField = z.infer<typeof zBoardField>;
+
 export const zLatentsField = z.object({
   latents_name: z.string().trim().min(1),
   seed: z.number().int().optional(),
@@ -494,6 +504,12 @@ export const zImageInputFieldValue = zInputFieldValueBase.extend({
 });
 export type ImageInputFieldValue = z.infer<typeof zImageInputFieldValue>;
 
+export const zBoardInputFieldValue = zInputFieldValueBase.extend({
+  type: z.literal('BoardField'),
+  value: zBoardField.optional(),
+});
+export type BoardInputFieldValue = z.infer<typeof zBoardInputFieldValue>;
+
 export const zImagePolymorphicInputFieldValue = zInputFieldValueBase.extend({
   type: z.literal('ImagePolymorphic'),
   value: zImageField.optional(),
@@ -630,6 +646,7 @@ export type SchedulerInputFieldValue = z.infer<
 >;
 
 export const zInputFieldValue = z.discriminatedUnion('type', [
+  zBoardInputFieldValue,
   zBooleanCollectionInputFieldValue,
   zBooleanInputFieldValue,
   zBooleanPolymorphicInputFieldValue,
@@ -770,6 +787,11 @@ export type BooleanPolymorphicInputFieldTemplate = Omit<
   type: 'BooleanPolymorphic';
 };
 
+export type BoardInputFieldTemplate = InputFieldTemplateBase & {
+  default: BoardField;
+  type: 'BoardField';
+};
+
 export type ImageInputFieldTemplate = InputFieldTemplateBase & {
   default: ImageField;
   type: 'ImageField';
@@ -952,6 +974,7 @@ export type WorkflowInputFieldTemplate = InputFieldTemplateBase & {
  * maximum length, pattern to match, etc).
  */
 export type InputFieldTemplate =
+  | BoardInputFieldTemplate
   | BooleanCollectionInputFieldTemplate
   | BooleanPolymorphicInputFieldTemplate
   | BooleanInputFieldTemplate

invokeai/frontend/web/src/features/nodes/util/fieldTemplateBuilders.ts

@@ -62,6 +62,8 @@ import {
   ConditioningField,
   IPAdapterInputFieldTemplate,
   IPAdapterModelInputFieldTemplate,
+  BoardInputFieldTemplate,
+  InputFieldTemplate,
 } from '../types/types';
 import { ControlField } from 'services/api/types';
 
@@ -450,6 +452,19 @@ const buildIPAdapterModelInputFieldTemplate = ({
   return template;
 };
 
+const buildBoardInputFieldTemplate = ({
+  schemaObject,
+  baseField,
+}: BuildInputFieldArg): BoardInputFieldTemplate => {
+  const template: BoardInputFieldTemplate = {
+    ...baseField,
+    type: 'BoardField',
+    default: schemaObject.default ?? undefined,
+  };
+
+  return template;
+};
+
 const buildImageInputFieldTemplate = ({
   schemaObject,
   baseField,
@@ -851,7 +866,10 @@ export const getFieldType = (
   return;
 };
 
-const TEMPLATE_BUILDER_MAP = {
+const TEMPLATE_BUILDER_MAP: {
+  [key in FieldType]?: (arg: BuildInputFieldArg) => InputFieldTemplate;
+} = {
+  BoardField: buildBoardInputFieldTemplate,
   boolean: buildBooleanInputFieldTemplate,
   BooleanCollection: buildBooleanCollectionInputFieldTemplate,
   BooleanPolymorphic: buildBooleanPolymorphicInputFieldTemplate,
@@ -937,7 +955,13 @@ export const buildInputFieldTemplate = (
     return;
   }
 
-  return TEMPLATE_BUILDER_MAP[fieldType]({
+  const builder = TEMPLATE_BUILDER_MAP[fieldType];
+
+  if (!builder) {
+    return;
+  }
+
+  return builder({
     schemaObject: fieldSchema,
     baseField,
   });

invokeai/frontend/web/src/features/nodes/util/fieldValueBuilders.ts

@@ -1,7 +1,10 @@
-import { InputFieldTemplate, InputFieldValue } from '../types/types';
+import { FieldType, InputFieldTemplate, InputFieldValue } from '../types/types';
 
-const FIELD_VALUE_FALLBACK_MAP = {
+const FIELD_VALUE_FALLBACK_MAP: {
+  [key in FieldType]: InputFieldValue['value'];
+} = {
   enum: '',
+  BoardField: undefined,
   boolean: false,
   BooleanCollection: [],
   BooleanPolymorphic: false,

invokeai/frontend/web/src/features/nodes/util/graphBuilders/addSaveImageNode.ts

@@ -24,12 +24,14 @@ export const addSaveImageNode = (
   const activeTabName = activeTabNameSelector(state);
   const is_intermediate =
     activeTabName === 'unifiedCanvas' ? !state.canvas.shouldAutoSave : false;
+  const { autoAddBoardId } = state.gallery;
 
   const saveImageNode: SaveImageInvocation = {
     id: SAVE_IMAGE,
     type: 'save_image',
     is_intermediate,
     use_cache: false,
+    board: autoAddBoardId === 'none' ? undefined : { board_id: autoAddBoardId },
   };
 
   graph.nodes[SAVE_IMAGE] = saveImageNode;

invokeai/frontend/web/src/features/nodes/util/graphBuilders/buildAdHocUpscaleGraph.ts

@@ -6,15 +6,18 @@ import {
   SaveImageInvocation,
 } from 'services/api/types';
 import { REALESRGAN as ESRGAN, SAVE_IMAGE } from './constants';
+import { BoardId } from 'features/gallery/store/types';
 
 type Arg = {
   image_name: string;
   esrganModelName: ESRGANModelName;
+  autoAddBoardId: BoardId;
 };
 
 export const buildAdHocUpscaleGraph = ({
   image_name,
   esrganModelName,
+  autoAddBoardId,
 }: Arg): Graph => {
   const realesrganNode: ESRGANInvocation = {
     id: ESRGAN,
@@ -28,6 +31,8 @@ export const buildAdHocUpscaleGraph = ({
     id: SAVE_IMAGE,
     type: 'save_image',
     use_cache: false,
+    is_intermediate: false,
+    board: autoAddBoardId === 'none' ? undefined : { board_id: autoAddBoardId },
   };
 
   const graph: NonNullableGraph = {

invokeai/frontend/web/src/features/parameters/components/Parameters/Advanced/ParamClipSkip.tsx

@@ -1,6 +1,6 @@
 import { RootState } from 'app/store/store';
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import IAISlider from 'common/components/IAISlider';
 import { setClipSkip } from 'features/parameters/store/generationSlice';
 import { clipSkipMap } from 'features/parameters/types/constants';
@@ -47,7 +47,7 @@ export default function ParamClipSkip() {
   }
 
   return (
-    <IAIInformationalPopover details="clipSkip">
+    <IAIInformationalPopover feature="clipSkip" placement="top">
       <IAISlider
         label={t('parameters.clipSkip')}
         aria-label={t('parameters.clipSkip')}

invokeai/frontend/web/src/features/parameters/components/Parameters/Canvas/BoundingBox/ParamBoundingBoxSize.tsx

@@ -1,7 +1,8 @@
-import { Box, Flex, Spacer, Text } from '@chakra-ui/react';
+import { Flex, FormControl, FormLabel, Spacer } from '@chakra-ui/react';
 import { createSelector } from '@reduxjs/toolkit';
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
 import IAIIconButton from 'common/components/IAIIconButton';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import { canvasSelector } from 'features/canvas/store/canvasSelectors';
 import { flipBoundingBoxAxes } from 'features/canvas/store/canvasSlice';
 import { generationSelector } from 'features/parameters/store/generationSelectors';
@@ -18,7 +19,6 @@ import ParamAspectRatio, {
 } from '../../Core/ParamAspectRatio';
 import ParamBoundingBoxHeight from './ParamBoundingBoxHeight';
 import ParamBoundingBoxWidth from './ParamBoundingBoxWidth';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
 
 const sizeOptsSelector = createSelector(
   [generationSelector, canvasSelector],
@@ -93,42 +93,29 @@ export default function ParamBoundingBoxSize() {
         },
       }}
     >
-      <Flex alignItems="center" gap={2}>
-        <Box width="full">
-          <IAIInformationalPopover details="paramRatio">
-            <Text
-              sx={{
-                fontSize: 'sm',
-                width: 'full',
-                color: 'base.700',
-                _dark: {
-                  color: 'base.300',
-                },
-              }}
-            >
-              {t('parameters.aspectRatio')}
-            </Text>
-          </IAIInformationalPopover>
-        </Box>
-        <Spacer />
-        <ParamAspectRatio />
-        <IAIIconButton
-          tooltip={t('ui.swapSizes')}
-          aria-label={t('ui.swapSizes')}
-          size="sm"
-          icon={<MdOutlineSwapVert />}
-          fontSize={20}
-          onClick={handleToggleSize}
-        />
-        <IAIIconButton
-          tooltip={t('ui.lockRatio')}
-          aria-label={t('ui.lockRatio')}
-          size="sm"
-          icon={<FaLock />}
-          isChecked={shouldLockAspectRatio}
-          onClick={handleLockRatio}
-        />
-      </Flex>
+      <IAIInformationalPopover feature="paramRatio">
+        <FormControl as={Flex} flexDir="row" alignItems="center" gap={2}>
+          <FormLabel>{t('parameters.aspectRatio')}</FormLabel>
+          <Spacer />
+          <ParamAspectRatio />
+          <IAIIconButton
+            tooltip={t('ui.swapSizes')}
+            aria-label={t('ui.swapSizes')}
+            size="sm"
+            icon={<MdOutlineSwapVert />}
+            fontSize={20}
+            onClick={handleToggleSize}
+          />
+          <IAIIconButton
+            tooltip={t('ui.lockRatio')}
+            aria-label={t('ui.lockRatio')}
+            size="sm"
+            icon={<FaLock />}
+            isChecked={shouldLockAspectRatio}
+            onClick={handleLockRatio}
+          />
+        </FormControl>
+      </IAIInformationalPopover>
       <ParamBoundingBoxWidth />
       <ParamBoundingBoxHeight />
     </Flex>

invokeai/frontend/web/src/features/parameters/components/Parameters/Canvas/Compositing/CoherencePass/ParamCanvasCoherenceMode.tsx

@@ -1,6 +1,6 @@
 import type { RootState } from 'app/store/store';
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import { IAISelectDataType } from 'common/components/IAIMantineSearchableSelect';
 import IAIMantineSelect from 'common/components/IAIMantineSelect';
 import { setCanvasCoherenceMode } from 'features/parameters/store/generationSlice';
@@ -31,7 +31,7 @@ const ParamCanvasCoherenceMode = () => {
   };
 
   return (
-    <IAIInformationalPopover details="compositingCoherenceMode">
+    <IAIInformationalPopover feature="compositingCoherenceMode">
       <IAIMantineSelect
         label={t('parameters.coherenceMode')}
         data={coherenceModeSelectData}

invokeai/frontend/web/src/features/parameters/components/Parameters/Canvas/Compositing/CoherencePass/ParamCanvasCoherenceSteps.tsx

@@ -1,6 +1,6 @@
 import type { RootState } from 'app/store/store';
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import IAISlider from 'common/components/IAISlider';
 import { setCanvasCoherenceSteps } from 'features/parameters/store/generationSlice';
 import { memo } from 'react';
@@ -14,7 +14,7 @@ const ParamCanvasCoherenceSteps = () => {
   const { t } = useTranslation();
 
   return (
-    <IAIInformationalPopover details="compositingCoherenceSteps">
+    <IAIInformationalPopover feature="compositingCoherenceSteps">
       <IAISlider
         label={t('parameters.coherenceSteps')}
         min={1}

invokeai/frontend/web/src/features/parameters/components/Parameters/Canvas/Compositing/CoherencePass/ParamCanvasCoherenceStrength.tsx

@@ -1,6 +1,6 @@
 import type { RootState } from 'app/store/store';
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import IAISlider from 'common/components/IAISlider';
 import { setCanvasCoherenceStrength } from 'features/parameters/store/generationSlice';
 import { memo } from 'react';
@@ -14,7 +14,7 @@ const ParamCanvasCoherenceStrength = () => {
   const { t } = useTranslation();
 
   return (
-    <IAIInformationalPopover details="compositingStrength">
+    <IAIInformationalPopover feature="compositingStrength">
       <IAISlider
         label={t('parameters.coherenceStrength')}
         min={0}

invokeai/frontend/web/src/features/parameters/components/Parameters/Canvas/Compositing/MaskAdjustment/ParamMaskBlur.tsx

@@ -1,6 +1,6 @@
 import type { RootState } from 'app/store/store';
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import IAISlider from 'common/components/IAISlider';
 import { setMaskBlur } from 'features/parameters/store/generationSlice';
 import { useTranslation } from 'react-i18next';
@@ -13,7 +13,7 @@ export default function ParamMaskBlur() {
   const { t } = useTranslation();
 
   return (
-    <IAIInformationalPopover details="compositingBlur">
+    <IAIInformationalPopover feature="compositingBlur">
       <IAISlider
         label={t('parameters.maskBlur')}
         min={0}

invokeai/frontend/web/src/features/parameters/components/Parameters/Canvas/Compositing/MaskAdjustment/ParamMaskBlurMethod.tsx

@@ -2,7 +2,7 @@ import { SelectItem } from '@mantine/core';
 import { RootState } from 'app/store/store';
 
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import IAIMantineSelect from 'common/components/IAIMantineSelect';
 import { setMaskBlurMethod } from 'features/parameters/store/generationSlice';
 import { useTranslation } from 'react-i18next';
@@ -29,7 +29,7 @@ export default function ParamMaskBlurMethod() {
   };
 
   return (
-    <IAIInformationalPopover details="compositingBlurMethod">
+    <IAIInformationalPopover feature="compositingBlurMethod">
       <IAIMantineSelect
         value={maskBlurMethod}
         onChange={handleMaskBlurMethodChange}

invokeai/frontend/web/src/features/parameters/components/Parameters/Canvas/Compositing/ParamCompositingSettingsCollapse.tsx

@@ -15,19 +15,13 @@ const ParamCompositingSettingsCollapse = () => {
   return (
     <IAICollapse label={t('parameters.compositingSettingsHeader')}>
       <Flex sx={{ flexDirection: 'column', gap: 2 }}>
-        <SubParametersWrapper
-          label={t('parameters.coherencePassHeader')}
-          headerInfoPopover="compositingCoherencePass"
-        >
+        <SubParametersWrapper label={t('parameters.coherencePassHeader')}>
           <ParamCanvasCoherenceMode />
           <ParamCanvasCoherenceSteps />
           <ParamCanvasCoherenceStrength />
         </SubParametersWrapper>
         <Divider />
-        <SubParametersWrapper
-          label={t('parameters.maskAdjustmentsHeader')}
-          headerInfoPopover="compositingMaskAdjustments"
-        >
+        <SubParametersWrapper label={t('parameters.maskAdjustmentsHeader')}>
           <ParamMaskBlur />
           <ParamMaskBlurMethod />
         </SubParametersWrapper>

invokeai/frontend/web/src/features/parameters/components/Parameters/Canvas/InfillAndScaling/ParamInfillMethod.tsx

@@ -2,7 +2,7 @@ import { createSelector } from '@reduxjs/toolkit';
 import { stateSelector } from 'app/store/store';
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
 import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import IAIMantineSelect from 'common/components/IAIMantineSelect';
 import { setInfillMethod } from 'features/parameters/store/generationSlice';
 
@@ -40,7 +40,7 @@ const ParamInfillMethod = () => {
   );
 
   return (
-    <IAIInformationalPopover details="infillMethod">
+    <IAIInformationalPopover feature="infillMethod">
       <IAIMantineSelect
         disabled={infill_methods?.length === 0}
         placeholder={isLoading ? 'Loading...' : undefined}

invokeai/frontend/web/src/features/parameters/components/Parameters/Canvas/InfillAndScaling/ParamScaleBeforeProcessing.tsx

@@ -1,7 +1,7 @@
 import { createSelector } from '@reduxjs/toolkit';
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
 import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import IAIMantineSearchableSelect from 'common/components/IAIMantineSearchableSelect';
 import { canvasSelector } from 'features/canvas/store/canvasSelectors';
 import { setBoundingBoxScaleMethod } from 'features/canvas/store/canvasSlice';
@@ -36,7 +36,7 @@ const ParamScaleBeforeProcessing = () => {
   };
 
   return (
-    <IAIInformationalPopover details="scaleBeforeProcessing">
+    <IAIInformationalPopover feature="scaleBeforeProcessing">
       <IAIMantineSearchableSelect
         label={t('parameters.scaleBeforeProcessing')}
         data={BOUNDING_BOX_SCALES_DICT}

invokeai/frontend/web/src/features/parameters/components/Parameters/Core/ParamAspectRatio.tsx

@@ -1,4 +1,4 @@
-import { ButtonGroup, Flex } from '@chakra-ui/react';
+import { ButtonGroup } from '@chakra-ui/react';
 import { RootState } from 'app/store/store';
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
 import IAIButton from 'common/components/IAIButton';
@@ -29,25 +29,23 @@ export default function ParamAspectRatio() {
   const activeTabName = useAppSelector(activeTabNameSelector);
 
   return (
-    <Flex gap={2} flexGrow={1}>
-      <ButtonGroup isAttached>
-        {aspectRatios.map((ratio) => (
-          <IAIButton
-            key={ratio.name}
-            size="sm"
-            isChecked={aspectRatio === ratio.value}
-            isDisabled={
-              activeTabName === 'img2img' ? !shouldFitToWidthHeight : false
-            }
-            onClick={() => {
-              dispatch(setAspectRatio(ratio.value));
-              dispatch(setShouldLockAspectRatio(false));
-            }}
-          >
-            {ratio.name}
-          </IAIButton>
-        ))}
-      </ButtonGroup>
-    </Flex>
+    <ButtonGroup isAttached>
+      {aspectRatios.map((ratio) => (
+        <IAIButton
+          key={ratio.name}
+          size="sm"
+          isChecked={aspectRatio === ratio.value}
+          isDisabled={
+            activeTabName === 'img2img' ? !shouldFitToWidthHeight : false
+          }
+          onClick={() => {
+            dispatch(setAspectRatio(ratio.value));
+            dispatch(setShouldLockAspectRatio(false));
+          }}
+        >
+          {ratio.name}
+        </IAIButton>
+      ))}
+    </ButtonGroup>
   );
 }

invokeai/frontend/web/src/features/parameters/components/Parameters/Core/ParamCFGScale.tsx

@@ -2,7 +2,7 @@ import { createSelector } from '@reduxjs/toolkit';
 import { stateSelector } from 'app/store/store';
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
 import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import IAINumberInput from 'common/components/IAINumberInput';
 import IAISlider from 'common/components/IAISlider';
 import { setCfgScale } from 'features/parameters/store/generationSlice';
@@ -54,7 +54,7 @@ const ParamCFGScale = () => {
   );
 
   return shouldUseSliders ? (
-    <IAIInformationalPopover details="paramCFGScale">
+    <IAIInformationalPopover feature="paramCFGScale">
       <IAISlider
         label={t('parameters.cfgScale')}
         step={shift ? 0.1 : 0.5}
@@ -71,7 +71,7 @@ const ParamCFGScale = () => {
       />
     </IAIInformationalPopover>
   ) : (
-    <IAIInformationalPopover details="paramCFGScale">
+    <IAIInformationalPopover feature="paramCFGScale">
       <IAINumberInput
         label={t('parameters.cfgScale')}
         step={0.5}

invokeai/frontend/web/src/features/parameters/components/Parameters/Core/ParamIterations.tsx

@@ -2,7 +2,7 @@ import { createSelector } from '@reduxjs/toolkit';
 import { stateSelector } from 'app/store/store';
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
 import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import IAINumberInput from 'common/components/IAINumberInput';
 import IAISlider from 'common/components/IAISlider';
 import { setIterations } from 'features/parameters/store/generationSlice';
@@ -61,7 +61,7 @@ const ParamIterations = ({ asSlider }: Props) => {
   }, [dispatch, initial]);
 
   return asSlider || shouldUseSliders ? (
-    <IAIInformationalPopover details="paramIterations">
+    <IAIInformationalPopover feature="paramIterations">
       <IAISlider
         label={t('parameters.iterations')}
         step={step}
@@ -77,7 +77,7 @@ const ParamIterations = ({ asSlider }: Props) => {
       />
     </IAIInformationalPopover>
   ) : (
-    <IAIInformationalPopover details="paramIterations">
+    <IAIInformationalPopover feature="paramIterations">
       <IAINumberInput
         label={t('parameters.iterations')}
         step={step}

invokeai/frontend/web/src/features/parameters/components/Parameters/Core/ParamNegativeConditioning.tsx

@@ -1,7 +1,7 @@
 import { Box, FormControl, useDisclosure } from '@chakra-ui/react';
 import type { RootState } from 'app/store/store';
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import IAITextarea from 'common/components/IAITextarea';
 import AddEmbeddingButton from 'features/embedding/components/AddEmbeddingButton';
 import ParamEmbeddingPopover from 'features/embedding/components/ParamEmbeddingPopover';
@@ -76,15 +76,15 @@ const ParamNegativeConditioning = () => {
   const isEmbeddingEnabled = useFeatureStatus('embedding').isFeatureEnabled;
 
   return (
-    <IAIInformationalPopover
-      placement="right"
-      details="paramNegativeConditioning"
-    >
-      <FormControl>
-        <ParamEmbeddingPopover
-          isOpen={isOpen}
-          onClose={onClose}
-          onSelect={handleSelectEmbedding}
+    <FormControl>
+      <ParamEmbeddingPopover
+        isOpen={isOpen}
+        onClose={onClose}
+        onSelect={handleSelectEmbedding}
+      >
+        <IAIInformationalPopover
+          feature="paramNegativeConditioning"
+          placement="right"
         >
           <IAITextarea
             id="negativePrompt"
@@ -98,20 +98,20 @@ const ParamNegativeConditioning = () => {
             minH={16}
             {...(isEmbeddingEnabled && { onKeyDown: handleKeyDown })}
           />
-        </ParamEmbeddingPopover>
-        {!isOpen && isEmbeddingEnabled && (
-          <Box
-            sx={{
-              position: 'absolute',
-              top: 0,
-              insetInlineEnd: 0,
-            }}
-          >
-            <AddEmbeddingButton onClick={onOpen} />
-          </Box>
-        )}
-      </FormControl>
-    </IAIInformationalPopover>
+        </IAIInformationalPopover>
+      </ParamEmbeddingPopover>
+      {!isOpen && isEmbeddingEnabled && (
+        <Box
+          sx={{
+            position: 'absolute',
+            top: 0,
+            insetInlineEnd: 0,
+          }}
+        >
+          <AddEmbeddingButton onClick={onOpen} />
+        </Box>
+      )}
+    </FormControl>
   );
 };
 

invokeai/frontend/web/src/features/parameters/components/Parameters/Core/ParamPositiveConditioning.tsx

@@ -2,6 +2,7 @@ import { Box, FormControl, useDisclosure } from '@chakra-ui/react';
 import { createSelector } from '@reduxjs/toolkit';
 import { stateSelector } from 'app/store/store';
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import IAITextarea from 'common/components/IAITextarea';
 import AddEmbeddingButton from 'features/embedding/components/AddEmbeddingButton';
 import ParamEmbeddingPopover from 'features/embedding/components/ParamEmbeddingPopover';
@@ -12,7 +13,6 @@ import { flushSync } from 'react-dom';
 import { useHotkeys } from 'react-hotkeys-hook';
 import { useTranslation } from 'react-i18next';
 import { useFeatureStatus } from '../../../../system/hooks/useFeatureStatus';
-import IAIInformationalPopover from '../../../../../common/components/IAIInformationalPopover';
 
 const promptInputSelector = createSelector(
   [stateSelector],
@@ -104,15 +104,15 @@ const ParamPositiveConditioning = () => {
 
   return (
     <Box position="relative">
-      <IAIInformationalPopover
-        placement="right"
-        details="paramPositiveConditioning"
-      >
-        <FormControl>
-          <ParamEmbeddingPopover
-            isOpen={isOpen}
-            onClose={onClose}
-            onSelect={handleSelectEmbedding}
+      <FormControl>
+        <ParamEmbeddingPopover
+          isOpen={isOpen}
+          onClose={onClose}
+          onSelect={handleSelectEmbedding}
+        >
+          <IAIInformationalPopover
+            feature="paramPositiveConditioning"
+            placement="right"
           >
             <IAITextarea
               id="prompt"
@@ -125,9 +125,9 @@ const ParamPositiveConditioning = () => {
               resize="vertical"
               minH={32}
             />
-          </ParamEmbeddingPopover>
-        </FormControl>
-      </IAIInformationalPopover>
+          </IAIInformationalPopover>
+        </ParamEmbeddingPopover>
+      </FormControl>
       {!isOpen && isEmbeddingEnabled && (
         <Box
           sx={{

invokeai/frontend/web/src/features/parameters/components/Parameters/Core/ParamScheduler.tsx

@@ -1,7 +1,7 @@
 import { createSelector } from '@reduxjs/toolkit';
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
 import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import IAIMantineSearchableSelect from 'common/components/IAIMantineSearchableSelect';
 import { generationSelector } from 'features/parameters/store/generationSelectors';
 import { setScheduler } from 'features/parameters/store/generationSlice';
@@ -52,7 +52,7 @@ const ParamScheduler = () => {
   );
 
   return (
-    <IAIInformationalPopover details="paramScheduler">
+    <IAIInformationalPopover feature="paramScheduler">
       <IAIMantineSearchableSelect
         label={t('parameters.scheduler')}
         value={scheduler}

invokeai/frontend/web/src/features/parameters/components/Parameters/Core/ParamSize.tsx

@@ -1,7 +1,9 @@
-import { Box, Flex, Spacer, Text } from '@chakra-ui/react';
+import { Flex, FormControl, FormLabel, Spacer } from '@chakra-ui/react';
 import { createSelector } from '@reduxjs/toolkit';
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
+import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions';
 import IAIIconButton from 'common/components/IAIIconButton';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import { generationSelector } from 'features/parameters/store/generationSelectors';
 import {
   setAspectRatio,
@@ -16,8 +18,6 @@ import { activeTabNameSelector } from '../../../../ui/store/uiSelectors';
 import ParamAspectRatio, { mappedAspectRatios } from './ParamAspectRatio';
 import ParamHeight from './ParamHeight';
 import ParamWidth from './ParamWidth';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
-import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions';
 
 const sizeOptsSelector = createSelector(
   [generationSelector, activeTabNameSelector],
@@ -83,47 +83,35 @@ export default function ParamSize() {
         },
       }}
     >
-      <Flex alignItems="center" gap={2}>
-        <Box width="full">
-          <IAIInformationalPopover details="paramRatio">
-            <Text
-              sx={{
-                fontSize: 'sm',
-                color: 'base.700',
-                _dark: {
-                  color: 'base.300',
-                },
-              }}
-            >
-              {t('parameters.aspectRatio')}
-            </Text>
-          </IAIInformationalPopover>
-        </Box>
-        <Spacer />
-        <ParamAspectRatio />
-        <IAIIconButton
-          tooltip={t('ui.swapSizes')}
-          aria-label={t('ui.swapSizes')}
-          size="sm"
-          icon={<MdOutlineSwapVert />}
-          fontSize={20}
-          isDisabled={
-            activeTabName === 'img2img' ? !shouldFitToWidthHeight : false
-          }
-          onClick={handleToggleSize}
-        />
-        <IAIIconButton
-          tooltip={t('ui.lockRatio')}
-          aria-label={t('ui.lockRatio')}
-          size="sm"
-          icon={<FaLock />}
-          isChecked={shouldLockAspectRatio}
-          isDisabled={
-            activeTabName === 'img2img' ? !shouldFitToWidthHeight : false
-          }
-          onClick={handleLockRatio}
-        />
-      </Flex>
+      <IAIInformationalPopover feature="paramRatio">
+        <FormControl as={Flex} flexDir="row" alignItems="center" gap={2}>
+          <FormLabel>{t('parameters.aspectRatio')}</FormLabel>
+          <Spacer />
+          <ParamAspectRatio />
+          <IAIIconButton
+            tooltip={t('ui.swapSizes')}
+            aria-label={t('ui.swapSizes')}
+            size="sm"
+            icon={<MdOutlineSwapVert />}
+            fontSize={20}
+            isDisabled={
+              activeTabName === 'img2img' ? !shouldFitToWidthHeight : false
+            }
+            onClick={handleToggleSize}
+          />
+          <IAIIconButton
+            tooltip={t('ui.lockRatio')}
+            aria-label={t('ui.lockRatio')}
+            size="sm"
+            icon={<FaLock />}
+            isChecked={shouldLockAspectRatio}
+            isDisabled={
+              activeTabName === 'img2img' ? !shouldFitToWidthHeight : false
+            }
+            onClick={handleLockRatio}
+          />
+        </FormControl>
+      </IAIInformationalPopover>
       <Flex gap={2} alignItems="center">
         <Flex gap={2} flexDirection="column" width="full">
           <ParamWidth

invokeai/frontend/web/src/features/parameters/components/Parameters/Core/ParamSteps.tsx

@@ -2,7 +2,7 @@ import { createSelector } from '@reduxjs/toolkit';
 import { stateSelector } from 'app/store/store';
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
 import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import IAINumberInput from 'common/components/IAINumberInput';
 
 import IAISlider from 'common/components/IAISlider';
@@ -57,7 +57,7 @@ const ParamSteps = () => {
   }, [dispatch]);
 
   return shouldUseSliders ? (
-    <IAIInformationalPopover details="paramSteps">
+    <IAIInformationalPopover feature="paramSteps">
       <IAISlider
         label={t('parameters.steps')}
         min={min}
@@ -73,7 +73,7 @@ const ParamSteps = () => {
       />
     </IAIInformationalPopover>
   ) : (
-    <IAIInformationalPopover details="paramSteps">
+    <IAIInformationalPopover feature="paramSteps">
       <IAINumberInput
         label={t('parameters.steps')}
         min={min}

invokeai/frontend/web/src/features/parameters/components/Parameters/ImageToImage/ImageToImageStrength.tsx

@@ -7,7 +7,7 @@ import { setImg2imgStrength } from 'features/parameters/store/generationSlice';
 import { memo, useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
 import SubParametersWrapper from '../SubParametersWrapper';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 
 const selector = createSelector(
   [stateSelector],
@@ -46,8 +46,8 @@ const ImageToImageStrength = () => {
   }, [dispatch, initial]);
 
   return (
-    <SubParametersWrapper>
-      <IAIInformationalPopover details="paramDenoisingStrength">
+    <IAIInformationalPopover feature="paramDenoisingStrength">
+      <SubParametersWrapper>
         <IAISlider
           label={`${t('parameters.denoisingStrength')}`}
           step={step}
@@ -62,8 +62,8 @@ const ImageToImageStrength = () => {
           withReset
           sliderNumberInputProps={{ max: inputMax }}
         />
-      </IAIInformationalPopover>
-    </SubParametersWrapper>
+      </SubParametersWrapper>
+    </IAIInformationalPopover>
   );
 };
 

invokeai/frontend/web/src/features/parameters/components/Parameters/MainModel/ParamMainModelSelect.tsx

@@ -21,7 +21,7 @@ import {
   useGetOnnxModelsQuery,
 } from 'services/api/endpoints/models';
 import { useFeatureStatus } from '../../../../system/hooks/useFeatureStatus';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 
 const selector = createSelector(
   stateSelector,
@@ -120,7 +120,7 @@ const ParamMainModelSelect = () => {
     />
   ) : (
     <Flex w="100%" alignItems="center" gap={3}>
-      <IAIInformationalPopover details="paramModel" placement="bottom">
+      <IAIInformationalPopover feature="paramModel">
         <IAIMantineSearchableSelect
           tooltip={selectedModel?.description}
           label={t('modelManager.model')}
@@ -136,7 +136,7 @@ const ParamMainModelSelect = () => {
         />
       </IAIInformationalPopover>
       {isSyncModelEnabled && (
-        <Box mt={7}>
+        <Box mt={6}>
           <SyncModelsButton iconMode />
         </Box>
       )}

invokeai/frontend/web/src/features/parameters/components/Parameters/Noise/ParamCpuNoise.tsx

@@ -1,5 +1,5 @@
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
-import IAIInformationalPopover from 'common/components/IAIInformationalPopover';
+import IAIInformationalPopover from 'common/components/IAIInformationalPopover/IAIInformationalPopover';
 import IAISwitch from 'common/components/IAISwitch';
 import { shouldUseCpuNoiseChanged } from 'features/parameters/store/generationSlice';
 import { ChangeEvent, useCallback } from 'react';
@@ -20,7 +20,7 @@ export const ParamCpuNoiseToggle = () => {
   );
 
   return (
-    <IAIInformationalPopover details="noiseUseCPU">
+    <IAIInformationalPopover feature="noiseUseCPU">
       <IAISwitch
         label={t('parameters.useCpuNoise')}
         isChecked={shouldUseCpuNoise}