Commit Graph

3 Commits

Author SHA1 Message Date
972bb50c64 Replace emoji icons with Lucide icons and soften link colors
Replaced emoji icons throughout the Angular app with modern Lucide icon library for a more professional and consistent look matching the original static site design.

**Icon Updates:**
- Navigation tabs: Database, Upload, Search icons
- Toolbar buttons: RefreshCw, Sparkles, Search, X icons
- Action buttons: Download, Trash2 icons
- Form buttons: Upload, Search, X icons

**Style Improvements:**
- Added softer blue color for artifact links (#93c5fd)
- Added hover effect with lighter blue (#bfdbfe)
- Added proper cursor pointer for clickable rows
- Improved icon color consistency throughout

**Dependencies:**
- Added lucide-angular (v0.545.0) for icon support
- Bundle size: 356.54 kB (raw) → 93.91 kB (gzipped)
- Minimal impact: only +7.79 kB for full icon library

All components updated with Lucide imports and icon references.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-10-15 12:19:36 -05:00
0856ca5b7a Downgrade to Angular 19 and add custom npm registry package-lock regeneration
**Angular Downgrade:**
- Downgraded from Angular 20 to Angular 19 for better stability
- Updated all @angular/* packages to ^19.0.0
- Adjusted TypeScript to ~5.8.0 for Angular 19 compatibility
- Added required outputPath and index to angular.json for Angular 19 build requirements
- Verified production build works successfully

**NPM Registry Enhancements:**
- Updated Dockerfile.frontend to regenerate package-lock.json when custom npm registry is provided
- When NPM_REGISTRY is set to custom URL, the build will:
  1. Configure npm to use the custom registry
  2. Delete existing package-lock.json
  3. Generate new package-lock.json with custom registry URLs
  4. Run npm ci with the new lock file
- Default behavior (npmjs.org) unchanged - uses existing package-lock.json

**Build Verification:**
- Local build tested: ✓
- Docker build tested: ✓
- Bundle size: 348.75 kB raw, 91.73 kB gzipped
- No vulnerabilities found

**Usage:**
```bash
# Default registry (uses existing package-lock.json)
./quickstart.sh

# Custom registry (regenerates package-lock.json)
NPM_REGISTRY=http://your-npm-proxy:8081/repository/npm-proxy/ ./quickstart.sh
```

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-10-15 12:03:42 -05:00
d69c209101 Migrate frontend to Angular 20 with full Docker support
Implemented a complete Angular 20 migration with modern standalone components architecture and production-ready Docker deployment:

**Frontend Migration:**
- Created Angular 20 application with standalone components (no NgModules)
- Implemented three main components: artifacts-list, upload-form, query-form
- Added TypeScript models and services for type-safe API communication
- Migrated dark theme UI with all existing features
- Configured routing and navigation between views
- Set up development proxy for seamless API integration
- Reactive forms with validation for upload and query functionality
- Auto-refresh artifacts every 5 seconds with RxJS observables
- Client-side sorting, filtering, and search capabilities
- Tags displayed as inline badges, SIM source grouping support

**Docker Integration:**
- Multi-stage Dockerfile for Angular (Node 24 build, nginx Alpine serve)
- nginx configuration for SPA routing and API proxy
- Updated docker-compose.yml with frontend service on port 80
- Health checks for all services
- Production-optimized build with gzip compression and asset caching

**Technical Stack:**
- Angular 20 with standalone components
- TypeScript for type safety
- RxJS for reactive programming
- nginx as reverse proxy
- Multi-stage Docker builds for optimal image size

All features fully functional and tested in Docker environment.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-10-15 11:35:28 -05:00