flora is a fast and secure runtime that lets you write discord bots for your servers, with a rich TypeScript SDK, without worrying about running infrastructure. [mirror]
feat(frontend): use geist
WIP
+23
-21
+1
-1
apps/frontend/package.json
+1
-1
apps/frontend/package.json
···
30
30
"@codingame/monaco-vscode-theme-service-override": "28.0.1",
31
31
"@codingame/monaco-vscode-typescript-basics-default-extension": "28.0.1",
32
32
"@codingame/monaco-vscode-workbench-service-override": "28.0.1",
33
-
"@fontsource-variable/inter": "5.2.8",
33
+
"@fontsource-variable/geist": "5.2.8",
34
34
"@pierre/diffs": "1.0.11",
35
35
"@radix-ui/react-scroll-area": "^1.2.10",
36
36
"@radix-ui/react-tabs": "^1.1.13",
+2
-2
apps/frontend/src/index.css
+2
-2
apps/frontend/src/index.css
···
1
1
@import "tailwindcss";
2
2
@import "tw-animate-css";
3
3
@import "shadcn/tailwind.css";
4
-
@import "@fontsource-variable/inter";
4
+
@import "@fontsource-variable/geist";
5
5
6
6
@custom-variant dark (&:is(.dark *));
7
7
···
75
75
}
76
76
77
77
@theme inline {
78
-
--font-sans: "Inter Variable", sans-serif;
78
+
--font-sans: "Geist Variable", sans-serif;
79
79
--color-sidebar-ring: var(--sidebar-ring);
80
80
--color-sidebar-border: var(--sidebar-border);
81
81
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+14
-12
apps/frontend/src/pages/dashboard.tsx
+14
-12
apps/frontend/src/pages/dashboard.tsx
···
15
15
}
16
16
17
17
export function Dashboard() {
18
-
const { guilds, setSelectedGuild, setView } = useApp()
18
+
const { guilds, session, setSelectedGuild, setView } = useApp()
19
19
const { recentGuildIds } = useRecentGuilds()
20
20
const [, setLocation] = useLocation()
21
+
const recentGuildLimit = 4
21
22
22
23
const recentGuilds = useMemo(() => {
23
24
const all = guilds.data ?? []
24
25
const fromRecent = recentGuildIds.map((id) => all.find((guild) => guild.id === id)).filter((
25
26
guild
26
27
): guild is NonNullable<typeof guild> => Boolean(guild))
27
-
if (fromRecent.length >= 2) return fromRecent.slice(0, 2)
28
+
if (fromRecent.length >= recentGuildLimit) return fromRecent.slice(0, recentGuildLimit)
28
29
const rest = all.filter((guild) => !fromRecent.some((recent) => recent.id === guild.id))
29
-
return [...fromRecent, ...rest].slice(0, 2)
30
-
}, [guilds.data, recentGuildIds])
30
+
return [...fromRecent, ...rest].slice(0, recentGuildLimit)
31
+
}, [guilds.data, recentGuildIds, recentGuildLimit])
31
32
33
+
const welcomeUsername = session?.username
32
34
const recentGuildsContent = match(recentGuilds.length)
33
35
.with(
34
36
0,
···
39
41
)
40
42
)
41
43
.otherwise(() => (
42
-
<div className='grid gap-4 md:grid-cols-2'>
44
+
<div className='grid gap-4 sm:grid-cols-2 lg:grid-cols-4'>
43
45
{recentGuilds.map((guild) => (
44
46
<button
45
47
key={guild.id}
46
48
type='button'
47
-
className='group cursor-pointer rounded-2xl border bg-card p-4 text-left transition hover:-translate-y-0.5 hover:shadow-md'
49
+
className='group flex h-full cursor-pointer flex-col rounded-2xl border bg-card p-4 text-left transition hover:-translate-y-0.5 hover:shadow-md'
48
50
onClick={() => {
49
51
setSelectedGuild(guild.id)
50
52
setView('overview')
···
60
62
/>
61
63
<AvatarFallback>{getGuildInitials(guild.name)}</AvatarFallback>
62
64
</Avatar>
63
-
<div>
64
-
<div className='font-medium'>{guild.name}</div>
65
-
<div className='text-xs text-muted-foreground'>
66
-
Guild ID: {guild.id}
67
-
</div>
68
-
</div>
65
+
<div className='font-medium'>{guild.name}</div>
69
66
</div>
70
67
<div className='inline-flex items-center gap-2 text-sm text-muted-foreground group-hover:text-foreground'>
71
68
<Clock4 className='h-4 w-4' />Continue managing guild
···
93
90
<div className='mx-auto flex w-full max-w-6xl flex-col gap-12 pb-8'>
94
91
<section className='space-y-4'>
95
92
<div className='space-y-1'>
93
+
{welcomeUsername && (
94
+
<p className='text-sm font-medium text-muted-foreground'>
95
+
Welcome back, @{welcomeUsername}
96
+
</p>
97
+
)}
96
98
<h2 className='text-2xl font-semibold tracking-tight'>Jump back in</h2>
97
99
<p className='text-sm text-muted-foreground'>
98
100
Your most recently used servers.
+6
-6
pnpm-lock.yaml
+6
-6
pnpm-lock.yaml
···
179
179
'@codingame/monaco-vscode-workbench-service-override':
180
180
specifier: 28.0.1
181
181
version: 28.0.1
182
-
'@fontsource-variable/inter':
182
+
'@fontsource-variable/geist':
183
183
specifier: 5.2.8
184
184
version: 5.2.8
185
185
'@pierre/diffs':
···
1192
1192
'@floating-ui/utils@0.2.11':
1193
1193
resolution: {integrity: sha512-RiB/yIh78pcIxl6lLMG0CgBXAZ2Y0eVHqMPYugu+9U0AeT6YBeiJpf7lbdJNIugFP5SIjwNRgo4DhR1Qxi26Gg==}
1194
1194
1195
-
'@fontsource-variable/inter@5.2.8':
1196
-
resolution: {integrity: sha512-kOfP2D+ykbcX/P3IFnokOhVRNoTozo5/JxhAIVYLpea/UBmCQ/YWPBfWIDuBImXX/15KH+eKh4xpEUyS2sQQGQ==}
1195
+
'@fontsource-variable/geist@5.2.8':
1196
+
resolution: {integrity: sha512-cJ6m9e+8MQ5dCYJsLylfZrgBh6KkG4bOLckB35Tr9J/EqdkEM6QllH5PxqP1dhTvFup+HtMRPuz9xOjxXJggxw==}
1197
1197
1198
1198
'@hono/node-server@1.19.11':
1199
1199
resolution: {integrity: sha512-dr8/3zEaB+p0D2n/IUrlPF1HZm586qgJNXK1a9fhg/PzdtkK7Ksd5l312tJX2yBuALqDYBlG20QEbayqPyxn+g==}
···
6544
6544
6545
6545
'@floating-ui/utils@0.2.11': {}
6546
6546
6547
-
'@fontsource-variable/inter@5.2.8': {}
6547
+
'@fontsource-variable/geist@5.2.8': {}
6548
6548
6549
6549
'@hono/node-server@1.19.11(hono@4.12.7)':
6550
6550
dependencies:
···
10816
10816
'@oxc-project/runtime': 0.115.0
10817
10817
lightningcss: 1.31.1
10818
10818
picomatch: 4.0.3
10819
-
postcss: 8.5.6
10819
+
postcss: 8.5.8
10820
10820
rolldown: 1.0.0-rc.6
10821
10821
tinyglobby: 0.2.15
10822
10822
optionalDependencies:
···
10832
10832
'@oxc-project/runtime': 0.115.0
10833
10833
lightningcss: 1.31.1
10834
10834
picomatch: 4.0.3
10835
-
postcss: 8.5.6
10835
+
postcss: 8.5.8
10836
10836
rolldown: 1.0.0-rc.6
10837
10837
tinyglobby: 0.2.15
10838
10838
optionalDependencies: