diff --git a/.gitignore b/.gitignore index a547bf3..79bca5f 100644 --- a/.gitignore +++ b/.gitignore @@ -7,11 +7,22 @@ yarn-error.log* pnpm-debug.log* lerna-debug.log* +# Dependencies node_modules + +# Build outputs dist dist-ssr +build *.local +# Environment variables +.env +.env.local +.env.development.local +.env.test.local +.env.production.local + # Editor directories and files .vscode/* !.vscode/extensions.json @@ -22,3 +33,22 @@ dist-ssr *.njsproj *.sln *.sw? +*.swp +*~ + +# OS files +Thumbs.db +Desktop.ini + +# Cache and temporary files +.cache +.tmp +.temp +*.tmp +*.temp + +# Test coverage +coverage +*.lcov +.nyc_output + diff --git a/GIT-AUTO-SYNC.md b/GIT-AUTO-SYNC.md new file mode 100644 index 0000000..2a1d31f --- /dev/null +++ b/GIT-AUTO-SYNC.md @@ -0,0 +1,179 @@ +# Git Auto-Sync - Documentação + +## 📋 Visão Geral + +O **Git Auto-Sync** é um sistema de automação que monitora alterações no projeto PlatformSistemas e realiza commits e push automáticos para o repositório Git remoto. + +## 🎯 Características + +- ✅ **Monitoramento em tempo real** de alterações nos arquivos +- ✅ **Debounce inteligente** (aguarda 10 segundos após a última alteração) +- ✅ **Build automático** antes de cada commit +- ✅ **Filtragem inteligente** de arquivos (ignora node_modules, .git, dist, etc.) +- ✅ **Mensagens de commit descritivas** com timestamp e contagem de arquivos +- ✅ **Interface visual** com cores e feedback claro + +## 🚀 Como Usar + +### Método 1: Via NPM (Recomendado) + +```bash +# Com build automático (padrão) +npm run git:sync + +# Sem build automático (mais rápido para desenvolvimento) +npm run git:sync:nobuild +``` + +### Método 2: Via PowerShell Direto + +```powershell +# Com build automático +.\git-auto-sync.ps1 + +# Sem build automático +$env:BUILD_ENABLED='false'; .\git-auto-sync.ps1 +``` + +## ⚙️ Configurações + +Você pode ajustar as configurações editando o arquivo `git-auto-sync.ps1`: + +```powershell +# Configurações (linhas 10-12) +$BRANCH_NAME = "frontend_React" # Branch de destino +$DEBOUNCE_SECONDS = 10 # Tempo de espera após última alteração +$BUILD_ENABLED = $true # Executar build antes do commit +``` + +### Parâmetros Configuráveis + +| Parâmetro | Descrição | Valor Padrão | +|-----------|-----------|--------------| +| `BRANCH_NAME` | Branch do Git para push | `frontend_React` | +| `DEBOUNCE_SECONDS` | Segundos de espera após última alteração | `10` | +| `BUILD_ENABLED` | Executar build de produção antes do commit | `true` | + +## 📁 Arquivos Ignorados + +O script ignora automaticamente as seguintes pastas/arquivos: + +- `node_modules/` +- `.git/` +- `dist/` +- `.env` +- `*.log` +- `package-lock.json` +- `.tmp/` +- `.cache/` +- `.vscode/` +- `.idea/` +- `*.swp` +- `*~` + +## 🔄 Fluxo de Trabalho + +1. **Detecção de Alteração**: O script detecta quando um arquivo é modificado, criado, deletado ou renomeado +2. **Debounce**: Aguarda 10 segundos para garantir que não há mais alterações pendentes +3. **Verificação**: Confirma que há alterações reais para commitar +4. **Build** (opcional): Executa `npm run build` para gerar a versão de produção +5. **Stage**: Adiciona todos os arquivos alterados (`git add .`) +6. **Commit**: Cria um commit com mensagem descritiva +7. **Push**: Envia as alterações para o repositório remoto na branch `frontend_React` + +## 📝 Formato das Mensagens de Commit + +``` +Auto-deploy: 2026-01-13 09:20:45 | 3 arquivo(s) alterado(s) [Build included] +``` + +- **Timestamp**: Data e hora do commit +- **Contagem**: Número de arquivos alterados +- **Build**: Indica se o build foi incluído + +## 🛑 Como Parar + +Para interromper o monitoramento, pressione `Ctrl+C` no terminal onde o script está rodando. + +## 🔧 Troubleshooting + +### Erro: "Execution Policy" + +Se você receber um erro sobre política de execução, execute: + +```powershell +Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope CurrentUser +``` + +### Erro no Build + +Se o build falhar, o commit será abortado automaticamente. Verifique os erros no console e corrija-os antes de tentar novamente. + +### Push Rejeitado + +Se o push for rejeitado (ex: branch desatualizada), você precisará: + +1. Parar o script (`Ctrl+C`) +2. Fazer `git pull origin frontend_React` +3. Resolver conflitos (se houver) +4. Reiniciar o script + +## 🎨 Interface Visual + +O script exibe um banner informativo ao iniciar: + +``` +╔════════════════════════════════════════════════════════════╗ +║ Git Auto-Sync - PlatformSistemas ║ +╠════════════════════════════════════════════════════════════╣ +║ Branch: frontend_React ║ +║ Remote: https://git.itguys.com.br/itguys_dev/Workspace ║ +║ Debounce: 10 segundos ║ +║ Build automático: Habilitado ║ +╠════════════════════════════════════════════════════════════╣ +║ Status: Monitorando alterações... ║ +║ Pressione Ctrl+C para parar ║ +╚════════════════════════════════════════════════════════════╝ +``` + +## 📊 Logs e Feedback + +O script fornece feedback visual em tempo real: + +- 🔵 **Azul escuro**: Alterações detectadas +- 🟡 **Amarelo**: Processos em andamento +- 🟢 **Verde**: Operações bem-sucedidas +- 🔴 **Vermelho**: Erros + +## 🔐 Segurança + +- O script **não** commita arquivos sensíveis (`.env`, etc.) +- Arquivos temporários e de cache são automaticamente ignorados +- O `.gitignore` do projeto é respeitado + +## 📌 Repositório + +- **Remote**: https://git.itguys.com.br/itguys_dev/Workspace +- **Branch**: frontend_React + +## 💡 Dicas + +1. **Desenvolvimento rápido**: Use `npm run git:sync:nobuild` para commits mais rápidos durante desenvolvimento +2. **Produção**: Use `npm run git:sync` para garantir que o build está sempre atualizado +3. **Múltiplas alterações**: O debounce agrupa alterações feitas em sequência em um único commit +4. **Monitoramento**: Mantenha o terminal visível para acompanhar o status das sincronizações + +## 🆘 Suporte + +Em caso de problemas: + +1. Verifique se o Git está configurado corretamente +2. Confirme que você tem permissões de push na branch `frontend_React` +3. Verifique se não há conflitos pendentes no repositório +4. Revise os logs no console para identificar erros específicos + +--- + +**Última atualização**: 2026-01-13 +**Versão**: 2.0 +**Autor**: Antigravity AI diff --git a/README.md b/README.md index d2e7761..641c683 100644 --- a/README.md +++ b/README.md @@ -1,73 +1,215 @@ -# React + TypeScript + Vite +# PlatformSistemas -This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. +Sistema de gestão integrada desenvolvido em React + TypeScript + Vite. -Currently, two official plugins are available: +## 🚀 Repositório -- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Babel](https://babeljs.io/) (or [oxc](https://oxc.rs) when used in [rolldown-vite](https://vite.dev/guide/rolldown)) for Fast Refresh -- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh +- **Remote**: https://git.itguys.com.br/itguys_dev/Workspace +- **Branch**: `frontend_React` -## React Compiler +## 📋 Índice -The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation). +- [Início Rápido](#início-rápido) +- [Scripts Disponíveis](#scripts-disponíveis) +- [Git Auto-Sync](#git-auto-sync) +- [Estrutura do Projeto](#estrutura-do-projeto) +- [Tecnologias](#tecnologias) +- [Desenvolvimento](#desenvolvimento) -## Expanding the ESLint configuration +## 🎯 Início Rápido -If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules: +### Pré-requisitos -```js -export default defineConfig([ - globalIgnores(['dist']), - { - files: ['**/*.{ts,tsx}'], - extends: [ - // Other configs... +- Node.js (v18 ou superior) +- npm ou yarn +- Git - // Remove tseslint.configs.recommended and replace with this - tseslint.configs.recommendedTypeChecked, - // Alternatively, use this for stricter rules - tseslint.configs.strictTypeChecked, - // Optionally, add this for stylistic rules - tseslint.configs.stylisticTypeChecked, +### Instalação - // Other configs... - ], - languageOptions: { - parserOptions: { - project: ['./tsconfig.node.json', './tsconfig.app.json'], - tsconfigRootDir: import.meta.dirname, - }, - // other options... - }, - }, -]) +```bash +# Clone o repositório +git clone https://git.itguys.com.br/itguys_dev/Workspace.git +cd PlatformSistemas + +# Instale as dependências +npm install + +# Configure as variáveis de ambiente +cp .env.example .env +# Edite o arquivo .env com suas configurações + +# Inicie o servidor de desenvolvimento +npm run dev ``` -You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules: +## 📜 Scripts Disponíveis -```js -// eslint.config.js -import reactX from 'eslint-plugin-react-x' -import reactDom from 'eslint-plugin-react-dom' +```bash +# Desenvolvimento +npm run dev # Inicia o servidor de desenvolvimento -export default defineConfig([ - globalIgnores(['dist']), - { - files: ['**/*.{ts,tsx}'], - extends: [ - // Other configs... - // Enable lint rules for React - reactX.configs['recommended-typescript'], - // Enable lint rules for React DOM - reactDom.configs.recommended, - ], - languageOptions: { - parserOptions: { - project: ['./tsconfig.node.json', './tsconfig.app.json'], - tsconfigRootDir: import.meta.dirname, - }, - // other options... - }, - }, -]) +# Build +npm run build # Gera build de produção +npm run preview # Preview do build de produção + +# Qualidade de Código +npm run lint # Executa ESLint + +# Git Auto-Sync +npm run git:sync # Inicia monitoramento Git com build automático +npm run git:sync:nobuild # Inicia monitoramento Git sem build automático ``` + +## 🔄 Git Auto-Sync + +O **Git Auto-Sync** é um sistema de automação que monitora alterações no projeto e realiza commits/push automáticos. + +### Como Usar + +```bash +# Com build automático (recomendado para produção) +npm run git:sync + +# Sem build automático (mais rápido para desenvolvimento) +npm run git:sync:nobuild +``` + +### Características + +- ✅ Monitoramento em tempo real de alterações +- ✅ Debounce de 10 segundos (agrupa alterações) +- ✅ Build automático antes de cada commit +- ✅ Filtragem inteligente de arquivos +- ✅ Mensagens de commit descritivas + +### Documentação Completa + +Para mais detalhes, consulte [GIT-AUTO-SYNC.md](./GIT-AUTO-SYNC.md) + +## 📁 Estrutura do Projeto + +``` +PlatformSistemas/ +├── src/ +│ ├── components/ # Componentes reutilizáveis +│ │ ├── access/ # Componentes de acesso +│ │ ├── admin/ # Componentes administrativos +│ │ ├── layout/ # Componentes de layout +│ │ └── ui/ # Componentes de UI +│ ├── features/ # Features do sistema +│ │ ├── fleet-v2/ # Gestão de frota +│ │ └── ... +│ ├── services/ # Serviços e APIs +│ ├── hooks/ # Custom hooks +│ ├── utils/ # Utilitários +│ └── index.css # Estilos globais +├── public/ # Arquivos públicos +├── docs/ # Documentação +├── .env # Variáveis de ambiente +├── git-auto-sync.ps1 # Script de automação Git +└── package.json # Dependências e scripts +``` + +## 🛠️ Tecnologias + +### Core +- **React 19** - Biblioteca UI +- **TypeScript** - Superset JavaScript +- **Vite** - Build tool e dev server + +### UI/UX +- **TailwindCSS** - Framework CSS +- **Radix UI** - Componentes acessíveis +- **Framer Motion** - Animações +- **Lucide React** - Ícones + +### Estado e Formulários +- **Zustand** - Gerenciamento de estado +- **React Hook Form** - Formulários +- **Zod** - Validação de schemas + +### Roteamento e Requisições +- **React Router DOM** - Roteamento +- **Axios** - Cliente HTTP + +### Gráficos +- **Recharts** - Biblioteca de gráficos + +## 💻 Desenvolvimento + +### Variáveis de Ambiente + +Copie `.env.example` para `.env` e configure: + +```env +VITE_API_URL=https://dev.workspace.itguys.com.br/api +VITE_APP_NAME=PlatformSistemas +``` + +### Padrões de Código + +- **Componentes**: Use componentes funcionais com hooks +- **Tipagem**: Sempre utilize TypeScript +- **Estilos**: Prefira TailwindCSS +- **Estado**: Use Zustand para estado global +- **Formulários**: Use React Hook Form + Zod + +### ESLint + +O projeto usa ESLint para garantir qualidade de código: + +```bash +npm run lint +``` + +### Estrutura de Componentes + +```tsx +// Exemplo de componente +import { useState } from 'react' +import { Button } from '@/components/ui/button' + +interface MyComponentProps { + title: string + onAction?: () => void +} + +export function MyComponent({ title, onAction }: MyComponentProps) { + const [state, setState] = useState(false) + + return ( +