How sumanng03-svg/bloodconnect-india-platform works
BloodConnect India is a React blood-coordination interface. Users can explore availability, enroll as donors, submit emergency blood requests, and view hospital-network and operational dashboards. The app shell holds mock request, inventory, hospital, donor, archive, and audit state and passes it to its views; the sampled code shows local state updates rather than a server-backed workflow. View-specific behavior beyond the excerpts is represented only where the tree and sampled imports support it.
Main entry points: App.tsx Application state and routing · DonateBloodView.tsx Donor profile and donations · RequestBloodView.tsx Emergency request form · HomeView.tsx Availability and enrollment
Components 16
App shell
- Application state and routing
src/App.tsx - Navigation and role controls
src/components/Header.tsx - Role sign-in modal
src/components/AuthModal.tsx - Notifications
src/components/NotificationToast.tsx - Footer navigation
src/components/Footer.tsx - Initial coordination data
src/data/mockData.ts - Domain data types
src/types/bloodConnect.ts
Blood coordination
- Availability and enrollment
src/views/HomeView.tsx - Emergency request form
src/views/RequestBloodView.tsx - Facility location picker
src/components/OpenStreetMapModal.tsx - Hospital network
src/views/HospitalNetworkView.tsx
Donor services
- Donor profile and donations
src/views/DonateBloodView.tsx - Donor ID token
src/components/DonorIdTokenModal.tsx
Network operations
- Live operations explorer
src/views/LiveExplorerView.tsx - Administration dashboard
src/views/AdminDashboardView.tsx
Other components
- Platform user
Connections 26
- Platform user → Navigation and role controls: navigates
- Navigation and role controls → Application state and routing: changes view
- Platform user → Application state and routing: uses application
- Application state and routing → Navigation and role controls: renders
- Application state and routing → Availability and enrollment: renders
- Application state and routing → Emergency request form: renders
- Application state and routing → Hospital network: renders
- Application state and routing → Donor profile and donations: renders
- Application state and routing → Live operations explorer: renders
- Application state and routing → Administration dashboard: renders
- Application state and routing → Footer navigation: renders
- Application state and routing → Initial coordination data: initializes state
- Availability and enrollment → Application state and routing: requests reservation
- Availability and enrollment → Application state and routing: enrollment callback
- Emergency request form → Facility location picker: opens picker
- Facility location picker → Emergency request form: confirms facility
- Emergency request form → Application state and routing: submits request
- Application state and routing → Donor profile and donations: passes donor data
- Donor profile and donations → Application state and routing: updates donor
- Donor profile and donations → Application state and routing: adds archive record
- Donor profile and donations → Donor ID token: opens token
- Application state and routing → Role sign-in modal: renders modal
- Role sign-in modal → Application state and routing: returns role
- Application state and routing → Notifications: renders alerts
- Application state and routing → Domain data types: uses domain models
- Initial coordination data → Domain data types: defines typed data