chave-mfe-supplier 1.0.0

package/.env.example

@@ -0,0 +1 @@
+VITE_MS_SUPPLIER_URL=http://localhost:3002

package/.github/workflows/ci.yml

@@ -0,0 +1,38 @@
+name: CI
+
+on:
+  push:
+    branches: [main]
+    tags: ['v*']
+  pull_request:
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: npm
+      - run: npm ci
+      - run: npm run lint
+      - run: npm test
+      - run: npm run build
+
+  release:
+    needs: test
+    if: startsWith(github.ref, 'refs/tags/v')
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: npm
+          registry-url: 'https://registry.npmjs.org'
+      - run: npm ci
+      - run: npm run build
+      - run: npm publish --access public
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

package/Dockerfile

@@ -0,0 +1,13 @@
+FROM node:20-alpine AS build
+WORKDIR /app
+COPY package.json package-lock.json* ./
+RUN npm ci
+COPY . .
+RUN npm run build
+
+FROM node:20-alpine
+WORKDIR /app
+RUN npm install -g vite
+COPY --from=build /app/dist ./dist
+EXPOSE 4002
+CMD ["vite", "preview", "--port", "4002", "--host"]

package/README.md

@@ -0,0 +1,94 @@
+# chave-mfe-supplier
+
+Microfrontend de **Gestão de Fornecedores** do sistema Chave (loja plus size) —
+Engenharia de Software II, PUCRS 2026-1, Turma 30, Grupo It Girls. Consome o
+microsserviço `chave-ms-supplier` e é montado no Shell via Module Federation.
+
+## Stack
+
+- **React 18 + TypeScript + Vite 5**
+- **MUI v9** (`@mui/material`, `@mui/icons-material`, `@emotion`) + **`@mui/x-data-grid` v9** (lista paginada)
+- **`@originjs/vite-plugin-federation`** — remote `mfe_supplier`
+- **Jest + Testing Library** (jsdom)
+
+## Como rodar (standalone)
+
+```bash
+npm install
+cp .env.example .env          # VITE_MS_SUPPLIER_URL aponta para o MS (default http://localhost:3002)
+npm run dev                   # http://localhost:4002
+```
+
+O token de autenticação é lido de `localStorage` (chave `token`) e enviado no header
+`Authorization: Bearer <token>` — faça login pelo MFE de Auth / Shell para populá-lo.
+
+Outros comandos:
+
+```bash
+npm test               # testes (Jest + Testing Library)
+npm run test:coverage  # com cobertura (thresholds 50% em jest.config.cjs)
+npm run lint           # tsc --noEmit (strict)
+npm run build          # vite build → dist/assets/remoteEntry.js
+```
+
+## Integração via Module Federation
+
+O `vite.config.ts` expõe o remote `mfe_supplier` (`filename: remoteEntry.js`) com os módulos:
+
+| Exposto | Componente |
+|---|---|
+| `./SupplierApp` | App completo (mount único do shell, com roteamento interno por view-state) |
+| `./SupplierListPage` | Lista de fornecedores |
+| `./SupplierFormPage` | Formulário criar/editar |
+| `./SupplierDetailPage` | Detalhe com abas |
+
+O Shell consome via `lazy(() => import("mfe_supplier/SupplierApp"))` na rota `/suppliers`.
+`react` e `react-dom` são compartilhados (`shared`). A URL do remote é
+`http://localhost:4002/assets/remoteEntry.js` (sobrescrevível por `MFE_SUPPLIER_URL` no shell).
+
+---
+
+## Manual de UI
+
+### 1. Lista de fornecedores (tela inicial)
+
+- **DataGrid paginado** (`@mui/x-data-grid`) com paginação **server-side**: as páginas são
+  buscadas no MS conforme você navega (`page`, `pageSize`).
+- **Filtros** no topo: campo **Buscar** (razão social / nome fantasia / documento),
+  **Status** (Todos / Ativo / Inativo), **Cidade** e **Estado**. Clique em **Buscar** para
+  aplicar — a lista volta à primeira página e re-consulta o MS.
+- **Colunas**: Razão Social, Nome Fantasia, Documento, Status (chip colorido), Cidade e
+  **Ações** por linha:
+  - **Abrir** → tela de detalhe;
+  - **Editar** → formulário em modo edição;
+  - **Inativar** → soft delete (desabilitado se já inativo); a lista recarrega.
+- Botão **Novo fornecedor** (canto superior direito) → formulário em modo criação.
+- **Estados**: spinner de carregamento no grid; **Alert** vermelho em caso de erro.
+
+### 2. Formulário (criar / editar)
+
+- Campos do fornecedor (Razão Social, Nome Fantasia, **Documento CNPJ/CPF**, E-mail,
+  Telefone, Pessoa de contato) e bloco de **Endereço** (logradouro, número, complemento,
+  bairro, cidade, estado, CEP, país).
+- **Validação client-side**: Razão Social e Documento obrigatórios, e-mail válido —
+  mensagens de erro aparecem como `helperText` abaixo do campo e o envio é bloqueado.
+- Em **modo edição** os dados são carregados do MS e o **Documento fica bloqueado**
+  (imutável). O envio bruto vai ao MS, que normaliza/valida o documento.
+- Botões **Salvar** (mostra "Salvando..." durante o request) e **Cancelar** (volta à lista).
+- **Alert** de erro no topo se o MS rejeitar (ex.: `409` documento duplicado).
+
+### 3. Detalhe do fornecedor
+
+Carrega fornecedor, produtos e reposições em paralelo. Cabeçalho com razão social, chip de
+status e botões **Voltar** / **Editar**. Três **abas**:
+
+- **Dados** — nome fantasia, documento + tipo, e-mail, telefone, contato, cidade/UF.
+- **Produtos vinculados** — tabela (produto, preço, lead time, SKU) + botão
+  **Vincular produto** que abre o **diálogo de vínculo** (ID do produto obrigatório, preço,
+  lead time e SKU opcionais). Cada linha tem **Desvincular**. A tabela recarrega após cada ação.
+- **Reposições** — tabela (pedido, status, total, nº de itens, data) + botão
+  **Registrar reposição** que abre o **diálogo de reposição**: seleção de **Status** e uma
+  **lista dinâmica de itens** (ID do produto, quantidade, custo unitário) com **Adicionar
+  item** / remover linha. O MS calcula o total quando todos os itens têm custo.
+
+Todas as telas tratam **loading** (spinner) e **erros** (Alert).

