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.
59 lines
1.6 KiB
TypeScript
59 lines
1.6 KiB
TypeScript
'use client';
|
|
|
|
import { useState } from 'react';
|
|
import { useRouter } from 'next/navigation';
|
|
import { signIn } from 'next-auth/react';
|
|
|
|
interface Operator {
|
|
id: string;
|
|
email: string;
|
|
}
|
|
|
|
export function OperatorPicker({ operators }: { operators: Operator[] }) {
|
|
const router = useRouter();
|
|
const [busy, setBusy] = useState<string | null>(null);
|
|
const [error, setError] = useState<string | null>(null);
|
|
|
|
async function handleSelect(email: string) {
|
|
setBusy(email);
|
|
setError(null);
|
|
try {
|
|
const result = await signIn('credentials', { email, redirect: false });
|
|
if (result?.error) {
|
|
setError(`Não foi possível entrar como ${email}`);
|
|
} else {
|
|
router.push('/');
|
|
router.refresh();
|
|
}
|
|
} catch {
|
|
setError('Erro inesperado. Tente novamente.');
|
|
} finally {
|
|
setBusy(null);
|
|
}
|
|
}
|
|
|
|
if (operators.length === 0) {
|
|
return (
|
|
<p className="text-sm text-muted-foreground">
|
|
Nenhum operador encontrado. Execute <code>pnpm db:seed</code>.
|
|
</p>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="flex flex-col gap-3">
|
|
{operators.map((op) => (
|
|
<button
|
|
key={op.id}
|
|
onClick={() => handleSelect(op.email)}
|
|
disabled={busy !== null}
|
|
className="w-full rounded-xl border border-border bg-card px-6 py-5 text-left text-base font-medium transition-colors hover:bg-accent active:scale-[0.98] disabled:opacity-50"
|
|
>
|
|
{busy === op.email ? 'A entrar…' : op.email}
|
|
</button>
|
|
))}
|
|
{error && <p className="text-sm text-destructive">{error}</p>}
|
|
</div>
|
|
);
|
|
}
|