A modern border control and passenger management system built with React, featuring comprehensive passenger and gate management capabilities with advanced UI/UX components.
- Gate Management System: Full CRUD operations for border gates
- 6-Tab Gate Forms: Add and edit gates with comprehensive configuration
- Advanced Gate View: Modern UI with timelines, progress bars, and document galleries
- Gate Statistics: Real-time performance metrics and monitoring
- Modern Card-Based Layouts: Professional information display
- Interactive Timelines: Activity tracking for passengers and gates
- Progress Bars: Visual assessment scores and performance metrics
- Document Galleries: Image previews with modal viewers
- Mobile-Responsive Design: Optimized for all screen sizes
- Enhanced List View: Advanced search, filtering, and sorting
- 6-Tab Add/Edit Forms: Comprehensive passenger data entry
- Modern View Page: Card-based layout with timelines and progress bars
- Document Management: Upload and preview passenger documents
- Biometric Integration: IRIS, fingerprint, and face recognition support
- Gate Configuration: Entry/Exit gates with IRIS biometric priority
- Hardware Specifications: Model, manufacturer, dimensions, config files
- Security Settings: Risk thresholds, watchlist integration
- Performance Monitoring: Real-time statistics and activity tracking
- Fully Automated: Complete automation level configuration
- 50+ Radix UI Components: Professional component library
- Enhanced Badge Colors: Vibrant, high-contrast status indicators
- Full-Width Controls: Consistent dropdown and calendar styling
- Tab Completion Icons: Visual progress indicators
- Responsive Design: Mobile and desktop compatibility
- Secure Login System: Persistent authentication state
- Protected Routes: Role-based access control
- Data Validation: Real-time form validation and error handling
- Audit Trails: Change tracking and history logging
- Frontend: React 18+ with Vite
- UI Library: Radix UI components
- Styling: Tailwind CSS
- Routing: React Router v7
- Icons: Lucide React
- State Management: React hooks and context
- Node.js 18 or higher
- npm or pnpm package manager
# Extract the application archive
tar -xzf guardian-gate-v3.0.0.tar.gz
cd guardian-gate
# Install dependencies
npm install
# Start development server
npm run dev
# Open browser to http://localhost:5173
# Build for production
npm run build
# Preview production build
npm run preview
- Use any credentials to access the system
- Authentication state persists across sessions
- Dashboard: Overview and statistics
- Passenger Management: Complete passenger lifecycle
- Gate Management: Border gate configuration and monitoring
- Reporting: Analytics and reports (coming soon)
- Settings: System configuration (coming soon)
Passenger Management:
- Navigate to Passenger Management
- Use search and filters to find passengers
- Add new passengers with 6-tab form
- Edit existing passenger data
- View detailed passenger profiles
Gate Management:
- Navigate to Gate Management
- Configure new gates with hardware specs
- Set security and biometric settings
- Monitor gate performance and activity
- Edit gate configurations as needed
guardian-gate/
├── src/
│ ├── components/
│ │ ├── ui/ # Reusable UI components
│ │ ├── Enhanced*Passenger* # Passenger management components
│ │ ├── Enhanced*Gate* # Gate management components
│ │ └── ComprehensiveDashboard.jsx
│ ├── services/
│ │ ├── mockPassengerService.js
│ │ └── mockGateService.js
│ └── App.jsx # Main application with routing
├── public/
│ └── images/ # Sample images and documents
├── package.json
├── README.md
├── VERSION.md
└── INSTALLATION.md
- Modern UI: Card-based layouts with hover effects
- Interactive Timeline: Travel history with status indicators
- Progress Bars: Assessment scores with visual feedback
- Document Gallery: Image previews with zoom functionality
- Mobile Responsive: Optimized for all devices
- Hardware Configuration: Model, manufacturer, dimensions
- Biometric Setup: IRIS primary, secondary options
- Security Configuration: Risk thresholds, watchlist integration
- Performance Monitoring: Real-time statistics and alerts
- Activity Timeline: Gate usage and maintenance history
- Vibrant Badge Colors: High-contrast status indicators
- Consistent Design: Unified color scheme and typography
- Enhanced Forms: Full-width controls and validation
- Tab Completion: Visual progress indicators
- Responsive Layout: Works on all screen sizes
- v3.0.0: Complete Gates Module + Enhanced UI/UX
- v2.0.0: Enhanced Passenger Management + Badge Colors
- v1.0.0: Initial Release with Core Features
For questions, issues, or feature requests, please refer to the documentation or contact the development team.
This project is proprietary software. All rights reserved.