diff --git a/src/components/File.tsx b/src/components/File.tsx index 42214b9..762d6ac 100644 --- a/src/components/File.tsx +++ b/src/components/File.tsx @@ -1,4 +1,16 @@ -import { Button, Card, Group, LoadingOverlay, Modal, Stack, Text, Title, Tooltip } from '@mantine/core'; +import { + ActionIcon, + Card, + Group, + LoadingOverlay, + Modal, + Paper, + SimpleGrid, + Stack, + Text, + Title, + Tooltip, +} from '@mantine/core'; import { useClipboard } from '@mantine/hooks'; import { showNotification } from '@mantine/notifications'; import { useFileDelete, useFileFavorite } from 'lib/queries/files'; @@ -10,16 +22,16 @@ import { CopyIcon, CrossIcon, DeleteIcon, + DownloadIcon, ExternalLinkIcon, EyeIcon, FileIcon, HashIcon, ImageIcon, StarIcon, + InfoIcon, } from './icons'; -import Link from './Link'; import MutedText from './MutedText'; -import Markdown from './render/Markdown'; import Type from './Type'; export function FileMeta({ Icon, title, subtitle, ...other }) { @@ -129,7 +141,15 @@ export default function File({ image, disableMediaPreview, exifEnabled }) { overrideRender={overrideRender} setOverrideRender={setOverrideRender} /> - + @@ -156,11 +176,66 @@ export default function File({ image, disableMediaPreview, exifEnabled }) { /> )} - + - - {exifEnabled && ( + + + {exifEnabled && ( + // + // + // + + window.open(`/dashboard/metadata/${image.id}`, '_blank')} + > + + + + )} + + + + + + + + + + + + + + + + window.open(image.url, '_blank')}> + + + + + + + + + + + + window.open(`/r/${image.file}?download=true`, '_blank')} + > + + + + + {/* {exifEnabled && ( @@ -170,7 +245,7 @@ export default function File({ image, disableMediaPreview, exifEnabled }) { - + */} diff --git a/src/components/Type.tsx b/src/components/Type.tsx index b4017e0..b854446 100644 --- a/src/components/Type.tsx +++ b/src/components/Type.tsx @@ -1,4 +1,15 @@ -import { Alert, Box, Button, Card, Center, Container, Group, Image, Text } from '@mantine/core'; +import { + Alert, + Box, + Button, + Card, + Center, + Container, + Group, + Image, + LoadingOverlay, + Text, +} from '@mantine/core'; import { Prism } from '@mantine/prism'; import { useEffect, useState } from 'react'; import { AudioIcon, FileIcon, ImageIcon, PlayIcon } from './icons'; @@ -35,6 +46,8 @@ export default function Type({ file, popup = false, disableMediaPreview, ...prop const shouldRenderMarkdown = name.endsWith('.md'); const shouldRenderTex = name.endsWith('.tex'); + const [loading, setLoading] = useState(type === 'text' && popup); + if (type === 'text' && popup) { useEffect(() => { (async () => { @@ -42,6 +55,7 @@ export default function Type({ file, popup = false, disableMediaPreview, ...prop const text = await res.text(); setText(text); + setLoading(false); })(); }, []); } @@ -90,8 +104,14 @@ export default function Type({ file, popup = false, disableMediaPreview, ...prop audio: