Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
RouteFlow is a mobile-first SaaS web application designed for delivery companies. It allows businesses to manage their drivers, routes, and deliveries efficiently while providing a clean and intuitive user experience for both admins and drivers.

## CORE FEATURES
1. **Company Signup**: Enables new companies to register and automatically creates a company record in the database.
2. **Admin Dashboard**: Admins can create and manage drivers, groups, routes, and deliveries through a user-friendly interface.
3. **Driver Dashboard**: Drivers can log in to view their assigned routes, stops, and items, ensuring they have all necessary information at their fingertips.
4. **Role-Based Access Control**: Admins have full control over the system, while drivers have restricted access to their specific information.
5. **Real-Time Data Management**: Updates to routes, deliveries, and items can be made dynamically, ensuring all users have access to the latest information.
6. **Mobile Optimization**: The application is designed with a mobile-first approach, ensuring a seamless experience on smartphones.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - Clean, simple design with plenty of white space, a minimal color palette, and a strong focus on typography.
- **Color Mode**: Light theme with dark text on light backgrounds to enhance readability.
- **Layout**: The application will utilize a card-based layout for displaying information, with large buttons for navigation and interaction, and a straightforward form layout for data input.
- **Typography**: Utilize a sans-serif font for clarity and readability, ensuring a clear hierarchy for headers and body text.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for robust type safety and component structure.
- **Styling**: Tailwind CSS for utility-first styling, allowing for rapid design adjustments and responsiveness.
- **UI Components**: Use shadcn/ui for pre-built components that adhere to the minimalist design.
- **State Management**: Utilize React Context or a state management library as needed for managing application state.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Create a new React project with TypeScript and install Tailwind CSS and shadcn/ui.
2. **Database Configuration**: Set up Supabase with the defined database structure, including tables for companies, users, groups, routes, deliveries, and delivery items. Implement foreign key relationships as specified.
3. **Authentication**: Integrate Supabase Auth for user signup and login functionality. Ensure the correct role-based redirection logic is implemented.
4. **Admin Dashboard Development**: Design and build the admin dashboard with components for creating drivers, groups, routes, and deliveries. Include necessary forms and data visualizations.
5. **Driver Dashboard Development**: Create the driver dashboard that displays assigned routes and deliveries, including a way to mark deliveries as complete.
6. **Responsive Design Implementation**: Ensure all components are mobile-friendly and adapt to various screen sizes using Tailwind's responsive utilities.
7. **Testing and Debugging**: Conduct thorough testing of all functionalities, focusing on user experience and fixing any bugs identified.
8. **Deployment Instructions**: Prepare documentation for deployment, including setup instructions and any required environment variables for Supabase.

## USER EXPERIENCE
Key interactions include:
- **Admin Flow**: Admins can easily navigate to create and manage drivers, groups, and deliveries through a streamlined dashboard interface, utilizing large, mobile-friendly buttons and forms.
- **Driver Flow**: Upon logging in, drivers are presented with their route details, allowing them to efficiently view customer information, item lists, and completion statuses, with easy navigation to mark deliveries as completed.
- **Real-Time Updates**: Users will experience real-time data updates, ensuring that both admins and drivers are always aware of the latest information related to routes and deliveries.

By following these guidelines, the RouteFlow application will provide a comprehensive and user-friendly solution for delivery companies, enhancing their operational efficiency and effectiveness.