Passo 8 completo. Tudo verde. Sumário do que foi feito:
Novas páginas:
app/select-operator/page.tsx — Server Component; redireciona automaticamente se já há sessão; lista operadores via prisma direto (funciona mesmo sem sessão ativa)
app/select-operator/operator-picker.tsx — Client Component; tap → signIn('credentials', { email, redirect: false }) → redireciona para /
app/sign-out-button.tsx — botão "Trocar" que chama signOut → volta ao picker
middleware.ts atualizado — redireciona para /select-operator quando não há sessão e AUTH_DEV_AUTOLOGIN=false; skip automático se já logado; o picker não faz redirect se não há sessão (deixa carregar)
app/page.tsx atualizado — mostra chip com o email do utilizador atual + botão "Trocar" (necessário para o AC "header mostra op1@demo.local")
Correções de infraestrutura descobertas:
NODE_ENV="development" removido do .env — estava a forçar o runtime de dev no next build, quebrando a geração estática
pages/_error.tsx adicionado — override mínimo que previne o erro <Html> outside _document
@repo/storage adicionado a transpilePackages e AWS SDK marcado como serverExternalPackages
app/not-found.tsx + app/error.tsx adicionados para App Router
AC verificado: build de produção passa limpo em Next.js 15.3.9 com todas as rotas correctas. O fluxo demo (/ → picker → login → / mostra email) funciona via dev server.
91 lines
3.3 KiB
TypeScript
91 lines
3.3 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 { resolveUser } from '@/lib/auth';
|
|
import { PingClient } from './ping-client';
|
|
import { SignOutButton } from './sign-out-button';
|
|
|
|
export default async function HomePage() {
|
|
const user = await resolveUser();
|
|
|
|
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">
|
|
{user && (
|
|
<div className="flex items-center justify-between rounded-lg border border-border bg-card px-4 py-2 text-sm">
|
|
<span data-testid="current-user">{user.email}</span>
|
|
<SignOutButton />
|
|
</div>
|
|
)}
|
|
|
|
<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 the operator picker.
|
|
</p>
|
|
</AlertDescription>
|
|
</Alert>
|
|
)}
|
|
|
|
<PingClient />
|
|
</main>
|
|
);
|
|
}
|