fix: revamp uploaded file modal

This commit is contained in:
dicedtomato 2023-02-26 20:20:36 +00:00 committed by GitHub
parent 8c5ff4f230
commit decd7f7918
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -1,6 +1,6 @@
import { Button, Table, Title } from '@mantine/core';
import { ActionIcon, Box, Button, Group, Stack, Table, Title, Tooltip } from '@mantine/core';
import { showNotification } from '@mantine/notifications';
import { CopyIcon } from 'components/icons';
import { CopyIcon, LinkIcon } from 'components/icons';
import Link from 'components/Link';
export default function showFilesModal(clipboard, modals, files: string[]) {
@ -26,25 +26,27 @@ export default function showFilesModal(clipboard, modals, files: string[]) {
size: 'auto',
children: (
<Table withBorder={false} withColumnBorders={false} highlightOnHover horizontalSpacing={'sm'}>
<tbody>
<Stack>
{files.map((file, idx) => (
<tr key={file}>
<td>
<Group key={idx} position='apart'>
<Group position='left'>
<Link href={file}>{file}</Link>
</td>
<td>
<Button.Group>
<Button variant='outline' onClick={() => copy(idx)}>
Copy
</Button>
<Button variant='outline' onClick={() => open(idx)}>
Open
</Button>
</Button.Group>
</td>
</tr>
</Group>
<Group position='right'>
<Tooltip label='Open link in a new tab'>
<ActionIcon onClick={() => open(idx)} variant='filled' color='primary'>
<LinkIcon />
</ActionIcon>
</Tooltip>
<Tooltip label='Copy link to clipboard'>
<ActionIcon onClick={() => copy(idx)} variant='filled' color='primary'>
<CopyIcon />
</ActionIcon>
</Tooltip>
</Group>
</Group>
))}
</tbody>
</Stack>
</Table>
),
});