Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The project is a web application designed to streamline the code cleaning process for developers using an anti-gravity IDE. It focuses on removing unnecessary code, enhancing readability, and improving overall code quality. The application aims to provide a user-friendly interface that simplifies code management and optimization.

## CORE FEATURES
1. **Code Analysis**: Automatically scans and analyzes code to identify redundant or unused sections, providing detailed reports on potential improvements.
2. **Clean-Up Suggestions**: Offers actionable suggestions for code refactoring and optimization based on best practices.
3. **Interactive Code Editor**: A minimalist editor that allows users to edit their code directly within the application with live feedback on changes.
4. **Version Control Integration**: Seamlessly integrates with popular version control systems (e.g., Git) to manage code changes effectively.
5. **User Profiles and Settings**: Allows users to create profiles, save preferences, and customize their code cleaning settings.
6. **Real-Time Collaboration**: Enables multiple users to work on the same code base simultaneously, facilitating teamwork and peer reviews.

## 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 will feature a top navigation bar, a central interactive code editor, a sidebar for suggestions and analysis results, and a footer with user profile links and settings.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui.
- **State Management**: Use React Context API for state management across the application.

## IMPLEMENTATION STEPS
1. **Set up the React project**: Create a new React application using Create React App with TypeScript support.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui to the project. Configure Tailwind CSS as per the documentation.
3. **Create Layout Components**: Build the main layout structure including the navigation bar, sidebar, code editor area, and footer.
4. **Implement Code Analysis Feature**: Develop the backend logic to analyze code and return suggestions. Connect this logic to the frontend.
5. **Build the Interactive Code Editor**: Integrate a code editor component that allows users to edit and save their code.
6. **Add User Profile Functionality**: Implement user authentication and settings management using React Context API.
7. **Integrate Version Control**: Use APIs to connect with Git repositories for version control functionalities.
8. **Implement Real-Time Collaboration**: Use WebSocket or similar technologies for enabling real-time collaboration features.

## USER EXPERIENCE
Users will interact with the application through a clean and intuitive interface. They will start by uploading or pasting their code into the interactive editor. As they work, real-time suggestions and analysis results will appear in the sidebar, allowing them to make informed decisions about their code. Users can save their progress, manage their profiles, and collaborate with others seamlessly, all while enjoying a minimalist and distraction-free environment.