Driving School App - Copy this React, Tailwind Component to your project
Generate a layout file using React and Tailwind CSS for a driving school management application. The layout should include: Header: Display the logo on the left, and user information (profile picture, name) with a dropdown for profile and logout on the right. If the user is not logged in, show 'Login' and 'Signup' buttons instead. Ensure the header is sticky and adjusts well on mobile devices. Sidebar Navigation: Depending on the user role (student, trainer, or admin), show different navigation options. Students: Practice slots, my bookings, progress, payments, exams. Trainers: Schedule, attendance, student progress, payment confirmation. Admins: Manage practice sessions, trainer schedules, payments, exams, reports. The sidebar should collapse into a hamburger menu on smaller screens. Main Content Area: The content should be dynamically loaded based on the active route, ensuring smooth transitions between pages. The layout should be flexible to accommodate different types of content (lists, calendars, forms). Footer: Add a simple footer with the driving school’s contact information and links to terms and conditions, privacy policy, and support. Responsiveness: Ensure the layout is mobile first and responsive for various screen sizes. Use Tailwind’s utility classes to handle responsive breakpoints
