Lovable Prompt Creator - AI Prompt Generator

# APPLICATION OVERVIEW
"Zap do Rei" is a web application designed for automating communications via WhatsApp. It provides businesses with tools to enhance customer engagement through chatbots, automated messaging, and analytics, enabling them to efficiently handle inquiries and outreach.

# CORE FEATURES
- **User Authentication**: Secure login and signup capabilities for users to access their personalized dashboards.
- **Dashboard**: Overview of key metrics including messages received, response times, and customer satisfaction ratings.
- **Chatbot Builder**: A visual flow builder to create automated message responses and interactions.
- **Campaign Management**: Tools to create, schedule, and track mass messaging campaigns.
- **Conversation Management**: An organized interface for managing customer conversations with tagging and quick response features.
- **Compliance Assurance**: Features ensuring all communications adhere to WhatsApp's policies, including API usage badges.

# 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 consists of a sidebar for navigation, a central content area for metrics, chat, and campaign management, and responsive design for mobile compatibility.

# TECHNICAL REQUIREMENTS
- Framework: React with TypeScript
- Styling: Tailwind CSS
- UI Components: shadcn/ui
- State Management: Redux (for managing application state, if needed)

# IMPLEMENTATION STEPS
1. **Set up the React application** using Create React App with TypeScript template.
2. **Install necessary dependencies**: Tailwind CSS, shadcn/ui for UI components, and Redux for state management.
3. **Create the folder structure**:
   - `/components` for reusable components
   - `/pages` for different application pages (Home, Login, Signup, Dashboard, Chatbot, Disparos, Conversas)
   - `/redux` for state management
4. **Implement routing** using React Router to navigate between pages.
5. **Develop the authentication flow**: Create Login and Signup components and connect to a backend service for user management.
6. **Build the Dashboard**: Create the dashboard layout with cards displaying metrics and a sidebar for navigation.
7. **Develop the Chatbot Builder**: Implement the visual flow builder with drag-and-drop functionality for creating chatbot interactions.
8. **Create the Campaign Management**: Develop interfaces for creating and managing messaging campaigns.
9. **Implement conversation management**: Design the chat interface with features for tagging and quick responses.
10. **Ensure compliance features** are in place with clear messaging about API usage and privacy policies.

# USER EXPERIENCE
Users will experience a streamlined interface allowing them to quickly navigate between different functionalities. The dashboard will provide immediate insights through visual metrics, while the chatbot builder will enable users to create automated flows with ease. Notifications for new messages and a responsive design will enhance the overall user experience, ensuring that users can manage their communications effectively, whether on desktop or mobile devices.