Merge branch 'main' into lstein/enhance/diffusers-0.15

README.md

@@ -148,6 +148,11 @@ not supported.
     pip install InvokeAI --use-pep517 --extra-index-url https://download.pytorch.org/whl/rocm5.4.2
     ```
 
+    _For non-GPU systems:_
+    ```terminal
+    pip install InvokeAI --use-pep517 --extra-index-url https://download.pytorch.org/whl/cpu
+    ``` 
+
     _For Macintoshes, either Intel or M1/M2:_
 
     ```sh

invokeai/app/invocations/latent.py

@@ -171,7 +171,7 @@ class TextToLatentsInvocation(BaseInvocation):
     # TODO: pass this an emitter method or something? or a session for dispatching?
     def dispatch_progress(
         self, context: InvocationContext, intermediate_state: PipelineIntermediateState
-    ) -> None:  
+    ) -> None:
         if (context.services.queue.is_canceled(context.graph_execution_state_id)):
             raise CanceledException
 
@@ -185,7 +185,7 @@ class TextToLatentsInvocation(BaseInvocation):
 
         diffusers_step_callback_adapter(sample, step, steps=self.steps, id=self.id, context=context)
 
-    
+
     def get_model(self, model_manager: ModelManager) -> StableDiffusionGeneratorPipeline:
         model_info = choose_model(model_manager, self.model)
         model_name = model_info['model_name']
@@ -195,7 +195,7 @@ class TextToLatentsInvocation(BaseInvocation):
             model=model,
             scheduler_name=self.scheduler
         )
