ui: redirect home route and simplify dashboard navigation

This commit is contained in:
Syahdan 2026-04-29 20:08:29 +07:00
parent 8e9acd5006
commit 4e0cf0140f
3 changed files with 13 additions and 68 deletions

View file

@ -4,31 +4,13 @@ import { ModeToggle } from "./mode-toggle";
import UserMenu from "./user-menu";
export default function Header() {
const links = [
{ to: "/", label: "Home" },
{ to: "/dashboard", label: "Dashboard" },
{ to: "/dashboard/servers", label: "Servers" },
{ to: "/dashboard/services", label: "Services" },
{ to: "/dashboard/domains", label: "Domains" },
{ to: "/dashboard/notes", label: "Notes" },
] as const;
return (
<div className="border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/75">
<div className="mx-auto flex max-w-7xl flex-row items-center justify-between gap-4 px-4 py-3 lg:px-6">
<div className="flex items-center gap-6">
<Link to="/" className="text-sm font-semibold tracking-[0.2em] uppercase">
<Link to="/dashboard" className="text-sm font-semibold tracking-[0.2em] uppercase">
minmon
</Link>
<nav className="flex flex-wrap gap-4 text-sm text-muted-foreground">
{links.map(({ to, label }) => {
return (
<Link key={to} to={to} activeProps={{ className: "text-foreground" }}>
{label}
</Link>
);
})}
</nav>
</div>
<div className="flex items-center gap-2">
<ModeToggle />

View file

@ -129,8 +129,8 @@ export default function SignInForm() {
<div className="grid gap-2 border-t pt-4 text-center text-xs text-muted-foreground">
<p>Student demo flow uses administrator sign-in only.</p>
<Link to="/" className="text-primary underline-offset-4 hover:underline">
Return to homepage
<Link to="/dashboard" className="text-primary underline-offset-4 hover:underline">
Open dashboard after sign in
</Link>
</div>
</div>

View file

@ -1,51 +1,14 @@
import { useQuery } from "@tanstack/react-query";
import { createFileRoute } from "@tanstack/react-router";
import { createFileRoute, redirect } from "@tanstack/react-router";
import { trpc } from "@/utils/trpc";
import { authClient } from "@/lib/auth-client";
export const Route = createFileRoute("/")({
component: HomeComponent,
beforeLoad: async () => {
const session = await authClient.getSession();
throw redirect({
to: session.data ? "/dashboard" : "/login",
});
},
component: () => null,
});
const TITLE_TEXT = `
`;
function HomeComponent() {
const healthCheck = useQuery(trpc.healthCheck.queryOptions());
return (
<div className="container mx-auto max-w-3xl px-4 py-2">
<pre className="overflow-x-auto font-mono text-sm">{TITLE_TEXT}</pre>
<div className="grid gap-6">
<section className="rounded-lg border p-4">
<h2 className="mb-2 font-medium">API Status</h2>
<div className="flex items-center gap-2">
<div
className={`h-2 w-2 rounded-full ${healthCheck.data ? "bg-green-500" : "bg-red-500"}`}
/>
<span className="text-sm text-muted-foreground">
{healthCheck.isLoading
? "Checking..."
: healthCheck.data
? "Connected"
: "Disconnected"}
</span>
</div>
</section>
</div>
</div>
);
}