Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application is designed to provide users with a seamless experience for managing and integrating various AI APIs, including Lovable, Claude, DeepSeek, ChatGPT, Gemini, and NotebookLLM. The application aims to enhance functionality and user engagement by allowing users to easily connect to these APIs and utilize their capabilities in a streamlined, interactive environment.

## CORE FEATURES
1. **API Integration**: Users can input API keys for various AI services, and the application will validate and store them securely.
2. **Interactive Dashboard**: A user-friendly dashboard that displays the status of connected APIs, usage statistics, and error reporting.
3. **User Authentication**: Secure login and registration system to manage user accounts and protect sensitive information.
4. **Dynamic API Queries**: Users can perform queries against connected APIs and view results in real-time, with options to export data.
5. **Settings Management**: Users can customize application settings, including theme preferences and API connection settings.
6. **Feedback System**: An integrated feedback mechanism for users to report issues or request new features directly within the app.

## 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 include a top navigation bar, a central dashboard area for API interactions, and a sidebar for quick access to settings and user profile options.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Redux or Context API for state management as needed.

## IMPLEMENTATION STEPS
1. **Set up the React application** using Create React App with TypeScript template.
2. **Install dependencies**: Add Tailwind CSS, shadcn/ui, and any state management libraries (like Redux).
3. **Create the folder structure**: Organize components, pages, and services for better maintainability.
4. **Implement user authentication**: Create login, registration, and session management functionalities.
5. **Develop the dashboard**: Build the main dashboard layout, integrating the API input forms and displaying results dynamically.
6. **Add API integration logic**: Ensure that the application can handle API requests and responses securely.
7. **Design the UI components**: Utilize Tailwind CSS for styling and ensure the design adheres to the specified design specifications.
8. **Testing**: Conduct thorough testing for functionality, usability, and responsiveness across devices.
9. **Deploy**: Once tested, deploy the application to a cloud service for public access.

## USER EXPERIENCE
Users will begin by registering or logging into the application. Upon successful login, they will be greeted with a clean and intuitive dashboard where they can easily input their API keys. They will have options to perform queries and view results immediately. The design allows for straightforward navigation through different sections, ensuring users can manage their settings and feedback effortlessly. The minimalist design enhances focus and usability, making the experience smooth and engaging.