dbis_core/frontend/README.md

DBIS Admin Console - Frontend

React + TypeScript frontend application for the DBIS Admin Console system.

Setup

cd frontend
npm install

Development

npm run dev

The app will be available at http://localhost:3001

Build

npm run build

Environment Variables

Create a .env file based on .env.example:

VITE_API_BASE_URL=http://localhost:3000
VITE_APP_NAME=DBIS Admin Console
VITE_REAL_TIME_UPDATE_INTERVAL=5000

Features

• DBIS Admin Console: Global network control and monitoring
• SCB Admin Console: Jurisdiction-scoped administration
• Permission-based UI: Controls shown/hidden based on user permissions
• Real-time updates: Polling-based dashboard updates
• Responsive design: Works on desktop, tablet, and mobile

Project Structure

src/
  components/
    shared/        # Reusable components (DataTable, Modal, Button, etc.)
    admin/         # Admin-specific components
    layout/        # Layout components (Sidebar, TopBar, etc.)
    auth/          # Authentication components
  pages/
    dbis/         # DBIS admin pages
    scb/          # SCB admin pages
    auth/         # Auth pages
  services/
    api/          # API clients
    auth/         # Auth service
  hooks/          # Custom React hooks
  stores/         # Zustand stores
  utils/          # Utility functions
  types/          # TypeScript types
  constants/      # Constants

Tech Stack

• React 18
• TypeScript
• Vite
• React Router v6
• Zustand (state management)
• React Query (data fetching)
• Recharts (charts)
• React Hot Toast (notifications)
• React Icons