package/index.html

@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="pt-BR">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Chave Fornecedores</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>

package/jest.config.cjs

@@ -0,0 +1,34 @@
+module.exports = {
+  preset: 'ts-jest',
+  testEnvironment: 'jsdom',
+  roots: ['<rootDir>/src'],
+  testMatch: ['**/__tests__/**/*.tsx', '**/?(*.)+(spec|test).tsx'],
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
+  transform: {
+    '^.+\\.tsx?$': ['ts-jest', {
+      tsconfig: {
+        jsx: 'react-jsx',
+        esModuleInterop: true,
+        allowSyntheticDefaultImports: true,
+      },
+    }],
+  },
+  setupFilesAfterEnv: ['<rootDir>/src/__tests__/setup.ts'],
+  moduleNameMapper: {
+    '\\.(css|less|scss|sass)$': 'identity-obj-proxy',
+  },
+  collectCoverageFrom: [
+    'src/**/*.{ts,tsx}',
+    '!src/**/*.d.ts',
+    '!src/main.tsx',
+    '!src/vite-env.d.ts',
+  ],
+  coverageThreshold: {
+    global: {
+      branches: 50,
+      functions: 50,
+      lines: 50,
+      statements: 50,
+    },
+  },
+};

package/package.json

@@ -0,0 +1,37 @@
+{
+  "name": "chave-mfe-supplier",
+  "version": "1.0.0",
+  "scripts": {
+    "dev": "vite --port 4002",
+    "build": "vite build",
+    "preview": "vite preview --port 4002",
+    "lint": "tsc --noEmit",
+    "test": "jest",
+    "test:coverage": "jest --coverage"
+  },
+  "dependencies": {
+    "@emotion/react": "^11.14.0",
+    "@emotion/styled": "^11.14.1",
+    "@mui/icons-material": "^9.0.1",
+    "@mui/material": "^9.0.1",
+    "@mui/x-data-grid": "^9.0.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  },
+  "devDependencies": {
+    "@originjs/vite-plugin-federation": "^1.3.5",
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/react": "^16.3.2",
+    "@testing-library/user-event": "^14.5.2",
+    "@types/jest": "^30.0.0",
+    "@types/react": "^18.2.0",
+    "@types/react-dom": "^18.2.0",
+    "@vitejs/plugin-react": "^4.2.1",
+    "identity-obj-proxy": "^3.0.0",
+    "jest": "^30.4.2",
+    "jest-environment-jsdom": "^30.4.1",
+    "ts-jest": "^29.4.9",
+    "typescript": "^5.3.0",
+    "vite": "^5.1.0"
+  }
+}

package/src/__tests__/SupplierDetailPage.test.tsx

@@ -0,0 +1,75 @@
+import { render, screen, waitFor, within } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import SupplierDetailPage from '../pages/SupplierDetailPage';
+import { SupplierApi } from '../api/client';
+
+const supplier = {
+  id: 'id1', legalName: 'Plus Fashion', tradeName: 'Plus', document: '11222333000181',
+  documentType: 'cnpj' as const, email: 'a@b.com', phone: null, contactPerson: null,
+  status: 'active' as const, address: { city: 'POA', state: 'RS' }, createdAt: '', updatedAt: '',
+};
+
+const product = {
+  id: 'sp1', supplierId: 'id1', productId: 'prod-1', supplyPrice: 10,
+  leadTimeDays: 5, supplierSku: 'SKU1', createdAt: '',
+};
+
+function makeApi(overrides: Partial<Record<string, jest.Mock>> = {}) {
+  return {
+    getSupplier: jest.fn().mockResolvedValue(supplier),
+    listProducts: jest.fn().mockResolvedValue([]),
+    listReplenishments: jest.fn().mockResolvedValue([]),
+    linkProduct: jest.fn().mockResolvedValue(product),
+    unlinkProduct: jest.fn().mockResolvedValue(undefined),
+    createReplenishment: jest.fn().mockResolvedValue({}),
+    ...overrides,
+  } as unknown as SupplierApi;
+}
+
+it('loads and shows supplier detail with tabs', async () => {
+  const api = makeApi();
+  render(<SupplierDetailPage api={api} supplierId="id1" onBack={() => {}} onEdit={() => {}} />);
+  await waitFor(() => expect(screen.getByText('Plus Fashion')).toBeInTheDocument());
+  expect(screen.getByRole('tab', { name: /produtos/i })).toBeInTheDocument();
+  expect(screen.getByRole('tab', { name: /reposiç/i })).toBeInTheDocument();
+});
+
+it('shows error on load failure', async () => {
+  const api = makeApi({ getSupplier: jest.fn().mockRejectedValue(new Error('Boom')) });
+  render(<SupplierDetailPage api={api} supplierId="id1" onBack={() => {}} onEdit={() => {}} />);
+  await waitFor(() => expect(screen.getByText(/Boom/)).toBeInTheDocument());
+});
+
+it('links a product via dialog and reloads', async () => {
+  const api = makeApi();
+  render(<SupplierDetailPage api={api} supplierId="id1" onBack={() => {}} onEdit={() => {}} />);
+  await waitFor(() => screen.getByText('Plus Fashion'));
+  await userEvent.click(screen.getByRole('tab', { name: /produtos/i }));
+  await userEvent.click(screen.getByRole('button', { name: /vincular produto/i }));
+  const dialog = screen.getByRole('dialog');
+  await userEvent.type(within(dialog).getByLabelText(/ID do produto/i), 'prod-1');
+  await userEvent.click(within(dialog).getByRole('button', { name: /vincular/i }));
+  await waitFor(() => expect(api.linkProduct).toHaveBeenCalled());
+  expect(api.getSupplier).toHaveBeenCalledTimes(2); // initial + reload
+});
+
+it('unlinks a product', async () => {
+  const api = makeApi({ listProducts: jest.fn().mockResolvedValue([product]) });
+  render(<SupplierDetailPage api={api} supplierId="id1" onBack={() => {}} onEdit={() => {}} />);
+  await waitFor(() => screen.getByText('Plus Fashion'));
+  await userEvent.click(screen.getByRole('tab', { name: /produtos/i }));
+  await userEvent.click(screen.getByRole('button', { name: /desvincular/i }));
+  await waitFor(() => expect(api.unlinkProduct).toHaveBeenCalledWith('id1', 'prod-1'));
+});
+
+it('registers a replenishment via dialog', async () => {
+  const api = makeApi();
+  render(<SupplierDetailPage api={api} supplierId="id1" onBack={() => {}} onEdit={() => {}} />);
+  await waitFor(() => screen.getByText('Plus Fashion'));
+  await userEvent.click(screen.getByRole('tab', { name: /reposiç/i }));
+  await userEvent.click(screen.getByRole('button', { name: /registrar reposição/i }));
+  const dialog = screen.getByRole('dialog');
+  await userEvent.type(within(dialog).getAllByLabelText(/ID do produto/i)[0], 'prod-1');
+  await userEvent.click(within(dialog).getByRole('button', { name: /^registrar$/i }));
+  await waitFor(() => expect(api.createReplenishment).toHaveBeenCalled());
+});

package/src/__tests__/SupplierFormPage.test.tsx

@@ -0,0 +1,53 @@
+import { render, screen, waitFor } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import SupplierFormPage from '../pages/SupplierFormPage';
+import { SupplierApi } from '../api/client';
+
+const supplier = {
+  id: 'id1', legalName: 'Plus Fashion LTDA', tradeName: 'Plus', document: '11222333000181',
+  documentType: 'cnpj' as const, email: 'a@b.com', phone: null, contactPerson: null,
+  status: 'active' as const, address: { city: 'POA', state: 'RS' }, createdAt: '', updatedAt: '',
+};
+
+it('validates required fields before submit', async () => {
+  const api = { createSupplier: jest.fn() } as unknown as SupplierApi;
+  render(<SupplierFormPage api={api} onDone={() => {}} onCancel={() => {}} />);
+  await userEvent.click(screen.getByRole('button', { name: /salvar/i }));
+  expect(api.createSupplier).not.toHaveBeenCalled();
+  // Validation error helperText is shown (unique message, not the field label/legend).
+  expect(screen.getByText(/obrigatória/i)).toBeInTheDocument();
+});
+
+it('submits a valid new supplier', async () => {
+  const api = { createSupplier: jest.fn().mockResolvedValue({ id: 'id1' }) } as unknown as SupplierApi;
+  const onDone = jest.fn();
+  render(<SupplierFormPage api={api} onDone={onDone} onCancel={() => {}} />);
+  await userEvent.type(screen.getByLabelText(/razão social/i), 'Plus Fashion LTDA');
+  await userEvent.type(screen.getByLabelText(/documento/i), '11.222.333/0001-81');
+  await userEvent.type(screen.getByLabelText(/e-mail/i), 'contato@plus.com');
+  await userEvent.click(screen.getByRole('button', { name: /salvar/i }));
+  await waitFor(() => expect(api.createSupplier).toHaveBeenCalled());
+  await waitFor(() => expect(onDone).toHaveBeenCalled());
+});
+
+it('loads an existing supplier in edit mode and updates it', async () => {
+  const api = {
+    getSupplier: jest.fn().mockResolvedValue(supplier),
+    updateSupplier: jest.fn().mockResolvedValue(supplier),
+  } as unknown as SupplierApi;
+  const onDone = jest.fn();
+  render(<SupplierFormPage api={api} supplierId="id1" onDone={onDone} onCancel={() => {}} />);
+  await waitFor(() => expect(screen.getByLabelText(/razão social/i)).toHaveValue('Plus Fashion LTDA'));
+  expect(api.getSupplier).toHaveBeenCalledWith('id1');
+  await userEvent.click(screen.getByRole('button', { name: /salvar/i }));
+  await waitFor(() => expect(api.updateSupplier).toHaveBeenCalled());
+  await waitFor(() => expect(onDone).toHaveBeenCalled());
+});
+
+it('cancels via the cancel button', async () => {
+  const api = { createSupplier: jest.fn() } as unknown as SupplierApi;
+  const onCancel = jest.fn();
+  render(<SupplierFormPage api={api} onDone={() => {}} onCancel={onCancel} />);
+  await userEvent.click(screen.getByRole('button', { name: /cancelar/i }));
+  expect(onCancel).toHaveBeenCalled();
+});

package/src/__tests__/SupplierListPage.test.tsx

@@ -0,0 +1,48 @@
+import { render, screen, waitFor } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import SupplierListPage from '../pages/SupplierListPage';
+import { SupplierApi } from '../api/client';
+
+const supplier = {
+  id: 'id1', legalName: 'Plus Fashion', tradeName: 'Plus', document: '11222333000181',
+  documentType: 'cnpj' as const, email: 'a@b.com', phone: null, contactPerson: null,
+  status: 'active' as const, address: { city: 'POA', state: 'RS' }, createdAt: '', updatedAt: '',
+};
+
+const page = { data: [supplier], page: 1, pageSize: 20, total: 1 };
+
+it('renders suppliers from the API', async () => {
+  const api = { listSuppliers: jest.fn().mockResolvedValue(page) } as unknown as SupplierApi;
+  render(<SupplierListPage api={api} onCreate={() => {}} onOpen={() => {}} onEdit={() => {}} />);
+  await waitFor(() => expect(screen.getByText('Plus Fashion')).toBeInTheDocument());
+  expect(api.listSuppliers).toHaveBeenCalled();
+});
+
+it('shows error alert on failure', async () => {
+  const api = { listSuppliers: jest.fn().mockRejectedValue(new Error('Falha de rede')) } as unknown as SupplierApi;
+  render(<SupplierListPage api={api} onCreate={() => {}} onOpen={() => {}} onEdit={() => {}} />);
+  await waitFor(() => expect(screen.getByText(/Falha de rede/)).toBeInTheDocument());
+});
+
+it('fires onCreate and re-queries on search', async () => {
+  const api = { listSuppliers: jest.fn().mockResolvedValue(page) } as unknown as SupplierApi;
+  const onCreate = jest.fn();
+  render(<SupplierListPage api={api} onCreate={onCreate} onOpen={() => {}} onEdit={() => {}} />);
+  await waitFor(() => screen.getByText('Plus Fashion'));
+  await userEvent.click(screen.getByRole('button', { name: /novo fornecedor/i }));
+  expect(onCreate).toHaveBeenCalled();
+  await userEvent.type(screen.getByLabelText(/buscar/i), 'plus');
+  await userEvent.click(screen.getByRole('button', { name: /^buscar$/i }));
+  await waitFor(() => expect((api.listSuppliers as jest.Mock).mock.calls.length).toBeGreaterThan(1));
+});
+
+it('inactivates a supplier from the row action', async () => {
+  const api = {
+    listSuppliers: jest.fn().mockResolvedValue(page),
+    inactivateSupplier: jest.fn().mockResolvedValue(supplier),
+  } as unknown as SupplierApi;
+  render(<SupplierListPage api={api} onCreate={() => {}} onOpen={() => {}} onEdit={() => {}} />);
+  await waitFor(() => screen.getByText('Plus Fashion'));
+  await userEvent.click(screen.getByRole('button', { name: /inativar/i }));
+  await waitFor(() => expect(api.inactivateSupplier).toHaveBeenCalledWith('id1'));
+});

package/src/__tests__/client.test.tsx

@@ -0,0 +1,22 @@
+import { SupplierApi } from '../api/client';
+
+describe('SupplierApi', () => {
+  const fetchMock = jest.fn();
+  beforeEach(() => { fetchMock.mockReset(); (global as { fetch: unknown }).fetch = fetchMock; localStorage.setItem('token', 'tkn'); });
+
+  it('sends Authorization header and parses list', async () => {
+    fetchMock.mockResolvedValue({ ok: true, json: async () => ({ data: [], page: 1, pageSize: 20, total: 0 }) });
+    const api = new SupplierApi('http://api');
+    const res = await api.listSuppliers({ page: 1, pageSize: 20 });
+    expect(res.total).toBe(0);
+    const [, opts] = fetchMock.mock.calls[0];
+    expect(opts.headers.Authorization).toBe('Bearer tkn');
+  });
+
+  it('throws with server error message on non-ok', async () => {
+    fetchMock.mockResolvedValue({ ok: false, status: 409, json: async () => ({ error: 'Documento duplicado' }) });
+    const api = new SupplierApi('http://api');
+    await expect(api.createSupplier({ legalName: 'x', document: '1', email: 'a@b.com' }))
+      .rejects.toThrow('Documento duplicado');
+  });
+});

package/src/__tests__/dialogs.test.tsx

@@ -0,0 +1,42 @@
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import LinkProductDialog from '../components/LinkProductDialog';
+import ReplenishmentDialog from '../components/ReplenishmentDialog';
+
+describe('LinkProductDialog', () => {
+  it('submits a typed payload', async () => {
+    const onSubmit = jest.fn();
+    render(<LinkProductDialog open onClose={() => {}} onSubmit={onSubmit} />);
+    await userEvent.type(screen.getByLabelText(/ID do produto/i), 'prod-1');
+    await userEvent.type(screen.getByLabelText(/Preço de fornecimento/i), '49.9');
+    await userEvent.type(screen.getByLabelText(/Lead time/i), '7');
+    await userEvent.click(screen.getByRole('button', { name: /vincular/i }));
+    expect(onSubmit).toHaveBeenCalledWith(expect.objectContaining({
+      productId: 'prod-1', supplyPrice: 49.9, leadTimeDays: 7, supplierSku: null,
+    }));
+  });
+
+  it('does not submit without productId', async () => {
+    const onSubmit = jest.fn();
+    render(<LinkProductDialog open onClose={() => {}} onSubmit={onSubmit} />);
+    expect(screen.getByRole('button', { name: /vincular/i })).toBeDisabled();
+    expect(onSubmit).not.toHaveBeenCalled();
+  });
+});
+
+describe('ReplenishmentDialog', () => {
+  it('adds/removes item rows and submits', async () => {
+    const onSubmit = jest.fn();
+    render(<ReplenishmentDialog open onClose={() => {}} onSubmit={onSubmit} />);
+    await userEvent.type(screen.getAllByLabelText(/ID do produto/i)[0], 'p1');
+    await userEvent.click(screen.getByRole('button', { name: /adicionar item/i }));
+    expect(screen.getAllByLabelText(/ID do produto/i)).toHaveLength(2);
+    await userEvent.click(screen.getAllByLabelText(/remover item/i)[1]);
+    expect(screen.getAllByLabelText(/ID do produto/i)).toHaveLength(1);
+    await userEvent.click(screen.getByRole('button', { name: /registrar/i }));
+    expect(onSubmit).toHaveBeenCalledWith(expect.objectContaining({
+      status: 'requested',
+      items: [expect.objectContaining({ productId: 'p1', quantity: 1, unitCost: null })],
+    }));
+  });
+});

package/src/__tests__/setup.ts

@@ -0,0 +1,5 @@
+import '@testing-library/jest-dom';
+import { TextEncoder, TextDecoder } from 'util';
+
+// jsdom (jest) does not expose TextEncoder/TextDecoder, which @mui/x-data-grid requires.
+Object.assign(globalThis, { TextEncoder, TextDecoder });

package/src/api/client.ts

@@ -0,0 +1,63 @@
+import {
+  CreateReplenishmentPayload, CreateSupplierPayload, LinkProductPayload, Paginated,
+  ReplenishmentOrder, Supplier, SupplierProduct,
+} from './types';
+
+export interface ListParams {
+  page: number; pageSize: number;
+  status?: string; city?: string; state?: string; productId?: string; q?: string;
+}
+
+export class SupplierApi {
+  constructor(private baseUrl: string) {}
+
+  private async request<T>(path: string, init?: RequestInit): Promise<T> {
+    const token = localStorage.getItem('token');
+    const res = await fetch(`${this.baseUrl}${path}`, {
+      ...init,
+      headers: {
+        'Content-Type': 'application/json',
+        ...(token ? { Authorization: `Bearer ${token}` } : {}),
+        ...(init?.headers ?? {}),
+      },
+    });
+    if (res.status === 204) return undefined as T;
+    const body = await res.json().catch(() => ({}));
+    if (!res.ok) {
+      const message = (body as { error?: string }).error ?? `Erro ${res.status}`;
+      throw new Error(message);
+    }
+    return body as T;
+  }
+
+  listSuppliers(params: ListParams): Promise<Paginated<Supplier>> {
+    const qs = new URLSearchParams();
+    Object.entries(params).forEach(([k, v]) => { if (v !== undefined && v !== '') qs.append(k, String(v)); });
+    return this.request<Paginated<Supplier>>(`/suppliers?${qs.toString()}`);
+  }
+  getSupplier(id: string): Promise<Supplier> { return this.request(`/suppliers/${id}`); }
+  createSupplier(payload: CreateSupplierPayload): Promise<Supplier> {
+    return this.request('/suppliers', { method: 'POST', body: JSON.stringify(payload) });
+  }
+  updateSupplier(id: string, payload: Partial<CreateSupplierPayload> & { status?: string }): Promise<Supplier> {
+    return this.request(`/suppliers/${id}`, { method: 'PATCH', body: JSON.stringify(payload) });
+  }
+  inactivateSupplier(id: string): Promise<Supplier> {
+    return this.request(`/suppliers/${id}`, { method: 'DELETE' });
+  }
+  listProducts(id: string): Promise<SupplierProduct[]> { return this.request(`/suppliers/${id}/products`); }
+  linkProduct(id: string, payload: LinkProductPayload): Promise<SupplierProduct> {
+    return this.request(`/suppliers/${id}/products`, { method: 'POST', body: JSON.stringify(payload) });
+  }
+  unlinkProduct(id: string, productId: string): Promise<void> {
+    return this.request(`/suppliers/${id}/products/${productId}`, { method: 'DELETE' });
+  }
+  listReplenishments(id: string, params?: { status?: string; from?: string; to?: string }): Promise<ReplenishmentOrder[]> {
+    const qs = new URLSearchParams();
+    if (params) Object.entries(params).forEach(([k, v]) => { if (v) qs.append(k, v); });
+    return this.request(`/suppliers/${id}/replenishments?${qs.toString()}`);
+  }
+  createReplenishment(id: string, payload: CreateReplenishmentPayload): Promise<ReplenishmentOrder> {
+    return this.request(`/suppliers/${id}/replenishments`, { method: 'POST', body: JSON.stringify(payload) });
+  }
+}

package/src/api/createApi.ts

@@ -0,0 +1,7 @@
+import { SupplierApi } from "./client";
+
+// Kept in its own module: `import.meta.env` is a Vite-only construct and cannot be
+// parsed inside a CommonJS module (ts-jest), so it must not live in client.ts, which
+// the unit tests load directly.
+export const createApi = (): SupplierApi =>
+  new SupplierApi(import.meta.env.VITE_MS_SUPPLIER_URL || "http://localhost:3002");

package/src/api/types.ts

@@ -0,0 +1,94 @@
+export type SupplierStatus = "active" | "inactive";
+export type DocumentType = "cnpj" | "cpf";
+export type ReplenishmentStatus = "requested" | "sent" | "received" | "cancelled";
+
+export interface Address {
+  street?: string | null;
+  number?: string | null;
+  complement?: string | null;
+  district?: string | null;
+  city?: string | null;
+  state?: string | null;
+  zipCode?: string | null;
+  country?: string | null;
+}
+
+export interface Supplier {
+  id: string;
+  legalName: string;
+  tradeName: string | null;
+  document: string;
+  documentType: DocumentType;
+  email: string;
+  phone: string | null;
+  contactPerson: string | null;
+  status: SupplierStatus;
+  address: Address;
+  createdAt: string;
+  updatedAt: string;
+}
+
+export interface SupplierProduct {
+  id: string;
+  supplierId: string;
+  productId: string;
+  supplyPrice: number | null;
+  leadTimeDays: number | null;
+  supplierSku: string | null;
+  createdAt: string;
+}
+
+export interface ReplenishmentItem {
+  id: string;
+  orderId: string;
+  productId: string;
+  quantity: number;
+  unitCost: number | null;
+}
+
+export interface ReplenishmentOrder {
+  id: string;
+  supplierId: string;
+  status: ReplenishmentStatus;
+  totalCost: number | null;
+  orderedAt: string;
+  items: ReplenishmentItem[];
+  createdAt: string;
+  updatedAt: string;
+}
+
+export interface Paginated<T> {
+  data: T[];
+  page: number;
+  pageSize: number;
+  total: number;
+}
+
+export interface CreateSupplierPayload {
+  legalName: string;
+  tradeName?: string | null;
+  document: string;
+  email: string;
+  phone?: string | null;
+  contactPerson?: string | null;
+  address?: Address;
+}
+
+export interface LinkProductPayload {
+  productId: string;
+  supplyPrice?: number | null;
+  leadTimeDays?: number | null;
+  supplierSku?: string | null;
+}
+
+export interface CreateReplenishmentItemPayload {
+  productId: string;
+  quantity: number;
+  unitCost?: number | null;
+}
+
+export interface CreateReplenishmentPayload {
+  status?: ReplenishmentStatus;
+  orderedAt?: string;
+  items: CreateReplenishmentItemPayload[];
+}