Lovable Prompt Creator - AI Prompt Generator

```markdown
## APPLICATION OVERVIEW
This web application is designed for monitoring convoys in real-time, providing operators with a professional and efficient tool to manage and visualize convoy movements. The focus is on delivering a seamless user experience that prioritizes performance, stability, and ease of use during monitoring operations.

## CORE FEATURES
1. **Map Visualization**: Implement a professional-grade map using OpenStreetMaps, focusing on operational monitoring with clear visibility of national routes, provincial roads, and other relevant geographical features.
   
2. **Convoy Selection**: Automatically select and center the first active convoy upon entry, ensuring that operators immediately focus on the relevant convoy without unnecessary navigation.

3. **Dynamic Position Updates**: Allow for smooth transitions and automatic zoom recalculation when operators switch between convoys, enhancing the user experience.

4. **Formation Line Drawing**: Visually represent the current formation of a convoy with a connecting line between vehicles, automatically updating as positions change.

5. **Custom Markers**: Redesign vehicle markers to clearly differentiate roles within the convoy while maintaining consistent styling across the application.

6. **Vehicle Popup Information**: Provide detailed popups upon vehicle selection, displaying essential information such as license plate, role, speed, and last communication time.

## DESIGN SPECIFICATIONS
- **Visual Style**: minimalist - Clean, simple design with plenty of white space, minimal color palette, and focus on typography
- **Color Mode**: Light theme with dark text on light backgrounds
- **Primary Color**: #1978E5 (accent for buttons, links, highlights)
- **Typography**: Use Inter from Google Fonts for headings, Inter for body text and UI elements
- **Border Radius**: 8px (moderately rounded) for buttons, cards, and inputs
- **Layout**: The main layout should consist of a left panel for convoy selection, a central map area for visualization, and popups for additional vehicle information, ensuring easy navigation and a clear visual hierarchy.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Recoil or Context API (specify based on complexity)

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript, integrating Tailwind CSS for styling.
2. **Map Integration**: Replace MapLibre with OpenStreetMaps and configure the necessary components to render the map correctly.
3. **Develop Convoy Selection Logic**: Implement functionality to auto-select the first convoy, centering the map and adjusting the zoom level accordingly.
4. **Dynamic Updates**: Create functions to handle position updates dynamically while ensuring fluid transitions between convoy views.
5. **Design Markers and Popups**: Redesign vehicle markers and implement popups to show essential vehicle information.
6. **Testing and Optimization**: Rigorously test the application for performance under various scenarios, ensuring that the map and components behave as expected.

## USER EXPERIENCE
Operators will enter the module and immediately see the first active convoy highlighted on the map. The design will facilitate easy switching between convoys with smooth animations, providing a modern and professional user experience. The application will ensure real-time updates and maintain a high level of performance, allowing operators to focus on their task without distractions.
```