Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 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 | 66x | import React, { ReactElement, useState } from 'react';
import { ExtendUploadFile, StorageFileValue } from '@props/RecordProps';
import FilePreview from '../../components/fileOperator/FilePreview';
import { EyeOutlined } from '@ant-design/icons'; // Import an icon from Ant Design
import { Space } from 'antd';
import { useTranslation } from 'react-i18next';
export interface PreviewActionProps {
file: StorageFileValue;
zIndex: number;
displayTextAndIcon?: boolean;
}
const PreviewAction = (props: PreviewActionProps): ReactElement => {
const { file, zIndex, displayTextAndIcon } = props;
const [display, setDisplay] = useState<boolean>(false);
const { t } = useTranslation();
const toggleDisplay = (): void => {
setDisplay(!display);
};
return (
<>
{displayTextAndIcon &&
<Space onClick={toggleDisplay} style={{ paddingLeft: "24px", cursor: "pointer" }}>
<EyeOutlined />
{t('Preview and print')}
</Space>
}
{(display || !displayTextAndIcon) && (
<FilePreview
file={{
id: file.id,
uid: file.id,
name: file.name,
data: file,
} as unknown as ExtendUploadFile}
onClose={() => {
setDisplay(false);
}}
zIndex={zIndex}
/>
)}
</>
);
};
export default PreviewAction;
|