Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
Funding Tracker is a web application designed to manage day trading operation cycles through an intuitive and straightforward dashboard. The application will focus exclusively on displaying relevant financial indicators and data visualizations, maintaining a clean aesthetic that promotes a professional user experience.

## CORE FEATURES
- **Filter Bar**: A dynamic filter bar allowing users to search by cycle name, period, funding amount, category, and status, with a "Clear Filters" button.
- **Indicator Cards**: Display key metrics including Total Profit, Current Equity, Daily Average, Active Days, Active Cycles, and Closed Cycles in easily digestible card formats.
- **Graph of Equity Evolution**: A graphical representation of equity changes over time, providing users with insights into their performance.
- **Monthly Calendar**: A calendar view showing daily net results, with footer metrics for monthly profit, number of entries, and daily average.
- **Ongoing Cycles List**: A comprehensive table listing ongoing cycles with pagination, showing ID, cycle name, funding, category, start date, last entry, days, accumulated profit, status, and action buttons.
- **Add New Cycle Button**: Positioned for easy access, allowing users to quickly add new trading cycles.

## 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**: 
  - Fixed sidebar on the left with a single entry for Dashboard.
  - Main content area divided into two containers: left for the equity graph and right for the monthly calendar.
  - Below the graphs, a full-width container for ongoing cycles with a title and a button for adding new cycles above a modern table.

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

## IMPLEMENTATION STEPS
1. **Set up the React project** with TypeScript and install necessary dependencies including Tailwind CSS and shadcn/ui.
2. **Create the Sidebar component** to house the navigation with a fixed position.
3. **Develop the Filter Bar component**, implementing state management to handle filter criteria.
4. **Build Indicator Cards** to display key metrics, ensuring they are responsive and visually appealing.
5. **Integrate the Graph component** for equity evolution using a charting library (like Chart.js).
6. **Create the Monthly Calendar component** that dynamically displays daily results and footer metrics.
7. **Design the Ongoing Cycles List** with a table component, implementing pagination for better usability.
8. **Add functionality for the New Cycle button** to allow users to initiate the creation of new cycles.
9. **Ensure responsiveness** across different devices and screen sizes using Tailwind CSS utilities.

## USER EXPERIENCE
Users will interact with a clean and organized dashboard where they can quickly filter and view their trading cycles. The interface will provide a seamless experience, enabling users to monitor their performance through visually engaging charts and metrics while maintaining focus on essential information without overwhelming details. The minimalist design will ensure that users can navigate effortlessly, fostering a sense of professionalism and clarity in managing their trading activities.