-        
+
         if isinstance(model, DiffusionPipeline):
             for component in [model.unet, model.vae]:
                 configure_model_padding(component,
@@ -292,57 +292,7 @@ class LatentsToLatentsInvocation(TextToLatentsInvocation):
         initial_latents = latent if self.strength < 1.0 else torch.zeros_like(
             latent, device=model.device, dtype=latent.dtype
         )
-        
-        timesteps, _ = model.get_img2img_timesteps(
-            self.steps,
-            self.strength,
-            device=model.device,
-        )
 
-        result_latents, result_attention_map_saver = model.latents_from_embeddings(
-            latents=initial_latents,
-            timesteps=timesteps,
-            noise=noise,
-            num_inference_steps=self.steps,
-            conditioning_data=conditioning_data,
-            callback=step_callback
-        )
-
-        # https://discuss.huggingface.co/t/memory-usage-by-later-pipeline-stages/23699
-        torch.cuda.empty_cache()
-
-        name = f'{context.graph_execution_state_id}__{self.id}'
-        context.services.latents.set(name, result_latents)
-        return LatentsOutput(
-            latents=LatentsField(latents_name=name)
-        )
-
-
-class LatentsToLatentsInvocation(TextToLatentsInvocation):
-    """Generates latents using latents as base image."""
-
-    type: Literal["l2l"] = "l2l"
-
-    # Inputs
-    latents: Optional[LatentsField] = Field(description="The latents to use as a base image")
-    strength: float = Field(default=0.5, description="The strength of the latents to use")
-
-    def invoke(self, context: InvocationContext) -> LatentsOutput:
-        noise = context.services.latents.get(self.noise.latents_name)
-        latent = context.services.latents.get(self.latents.latents_name)
-
-        def step_callback(state: PipelineIntermediateState):
-            self.dispatch_progress(context, state)
-
-        model = self.get_model(context.services.model_manager)
-        conditioning_data = self.get_conditioning_data(model)
-
-        # TODO: Verify the noise is the right size
-
-        initial_latents = latent if self.strength < 1.0 else torch.zeros_like(
-            latent, device=model.device, dtype=latent.dtype
-        )
-        
         timesteps, _ = model.get_img2img_timesteps(
             self.steps,
             self.strength,

invokeai/app/services/graph.py

@@ -2,7 +2,6 @@
 
 import copy
 import itertools
-import traceback
 import uuid
 from types import NoneType
 from typing import (
@@ -26,7 +25,6 @@ from ..invocations.baseinvocation import (
     BaseInvocationOutput,
     InvocationContext,
 )
-from .invocation_services import InvocationServices
 
 
 class EdgeConnection(BaseModel):
@@ -215,7 +213,7 @@ InvocationOutputsUnion = Union[BaseInvocationOutput.get_all_subclasses_tuple()]
 
 
 class Graph(BaseModel):
-    id: str = Field(description="The id of this graph", default_factory=uuid.uuid4)
+    id: str = Field(description="The id of this graph", default_factory=lambda: uuid.uuid4().__str__())
     # TODO: use a list (and never use dict in a BaseModel) because pydantic/fastapi hates me
     nodes: dict[str, Annotated[InvocationsUnion, Field(discriminator="type")]] = Field(
         description="The nodes in this graph", default_factory=dict
@@ -750,9 +748,7 @@ class Graph(BaseModel):
 class GraphExecutionState(BaseModel):
     """Tracks the state of a graph execution"""
 
-    id: str = Field(
-        description="The id of the execution state", default_factory=uuid.uuid4
-    )
+    id: str = Field(description="The id of the execution state", default_factory=lambda: uuid.uuid4().__str__())
 
     # TODO: Store a reference to the graph instead of the actual graph?
     graph: Graph = Field(description="The graph being executed")
@@ -1171,7 +1167,7 @@ class LibraryGraph(BaseModel):
         if len(v) != len(set(i.alias for i in v)):
             raise ValueError("Duplicate exposed alias")
         return v
-    
+
     @root_validator
     def validate_exposed_nodes(cls, values):
         graph = values['graph']

invokeai/app/services/invocation_queue.py

@@ -1,30 +1,17 @@
 # Copyright (c) 2022 Kyle Schouviller (https://github.com/kyle0654)
 
+import time
 from abc import ABC, abstractmethod
 from queue import Queue
-import time
+
+from pydantic import BaseModel, Field
 
 
-# TODO: make this serializable
-class InvocationQueueItem:
-    # session_id: str
-    graph_execution_state_id: str
-    invocation_id: str
-    invoke_all: bool
-    timestamp: float
-
-    def __init__(
-        self,
-        # session_id: str,
-        graph_execution_state_id: str,
-        invocation_id: str,
-        invoke_all: bool = False,
-    ):
-        # self.session_id = session_id
-        self.graph_execution_state_id = graph_execution_state_id
-        self.invocation_id = invocation_id
-        self.invoke_all = invoke_all
-        self.timestamp = time.time()
+class InvocationQueueItem(BaseModel):
+    graph_execution_state_id: str = Field(description="The ID of the graph execution state")
+    invocation_id: str = Field(description="The ID of the node being invoked")
+    invoke_all: bool = Field(default=False)
+    timestamp: float = Field(default_factory=time.time)
 
 
 class InvocationQueueABC(ABC):

invokeai/backend/stable_diffusion/concepts_lib.py

@@ -57,7 +57,7 @@ class HuggingFaceConceptsLibrary(object):
                 self.concept_list.extend(list(local_concepts_to_add))
                 return self.concept_list
             return self.concept_list
-        else:
+        elif Globals.internet_available is True:
             try:
                 models = self.hf_api.list_models(
                     filter=ModelFilter(model_name="sd-concepts-library/")
@@ -73,6 +73,8 @@ class HuggingFaceConceptsLibrary(object):
                     " ** You may load .bin and .pt file(s) manually using the --embedding_directory argument."
                 )
             return self.concept_list
+        else: 
+            return self.concept_list
 
     def get_concept_model_path(self, concept_name: str) -> str:
         """

invokeai/frontend/web/dist/assets/ThemeLocaleProvider-7791bd91.js

@@ -1,4 +1,4 @@
-import{j as y,cN as Ie,r as _,cO as bt,q as Lr,cP as o,cQ as b,cR as v,cS as S,cT as Vr,cU as ut,cV as vt,cM as ft,cW as mt,n as gt,cX as ht,E as pt}from"./index-f7f41e1f.js";import{d as yt,i as St,T as xt,j as $t,h as kt}from"./storeHooks-eaf47ae3.js";var Or=`
+import{j as y,cO as Ie,r as _,cP as bt,q as Lr,cQ as o,cR as b,cS as v,cT as S,cU as Vr,cV as ut,cW as vt,cN as ft,cX as mt,n as gt,cY as ht,E as pt}from"./index-e53e8108.js";import{d as yt,i as St,T as xt,j as $t,h as kt}from"./storeHooks-5cde7d31.js";var Or=`
   :root {
     --chakra-vh: 100vh;
   }

invokeai/frontend/web/dist/index.html

@@ -12,7 +12,7 @@
         margin: 0;
       }
     </style>
-    <script type="module" crossorigin src="./assets/index-f7f41e1f.js"></script>
+    <script type="module" crossorigin src="./assets/index-e53e8108.js"></script>
     <link rel="stylesheet" href="./assets/index-5483945c.css">
   </head>
 

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

@@ -8,7 +8,6 @@
         "darkTheme": "داكن",
         "lightTheme": "فاتح",
         "greenTheme": "أخضر",
-        "text2img": "نص إلى صورة",
         "img2img": "صورة إلى صورة",
         "unifiedCanvas": "لوحة موحدة",
         "nodes": "عقد",

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

@@ -7,7 +7,6 @@
         "darkTheme": "Dunkel",
         "lightTheme": "Hell",
         "greenTheme": "Grün",
-        "text2img": "Text zu Bild",
         "img2img": "Bild zu Bild",
         "nodes": "Knoten",
         "langGerman": "Deutsch",

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

@@ -505,7 +505,9 @@
         "info": "Info",
         "deleteImage": "Delete Image",
         "initialImage": "Initial Image",
-        "showOptionsPanel": "Show Options Panel"
+        "showOptionsPanel": "Show Options Panel",
+        "hidePreview": "Hide Preview",
+        "showPreview": "Show Preview"
     },
     "settings": {
         "models": "Models",

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

@@ -8,7 +8,6 @@
         "darkTheme": "Oscuro",
         "lightTheme": "Claro",
         "greenTheme": "Verde",
-        "text2img": "Texto a Imagen",
         "img2img": "Imagen a Imagen",
         "unifiedCanvas": "Lienzo Unificado",
         "nodes": "Nodos",
@@ -70,7 +69,11 @@
         "langHebrew": "Hebreo",
         "pinOptionsPanel": "Pin del panel de opciones",
         "loading": "Cargando",
-        "loadingInvokeAI": "Cargando invocar a la IA"
+        "loadingInvokeAI": "Cargando invocar a la IA",
+        "postprocessing": "Tratamiento posterior",
+        "txt2img": "De texto a imagen",
+        "accept": "Aceptar",
+        "cancel": "Cancelar"
     },
     "gallery": {
         "generations": "Generaciones",
@@ -404,7 +407,8 @@
         "none": "ninguno",
         "pickModelType": "Elige el tipo de modelo",
         "v2_768": "v2 (768px)",
-        "addDifference": "Añadir una diferencia"
+        "addDifference": "Añadir una diferencia",
+        "scanForModels": "Buscar modelos"
     },
     "parameters": {
         "images": "Imágenes",
@@ -574,7 +578,7 @@
         "autoSaveToGallery": "Guardar automáticamente en galería",
         "saveBoxRegionOnly": "Guardar solo región dentro de la caja",
         "limitStrokesToBox": "Limitar trazos a la caja",
-        "showCanvasDebugInfo": "Mostrar información de depuración de lienzo",
+        "showCanvasDebugInfo": "Mostrar la información adicional del lienzo",
         "clearCanvasHistory": "Limpiar historial de lienzo",
         "clearHistory": "Limpiar historial",
         "clearCanvasHistoryMessage": "Limpiar el historial de lienzo también restablece completamente el lienzo unificado. Esto incluye todo el historial de deshacer/rehacer, las imágenes en el área de preparación y la capa base del lienzo.",

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

@@ -8,7 +8,6 @@
         "darkTheme": "Sombre",
         "lightTheme": "Clair",
         "greenTheme": "Vert",
-        "text2img": "Texte en image",
         "img2img": "Image en image",
         "unifiedCanvas": "Canvas unifié",
         "nodes": "Nœuds",
@@ -47,7 +46,19 @@
         "statusLoadingModel": "Chargement du modèle",
         "statusModelChanged": "Modèle changé",
         "discordLabel": "Discord",
-        "githubLabel": "Github"
+        "githubLabel": "Github",
+        "accept": "Accepter",
+        "statusMergingModels": "Mélange des modèles",
+        "loadingInvokeAI": "Chargement de Invoke AI",
+        "cancel": "Annuler",
+        "langEnglish": "Anglais",
+        "statusConvertingModel": "Conversion du modèle",
+        "statusModelConverted": "Modèle converti",
+        "loading": "Chargement",
+        "pinOptionsPanel": "Épingler la page d'options",
+        "statusMergedModels": "Modèles mélangés",
+        "txt2img": "Texte vers image",
+        "postprocessing": "Post-Traitement"
     },
     "gallery": {
         "generations": "Générations",
@@ -518,5 +529,15 @@
         "betaDarkenOutside": "Assombrir à l'extérieur",
         "betaLimitToBox": "Limiter à la boîte",
         "betaPreserveMasked": "Conserver masqué"
+    },
+    "accessibility": {
+        "uploadImage": "Charger une image",
+        "reset": "Réinitialiser",
+        "nextImage": "Image suivante",
+        "previousImage": "Image précédente",
+        "useThisParameter": "Utiliser ce paramètre",
+        "zoomIn": "Zoom avant",
+        "zoomOut": "Zoom arrière",
+        "showOptionsPanel": "Montrer la page d'options"
     }
 }

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

@@ -125,7 +125,6 @@
         "langSimplifiedChinese": "סינית",
         "langUkranian": "אוקראינית",
         "langSpanish": "ספרדית",
-        "text2img": "טקסט לתמונה",
         "img2img": "תמונה לתמונה",
         "unifiedCanvas": "קנבס מאוחד",
         "nodes": "צמתים",

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

@@ -8,7 +8,6 @@
         "darkTheme": "Scuro",
         "lightTheme": "Chiaro",
         "greenTheme": "Verde",
-        "text2img": "Testo a Immagine",
         "img2img": "Immagine a Immagine",
         "unifiedCanvas": "Tela unificata",
         "nodes": "Nodi",
@@ -70,7 +69,11 @@
         "loading": "Caricamento in corso",
         "oceanTheme": "Oceano",
         "langHebrew": "Ebraico",
-        "loadingInvokeAI": "Caricamento Invoke AI"
+        "loadingInvokeAI": "Caricamento Invoke AI",
+        "postprocessing": "Post Elaborazione",
+        "txt2img": "Testo a Immagine",
+        "accept": "Accetta",
+        "cancel": "Annulla"
     },
     "gallery": {
         "generations": "Generazioni",
@@ -404,7 +407,8 @@
         "v2_768": "v2 (768px)",
         "none": "niente",
         "addDifference": "Aggiungi differenza",
-        "pickModelType": "Scegli il tipo di modello"
+        "pickModelType": "Scegli il tipo di modello",
+        "scanForModels": "Cerca modelli"
     },
     "parameters": {
         "images": "Immagini",
@@ -574,7 +578,7 @@
         "autoSaveToGallery": "Salvataggio automatico nella Galleria",
         "saveBoxRegionOnly": "Salva solo l'area di selezione",
         "limitStrokesToBox": "Limita i tratti all'area di selezione",
-        "showCanvasDebugInfo": "Mostra informazioni di debug della Tela",
+        "showCanvasDebugInfo": "Mostra ulteriori informazioni sulla Tela",
         "clearCanvasHistory": "Cancella cronologia Tela",
         "clearHistory": "Cancella la cronologia",
         "clearCanvasHistoryMessage": "La cancellazione della cronologia della tela lascia intatta la tela corrente, ma cancella in modo irreversibile la cronologia degli annullamenti e dei ripristini.",
@@ -612,7 +616,7 @@
         "copyMetadataJson": "Copia i metadati JSON",
         "exitViewer": "Esci dal visualizzatore",
         "zoomIn": "Zoom avanti",
-        "zoomOut": "Zoom Indietro",
+        "zoomOut": "Zoom indietro",
         "rotateCounterClockwise": "Ruotare in senso antiorario",
         "rotateClockwise": "Ruotare in senso orario",
         "flipHorizontally": "Capovolgi orizzontalmente",

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

@@ -11,7 +11,6 @@
         "langArabic": "العربية",
         "langEnglish": "English",
         "langDutch": "Nederlands",
-        "text2img": "텍스트->이미지",
         "unifiedCanvas": "통합 캔버스",
         "langFrench": "Français",
         "langGerman": "Deutsch",

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

@@ -8,7 +8,6 @@
         "darkTheme": "Donker",
         "lightTheme": "Licht",
         "greenTheme": "Groen",
-        "text2img": "Tekst naar afbeelding",
         "img2img": "Afbeelding naar afbeelding",
         "unifiedCanvas": "Centraal canvas",
         "nodes": "Knooppunten",

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

@@ -8,7 +8,6 @@
         "darkTheme": "Ciemny",
         "lightTheme": "Jasny",
         "greenTheme": "Zielony",
-        "text2img": "Tekst na obraz",
         "img2img": "Obraz na obraz",
         "unifiedCanvas": "Tryb uniwersalny",
         "nodes": "Węzły",

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

@@ -20,7 +20,6 @@
         "langSpanish": "Espanhol",
         "langRussian": "Русский",
         "langUkranian": "Украї́нська",
-        "text2img": "Texto para Imagem",
         "img2img": "Imagem para Imagem",
         "unifiedCanvas": "Tela Unificada",
         "nodes": "Nós",

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

@@ -8,7 +8,6 @@
         "darkTheme": "Noite",
         "lightTheme": "Dia",
         "greenTheme": "Verde",
-        "text2img": "Texto Para Imagem",
         "img2img": "Imagem Para Imagem",
         "unifiedCanvas": "Tela Unificada",
         "nodes": "Nódulos",

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

@@ -8,7 +8,6 @@
         "darkTheme": "Темная",
         "lightTheme": "Светлая",
         "greenTheme": "Зеленая",
-        "text2img": "Изображение из текста (text2img)",
         "img2img": "Изображение в изображение (img2img)",
         "unifiedCanvas": "Универсальный холст",
         "nodes": "Ноды",

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

@@ -8,7 +8,6 @@
         "darkTheme": "Темна",
         "lightTheme": "Світла",
         "greenTheme": "Зелена",
-        "text2img": "Зображення із тексту (text2img)",
         "img2img": "Зображення із зображення (img2img)",
         "unifiedCanvas": "Універсальне полотно",
         "nodes": "Вузли",

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

@@ -8,7 +8,6 @@
         "darkTheme": "暗色",
         "lightTheme": "亮色",
         "greenTheme": "绿色",
-        "text2img": "文字到图像",
         "img2img": "图像到图像",
         "unifiedCanvas": "统一画布",
         "nodes": "节点",

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

@@ -33,7 +33,6 @@
         "langBrPortuguese": "巴西葡萄牙語",
         "langRussian": "俄語",
         "langSpanish": "西班牙語",
-        "text2img": "文字到圖像",
         "unifiedCanvas": "統一畫布"
     }
 }

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

@@ -505,7 +505,9 @@
         "info": "Info",
         "deleteImage": "Delete Image",
         "initialImage": "Initial Image",
-        "showOptionsPanel": "Show Options Panel"
+        "showOptionsPanel": "Show Options Panel",
+        "hidePreview": "Hide Preview",
+        "showPreview": "Show Preview"
     },
     "settings": {
         "models": "Models",

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

@@ -27,6 +27,7 @@ import {
 } from 'features/ui/store/uiSelectors';
 import {
   setActiveTab,
+  setShouldHidePreview,
   setShouldShowImageDetails,
 } from 'features/ui/store/uiSlice';
 import { useHotkeys } from 'react-hotkeys-hook';
@@ -38,6 +39,8 @@ import {
   FaDownload,
   FaExpand,
   FaExpandArrowsAlt,
+  FaEye,
+  FaEyeSlash,
   FaGrinStars,
   FaQuoteRight,
   FaSeedling,
@@ -75,7 +78,7 @@ const currentImageButtonsSelector = createSelector(
 
     const { isLightboxOpen } = lightbox;
 
-    const { shouldShowImageDetails } = ui;
+    const { shouldShowImageDetails, shouldHidePreview } = ui;
 
     const { intermediateImage, currentImage } = gallery;
 
@@ -91,6 +94,7 @@ const currentImageButtonsSelector = createSelector(
       shouldShowImageDetails,
       activeTabName,
       isLightboxOpen,
+      shouldHidePreview,
     };
   },
   {
@@ -120,6 +124,7 @@ const CurrentImageButtons = (props: CurrentImageButtonsProps) => {
     currentImage,
     isLightboxOpen,
     activeTabName,
+    shouldHidePreview,
   } = useAppSelector(currentImageButtonsSelector);
 
   const toast = useToast();
@@ -188,6 +193,10 @@ const CurrentImageButtons = (props: CurrentImageButtonsProps) => {
     [currentImage]
   );
 
+  const handlePreviewVisibility = () => {
+    dispatch(setShouldHidePreview(!shouldHidePreview));
+  };
+
   const handleClickUseAllParameters = () => {
     if (!currentImage) return;
     currentImage.metadata && dispatch(setAllParameters(currentImage.metadata));
@@ -455,6 +464,21 @@ const CurrentImageButtons = (props: CurrentImageButtonsProps) => {
             </Link>
           </Flex>
         </IAIPopover>
+        <IAIIconButton
+          icon={shouldHidePreview ? <FaEyeSlash /> : <FaEye />}
+          tooltip={
+            !shouldHidePreview
+              ? t('parameters.hidePreview')
+              : t('parameters.showPreview')
+          }
+          aria-label={
+            !shouldHidePreview
+              ? t('parameters.hidePreview')
+              : t('parameters.showPreview')
+          }
+          isChecked={shouldHidePreview}
+          onClick={handlePreviewVisibility}
+        />
         <IAIIconButton
           icon={<FaExpand />}
           tooltip={

invokeai/frontend/web/src/features/gallery/components/CurrentImageHidden.tsx

@@ -0,0 +1,21 @@
+import { Flex } from '@chakra-ui/react';
+import { FaEyeSlash } from 'react-icons/fa';
+
+const CurrentImageHidden = () => {
+  return (
+    <Flex
+      sx={{
+        w: 'full',
+        h: 'full',
+        alignItems: 'center',
+        justifyContent: 'center',
+        position: 'absolute',
+        color: 'base.400',
+      }}
+    >
+      <FaEyeSlash size={'30vh'} />
+    </Flex>
+  );
+};
+
+export default CurrentImageHidden;

invokeai/frontend/web/src/features/gallery/components/CurrentImagePreview.tsx

@@ -10,17 +10,19 @@ import { gallerySelector } from '../store/gallerySelectors';
 import CurrentImageFallback from './CurrentImageFallback';
 import ImageMetadataViewer from './ImageMetaDataViewer/ImageMetadataViewer';
 import NextPrevImageButtons from './NextPrevImageButtons';
+import CurrentImageHidden from './CurrentImageHidden';
 
 export const imagesSelector = createSelector(
   [gallerySelector, uiSelector],
   (gallery: GalleryState, ui) => {
     const { currentImage, intermediateImage } = gallery;
-    const { shouldShowImageDetails } = ui;
+    const { shouldShowImageDetails, shouldHidePreview } = ui;
 
     return {
       imageToDisplay: intermediateImage ? intermediateImage : currentImage,
       isIntermediate: Boolean(intermediateImage),
       shouldShowImageDetails,
+      shouldHidePreview,
     };
   },
   {
@@ -31,8 +33,12 @@ export const imagesSelector = createSelector(
 );
 
 export default function CurrentImagePreview() {
-  const { shouldShowImageDetails, imageToDisplay, isIntermediate } =
-    useAppSelector(imagesSelector);
+  const {
+    shouldShowImageDetails,
+    imageToDisplay,
+    isIntermediate,
+    shouldHidePreview,
+  } = useAppSelector(imagesSelector);
 
   return (
     <Flex
@@ -46,10 +52,16 @@ export default function CurrentImagePreview() {
     >
       {imageToDisplay && (
         <Image
-          src={imageToDisplay.url}
+          src={shouldHidePreview ? undefined : imageToDisplay.url}
           width={imageToDisplay.width}
           height={imageToDisplay.height}
-          fallback={!isIntermediate ? <CurrentImageFallback /> : undefined}
+          fallback={
+            shouldHidePreview ? (
+              <CurrentImageHidden />
+            ) : !isIntermediate ? (
+              <CurrentImageFallback />
+            ) : undefined
+          }
           sx={{
             objectFit: 'contain',
             maxWidth: '100%',

invokeai/frontend/web/src/features/ui/components/tabs/ImageToImage/InitImagePreview.tsx

@@ -2,6 +2,7 @@ import { Flex, Image, Text, useToast } from '@chakra-ui/react';
 import { RootState } from 'app/store';
 import { useAppDispatch, useAppSelector } from 'app/storeHooks';
 import ImageUploaderIconButton from 'common/components/ImageUploaderIconButton';
+import CurrentImageHidden from 'features/gallery/components/CurrentImageHidden';
 import { clearInitialImage } from 'features/parameters/store/generationSlice';
 import { useTranslation } from 'react-i18next';
 
@@ -10,6 +11,8 @@ export default function InitImagePreview() {
     (state: RootState) => state.generation.initialImage
   );
 
+  const { shouldHidePreview } = useAppSelector((state: RootState) => state.ui);
+
   const { t } = useTranslation();
 
   const dispatch = useAppDispatch();
@@ -66,8 +69,13 @@ export default function InitImagePreview() {
               position: 'absolute',
             }}
             src={
-              typeof initialImage === 'string' ? initialImage : initialImage.url
+              shouldHidePreview
+                ? undefined
+                : typeof initialImage === 'string'
+                ? initialImage
+                : initialImage.url
             }
+            fallback={<CurrentImageHidden />}
             onError={alertMissingInitImage}
           />
         </Flex>

invokeai/frontend/web/src/features/ui/store/uiSlice.ts

@@ -16,6 +16,7 @@ const initialtabsState: UIState = {
   addNewModelUIOption: null,
   shouldPinGallery: true,
   shouldShowGallery: true,
+  shouldHidePreview: false,
 };
 
 const initialState: UIState = initialtabsState;
@@ -53,6 +54,9 @@ export const uiSlice = createSlice({
     setShouldUseCanvasBetaLayout: (state, action: PayloadAction<boolean>) => {
       state.shouldUseCanvasBetaLayout = action.payload;
     },
+    setShouldHidePreview: (state, action: PayloadAction<boolean>) => {
+      state.shouldHidePreview = action.payload;
+    },
     setShouldShowExistingModelsInSearch: (
       state,
       action: PayloadAction<boolean>
@@ -106,6 +110,7 @@ export const {
   setShouldShowExistingModelsInSearch,
   setShouldUseSliders,
   setAddNewModelUIOption,
+  setShouldHidePreview,
   setShouldPinGallery,
   setShouldShowGallery,
   togglePanels,

invokeai/frontend/web/src/features/ui/store/uiTypes.ts

@@ -11,6 +11,7 @@ export interface UIState {
   shouldShowExistingModelsInSearch: boolean;
   shouldUseSliders: boolean;
   addNewModelUIOption: AddNewModelType;
+  shouldHidePreview: boolean;
   shouldPinGallery: boolean;
   shouldShowGallery: boolean;
 }