# DBIS Admin Console - Features

## Complete Feature List

### ✅ Authentication & Authorization
- JWT token-based authentication
- Role-based access control (RBAC)
- Permission-based UI rendering
- Protected routes
- Session management
- Auto-logout on token expiration

### ✅ Dashboard Pages

#### DBIS Admin Console (7 pages)
1. **Global Overview**
   - Network health monitoring
   - Settlement throughput metrics
   - GRU liquidity dashboard
   - Risk flags overview
   - SCB status table
   - Real-time data polling

2. **Participants & Jurisdictions**
   - SCB directory with search/filter
   - Connectivity status indicators
   - Jurisdiction settings viewer
   - Template policy application

3. **GRU Command Center**
   - Monetary classes management (M00, M0, M1, etc.)
   - GRU indexes tracking
   - Bond issuance windows
   - Supranational pools
   - Lock/unlock controls
   - Issuance proposal creation

4. **GAS & QPS Control**
   - GAS metrics and utilization
   - Asset-level limits management
   - QPS mapping profiles
   - Bandwidth throttling
   - Real-time utilization gauges

5. **CBDC & FX**
   - CBDC wallet schema viewer
   - CBDC type approval workflow
   - FX routing configuration
   - Cross-border corridor setup
   - FX price trend charts

6. **Metaverse & Edge**
   - Metaverse Economic Nodes (MEN) management
   - On-ramp controls
   - 6G Edge GPU Grid monitoring
   - Load balancing controls
   - Node quarantine functionality

7. **Risk & Compliance**
   - SARE (Sovereign AI Risk Engine) heatmap
   - ARI (Autonomous Regulatory Intelligence) alerts
   - Ω-Layer incidents tracking
   - Alert acknowledgment
   - Stress test triggers

#### SCB Admin Console (3 pages)
1. **Overview Dashboard**
   - Domestic network health
   - Local GRU/CBDC metrics
   - Corridor view
   - Real-time updates

2. **FI Management & Nostro/Vostro**
   - Financial institution directory
   - FI approval/suspension workflow
   - Daily limit management
   - API profile assignment
   - Nostro/Vostro accounts management
   - Account opening workflow

3. **Corridor & FX Policy**
   - Cross-border corridor configuration
   - Daily cap management
   - Preferred asset settings
   - FX policy table
   - FX rate trend visualization

### ✅ Shared Components

#### Layout Components
- DashboardLayout (3-column responsive grid)
- SidebarNavigation (collapsible, with icons)
- TopBar (user info, logout)
- PageContainer (consistent page wrapper)

#### Data Display
- DataTable (sortable, filterable, paginated, exportable)
- MetricCard (KPI widgets with trends)
- StatusIndicator (health status lights)
- Badge (status badges)
- EmptyState (empty data states)
- PageError (404, 403, 500 pages)

#### Forms & Inputs
- FormInput (text, number, email)
- FormSelect (single/multi-select)
- FormTextarea (with character count)
- Button (with loading, variants, icons)
- Modal (with backdrop, keyboard navigation)
- ConfirmationDialog

#### Charts & Visualization
- LineChart (time series)
- BarChart (comparisons)
- PieChart (distributions)
- GaugeChart (utilization)
- Heatmap (risk visualization)

#### Utilities
- LoadingSpinner (inline and full-page)
- Tooltip (hover tooltips)
- ExportButton (CSV/JSON export)
- ErrorBoundary (error catching)

### ✅ Features

#### Real-time Updates
- Polling-based updates (10-15s intervals)
- WebSocket support (hooks ready)
- Automatic data refresh
- Manual refresh controls

#### Export Functionality
- CSV export
- JSON export
- Table data export
- Custom filename support

#### Error Handling
- Global error boundary
- Page-level error handling
- API error interceptors
- User-friendly error messages
- Development error details

#### Permission System
- PermissionGate component
- usePermissions hook
- Role-based navigation
- Conditional UI rendering
- Permission checks on actions

#### Responsive Design
- Mobile-friendly layouts
- Tablet optimization
- Desktop 3-column grid
- Collapsible sidebar
- Touch-friendly controls

### ✅ Developer Experience

#### Code Quality
- TypeScript throughout
- ESLint configuration
- Prettier formatting
- Path aliases
- Consistent component patterns

#### Utilities & Hooks
- useRealtimeUpdates (polling/WebSocket)
- useDebounce (debounced values)
- useLocalStorage (persistent state)
- usePermissions (permission checks)
- Format utilities (currency, numbers, dates)

#### API Integration
- Centralized API client
- Request/response interceptors
- Automatic token refresh
- Error handling
- Loading states

## Technology Stack

- **React 18** - UI framework
- **TypeScript** - Type safety
- **Vite** - Build tool
- **React Router v6** - Routing
- **Zustand** - State management
- **React Query** - Data fetching
- **Recharts** - Charts
- **React Hot Toast** - Notifications
- **React Icons** - Icons
- **date-fns** - Date formatting
- **zod** - Validation

## Browser Support

- Chrome (latest)
- Firefox (latest)
- Safari (latest)
- Edge (latest)

## Performance

- Code splitting
- Lazy loading ready
- Optimized re-renders
- Efficient data polling
- Memoized components