Skip to content

Commit 3d55ce0

Browse files
committed
fix: change buttons + add buttons
1 parent 8c9df5a commit 3d55ce0

8 files changed

Lines changed: 112 additions & 63 deletions

File tree

src/components/pages/dashboard/index.tsx

Lines changed: 42 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,20 @@
1+
import { useConfig } from '@/components/ConfigProvider';
12
import Stat from '@/components/Stat';
23
import type { Response } from '@/lib/api/response';
34
import { bytes } from '@/lib/bytes';
45
import useLogin from '@/lib/hooks/useLogin';
5-
import { Paper, ScrollArea, SimpleGrid, Skeleton, Table, Text, Title } from '@mantine/core';
6-
import { IconDeviceSdCard, IconEyeFilled, IconFiles, IconLink, IconStarFilled } from '@tabler/icons-react';
6+
import { isAdministrator } from '@/lib/role';
7+
import { Button, Group, Paper, ScrollArea, SimpleGrid, Skeleton, Table, Text, Title } from '@mantine/core';
8+
import {
9+
IconDeviceSdCard,
10+
IconEyeFilled,
11+
IconFiles,
12+
IconGraphFilled,
13+
IconLink,
14+
IconStarFilled,
15+
} from '@tabler/icons-react';
716
import { lazy, Suspense } from 'react';
17+
import { Link } from 'react-router-dom';
818
import useSWR from 'swr';
919

