diff --git a/invokeai/frontend/web/src/features/controlLayers/components/SimpleSession/QueueItemPreviewMini.tsx b/invokeai/frontend/web/src/features/controlLayers/components/SimpleSession/QueueItemPreviewMini.tsx
index 9a902b0ab7..ee27ae5f35 100644
--- a/invokeai/frontend/web/src/features/controlLayers/components/SimpleSession/QueueItemPreviewMini.tsx
+++ b/invokeai/frontend/web/src/features/controlLayers/components/SimpleSession/QueueItemPreviewMini.tsx
@@ -62,7 +62,7 @@ export const QueueItemPreviewMini = memo(({ item, isSelected, number }: Props) =
>
{imageDTO && }
- {!imageLoaded && }
+ {!imageLoaded && }
diff --git a/invokeai/frontend/web/src/features/controlLayers/components/SimpleSession/QueueItemProgressImage.tsx b/invokeai/frontend/web/src/features/controlLayers/components/SimpleSession/QueueItemProgressImage.tsx
index 0cf59fd290..e9f934f92b 100644
--- a/invokeai/frontend/web/src/features/controlLayers/components/SimpleSession/QueueItemProgressImage.tsx
+++ b/invokeai/frontend/web/src/features/controlLayers/components/SimpleSession/QueueItemProgressImage.tsx
@@ -3,14 +3,18 @@ import { Flex, Image } from '@invoke-ai/ui-library';
import { useCanvasSessionContext, useProgressData } from 'features/controlLayers/components/SimpleSession/context';
import { memo } from 'react';
-type Props = { itemId: number } & ImageProps;
+type Props = { itemId: number; withBg?: boolean } & ImageProps;
-export const QueueItemProgressImage = memo(({ itemId, ...rest }: Props) => {
+export const QueueItemProgressImage = memo(({ itemId, withBg, ...rest }: Props) => {
const ctx = useCanvasSessionContext();
const { progressImage } = useProgressData(ctx.$progressData, itemId);
if (!progressImage) {
- return ;
+ if (withBg) {
+ return ;
+ } else {
+ return null;
+ }
}
return (
diff --git a/invokeai/frontend/web/src/features/dnd/DndImage.tsx b/invokeai/frontend/web/src/features/dnd/DndImage.tsx
index 9009fe440f..9aed1798b4 100644
--- a/invokeai/frontend/web/src/features/dnd/DndImage.tsx
+++ b/invokeai/frontend/web/src/features/dnd/DndImage.tsx
@@ -77,7 +77,8 @@ export const DndImage = memo(
ref={ref}
src={asThumbnail ? imageDTO.thumbnail_url : imageDTO.image_url}
fallbackSrc={asThumbnail ? undefined : imageDTO.thumbnail_url}
- w={imageDTO.width}
+ width={imageDTO.width}
+ height={imageDTO.height}
sx={sx}
data-is-dragging={isDragging}
{...rest}