Deployment & Hosting

• Vercel - Frontend and backend hosting
• MongoDB Atlas - Cloud database hosting
• Git - Version control

✨ Key Features

🚗 Driver Management

• Complete CRUD Operations: Add, edit, view, and delete drivers
• Driver Profile Management: Personal information, contact details, and documents
• License Management: Track driving license types, numbers, and expiration dates
• Vehicle Information: Vehicle type, make, model, year, and color tracking
• Document Upload: Profile pictures and license document uploads with validation
• Driver Status Tracking: Available, on_route, unavailable status management
• Assignment History: Track past route assignments and performance
• Bulk Operations: Select and delete multiple drivers at once

🛣️ Route Management

• Complete CRUD Operations: Create, edit, view, and delete routes
• Location Tracking: Start and end location management
• Route Details: Distance, duration, cost, and speed specifications
• Status Management: Unassigned, assigned, in progress status tracking
• Driver Assignment: Assign and unassign drivers to routes
• Conflict Detection: Prevent double assignments and availability conflicts
• Bulk Operations: Select and delete multiple routes at once
• Route Filtering: Filter by status, duration, and search terms

📊 Dashboard & Analytics

• Real-time Statistics: Live driver and route counts
• Activity Feeds: Comprehensive logging of all system activities
• Export Functionality: CSV export for drivers, routes, and activity feeds
• Search & Filtering: Advanced search across all entities
• Pagination: Efficient handling of large datasets
• Responsive Tables: Mobile-friendly data display

🔄 Smart Scheduling

• Availability Checking: Real-time driver and route availability validation
• Conflict Resolution: Automatic detection of scheduling conflicts
• Assignment Logic: Intelligent driver-route matching
• Status Synchronization: Real-time updates across the system
• Activity Logging: Complete audit trail of all changes

📱 User Interface

• Responsive Design: Mobile-first approach with cross-device compatibility
• Modern UI/UX: Clean, intuitive interface design with smooth animations
• Page Transitions: Smooth page-to-page navigation with Framer Motion
• Component Animations: Staggered animations for lists, tables, and cards
• Modal-based Editing: Streamlined editing experience with animated modals
• Loading States: Proper loading indicators and error handling
• Toast Notifications: User-friendly success and error messages
• Accessibility: Keyboard navigation and screen reader support
• Internet Connectivity: Real-time connection status monitoring with retry functionality

🔧 Advanced Features

• File Upload System: Secure image and document uploads with validation
• Data Validation: Client-side and server-side validation
• Error Handling: Comprehensive error management with user feedback
• URL State Management: Filter states preserved in URL parameters
• Unsaved Changes Protection: Prevents accidental data loss
• Bulk Actions: Efficient management of multiple records
• Internet Connectivity Monitoring: Real-time connection status with floating notifications
• Advanced Animations: Framer Motion-powered smooth transitions and micro-interactions
• Table Row Animations: Bottom-to-top staggered animations for data tables
• Hover Effects: Enhanced button and card interactions with CSS transforms

🚀 Installation Instructions

Prerequisites

• Node.js (v18 or higher)
• npm or yarn package manager
• Git

Local Setup

1. Clone the repository

   git clone https://github.com/Ahmed-Maher77/driver-scheduling-system.git
   cd driver-scheduling-system
   

2. Backend Setup

   # Install dependencies
   cd Backend-server
   npm install
   # Configure your MongoDB connection string in .env
   PORT=3001    # Port number
   DATABASE_URL="mongodb+srv://<db_username>:<db_password>@cluster0.ldoyyda.mongodb.net/?appName=Cluster0"    # MongoDB connection string
   # Start the server
   npm start
   

3. Frontend Setup

   cd Frontend-client
   npm install
   # Configure environment variables
   VITE_API_BASE_URL=http://localhost:3001
   # Start the development server
   npm run dev
   

4. Access the application

   • Frontend: http://localhost:5173
   • Backend API: http://localhost:3001

📁 Project Structure

