Files
sar/apps/web/src/components/dev/DevLogin.tsx
2026-05-28 00:57:22 +00:00

72 lines
2.6 KiB
TypeScript

// Componente de login dev — visível apenas quando NODE_ENV !== 'production' e sem token.
// Em produção o token vem do master-login real (fora do escopo do MVP).
import { useState } from 'react';
import { Alert, Button, Card, Divider, Flex, Space, Typography } from 'antd';
import { apiFetch } from '../../lib/api-client';
import { authStore } from '../../lib/auth-store';
import { AuthTokenResponseSchema } from '@sar/api-interface';
type DevUser = { userId: string; role: string; label: string };
const DEV_USERS: DevUser[] = [
{ userId: 'user-001', role: 'rep', label: 'Rafael — Rep (user-001)' },
{ userId: 'user-002', role: 'rep', label: 'Rep 2 (user-002)' },
{ userId: 'user-sandra-01', role: 'supervisor', label: 'Sandra — Supervisora' },
{ userId: 'user-manager-01', role: 'manager', label: 'Gerente (user-manager-01)' },
];
export function DevLogin({ onLogin }: { onLogin: () => void }) {
const [loading, setLoading] = useState<string | null>(null);
const [error, setError] = useState<string | null>(null);
async function handleLogin(user: DevUser) {
setLoading(user.userId);
setError(null);
try {
const raw = await apiFetch('/auth/dev/token', {
method: 'POST',
body: { userId: user.userId, workspaceId: 'dev-workspace', role: user.role },
});
const { accessToken } = AuthTokenResponseSchema.parse(raw);
authStore.set(accessToken);
onLogin();
} catch (e) {
setError(e instanceof Error ? e.message : 'Erro ao obter token');
} finally {
setLoading(null);
}
}
return (
<Flex justify="center" align="center" style={{ minHeight: '100vh' }}>
<Card style={{ width: 380 }}>
<Space direction="vertical" size={16} style={{ width: '100%' }}>
<Typography.Title level={3} style={{ margin: 0 }}>
SAR · Login Dev
</Typography.Title>
<Alert
type="warning"
message="Ambiente de desenvolvimento"
description="Este login automático não existe em produção."
showIcon
/>
{error && <Alert type="error" message={error} showIcon />}
<Divider style={{ margin: '4px 0' }}>Entrar como</Divider>
{DEV_USERS.map((u) => (
<Button
key={u.userId}
block
type={u.role === 'rep' ? 'primary' : 'default'}
loading={loading === u.userId}
onClick={() => void handleLogin(u)}
>
{u.label}
</Button>
))}
</Space>
</Card>
</Flex>
);
}