feat(dashboard): implement producer earnings dashboard with analytics and charts (#18) - #20
Open
Simultech369 wants to merge 1 commit into
Open
Conversation
… and charts (Crate-Protocol#18) - Create Producer Analytics Dashboard on Profile page - Implement 4 overview stat cards (Lifetime Earned, This Month with growth %, Pending Balance, Total Sales) with mini sparklines - Implement interactive SVG Revenue Trends chart (30d, 90d, 1y periods with hover tooltips) - Implement sortable Beat Performance table with top-earner gold badge - Implement Recent Sales activity feed with transaction explorer links - Implement complete Withdrawal History log with explorer links and status badges - Add analytics service (analytics.ts) and useProducerStats hook with daily bucket aggregations - Add comprehensive unit tests in src/__tests__/analytics.test.ts
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary of Changes
This pull request resolves #18 by transforming the Profile page into a full-fledged Producer Earnings & Analytics Dashboard, complete with lifetime revenue metrics, monthly growth tracking, SVG area revenue charts, beat sales performance tables, and historical withdrawal logs.
🎯 Key Implementations
Earnings Overview Stat Cards (
src/components/StatsCard.tsx)get_earningswith one-click claim action.Interactive SVG Revenue Trend Chart (
src/components/RevenueChart.tsx)Beat Performance Table (
src/components/BeatPerformanceTable.tsx)Recent Sales Activity Feed (
src/components/SalesFeed.tsx)Lease,Premium,Exclusive), XLM volume, relative timestamps, and direct Stellar block explorer links.Withdrawal History Log (
src/components/WithdrawalHistory.tsx)Analytics Service & Custom Hook (
src/services/analytics.ts,src/hooks/useProducerStats.ts)aggregateSalesByDay), growth rate calculations (calculateGrowth), and scoped localStorage persistence per connected wallet address.Contract Integration (
src/contracts/crate.ts)getSamplesByUploaderquerying producer samples from the contract.🧪 Verification & Testing
npx vitest run: