Sm - modern, premium, multi-tenant real estate CRM application for villa projects using:
Generated Prompt
```markdown ## APPLICATION OVERVIEW Build a modern, premium multi-tenant real estate CRM application designed for villa projects. This web application will facilitate client management, activity tracking, and project oversight, enabling real estate professionals to streamline their workflows and enhance productivity. ## CORE FEATURES 1. **Multi-Tenant Support**: Seamlessly manage multiple projects (e.g., Haut Sur Mer, Les Trois Golfs) with a unified database structure that ensures global client uniqueness and project-specific activities. 2. **Client Management**: Track clients through different stages (Lead, BDV) with automatic status updates based on activities, ensuring timely follow-ups and streamlined conversions. 3. **Activities Dashboard**: Centralize all client activities with a clear overview displaying status, next steps, and deadlines, supporting efficient task management without a separate task table. 4. **Stock Management & Map View**: Showcase available properties on a responsive map with color-coded availability, enhancing client engagement through interactive visuals. 5. **Proposition Management**: Link propositions to clients and stock properties with a robust status tracking system that triggers payment schedules upon conversion. 6. **Comprehensive Dashboard**: Utilize Mantine UI components to create a dynamic dashboard displaying key metrics such as leads, conversion rates, and revenue forecasts. ## DESIGN SPECIFICATIONS - **Visual Style**: Modern SaaS aesthetic with a premium green real estate theme. Focus on a clean, simple design with ample white space and minimal color palette. - **Color Mode**: Light theme featuring deep emerald and forest green as primary colors, complemented by an off-white background for a fresh appearance. - **Layout**: Utilize Mantine AppShell for global layout with a collapsible left navbar, notification bell, project switcher, and a right panel for unassigned leads. Ensure a responsive design that adapts to various screen sizes. - **Typography**: Implement a clean sans-serif font for headings and body text, maintaining a clear hierarchy with appropriate font sizes for titles, subtitles, and body copy. ## TECHNICAL REQUIREMENTS - **Framework**: React with TypeScript - **Styling**: Mantine (core + hooks + form) for UI components, using Mantine's spacing system exclusively. - **State Management**: TanStack Query for data fetching and TanStack Table for table management. - **Database & Auth**: Supabase for authentication and data storage, with Zod for data validation. - **Animations**: Framer Motion for subtle animations enhancing user interactions, such as card entrances and modal transitions. ## IMPLEMENTATION STEPS 1. **Initialize Project**: Set up a Vite project with React and TypeScript. 2. **Install Dependencies**: Add Mantine, TanStack Query, TanStack Table, Recharts, Supabase, Zod, FullCalendar, and Framer Motion to the project. 3. **Set Up Global Layout**: Implement Mantine AppShell, configuring the header, left navbar, and right panel as per design specifications. 4. **Create Data Models**: Establish the required data models in Supabase for projects, clientele, activities, propositions, and notifications. 5. **Develop Core Components**: Build components for client management, activity tracking, stock views, and dashboard analytics, leveraging Mantine UI patterns for consistency. 6. **Integrate State Management**: Use TanStack Query for data fetching operations and TanStack Table for displaying data in table format. 7. **Implement User Interactions**: Ensure all client interactions, such as adding activities or propositions, open modals with pre-filled forms for a seamless user experience. 8. **Add Notification System**: Create a notification system to alert users of new leads, payment due dates, and proposition validations. 9. **Test Across Devices**: Ensure the application is responsive and functions correctly across various devices through thorough testing. ## USER EXPERIENCE The application will provide a smooth user experience, with intuitive navigation through the project switcher and the collapsible navbar. Users can easily access client details, activities, and stock information. The Kanban-style BDV pipeline view will allow users to manage leads effectively while the dashboard will present essential performance metrics at a glance. Each interaction, like adding a new activity, will be straightforward, ensuring users can focus on their tasks without distractions. ```
Loved by thousands of makers from
From early prototypes to real products, they started here.







































Generate optimized prompts for your vibe coding projects
Generate prompt
Enter a brief description of the app you want to build and get an optimized prompt
Review and use your prompt
Review (and edit if necessary) the generated prompt, then copy it or open it directly in your chosen platform
Get inspired with new ideas
Get AI-generated suggestions to expand your product with features that will surprise your users
Frequently Asked Questions
Everything you need to know about creating better prompts for your Lovable projects
Still have questions?
Can't find what you're looking for? We're here to help!