1020
const DashboardFile = lazy(() => import('@/components/file/DashboardFile'));
@@ -13,6 +23,9 @@ export default function DashboardHome() {
1323
const { user } = useLogin();
1424
const { data: recent, isLoading: recentLoading } = useSWR<Response['/api/user/recent']>('/api/user/recent');
1525
const { data: stats, isLoading: statsLoading } = useSWR<Response['/api/user/stats']>('/api/user/stats');
26+
27+
const config = useConfig();
28+
1629
return (
1730
<>
1831
<Title>
@@ -47,9 +60,18 @@ export default function DashboardHome() {
4760
</Text>
4861
) : null}
4962

50-
<Title order={2} mt='md' mb='xs'>
51-
Recent files
52-
</Title>
63+
<Group mt='md' mb='xs' style={{ alignItems: 'center' }}>
64+
<Title order={2}>Recent files</Title>
65+
<Button
66+
variant='outline'
67+
size='compact-xs'
68+
component={Link}
69+
to='/dashboard/files'
70+
leftSection={<IconFiles size='1rem' />}
71+
>
72+
View all files
73+
</Button>
74+
</Group>
5375

5476
{recentLoading ? (
5577
<SimpleGrid cols={{ base: 1, md: 2, lg: 3 }} spacing={{ base: 'sm', md: 'md' }}>
@@ -71,9 +93,21 @@ export default function DashboardHome() {
7193
</Text>
7294
)}
7395

74-
<Title order={2} mt='md'>
75-
Stats
76-
</Title>
96+
<Group mt='md' style={{ alignItems: 'center' }}>
97+
<Title order={2}>Stats</Title>
98+
{(!config.features?.metrics?.adminOnly || isAdministrator(user?.role)) && (
99+
<Button
100+
variant='outline'
101+
size='compact-xs'
102+
component={Link}
103+
to='/dashboard/metrics'
104+
leftSection={<IconGraphFilled size='1rem' />}
105+
>
106+
View instance metrics
107+
</Button>
108+
)}
109+
</Group>
110+
77111
<Text size='sm' c='dimmed' mb='xs'>
78112
These statistics are based on your uploads only.
79113
</Text>

src/components/pages/folders/index.tsx

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,10 @@ import { Response } from '@/lib/api/response';
33
import { Folder } from '@/lib/db/models/folder';
44
import { fetchApi } from '@/lib/fetchApi';
55
import { useViewStore } from '@/lib/store/view';
6-
import { ActionIcon, Button, Group, Modal, Stack, Switch, TextInput, Title, Tooltip } from '@mantine/core';
6+
import { Button, Group, Modal, Stack, Switch, TextInput, Title } from '@mantine/core';
77
import { useForm } from '@mantine/form';
88
import { notifications } from '@mantine/notifications';
9-
import { IconFolderPlus, IconPlus } from '@tabler/icons-react';
9+
import { IconFolderPlus } from '@tabler/icons-react';
1010
import { useState } from 'react';
1111
import { mutate } from 'swr';
1212
import FolderGridView from './views/FolderGridView';
@@ -71,11 +71,14 @@ export default function DashboardFolders() {
7171
<Group>
7272
<Title>Folders</Title>
7373

74-
<Tooltip label='Create a new folder'>
75-
<ActionIcon variant='outline' onClick={() => setOpen(true)}>
76-
<IconPlus size='1rem' />
77-
</ActionIcon>
78-
</Tooltip>
74+
<Button
75+
size='compact-sm'
76+
variant='outline'
77+
leftSection={<IconFolderPlus size='1rem' />}
78+
onClick={() => setOpen(true)}
79+
>
80+
Create
81+
</Button>
7982

8083
<GridTableSwitcher type='folders' />
8184
</Group>

src/components/pages/invites/index.tsx

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { Response } from '@/lib/api/response';
33
import { Invite } from '@/lib/db/models/invite';
44
import { fetchApi } from '@/lib/fetchApi';
55
import { useViewStore } from '@/lib/store/view';
6-
import { ActionIcon, Button, Group, Modal, NumberInput, Select, Stack, Title, Tooltip } from '@mantine/core';
6+
import { Button, Group, Modal, NumberInput, Select, Stack, Title } from '@mantine/core';
77
import { useForm } from '@mantine/form';
88
import { notifications } from '@mantine/notifications';
99
import { IconPlus, IconTagOff } from '@tabler/icons-react';
@@ -112,11 +112,14 @@ export default function DashboardInvites() {
112112
<Group>
113113
<Title>Invites</Title>
114114

115-
<Tooltip label='Create a new invite'>
116-
<ActionIcon variant='outline' onClick={() => setOpen(true)}>
117-
<IconPlus size='1rem' />
118-
</ActionIcon>
119-
</Tooltip>
115+
<Button
116+
variant='outline'
117+
size='compact-sm'
118+
leftSection={<IconPlus size='1rem' />}
119+
onClick={() => setOpen(true)}
120+
>
121+
Create
122+
</Button>
120123

121124
<GridTableSwitcher type='invites' />
122125
</Group>

src/components/pages/upload/File/index.tsx

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@ import { bytes } from '@/lib/bytes';
33
import { humanizeDuration } from '@/lib/relativeTime';
44
import { useUploadOptionsStore } from '@/lib/store/uploadOptions';
55
import {
6-
ActionIcon,
76
Button,
87
Collapse,
98
Grid,
@@ -13,7 +12,6 @@ import {
1312
Progress,
1413
Text,
1514
Title,
16-
Tooltip,
1715
rem,
1816
useMantineTheme,
1917
} from '@mantine/core';
@@ -134,11 +132,15 @@ export default function UploadFile({ title, folder }: { title?: string; folder?:
134132
<Title order={1}>{title ?? 'Upload files'}</Title>
135133

136134
{!folder && (
137-
<Tooltip label='View your files'>
138-
<ActionIcon component={Link} to='/dashboard/files' variant='outline' radius='sm'>
139-
<IconFiles size={18} />
140-
</ActionIcon>
141-
</Tooltip>
135+
<Button
136+
variant='outline'
137+
size='compact-sm'
138+
component={Link}
139+
to='/dashboard/files'
140+
leftSection={<IconFiles size='1rem' />}
141+
>
142+
Go to files
143+
</Button>
142144
)}
143145
</Group>
144146

src/components/pages/upload/Text/index.tsx

Lines changed: 10 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,6 @@
11
import Render from '@/components/render/Render';
22
import { useUploadOptionsStore } from '@/lib/store/uploadOptions';
3-
import {
4-
ActionIcon,
5-
Button,
6-
Center,
7-
Group,
8-
Select,
9-
Tabs,
10-
Text,
11-
Textarea,
12-
Title,
13-
Tooltip,
14-
} from '@mantine/core';
3+
import { Button, Center, Group, Select, Tabs, Text, Textarea, Title } from '@mantine/core';
154
import { useClipboard } from '@mantine/hooks';
165
import { IconCursorText, IconEyeFilled, IconFiles, IconUpload } from '@tabler/icons-react';
176
import { useEffect, useState } from 'react';
@@ -82,11 +71,15 @@ export default function UploadText() {
8271
<Group gap='sm'>
8372
<Title order={1}>Upload text</Title>
8473

85-
<Tooltip label='View your files'>
86-
<ActionIcon component={Link} to='/dashboard/files' variant='outline' radius='sm'>
87-
<IconFiles size={18} />
88-
</ActionIcon>
89-
</Tooltip>
74+
<Button
75+
variant='outline'
76+
size='compact-sm'
77+
component={Link}
78+
to='/dashboard/files'
79+
leftSection={<IconFiles size='1rem' />}
80+
>
81+
Go to files
82+
</Button>
9083
</Group>
9184

9285
<Tabs defaultValue='textarea' variant='pills' my='sm'>

src/components/pages/urls/index.tsx

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@ import {
3030
IconKey,
3131
IconLink,
3232
IconLinkOff,
33+
IconLinkPlus,
3334
IconTextCaption,
3435
} from '@tabler/icons-react';
3536
import { useState } from 'react';
@@ -207,11 +208,14 @@ export default function DashboardURLs() {
207208
<Group>
208209
<Title>URLs</Title>
209210

210-
<Tooltip label='Shorten a URL'>
211-
<ActionIcon variant='outline' onClick={() => setOpen(true)}>
212-
<IconLink size='1rem' />
213-
</ActionIcon>
214-
</Tooltip>
211+
<Button
212+
variant='outline'
213+
size='compact-sm'
214+
leftSection={<IconLinkPlus size='1rem' />}
215+
onClick={() => setOpen(true)}
216+
>
217+
Create
218+
</Button>
215219

216220
<GridTableSwitcher type='urls' />
217221
</Group>

src/components/pages/urls/views/UrlTableView.tsx

Lines changed: 15 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -164,11 +164,14 @@ export default function UrlTableView() {
164164
/>
165165
),
166166
filtering: searchField === 'code' && searchQuery.code.trim() !== '',
167-
render: (url) => (
168-
<Anchor href={formatRootUrl(config.urls.route, url.code)} target='_blank'>
169-
{url.code}
170-
</Anchor>
171-
),
167+
render: (url) =>
168+
url.enabled ? (
169+
<Anchor href={formatRootUrl(config.urls.route, url.code)} target='_blank'>
170+
{url.code}
171+
</Anchor>
172+
) : (
173+
url.code
174+
),
172175
},
173176
{
174177
accessor: 'vanity',
@@ -184,9 +187,13 @@ export default function UrlTableView() {
184187
filtering: searchField === 'vanity' && searchQuery.vanity.trim() !== '',
185188
render: (url) =>
186189
url.vanity ? (
187-
<Anchor href={formatRootUrl(config.urls.route, url.vanity)} target='_blank'>
188-
{url.vanity}
189-
</Anchor>
190+
url.enabled ? (
191+
<Anchor href={formatRootUrl(config.urls.route, url.vanity)} target='_blank'>
192+
{url.vanity}
193+
</Anchor>
194+
) : (
195+
url.vanity
196+
)
190197
) : (
191198
''
192199
),

src/components/pages/users/index.tsx

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -154,11 +154,14 @@ export default function DashboardUsers() {
154154
<Group>
155155
<Title>Users</Title>
156156

157-
<Tooltip label='Create a new user'>
158-
<ActionIcon variant='outline' onClick={() => setOpen(true)}>
159-
<IconUserPlus size='1rem' />
160-
</ActionIcon>
161-
</Tooltip>
157+
<Button
158+
variant='outline'
159+
size='compact-sm'
160+
leftSection={<IconUserPlus size='1rem' />}
161+
onClick={() => setOpen(true)}
162+
>
163+
Create
164+
</Button>
162165

163166
<GridTableSwitcher type='users' />
164167
</Group>

0 commit comments

Comments
 (0)