Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
VmtCRM Connect is a web application designed for the commercial area of Viamatica, providing a comprehensive customer relationship management system. It leverages Supabase for backend services, including database management, authentication, and real-time data handling, enabling users to efficiently manage clients, contacts, and collaborations while ensuring robust security measures.

## CORE FEATURES
1. **User Authentication**: Secure login using Supabase Auth with domain restrictions, ensuring only Viamatica personnel can access the application.
2. **Dashboard**: Personalized dashboards for both Admin and Commercial roles, displaying relevant KPIs, metrics, and real-time data visualizations.
3. **Account Management**: A comprehensive module for querying and managing client accounts, allowing users to add notes and contacts, with inline editing capabilities.
4. **Collaboration Requests**: Functionality for users to request collaborations on accounts assigned to other commercial representatives.
5. **Relationship Tree**: An interactive tree structure for visualizing commercial relationships, available exclusively for Admin users.
6. **User Management**: Admin capabilities to manage user roles, create new users, and deactivate accounts directly within the application.

## 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 layout consists of a collapsible sidebar for navigation, a top navbar for user details and session management, and main content areas that adapt to the selected module, ensuring a responsive design that enhances user experience.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: React Context API or Zustand for managing global state effectively.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install necessary dependencies (React Router, Supabase client, Tailwind CSS).
2. **Configure Supabase**: Set up Supabase project and configure environment variables for database URL and anon key.
3. **Implement Authentication**: Create a login page that uses Supabase Auth for user login and includes error handling for domain restrictions.
4. **Build Dashboard**: Develop the dashboard component with conditional rendering for Admin and Commercial roles, integrating dynamic data from Supabase.
5. **Create Account Management Module**: Design the account management interface with search functionality, inline editing, and interaction for adding notes and contacts.
6. **Develop Collaboration Requests**: Implement modal functionality for collaboration requests, ensuring data is written to Supabase and reflected in the UI.
7. **Construct User Management Interface**: Build the admin user management section to allow creation and deactivation of users.
8. **Integrate Real-Time Updates**: Utilize Supabase's real-time capabilities to ensure data displayed is always current, with appropriate loaders and error handling.
9. **Test Responsiveness**: Ensure the application is mobile-friendly and functions well across different screen sizes.

## USER EXPERIENCE
Key user interactions include seamless navigation through the sidebar, real-time searching and filtering in the account management module, and intuitive dashboards that provide quick insights into individual and team performance. Users will experience smooth transitions between modules, with clear feedback on actions taken, such as successful submissions or errors encountered during data entry. The application will prioritize user-friendly design, ensuring a minimal learning curve for new users.