- Reorder paths: /api must come before / (more specific first)
- Add path regex pattern /api(/|$)(.*) to match API requests
- Add rewrite-target annotation to strip /api prefix from backend requests
- Enable regex matching with use-regex: "true"
- Change API pathType to ImplementationSpecific for proper regex support
This fixes the 404 errors by ensuring:
1. /api/* requests are correctly routed to the API service
2. The /api prefix is stripped before reaching the Express backend
3. Frontend /* requests fall through to the React SPA
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Replace non-persistent emptyDir with PersistentVolumeClaim for database storage
- Add imagePullSecrets to both API and frontend deployments for private registry access
- Implement database initialization Job that creates schema and populates fake data
- Fix incomplete frontend-deployment.yaml YAML structure
- Add database initialization ServiceAccount with minimal privileges
- Ensure idempotent initialization (checks if DB exists before creating)
- Update kustomization.yaml to include all new resources in correct order
These changes ensure the deployment:
1. Persists database across pod restarts
2. Authenticates with private container registry
3. Automatically initializes the database with schema and sample KPI data
4. Follows DRY and KISS principles with single reusable init job
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
ARCHITECTURE CHANGES:
- API service: Node.js server on port 3001 (Dockerfile.api)
- Frontend service: Nginx serving React on port 80 (Dockerfile.frontend)
- Each service has its own deployment, service, and replicas
- Ingress routes / to frontend and /api/ to API
KUBERNETES MANIFESTS:
- api-deployment.yaml: 2 replicas of Node.js API server
- api-service.yaml: ClusterIP service for API
- frontend-deployment.yaml: 2 replicas of Nginx frontend
- frontend-service.yaml: ClusterIP service for frontend
- Updated ingress.yaml: Routes traffic based on paths
- Updated kustomization.yaml: References new deployments
DOCKER IMAGES:
- Dockerfile.api: Minimal Node.js image for API (~200MB)
- Dockerfile.frontend: Nginx + React build (~50MB)
- Separate builds in workflow for independent versioning
NGINX CONFIGURATION:
- Removed API proxy (separate service now)
- Simplified config for static file serving only
BENEFITS:
- Independent scaling (can scale frontend/API separately)
- Smaller images with minimal base images
- API errors don't affect frontend availability
- Easier to update one service without affecting the other
🤖 Generated with Claude Code
Co-Authored-By: Claude <noreply@anthropic.com>
- Change server_name to '_' (catch-all for any domain)
- Move /static/ location before / to ensure static assets are matched first
- Move root fallback to last location block (must be last for proper priority)
- Change proxy_pass from 'localhost' to '127.0.0.1' for better container networking
- Add index.htm to index directive
These changes ensure:
1. Static assets are served with proper caching before catching with /index.html
2. Root fallback correctly handles React client-side routing
3. Proper nginx location block precedence
🤖 Generated with Claude Code
Co-Authored-By: Claude <noreply@anthropic.com>
The Dockerfile needs access to build/ directory during the COPY step. The .dockerignore was excluding it, causing nginx to have no static files to serve, resulting in 404 errors on /.
The Dockerfile correctly builds the React app in the build stage, but the exclusion prevented it from being used.
🤖 Generated with Claude Code
Co-Authored-By: Claude <noreply@anthropic.com>
- Remove PersistentVolumeClaim definition from deployment.yaml
- Replace persistentVolumeClaim volume with emptyDir for temporary storage
- Database files will be stored in pod memory/disk (ephemeral)
- Pods can now schedule without waiting for storage provisioning
Note: Data is not persistent across pod restarts. For production, implement proper storage class or migrate to persistent storage solution.
🤖 Generated with Claude Code
Co-Authored-By: Claude <noreply@anthropic.com>
- Update kustomization.yaml with newName field for proper image replacement
- Replace individual kubectl apply commands with kustomize build
- Use kustomize edit to dynamically set image tag from CI/CD pipeline
- Simplify deployment to single 'kubectl apply -k' command
- Consolidate verification steps
Benefits:
- Single source of truth for manifest configuration
- Declarative image tag management
- Easier to manage overlays for different environments
- Reduced template duplication
🤖 Generated with Claude Code
Co-Authored-By: Claude <noreply@anthropic.com>
- Change npm ci to install all dependencies (including devDependencies) during build stage
- Run npm ci --only=production after build to minimize final image size
- Fix CMD instruction to use JSON format (resolves Docker warning)
class-variance-authority, tailwindcss, postcss, and other build tools are required during the build process and were missing when using --only=production flag initially.
🤖 Generated with Claude Code
Co-Authored-By: Claude <noreply@anthropic.com>
- Fix package-lock.json sync issue by installing yaml@2.8.1 to satisfy tailwindcss dependency requirements
- Remove redundant test step (--passWithNoTests defeats purpose)
- Consolidate kubectl apply commands into single operation
- Combine kubectl verification with deployment update step
- Remove separate notify job (redundant; use Gitea status checks)
- Add env variables at workflow level for DRY principle
- Improve Docker build efficiency with multi-tag in single command
- Add proper permissions to kubeconfig file
- Simplify action syntax (uses: vs name:)
This reduces workflow execution time and complexity while fixing npm ci errors.
🤖 Generated with Claude Code
Co-Authored-By: Claude <noreply@anthropic.com>
- Add working-directory default to build and deploy jobs
- Fix npm cache lookup to point to dashboard-sqdc/package-lock.json
- Ensure all Node.js and kubectl operations execute from correct directory
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Major Changes:
- Migrate UI to Shadcn components with Tailwind CSS v3
- Implement dark theme as default with improved color scheme
- Optimize homepage layout to fit single screen without scrolling
- Fix chart visibility with explicit colors for dark mode
Deployment Infrastructure:
- Add Docker multi-stage build with Nginx + Node.js
- Create Kubernetes manifests (deployment, service, ingress, PVC)
- Configure Gitea CI/CD workflow with registry integration
- Add deployment scripts with registry support
CI/CD Configuration:
- Registry: gitea.vidoks.fr/sortifal/pfee
- Automatic build and push on commits
- Kubernetes deployment with image pull secrets
- Three-stage pipeline: build, deploy, notify
Documentation:
- Add DEPLOYMENT.md with comprehensive deployment guide
- Add SETUP-REGISTRY.md with step-by-step registry setup
- Add workflow README with troubleshooting guide
- Include configuration examples and best practices
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Added Express server with SQLite database connection.
- Created API endpoints to fetch categories, KPIs, measurements, and statistics.
- Implemented error handling for database operations.
feat: Create ChartModal component for visualizing KPI data
- Developed ChartModal to display line charts for KPI measurements.
- Integrated Chart.js for rendering charts with responsive design.
- Added styling for modal and chart components.
feat: Add ExportModal component for exporting KPI data
- Implemented ExportModal to allow users to select data ranges for export.
- Included radio buttons for predefined time ranges (last week, month, year, all data).
- Styled modal for better user experience.
feat: Introduce RangeChartModal for dynamic range selection
- Created RangeChartModal to visualize KPI data over user-selected time ranges.
- Integrated radio buttons for selecting different time ranges.
- Enhanced chart rendering with Chart.js.
refactor: Create useSQLiteDatabase hook for data fetching
- Developed custom hook to manage fetching categories, KPIs, and measurements.
- Improved error handling and loading states for better user feedback.
style: Add CSS styles for modals and charts
- Created styles for ChartModal, ExportModal, and RangeChartModal.
- Ensured responsive design for various screen sizes.
- Implemented DetailPage for detailed KPI analysis including charts and status badges.
- Created HomePage to display an overview of KPIs categorized by security, quality, delays, costs, and maintenance.
- Introduced KPI types and data structures for better type safety.
- Added styles for DetailPage, HomePage, KPICard, and charts for improved UI.
- Integrated web vitals reporting and setup tests for better performance tracking and testing.
- Included a CSV file with mathematical formulas for KPI calculations.
