- SellerDashboard: migrado para Shell (header topo), removida sidebar lateral, cards KPI brancos com react-icons pretos (FaChartLine, FaBoxOpen, FaReceipt) - Shell: adicionados todos os links de nav para owner/seller no header (Estoque, Buscar Produtos, Pedidos, Carteira, Equipe, Config. Entrega) - Wallet: ícone FaMoneyCheck no botão Solicitar Saque, card saldo com #0F4C81, thead da tabela com #0F4C81, fix R$ NaN (formatCurrency null-safe) - Team: botões e thead com #0F4C81, emojis removidos dos roleLabels - ShippingSettings: wrapped com Shell (mantém header), emojis substituídos por react-icons pretos (FaTruck, FaLocationDot, FaStore, FaCircleInfo, FaFloppyDisk), botão Salvar com #0F4C81 - Orders: removido box cinza de fundo dos ícones nas abas e estado vazio - LocationPicker: fallback seguro para OpenStreetMap quando VITE_MAP_TILE_LAYER não está definido (corrige tela branca em /search) - Inventory/Cart: cores dos botões e thead atualizadas para #0F4C81 |
||
|---|---|---|
| .. | ||
| src | ||
| .env.example | ||
| .gitignore | ||
| deno.lock | ||
| Dockerfile | ||
| index.html | ||
| MARKETPLACE.md | ||
| package.json | ||
| pnpm-lock.yaml | ||
| postcss.config.cjs | ||
| README.md | ||
| tailwind.config.ts | ||
| tsconfig.json | ||
| tsconfig.node.json | ||
| vite.config.ts | ||
| vitest.config.ts | ||
Frontend — SaveInMed Marketplace
React + Vite + TypeScript + Tailwind CSS
Estrutura de src/
src/
├── assets/ → Logo, imagens estáticas
├── components/ → Componentes reutilizáveis
├── context/ → React Context (auth, tema) — estado global estável
├── hooks/ → Custom hooks
├── layouts/ → Layouts de página (Shell, DashboardLayout)
├── pages/ → Páginas organizadas por contexto e perfil
│ ├── auth/ → Login
│ ├── marketplace/ → Search, Cart, Checkout, Orders, OrderDetails
│ └── dashboard/
│ ├── admin/ → Painel administrativo (role admin)
│ ├── seller/ → Inventário, Produtos, Carteira, Equipe
│ ├── employee/ → Dashboard do colaborador
│ ├── delivery/ → Dashboard do entregador
│ ├── Company.tsx
│ └── MyProfile.tsx
├── services/ → Clientes HTTP por domínio
├── stores/ → Zustand (carrinho, filtros, UI global)
├── types/ → Tipos TypeScript compartilhados
└── utils/ → format, jwt, logger
Importações absolutas
Utilize o alias @/ (aponta para src/):
// ✅ Correto
import { useAuth } from '@/context/AuthContext'
// ❌ Evitar (quebra ao mover o arquivo)
import { useAuth } from '../../context/AuthContext'
Gerenciamento de estado
| Estado | Estratégia |
|---|---|
| Auth (JWT, user) | Context API (AuthContext) |
| Tema claro/escuro | Context API (ThemeContext) |
| Carrinho | Zustand (cartStore) |
| Filtros de busca | Zustand / usePersistentFilters |
| Estado UI local | useState no componente |
Regra: Context apenas para auth e tema. Tudo mais vai para Zustand.
Scripts
pnpm dev # Dev server (proxy → :8214)
pnpm build # Build produção
pnpm test # Testes (Vitest)
pnpm lint # ESLint