mirror of
https://github.com/invoke-ai/InvokeAI.git
synced 2026-04-23 03:00:31 -04:00
add actions for copying image and opening image in new tab
This commit is contained in:
committed by
Mary Hipp Rogers
parent
7bcbe180df
commit
b1c9f59c30
@@ -1,5 +1,7 @@
|
||||
import { useAppDispatch } from 'app/store/storeHooks';
|
||||
import { useClipboard } from 'common/hooks/useClipboard';
|
||||
import { convertImageUrlToBlob } from 'common/util/convertImageUrlToBlob';
|
||||
import { imageCopiedToClipboard } from 'features/gallery/store/actions';
|
||||
import { toast } from 'features/toast/toast';
|
||||
import { useCallback } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
@@ -7,6 +9,7 @@ import { useTranslation } from 'react-i18next';
|
||||
export const useCopyImageToClipboard = () => {
|
||||
const { t } = useTranslation();
|
||||
const clipboard = useClipboard();
|
||||
const dispatch = useAppDispatch();
|
||||
|
||||
const copyImageToClipboard = useCallback(
|
||||
async (image_url: string) => {
|
||||
@@ -23,6 +26,7 @@ export const useCopyImageToClipboard = () => {
|
||||
title: t('toast.imageCopied'),
|
||||
status: 'success',
|
||||
});
|
||||
dispatch(imageCopiedToClipboard());
|
||||
});
|
||||
} catch (err) {
|
||||
toast({
|
||||
@@ -33,7 +37,7 @@ export const useCopyImageToClipboard = () => {
|
||||
});
|
||||
}
|
||||
},
|
||||
[clipboard, t]
|
||||
[clipboard, t, dispatch]
|
||||
);
|
||||
|
||||
return copyImageToClipboard;
|
||||
|
||||
@@ -1,5 +1,7 @@
|
||||
import { useAppDispatch } from 'app/store/storeHooks';
|
||||
import { IconMenuItem } from 'common/components/IconMenuItem';
|
||||
import { useImageDTOContext } from 'features/gallery/contexts/ImageDTOContext';
|
||||
import { imageOpenedInNewTab } from 'features/gallery/store/actions';
|
||||
import { memo, useCallback } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { PiArrowSquareOutBold } from 'react-icons/pi';
|
||||
@@ -7,9 +9,11 @@ import { PiArrowSquareOutBold } from 'react-icons/pi';
|
||||
export const ImageMenuItemOpenInNewTab = memo(() => {
|
||||
const { t } = useTranslation();
|
||||
const imageDTO = useImageDTOContext();
|
||||
const dispatch = useAppDispatch();
|
||||
const onClick = useCallback(() => {
|
||||
window.open(imageDTO.image_url, '_blank');
|
||||
}, [imageDTO.image_url]);
|
||||
dispatch(imageOpenedInNewTab());
|
||||
}, [imageDTO.image_url, dispatch]);
|
||||
|
||||
return (
|
||||
<IconMenuItem
|
||||
|
||||
@@ -3,3 +3,7 @@ import { createAction } from '@reduxjs/toolkit';
|
||||
export const sentImageToCanvas = createAction('gallery/sentImageToCanvas');
|
||||
|
||||
export const imageDownloaded = createAction('gallery/imageDownloaded');
|
||||
|
||||
export const imageCopiedToClipboard = createAction('gallery/imageCopiedToClipboard');
|
||||
|
||||
export const imageOpenedInNewTab = createAction('gallery/imageOpenedInNewTab');
|
||||
|
||||
Reference in New Issue
Block a user