diff --git a/invokeai/frontend/web/src/features/gallery/components/CurrentImageButtons.tsx b/invokeai/frontend/web/src/features/gallery/components/CurrentImageButtons.tsx
index 945e9aee1a..173f0b49c6 100644
--- a/invokeai/frontend/web/src/features/gallery/components/CurrentImageButtons.tsx
+++ b/invokeai/frontend/web/src/features/gallery/components/CurrentImageButtons.tsx
@@ -151,11 +151,17 @@ const CurrentImageButtons = (props: CurrentImageButtonsProps) => {
};
const handleCopyImage = async () => {
- if (!selectedImage) return;
+ if (!selectedImage?.url) {
+ return;
+ }
- const blob = await fetch(getUrl(selectedImage.url)).then((res) =>
- res.blob()
- );
+ const url = getUrl(selectedImage.url);
+
+ if (!url) {
+ return;
+ }
+
+ const blob = await fetch(url).then((res) => res.blob());
const data = [new ClipboardItem({ [blob.type]: blob })];
await navigator.clipboard.write(data);
@@ -175,6 +181,10 @@ const CurrentImageButtons = (props: CurrentImageButtonsProps) => {
: window.location.toString() + selectedImage.url
: '';
+ if (!url) {
+ return;
+ }
+
navigator.clipboard.writeText(url).then(() => {
toast({
title: t('toast.imageLinkCopied'),
@@ -477,7 +487,7 @@ const CurrentImageButtons = (props: CurrentImageButtonsProps) => {
{t('parameters.copyImageToLink')}
-
+
} size="sm" w="100%">
{t('parameters.downloadImage')}
diff --git a/invokeai/frontend/web/src/features/gallery/components/CurrentImageDisplay.tsx b/invokeai/frontend/web/src/features/gallery/components/CurrentImageDisplay.tsx
index 2f249d77f8..f9179ca4e2 100644
--- a/invokeai/frontend/web/src/features/gallery/components/CurrentImageDisplay.tsx
+++ b/invokeai/frontend/web/src/features/gallery/components/CurrentImageDisplay.tsx
@@ -1,6 +1,7 @@
import { Flex, Icon } from '@chakra-ui/react';
import { createSelector } from '@reduxjs/toolkit';
import { useAppSelector } from 'app/storeHooks';
+import { systemSelector } from 'features/system/store/systemSelectors';
import { isEqual } from 'lodash';
import { MdPhoto } from 'react-icons/md';
@@ -12,12 +13,12 @@ import CurrentImageButtons from './CurrentImageButtons';
import CurrentImagePreview from './CurrentImagePreview';
export const currentImageDisplaySelector = createSelector(
- [gallerySelector, selectedImageSelector],
- (gallery, selectedImage) => {
- const { currentImage, intermediateImage } = gallery;
+ [systemSelector, selectedImageSelector],
+ (system, selectedImage) => {
+ const { progressImage } = system;
return {
- hasAnImageToDisplay: selectedImage || intermediateImage,
+ hasAnImageToDisplay: selectedImage || progressImage,
};
},
{