File size: 2,222 Bytes
abcf568 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 | import { ImageContextMenu } from '../../../components/image-preview/context-menu'
import { CLOSED_IMAGE_CONTEXT_MENU } from '../../../components/image-preview/context-menu-state'
import { useI18n } from '../../../i18n'
interface PlotPreviewContextMenuProps {
isOpen: boolean
x: number
y: number
hasPreview: boolean
copyingFormat: 'png' | 'svg' | null
exportingFormat: 'png' | 'svg' | 'pdf' | null
onCopy: (format: 'png' | 'svg') => void
onExport: (format: 'png' | 'svg' | 'pdf') => void
onOpenLightbox: () => void
onClose: () => void
}
export function PlotPreviewContextMenu({
isOpen,
x,
y,
hasPreview,
copyingFormat,
exportingFormat,
onCopy,
onExport,
onOpenLightbox,
onClose,
}: PlotPreviewContextMenuProps) {
const { t } = useI18n()
return (
<ImageContextMenu
state={isOpen ? { open: true, x, y } : CLOSED_IMAGE_CONTEXT_MENU}
appearance="studio"
items={hasPreview ? [
{
key: 'copy-png',
label: copyingFormat === 'png' ? t('image.copying') : t('image.copyPng'),
busy: copyingFormat === 'png',
onClick: () => onCopy('png'),
},
{
key: 'copy-svg',
label: copyingFormat === 'svg' ? t('image.copying') : t('image.copySvg'),
busy: copyingFormat === 'svg',
onClick: () => onCopy('svg'),
},
{
key: 'export-png',
label: exportingFormat === 'png' ? t('image.exporting') : t('image.exportPng'),
busy: exportingFormat === 'png',
onClick: () => onExport('png'),
},
{
key: 'export-svg',
label: exportingFormat === 'svg' ? t('image.exporting') : t('image.exportSvg'),
busy: exportingFormat === 'svg',
onClick: () => onExport('svg'),
},
{
key: 'export-pdf',
label: exportingFormat === 'pdf' ? t('image.exporting') : t('image.exportPdf'),
busy: exportingFormat === 'pdf',
onClick: () => onExport('pdf'),
},
{
key: 'open-lightbox',
label: t('image.openLightbox'),
onClick: onOpenLightbox,
},
] : []}
onClose={onClose}
/>
)
}
|