Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
Mission Control is a web application designed as an operational system for agent management rather than a conventional dashboard. Its primary purpose is to provide real-time insights and control over agents' activities, task flows, and performance metrics, enabling efficient project management and decision-making.

## CORE FEATURES
1. **Live Ops**: Real-time monitoring of agents with statuses (Active, Idle, Blocked, Error, Stuck), along with their last heartbeat, ongoing tasks, and associated tools. Includes controls to pause agents, execute a kill switch, and disable tools.
   
2. **Task Flow**: Detailed view of task pipelines, tracking the progression through stages (Proposal, Debate, Plan, Execution, Validation, Delivery, Done/Rejected). Displays agent ownership, dependencies, links, accumulated costs, invested time, and results with rejection reasons if applicable.

3. **Replay (Forensic Analysis)**: An interactive chat history between agents, tool calls with inputs and outputs, and a decision log capturing considered alternatives, arguments, and final decisions.

4. **Cost & Efficiency**: Analysis of agent performance by area and task type, showcasing token usage, execution time, error rates, and costs per unit for specific outputs while identifying areas of unnecessary expenditure.

5. **Policies & Guardrails**: Implementation of hard blocks on production attempts, configuration settings per agent for tool access, spending limits, and concurrency caps.

6. **Retention and Cleanup**: Default retention of 90 days with options for manual cleanup in defined ranges. Features intelligent compacting strategies based on project references in GitHub or documentation in Notion.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - Emphasizes a clean and simple design with abundant white space, fostering a distraction-free user experience.
- **Color Mode**: Light theme with dark text on light backgrounds to enhance readability and maintain a clean aesthetic.
- **Layout**: The layout should utilize a grid system that organizes information into clear sections, allowing users to navigate easily between the main views (Live Ops, Task Flow, Replay, Cost & Efficiency, Policies & Guardrails).
- **Typography**: Use a sans-serif font for clarity and modernity. Maintain a clear hierarchy with larger headings for sections and subheadings, ensuring high legibility across different devices.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for a robust, type-safe application.
- **Styling**: Tailwind CSS to facilitate responsive design and maintain a minimalist aesthetic.
- **UI Components**: Utilize shadcn/ui for pre-styled components that align with the clean and simple design requirements.
- **State Management**: Redux or Context API may be implemented as needed for managing application state across different components.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and integrate Tailwind CSS for styling.
2. **Design Layout**: Create a responsive grid layout using Tailwind CSS that includes sections for Live Ops, Task Flow, Replay, Cost & Efficiency, and Policies & Guardrails.
3. **Develop Core Features**:
   - Implement the Live Ops feature with real-time updates using WebSocket or polling for agent statuses.
   - Build the Task Flow section to visualize task progress and manage dependencies.
   - Create the Replay functionality to log agent interactions and decisions.
   - Design the Cost & Efficiency feature to analyze performance metrics and costs.
   - Set up the Policies & Guardrails with configuration options for agents.
4. **Integrate State Management**: Use Redux or Context API to manage the state of agents and tasks effectively.
5. **Conduct Testing**: Ensure that all features work seamlessly across different devices and browsers, focusing on user experience and responsiveness.
6. **Optimize Performance**: Review and refine the application for performance efficiency, ensuring fast load times and smooth interactions.

## USER EXPERIENCE
Users will interact with Mission Control through a streamlined interface, easily navigating between the various operational views. Real-time updates in Live Ops will keep users informed of agent statuses, while the Task Flow will allow for tracking and managing tasks efficiently. The Replay feature will provide critical insights into past decisions, enhancing the overall decision-making process. Each section will be intuitively designed to ensure that users can focus on their tasks without unnecessary distractions, maximizing productivity within a minimalist framework.