diff options
Diffstat (limited to 'cmd/mirum-server/web/components/pages/dashboard.tsx')
| -rw-r--r-- | cmd/mirum-server/web/components/pages/dashboard.tsx | 50 | +28 −22 |
1 files changed, 28 insertions, 22 deletions
diff --git a/cmd/mirum-server/web/components/pages/dashboard.tsx b/cmd/mirum-server/web/components/pages/dashboard.tsx index dcfd8ba..80b29d5 100644 --- a/cmd/mirum-server/web/components/pages/dashboard.tsx +++ b/cmd/mirum-server/web/components/pages/dashboard.tsx @@ -1,34 +1,34 @@ // Copyright (c) 2026 Nikolay Govorov // SPDX-License-Identifier: AGPL-3.0-or-later -import { useEffect, useMemo, useState } from "react" -import { createConsoleClient } from "@/api/client" -import { formatError } from "@/lib/errors" -import type { Org } from "@/gen/api_pb" -import { Button } from "@/components/ui/button" -import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" +import { useEffect, useMemo, useState } from "react"; +import { createConsoleClient } from "@/api/client"; +import { formatError } from "@/lib/errors"; +import type { Org } from "@/gen/api_pb"; +import { Button } from "@/components/ui/button"; +import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; -export type DashboardProps = { - user: { email: string } - csrf: string +export interface DashboardProps { + user: { email: string }; + csrf: string; } export function Page({ user, csrf }: DashboardProps) { - const client = useMemo(() => createConsoleClient(csrf), [csrf]) - const [orgs, setOrgs] = useState<Org[] | null>(null) - const [error, setError] = useState<string | null>(null) + const client = useMemo(() => createConsoleClient(csrf), [csrf]); + const [orgs, setOrgs] = useState<Org[] | null>(null); + const [error, setError] = useState<string | null>(null); useEffect(() => { - const ac = new AbortController() + const ac = new AbortController(); client .orgList({}, { signal: ac.signal }) .then((res) => setOrgs(res.organizations)) .catch((err: unknown) => { - if (ac.signal.aborted) return - setError(formatError(err)) - }) - return () => ac.abort() - }, [client]) + if (ac.signal.aborted) return; + setError(formatError(err)); + }); + return () => ac.abort(); + }, [client]); return ( <div className="mx-auto max-w-3xl p-8 space-y-6"> @@ -38,7 +38,9 @@ export function Page({ user, csrf }: DashboardProps) { <span className="text-sm text-muted-foreground">{user.email}</span> <form method="POST" action="/auth/logout"> <input type="hidden" name="csrf" value={csrf} /> - <Button type="submit" variant="outline" size="sm">Sign out</Button> + <Button type="submit" variant="outline" size="sm"> + Sign out + </Button> </form> </div> </header> @@ -49,8 +51,12 @@ export function Page({ user, csrf }: DashboardProps) { </CardHeader> <CardContent> {error && <p className="text-destructive">{error}</p>} - {orgs === null && !error && <p className="text-muted-foreground">Loading…</p>} - {orgs?.length === 0 && <p className="text-muted-foreground">No organizations yet.</p>} + {orgs === null && !error && ( + <p className="text-muted-foreground">Loading…</p> + )} + {orgs?.length === 0 && ( + <p className="text-muted-foreground">No organizations yet.</p> + )} {orgs && orgs.length > 0 && ( <ul className="divide-y"> {orgs.map((org) => ( @@ -64,5 +70,5 @@ export function Page({ user, csrf }: DashboardProps) { </CardContent> </Card> </div> - ) + ); } |