Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application will integrate the ipinfo.io API to detect whether an IP or ASN is abusive. The primary purpose is to provide users with an intuitive interface to check the status of IP addresses, facilitating quick and informed decisions about network security. The app will focus on simplicity and ease of use, aligning with a minimalist design aesthetic.

## CORE FEATURES
1. **IP Address Lookup**: Users can input an IP address to retrieve detailed information about its status, including whether it is flagged as abusive.
2. **ASN Lookup**: Users can enter an Autonomous System Number (ASN) to check associated IP addresses and their abuse status.
3. **User Authentication**: Secure user accounts for saving search history and preferences.
4. **Dashboard**: A user-friendly interface displaying recent searches and their results for quick access.
5. **API Integration**: Seamless connection to the ipinfo.io API for real-time data retrieval.
6. **Responsive Design**: The application will be fully responsive, ensuring a smooth experience on both desktop and mobile devices.

## 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 will consist of a header with the application title, a central input area for IP/ASN lookups, and a results section displaying the retrieved data. The dashboard will organize recent searches in a clean, card-based layout.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui.
- **State Management**: Use React's built-in state management for simplicity.

## IMPLEMENTATION STEPS
1. **Set Up the Project**: Initialize a new React project using Create React App with TypeScript.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui for styling and UI components.
3. **Create API Service**: Develop a service to interface with ipinfo.io API for IP and ASN lookups.
4. **Build Components**:
   - Header Component: Displays the app title and navigation links.
   - Input Component: For users to enter IP addresses or ASNs.
   - Results Component: To show the lookup results in a user-friendly format.
   - Dashboard Component: To list recent searches and their outcomes.
5. **Implement User Authentication**: Set up user accounts with authentication for saving searches.
6. **Design and Style**: Apply Tailwind CSS styles to ensure a minimalist aesthetic and responsive design.
7. **Testing**: Conduct thorough testing, focusing on functionality and user experience.
8. **Deployment**: Deploy the application on a hosting platform of choice.

## USER EXPERIENCE
The application will guide users through the lookup process with clear instructions. Users will interact with a straightforward input field to enter an IP address or ASN. Upon submission, results will be displayed in a concise format, highlighting whether the IP is abusive. The dashboard will allow users to quickly access their recent searches, enhancing usability and efficiency. The overall experience will prioritize clarity and ease of use, ensuring users can obtain the information they need without unnecessary complexity.