navigation

# Navigation Guide - Akoto Verify

## Public Pages (No Authentication Required)

### Landing and Information
- **`/`** - Landing page with hero image and main navigation buttons
- **`/about`** - About Us page explaining company purpose and features
- **`/how-to-use`** - Comprehensive usage guide for all user types
- **`/plans`** - Pricing plans overview and signup options
- **`/changelog`** - Version history and release notes (linked from landing page footer)

### Account Creation
- **`/plans/free`** - Free plan signup (0-3 employees, instant setup)
- **`/plans/pro`** - Pro plan signup (up to 100 employees, Stripe payment)
- **`/plans/premium`** - Premium plan signup (up to 300 employees, Stripe payment)
- **`/plans/elite`** - Elite plan signup (up to 900 employees, Stripe payment)
- **`/enterprise/contact`** - Enterprise inquiry form (1000+ employees, custom pricing)

## System Administration (Password Protected)

### Backoffice Access
- **`/backoffice`** - System owner login (requires `AKOTOTECHPASSWORD`)
- **`/companies`** - Company management dashboard (create, view, delete companies)

## Company-Specific Pages

### Company Landing Page
- **`/[company]`** - Company landing page (no authentication required)
  - Choose between Employee login (Face ID) or HR/Admin login
  - Validates company exists before displaying
  - Links to `/[company]/login` and `/[company]/admin`

### HR Administration (Authentication Required)
- **`/[company]/admin`** - HR admin panel (requires HR User ID and password)
  - Employee upload and management
  - Live dashboard of logged-in employees
  - Employee deletion with confirmation
  - Links to settings, search, and security

### Company Settings and Management
- **`/[company]/settings`** - Company configuration (HR authentication required)
  - Employee log access settings
  - Security options (anti-spoofing, geolocation)
  - Work hours and tracking configuration
  - Automated reporting setup

- **`/[company]/search`** - Employee log search and reporting (HR authentication required)
  - Search by employee name and date range
  - Email reports in Excel/CSV format
  - View inactive employees (if enabled)
  - Late arrival tracking

- **`/[company]/security`** - Security incident dashboard (HR authentication required)
  - Anti-spoofing incident reports
  - Screenshot evidence viewing
  - Incident resolution marking

### Employee Access
- **`/[company]/login`** - Employee clock-in page (face verification only)
  - Face verification matches against all registered employees
  - Late arrival reason entry
  - Geolocation consent (if enabled)

- **`/[company]/logout`** - Employee clock-out (automatic or manual)
  - Hours worked calculation
  - Session completion

- **`/[company]/logged-in`** - Employee dashboard (after successful login)
  - Logout button
  - Link to view personal work logs
  - Colleague visibility (if enabled)

- **`/[company]/mylogs`** - Employee self-service log viewing
  - Personal time records
  - Face verification required
  - Date range based on admin settings

- **`/[company]/late-reason`** - Late arrival reason entry (if clocking in late)
  - Dropdown reason selection
  - Custom reason text entry

## Navigation Flow Examples

### Customer Journey
1. **Discovery:** `/` → `/about` → `/how-to-use`
2. **Plan Selection:** `/plans` → Choose plan
3. **Signup:** `/plans/[plan]` → Payment/Setup
4. **HR Setup:** Email notification → `/[company]/admin`

### Daily Employee Usage
1. **Clock In:** `/[company]/login` → Face verification → Dashboard
2. **View Logs:** Dashboard → `/[company]/mylogs` → Personal records
3. **Clock Out:** Dashboard → Logout button → Confirmation

### HR Management
1. **Admin Access:** `/[company]/admin` → Authentication
2. **Add Employee:** Admin panel → Upload form → Email notification
3. **Configure:** Admin panel → Settings → Company preferences
4. **Monitor:** Admin panel → Search/Security → Reports and incidents

### System Administration
1. **Backoffice:** `/backoffice` → Password authentication
2. **Company Management:** `/companies` → Create/view/delete companies
3. **Enterprise Setup:** Manual company creation for custom deployments

## URL Structure Patterns

### Company Slug Generation
- Company name "Acme Corp" → slug "acmecorp"
- All lowercase, spaces removed, special characters stripped
- Used in all company-specific URLs

### Employee ID Format
- Pattern: `[FirstInitial][LastInitial][CompanyRangeNumber]`
- Example: John Doe in company 1 → `JD1456`
- Each company has 999 available employee slots

### Authentication Levels
1. **Public** - No authentication required
2. **HR Admin** - Requires HR User ID and password
3. **Employee** - Requires User ID and face verification
4. **System Owner** - Requires backoffice password

## Mobile and Responsive Design
- All pages optimized for mobile devices
- Face verification works on mobile cameras
- Touch-friendly interface elements
- Responsive grid layouts

## Security Considerations
- Company data completely isolated
- Session management with timeouts
- HTTPS required for production
- Face verification with anti-spoofing
- Geolocation requires explicit consent

This navigation structure provides clear separation between public information, account creation, and authenticated operations while maintaining security and user experience.