Skip to content

Commit 90860a2

Browse files
raviroxonnraviroxonn
authored
Merge pull request #15 from ajayku267/main
react_frontend_ui
2 parents c14354b + be066c8 commit 90860a2

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

61 files changed

+23719
-34
lines changed

‎README.md‎

Lines changed: 113 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,61 +1,140 @@
1-
# Emergency Medical Portal
1+
# MediSync - Emergency Medical Response System
22

3-
An open-source project to improve emergency medical response and inter-hospital coordination.
3+
MediSync is a comprehensive emergency medical response and hospital coordination system designed to streamline emergency response operations and improve patient care outcomes.
44

5-
## Project Goal
5+
## Project Overview
66

7-
To create a centralized system that facilitates rapid response to emergencies, efficient patient transfer, and real-time communication between hospitals and emergency services.
7+
MediSync is built to address the critical need for efficient emergency medical response coordination. The system connects hospitals, emergency responders, and medical staff in real-time, enabling faster response times and better resource allocation.
88

9-
## Features (Planned)
9+
## Key Features
1010

11-
- Automatic accident detection and alert system
12-
- Real-time hospital status and capacity tracking
13-
- Inter-hospital patient data sharing
14-
- Intelligent patient routing to appropriate facilities
15-
- Emergency service coordination (ambulance, police, fire department)
11+
### Real-time Emergency Response
12+
- Instant emergency case tracking and management
13+
- Automated resource allocation
14+
- Real-time status updates and notifications
15+
- GPS-based routing and navigation
1616

17-
## Current Status
17+
### Hospital Coordination
18+
- Live bed availability tracking
19+
- Department and specialty management
20+
- Resource sharing between facilities
21+
- Patient transfer coordination
1822

19-
This project is in its initial planning and development phase. We're actively seeking contributors to help bring this vision to life.
23+
### Staff Management
24+
- Real-time staff availability tracking
25+
- Shift management and scheduling
26+
- Expertise-based assignment
27+
- Performance monitoring
2028

21-
## How to Contribute
29+
### Analytics and Reporting
30+
- Response time analytics
31+
- Resource utilization reports
32+
- Performance metrics
33+
- Trend analysis and predictions
2234

23-
We welcome contributions from developers, healthcare professionals, and anyone passionate about improving emergency medical services. See our [CONTRIBUTING.md](CONTRIBUTING.md) for more details.
35+
## System Architecture
2436

25-
## Setup
37+
The project is structured into two main components:
38+
39+
### Frontend (/frontend)
40+
- Modern Progressive Web Application (PWA)
41+
- Built with React, TypeScript, and Material-UI
42+
- Real-time updates and offline support
43+
- Responsive design for all devices
44+
- See [Frontend README](frontend/README.md) for details
45+
46+
### Backend (/backend)
47+
- RESTful API service
48+
- Real-time data processing
49+
- Secure authentication and authorization
50+
- Scalable microservices architecture
51+
- Database management and optimization
52+
53+
## Technology Stack
54+
55+
### Frontend
56+
- React 18 with TypeScript
57+
- Material-UI v5
58+
- Chart.js for data visualization
59+
- Leaflet for mapping
60+
- PWA capabilities
61+
62+
### Backend (Planned)
63+
- Node.js/Express.js
64+
- PostgreSQL
65+
- Redis for caching
66+
- WebSocket for real-time updates
67+
- Docker containerization
68+
69+
## Getting Started
2670

2771
1. Clone the repository:
28-
```
29-
git clone https://github.com/yourusername/emergency-med-portal.git
30-
cd emergency-med-portal
72+
```bash
73+
git clone https://github.com/yourusername/MediSync.git
74+
cd MediSync
3175
```
3276

33-
2. Create a virtual environment and activate it:
34-
```
35-
python -m venv venv
36-
source venv/bin/activate # On Windows, use `venv\Scripts\activate`
77+
2. Set up the frontend:
78+
```bash
79+
cd frontend
80+
npm install
81+
npm run dev
3782
```
3883

