What I shipped today: Usage Management View

Hey all, super excited to share what I shipped today for AIBillingDashboard.com - my AI spending analytics tool for tracking, analyzing, and optimizing your spending across all AI services — from LLMs like Claude, GPT, and Gemini to AI workflow tools like Make, Zapier, and n8n, plus specialized AI services like Tavily, Pinecone, and RunwayML — all in one unified dashboard.

So I pushed the complete Usage Management module to production! Finally got all four key components working together nicely:

UsageManagement - Main component that ties everything together with filtering, searching, and that sweet pagination

UsageDataForm - Clean form for adding/editing usage data with dynamic fields

UsageDataList - Interactive list view with sorting that actually works now

UsageFilterBar - Date-range filtering with MUI DatePickers (upgraded from react-datepicker)

The biggest win was switching to Material UI's DatePicker - much cleaner UI and better mobile experience. Had to wrestle with dayjs formatting for a bit (those timezone issues were killing me 😅), but it's all smooth now.

Added support for all platforms we're tracking and got it working end to end.

Demo up on landing page!

Also, I updated the landing page's demo walkthrough video showing how easy it is to track your spending across OpenAI, Claude, Gemini, and other platforms all in one place.

What's been your experience tracking AI platform costs? Are you just winging it with spreadsheets or is there a better way I'm missing?