mirror of
https://github.com/invoke-ai/InvokeAI
synced 2024-08-30 20:32:17 +00:00
feat(ui): do not change images if the dropped image is the same image
This commit is contained in:
parent
03f3ad435a
commit
a664ee30a2
@ -21,7 +21,7 @@ import { v4 as uuidv4 } from 'uuid';
|
||||
|
||||
type IAIDndImageProps = {
|
||||
image: ImageDTO | null | undefined;
|
||||
onDrop: (image: ImageDTO) => void;
|
||||
onDrop: (droppedImage: ImageDTO) => void;
|
||||
onReset?: () => void;
|
||||
onError?: (event: SyntheticEvent<HTMLImageElement>) => void;
|
||||
onLoad?: (event: SyntheticEvent<HTMLImageElement>) => void;
|
||||
|
@ -36,11 +36,16 @@ const ControlNetImagePreview = (props: Props) => {
|
||||
|
||||
const isMouseOverImage = useHoverDirty(containerRef);
|
||||
|
||||
const handleControlImageChanged = useCallback(
|
||||
(controlImage: ImageDTO) => {
|
||||
dispatch(controlNetImageChanged({ controlNetId, controlImage }));
|
||||
const handleDrop = useCallback(
|
||||
(droppedImage: ImageDTO) => {
|
||||
if (controlImage?.image_name === droppedImage.image_name) {
|
||||
return;
|
||||
}
|
||||
dispatch(
|
||||
controlNetImageChanged({ controlNetId, controlImage: droppedImage })
|
||||
);
|
||||
},
|
||||
[controlNetId, dispatch]
|
||||
[controlImage, controlNetId, dispatch]
|
||||
);
|
||||
|
||||
const shouldShowProcessedImageBackdrop =
|
||||
@ -58,7 +63,7 @@ const ControlNetImagePreview = (props: Props) => {
|
||||
<Box ref={containerRef} sx={{ position: 'relative', w: 'full', h: 'full' }}>
|
||||
<IAIDndImage
|
||||
image={controlImage}
|
||||
onDrop={handleControlImageChanged}
|
||||
onDrop={handleDrop}
|
||||
isDropDisabled={Boolean(
|
||||
processedControlImage && processorType !== 'none'
|
||||
)}
|
||||
@ -108,7 +113,7 @@ const ControlNetImagePreview = (props: Props) => {
|
||||
>
|
||||
<IAIDndImage
|
||||
image={processedControlImage}
|
||||
onDrop={handleControlImageChanged}
|
||||
onDrop={handleDrop}
|
||||
payloadImage={controlImage}
|
||||
/>
|
||||
</Box>
|
||||
|
@ -67,9 +67,12 @@ const CurrentImagePreview = () => {
|
||||
|
||||
const handleDrop = useCallback(
|
||||
(droppedImage: ImageDTO) => {
|
||||
if (droppedImage.image_name === image?.image_name) {
|
||||
return;
|
||||
}
|
||||
dispatch(imageSelected(droppedImage));
|
||||
},
|
||||
[dispatch]
|
||||
[dispatch, image?.image_name]
|
||||
);
|
||||
|
||||
return (
|
||||
|
@ -19,17 +19,21 @@ const ImageInputFieldComponent = (
|
||||
|
||||
const dispatch = useAppDispatch();
|
||||
|
||||
const handleChange = useCallback(
|
||||
(image: ImageDTO) => {
|
||||
const handleDrop = useCallback(
|
||||
(droppedImage: ImageDTO) => {
|
||||
if (field.value?.image_name === droppedImage.image_name) {
|
||||
return;
|
||||
}
|
||||
|
||||
dispatch(
|
||||
fieldValueChanged({
|
||||
nodeId,
|
||||
fieldName: field.name,
|
||||
value: image,
|
||||
value: droppedImage,
|
||||
})
|
||||
);
|
||||
},
|
||||
[dispatch, field.name, nodeId]
|
||||
[dispatch, field.name, field.value?.image_name, nodeId]
|
||||
);
|
||||
|
||||
const handleReset = useCallback(() => {
|
||||
@ -53,7 +57,7 @@ const ImageInputFieldComponent = (
|
||||
>
|
||||
<IAIDndImage
|
||||
image={field.value}
|
||||
onDrop={handleChange}
|
||||
onDrop={handleDrop}
|
||||
onReset={handleReset}
|
||||
resetIconSize="sm"
|
||||
/>
|
||||
|
@ -53,11 +53,14 @@ const InitialImagePreview = () => {
|
||||
}
|
||||
}, [dispatch, t, toaster, shouldFetchImages]);
|
||||
|
||||
const handleChange = useCallback(
|
||||
(image: ImageDTO) => {
|
||||
dispatch(initialImageChanged(image));
|
||||
const handleDrop = useCallback(
|
||||
(droppedImage: ImageDTO) => {
|
||||
if (droppedImage.image_name === initialImage?.image_name) {
|
||||
return;
|
||||
}
|
||||
dispatch(initialImageChanged(droppedImage));
|
||||
},
|
||||
[dispatch]
|
||||
[dispatch, initialImage?.image_name]
|
||||
);
|
||||
|
||||
const handleReset = useCallback(() => {
|
||||
@ -76,7 +79,7 @@ const InitialImagePreview = () => {
|
||||
>
|
||||
<IAIDndImage
|
||||
image={initialImage}
|
||||
onDrop={handleChange}
|
||||
onDrop={handleDrop}
|
||||
onReset={handleReset}
|
||||
fallback={<IAIImageFallback sx={{ bg: 'none' }} />}
|
||||
/>
|
||||
|
Loading…
Reference in New Issue
Block a user