89 lines
3.2 KiB
TypeScript
89 lines
3.2 KiB
TypeScript
import { TRPCError } from '@trpc/server';
|
|
import { CheckCircle2, AlertCircle } from 'lucide-react';
|
|
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@repo/ui';
|
|
import { Alert, AlertDescription, AlertTitle } from '@repo/ui';
|
|
import { api } from '@/lib/trpc/server';
|
|
import { PingClient } from './ping-client';
|
|
|
|
/**
|
|
* Smoke-test home page. Uses the RSC tRPC caller (server-side) to invoke the
|
|
* ping procedure end-to-end:
|
|
*
|
|
* RSC → tRPC caller → protectedProcedure → Prisma → Postgres → Tenant row
|
|
*
|
|
* If the call throws (e.g. UNAUTHORIZED because no session), the error is
|
|
* caught and rendered as a legible failure card.
|
|
*/
|
|
export default async function HomePage() {
|
|
let result:
|
|
| { ok: true; payload: Awaited<ReturnType<typeof api.ping.ping>> }
|
|
| { ok: false; message: string; code: string } = {
|
|
ok: false,
|
|
message: 'init',
|
|
code: 'INIT',
|
|
};
|
|
|
|
try {
|
|
const payload = await api.ping.ping();
|
|
result = { ok: true, payload };
|
|
} catch (err) {
|
|
if (err instanceof TRPCError) {
|
|
result = { ok: false, message: err.message, code: err.code };
|
|
} else if (err instanceof Error) {
|
|
result = { ok: false, message: err.message, code: 'UNKNOWN' };
|
|
} else {
|
|
result = { ok: false, message: String(err), code: 'UNKNOWN' };
|
|
}
|
|
}
|
|
|
|
return (
|
|
<main className="mx-auto flex min-h-screen max-w-2xl flex-col items-stretch justify-center gap-6 p-6">
|
|
<header className="text-center">
|
|
<h1 className="text-3xl font-bold tracking-tight">FieldOps Operator</h1>
|
|
<p className="text-sm text-muted-foreground">Scaffold smoke test</p>
|
|
</header>
|
|
|
|
{result.ok ? (
|
|
<Card data-testid="ping-success">
|
|
<CardHeader>
|
|
<CardTitle className="flex items-center gap-2">
|
|
<CheckCircle2 className="h-5 w-5 text-green-600" />
|
|
Connected
|
|
</CardTitle>
|
|
<CardDescription>
|
|
End-to-end path verified: RSC → tRPC → Prisma → Postgres.
|
|
</CardDescription>
|
|
</CardHeader>
|
|
<CardContent className="space-y-2 text-sm">
|
|
<div>
|
|
<span className="font-medium">Tenant: </span>
|
|
<span data-testid="tenant-name">{result.payload.tenant.name}</span>
|
|
</div>
|
|
<div className="text-muted-foreground">
|
|
<span className="font-medium">id:</span> {result.payload.tenant.id}
|
|
</div>
|
|
<div className="text-muted-foreground">
|
|
<span className="font-medium">at:</span> {result.payload.timestamp}
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
) : (
|
|
<Alert variant="destructive" data-testid="ping-failure">
|
|
<AlertCircle className="h-4 w-4" />
|
|
<AlertTitle>Ping failed ({result.code})</AlertTitle>
|
|
<AlertDescription className="space-y-2">
|
|
<p>{result.message}</p>
|
|
<p className="text-xs">
|
|
If this says <code>UNAUTHORIZED</code>, set{' '}
|
|
<code>AUTH_DEV_AUTOLOGIN=true</code> in <code>.env</code> for local dev,
|
|
or sign in via Auth.js.
|
|
</p>
|
|
</AlertDescription>
|
|
</Alert>
|
|
)}
|
|
|
|
<PingClient />
|
|
</main>
|
|
);
|
|
}
|