feat(api,web): c2 consulta de clientes — list + search + auth flow

prisma: modelo Client + migração 20260527225728_add_client + seed dev (10 clientes)
api: GET /clients (list, busca, filtro atividade/financeiro, paginação) + GET /clients/:id
     rep vê carteira própria; supervisor/admin vê tudo; activityStatus calculado de lastOrderAt
@sar/api-interface: ClientSummarySchema, ClientDetailSchema, ClientListResponseSchema
web: ClientsPage (tabela AntD, busca, filtro), DevLogin (token dev), authStore, Bearer no apiFetch
oq-4 resolvida: creditLimit gerenciado no SAR

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

apps/web/src/lib/api-client.ts

@@ -8,6 +8,8 @@
 // CODING-RULES §05: 422 = validação Zod; 4xx outros = erros de domínio; 5xx = retry pelo
 // QueryClient (até 2x). O ApiError carrega tudo que o caller precisa pra decidir.
 
+import { authStore } from './auth-store';
+
 const PROBLEM_CONTENT_TYPE = 'application/problem+json';
 
 export interface ProblemDetails {
@@ -39,11 +41,14 @@ interface RequestOptions extends Omit<RequestInit, 'body'> {
 export async function apiFetch(path: string, options: RequestOptions = {}): Promise<unknown> {
   const { body, headers, ...rest } = options;
 
+  const token = authStore.get();
+
   const init: RequestInit = {
     ...rest,
     headers: {
       Accept: 'application/json',
       ...(body !== undefined ? { 'Content-Type': 'application/json' } : {}),
+      ...(token ? { Authorization: `Bearer ${token}` } : {}),
       ...headers,
     },
     ...(body !== undefined ? { body: JSON.stringify(body) } : {}),

apps/web/src/lib/auth-store.ts

@@ -0,0 +1,16 @@
+// Store minimalista para o token de acesso (dev: localStorage; prod: cookie httpOnly via BFF).
+// Em produção o token virá do master-login real e não ficará em localStorage.
+
+const TOKEN_KEY = 'sar_access_token';
+
+export const authStore = {
+  get(): string | null {
+    return localStorage.getItem(TOKEN_KEY);
+  },
+  set(token: string): void {
+    localStorage.setItem(TOKEN_KEY, token);
+  },
+  clear(): void {
+    localStorage.removeItem(TOKEN_KEY);
+  },
+};

apps/web/src/lib/queries/clients.ts

@@ -0,0 +1,45 @@
+import { useQuery } from '@tanstack/react-query';
+import {
+  ClientListResponseSchema,
+  ClientDetailSchema,
+  type ClientListQuery,
+  type ClientListResponse,
+  type ClientDetail,
+} from '@sar/api-interface';
+import { apiFetch } from '../api-client';
+
+export const CLIENT_KEYS = {
+  all: ['clients'] as const,
+  list: (params: Partial<ClientListQuery>) => ['clients', 'list', params] as const,
+  detail: (id: string) => ['clients', 'detail', id] as const,
+};
+
+export function useClientList(params: Partial<ClientListQuery> = {}) {
+  const qs = new URLSearchParams();
+  if (params.q) qs.set('q', params.q);
+  if (params.status) qs.set('status', params.status);
+  if (params.financialStatus) qs.set('financialStatus', params.financialStatus);
+  if (params.page) qs.set('page', String(params.page));
+  if (params.limit) qs.set('limit', String(params.limit));
+
+  const query = qs.toString();
+
+  return useQuery<ClientListResponse, Error>({
+    queryKey: CLIENT_KEYS.list(params),
+    queryFn: async () => {
+      const raw = await apiFetch(`/api/v1/clients${query ? `?${query}` : ''}`);
+      return ClientListResponseSchema.parse(raw);
+    },
+  });
+}
+
+export function useClientDetail(id: string) {
+  return useQuery<ClientDetail, Error>({
+    queryKey: CLIENT_KEYS.detail(id),
+    queryFn: async () => {
+      const raw = await apiFetch(`/api/v1/clients/${id}`);
+      return ClientDetailSchema.parse(raw);
+    },
+    enabled: !!id,
+  });
+}

apps/web/src/lib/router.tsx

@@ -1,6 +1,7 @@
 import { createRouter, createRootRoute, createRoute, Outlet } from '@tanstack/react-router';
 import { AppShell } from '../components/layout/AppShell';
 import { RafaelPainel } from '../cockpits/rafael/RafaelPainel';
+import { ClientsPage } from '../cockpits/rafael/ClientsPage';
 
 const rootRoute = createRootRoute({
   component: () => (
@@ -16,14 +17,38 @@ const indexRoute = createRoute({
   component: RafaelPainel,
 });
 
-// Placeholder routes (cockpits a implementar)
 const rafaelRoute = createRoute({
   getParentRoute: () => rootRoute,
   path: '/rep',
   component: RafaelPainel,
 });
 
-const routeTree = rootRoute.addChildren([indexRoute, rafaelRoute]);
+const clientesRoute = createRoute({
+  getParentRoute: () => rootRoute,
+  path: '/clientes',
+  component: ClientsPage,
+});
+
+// Placeholder detail route — ClientDetailPage virá em próxima iteração de C2
+const clienteDetailRoute = createRoute({
+  getParentRoute: () => rootRoute,
+  path: '/clientes/$id',
+  component: () => {
+    const { id } = clienteDetailRoute.useParams();
+    return (
+      <div style={{ padding: 24 }}>
+        <p>Ficha do cliente {id} — em construção</p>
+      </div>
+    );
+  },
+});
+
+const routeTree = rootRoute.addChildren([
+  indexRoute,
+  rafaelRoute,
+  clientesRoute,
+  clienteDetailRoute,
+]);
 
 export const router = createRouter({
   routeTree,