39-
3. Install the required packages:
40-
```
41-
pip install -r requirements.txt
84+
3. Set up the backend (coming soon):
85+
```bash
86+
cd backend
87+
npm install
88+
npm run dev
4289
```
4390

44-
4. Run the API:
45-
```
46-
python src/api/app.py
47-
```
91+
## Development Roadmap
4892

49-
5. Run tests:
50-
```
51-
python -m unittest discover tests
52-
```
93+
### Phase 1 - Frontend Development (Current)
94+
- [x] Project setup and configuration
95+
- [x] UI component development
96+
- [x] PWA implementation
97+
- [x] Real-time updates
98+
- [ ] Testing and optimization
99+
100+
### Phase 2 - Backend Development
101+
- [ ] API development
102+
- [ ] Database setup
103+
- [ ] Authentication system
104+
- [ ] Real-time communication
105+
- [ ] Testing and documentation
106+
107+
### Phase 3 - Integration and Enhancement
108+
- [ ] Frontend-backend integration
109+
- [ ] Performance optimization
110+
- [ ] Security hardening
111+
- [ ] User acceptance testing
112+
- [ ] Deployment preparation
113+
114+
## Contributing
115+
116+
We welcome contributions to the MediSync project! Please see our [Contributing Guidelines](CONTRIBUTING.md) for details.
117+
118+
### Development Process
119+
1. Fork the repository
120+
2. Create your feature branch
121+
3. Commit your changes
122+
4. Push to the branch
123+
5. Create a Pull Request
53124

54125
## License
55126

56127
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
57128

58129
## Contact
59130

60-
connect@roxonn.com
131+
Project Maintainer: [Your Name]
132+
Email: [your.email@example.com]
133+
Project Link: [https://github.com/yourusername/MediSync](https://github.com/yourusername/MediSync)
134+
135+
## Acknowledgments
136+
137+
- Emergency medical professionals for their input and feedback
138+
- Open source community for various tools and libraries
139+
- Contributors and testers
61140
# emergency-med-portal

‎frontend/.gitignore‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
pnpm-debug.log*
8+
lerna-debug.log*
9+
10+
node_modules
11+
dist
12+
dist-ssr
13+
*.local
14+
15+
# Editor directories and files
16+
.vscode/*
17+
!.vscode/extensions.json
18+
.idea
19+
.DS_Store
20+
*.suo
21+
*.ntvs*
22+
*.njsproj
23+
*.sln
24+
*.sw?

‎frontend/README.md‎

Lines changed: 172 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,172 @@
1+
# MediSync Frontend
2+
3+
A modern, responsive Progressive Web Application (PWA) for emergency medical response and hospital coordination.
4+
5+
## Features
6+
7+
### Dashboard
8+
- Real-time emergency monitoring with interactive statistics
9+
- Live response time tracking and trend analysis
10+
- Staff availability and status monitoring
11+
- Hospital occupancy visualization
12+
- Emergency case management with severity indicators
13+
- Interactive charts for data visualization
14+
- System status monitoring with key metrics
15+
16+
### Hospital Management
17+
- Comprehensive hospital listing with multiple view options (Card, Table, Map)
18+
- Real-time bed availability tracking
19+
- Department and specialty filtering
20+
- Interactive map view with hospital locations
21+
- Detailed hospital information cards
22+
- Quick actions for emergency coordination
23+
- Advanced search and filtering capabilities
24+
25+
### Emergency Response
26+
- Active emergency case tracking
27+
- Severity-based prioritization
28+
- Real-time status updates
29+
- Staff assignment management
30+
- Response time monitoring
31+
- Location-based emergency routing
32+
- Incident reporting and documentation
33+
34+
### Staff Management
35+
- Staff availability tracking
36+
- Role-based access control
37+
- Shift management
38+
- Expertise and specialty tracking
39+
- Real-time status updates
40+
- Performance metrics
41+
- Quick communication tools
42+
43+
### Settings & Configuration
44+
- User preferences management
45+
- System configuration
46+
- Notification settings
47+
- Theme customization
48+
- Language preferences
49+
- Integration settings
50+
- Access control management
51+
52+
## Technical Stack
53+
54+
- **Framework**: React 18 with TypeScript
55+
- **UI Library**: Material-UI (MUI) v5
56+
- **State Management**: React Context API
57+
- **Routing**: React Router v6
58+
- **Data Visualization**: Chart.js with react-chartjs-2
59+
- **Maps**: Leaflet with react-leaflet
60+
- **PWA Support**: Vite PWA plugin
61+
- **Build Tool**: Vite
62+
- **Package Manager**: npm
63+
- **Code Quality**: ESLint, TypeScript
64+
65+
## Getting Started
66+
67+
### Prerequisites
68+
69+
- Node.js (v16 or higher)
70+
- npm (v7 or higher)
71+
72+
### Installation
73+
74+
1. Clone the repository:
75+
```bash
76+
git clone https://github.com/yourusername/MediSync.git
77+
cd MediSync/frontend
78+
```
79+
80+
2. Install dependencies:
81+
```bash
82+
npm install
83+
```
84+
85+
3. Start the development server:
86+
```bash
87+
npm run dev
88+
```
89+
90+
4. Build for production:
91+
```bash
92+
npm run build
93+
```
94+
95+
### Development
96+
97+
The project follows a modular architecture with the following structure:
98+
99+
```
100+
frontend/
101+
├── src/
102+
│ ├── components/ # Reusable UI components
103+
│ ├── pages/ # Main application pages
104+
│ ├── routes/ # Routing configuration
105+
│ ├── styles/ # Global styles and themes
106+
│ ├── assets/ # Static assets
107+
│ └── utils/ # Utility functions
108+
├── public/ # Public assets
109+
└── vite.config.ts # Vite configuration
110+
```
111+
112+
## Progressive Web App Features
113+
114+
- Offline support with service workers
115+
- Installable on mobile devices
116+
- Push notifications
117+
- Background sync
118+
- Responsive design for all devices
119+
- App-like experience
120+
121+
## Performance Optimizations
122+
123+
- Code splitting and lazy loading
124+
- Image optimization
125+
- Caching strategies
126+
- Minimized bundle size
127+
- Optimized assets
128+
- Performance monitoring
129+
130+
## Security Features
131+
132+
- HTTPS enforcement
133+
- Secure data transmission
134+
- Input validation
135+
- Authentication and authorization
136+
- Session management
137+
- API security
138+
- Data encryption
139+
140+
## Accessibility
141+
142+
- WCAG 2.1 compliance
143+
- Screen reader support
144+
- Keyboard navigation
145+
- Color contrast compliance
146+
- Focus management
147+
- Semantic HTML
148+
- ARIA attributes
149+
150+
## Browser Support
151+
152+
- Chrome (latest)
153+
- Firefox (latest)
154+
- Safari (latest)
155+
- Edge (latest)
156+
- Mobile browsers
157+
158+
## Contributing
159+
160+
1. Fork the repository
161+
2. Create your feature branch (`git checkout -b feature/AmazingFeature`)
162+
3. Commit your changes (`git commit -m 'Add some AmazingFeature'`)
163+
4. Push to the branch (`git push origin feature/AmazingFeature`)
164+
5. Open a Pull Request
165+
166+
## License
167+
168+
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
169+
170+
## Contact
171+
172+
Project Link: [https://github.com/yourusername/MediSync](https://github.com/yourusername/MediSync)

‎frontend/dev-dist/registerSW.js‎

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)