driver-scheduling-system/
├── Backend-server/                # Node.js API server
│   ├── models/                    # Database models (Drivers, Routes, ActivityFeeds)
│   ├── routes/                    # API route handlers
│   │   ├── AddNewDriver_Route.js
│   │   ├── EditDriver_Route.js
│   │   ├── DeleteDriver_Route.js
│   │   ├── AddNewRoute_Route.js
│   │   ├── EditRoute_Route.js
│   │   ├── DeleteRoute_Route.js
│   │   ├── GetActivityFeeds_Route.js
│   │   ├── UploadImageOnServer_Route.js
│   │   └── ... (18 total routes)
│   ├── utils/                     # Utility functions
│   │   ├── serverManager.js
│   │   ├── driverIdGenerator.js
│   │   └── routeIdGenerator.js
│   ├── index.js                   # Server entry point
│   └── package.json
├── Frontend-client/               # React application
│   ├── src/
│   │   ├── assets/               # Static assets (images, icons)
│   │   ├── components/           # Reusable UI components
│   │   │   ├── DriversPage_Components/
│   │   │   ├── RoutesPage_Components/
│   │   │   ├── ActivityFeedsPage_Components/
│   │   │   ├── Dashboard_Components/
│   │   │   └── SharedModalComponents/
│   │   ├── pages/                # Page components
│   │   │   ├── Dashboard/
│   │   │   ├── DriversPage/
│   │   │   ├── DriverDetailsPage/
│   │   │   ├── RoutesPage/
│   │   │   ├── RouteDetailsPage/
│   │   │   ├── ActivityFeedsPage/
│   │   │   ├── AboutPage/
│   │   │   ├── ContactPage/
│   │   │   └── CalendarPage/
│   │   ├── utils/                # Utility functions and hooks
│   │   │   ├── functions/        # Utility functions
│   │   │   └── hooks/            # Custom hooks
│   │   │       ├── api/          # API hooks (React Query)
│   │   │       └── activity-feeds/
│   │   ├── common/               # Shared components and utilities
│   │   │   ├── Animations/       # Framer Motion animation components
│   │   │   │   ├── AnimatedPage/
│   │   │   │   ├── AnimatedComponent/
│   │   │   │   ├── AnimatedList/
│   │   │   │   ├── AnimatedModal/
│   │   │   │   ├── AnimatedTableRow/
│   │   │   │   ├── AnimatedButton/
│   │   │   │   └── AnimatedLoadingSpinner/
│   │   │   ├── InternetChecker/  # Internet connectivity monitoring
│   │   │   └── Types/            # Shared types and interfaces
│   │   └── main.tsx              # Application entry point
│   ├── public/                   # Static assets
│   └── package.json
└── README.md

📚 API Documentation

Core Endpoints

Drivers

• GET /get-all-drivers - Retrieve all drivers with pagination and filtering
• GET /get-driver-details/:id - Get specific driver details
• POST /add-new-driver - Create a new driver
• PUT /edit-driver/:id - Update driver information
• DELETE /delete-driver/:id - Remove a driver
• DELETE /delete-bulk-drivers - Bulk delete drivers

Routes

• GET /get-all-routes - Retrieve all routes with pagination and filtering
• GET /get-route-details/:id - Get specific route details
• POST /add-new-route - Create a new route
• PUT /edit-route/:id - Update route information
• DELETE /delete-route/:id - Remove a route
• DELETE /delete-bulk-routes - Bulk delete routes

Dashboard & Analytics

• GET /get-dashboard-stats - Get dashboard statistics
• GET /get-activity-feeds - Retrieve activity logs with filtering
• GET /get-assigned-routes-by-month - Get monthly route assignments

Availability & Validation

• GET /check-driver-availability/:id - Check driver availability
• GET /check-route-availability/:id - Check route availability

File Management

• POST /upload-image-on-server - Upload images and documents

Sample Request/Response

Get All Drivers

GET /get-all-drivers?page=1&limit=10&status=available&vehicleType=Car

Response

{
    "data": [
        {
            "driver_id": "DR001",
            "name": "John Doe",
            "phone": "+1234567890",
            "status": "available",
            "license_type": "B",
            "vehicle_type": "Car",
            "assignedRoute": null,
            "joined_at": "2024-01-15T10:30:00Z"
        }
    ],
    "currentPage": 1,
    "totalPages": 5,
    "totalDocs": 50,
    "hasNextPage": true,
    "hasPreviousPage": false
}

🎯 Key Pages & Features

Dashboard

• Real-time statistics overview
• Quick access to recent activities
• System health monitoring

Drivers Management

• Drivers List: Paginated table with search and filtering
• Driver Details: Comprehensive driver profile view
• Add Driver: Modal form with validation and file upload
• Edit Driver: Full driver information editing
• Bulk Actions: Select and manage multiple drivers

Routes Management

• **Routes