brave / ads-ui

Self-service ads UI
Mozilla Public License 2.0
21 stars 11 forks source link

feat: improve reporting performance #1210

Closed IanKrieger closed 1 month ago

IanKrieger commented 1 month ago

Resolves https://github.com/brave/ads-ui/issues/1209

Part of: https://github.com/brave/ads-serve/issues/3685


https://github.com/brave/ads-ui/assets/48930920/780938fe-7764-4c10-ae35-4c41fef3d467

github-actions[bot] commented 1 month ago

[puLL-Merge] - brave/ads-ui@1210

Here is my review of the PR:

Description

This PR updates the campaign reporting view with a new analytics dashboard. It allows toggling different metrics, viewing data breakdowns by day, hour, ad set, ad, and OS, and filtering the date range and OS. The old reporting view is still accessible via a "Revert" button.

Changes ### Changes - `src/graphql-client/gql.ts` - Adds new GraphQL queries and fragments for loading the analytics data - `src/hooks/useStickyState.ts` - Adds a new custom hook for persisting state to local storage - `src/routes/campaigns/analytics/*` - Implements the new analytics dashboard components - `AnalyticsOverview.tsx` - Main entry point, shows a warning if campaign hasn't started yet - `CampaignAnalytics.tsx` - Renders the full dashboard - `MetricsList.tsx` - List of metrics with toggles - `ResultsPane.tsx` - Shows the chart or table for the selected breakdown - `breakdowns.tsx` - Definitions of the available data breakdowns - `metrics.ts` - Definitions of the available metrics - `filters/*` - Components for the date range and OS filters - `graphs/*` - Components for rendering the charts - `src/user/User.tsx` - Adds a `/user/main/report/:campaignId` route for the new reporting view - `src/user/views/user/CampaignReportViewSelector.tsx` - Updated to conditionally render the new or old reporting view - Other minor changes to remove an obsolete Dashboard button, update `ReportMenu` styling, etc

Security Hotspots

None identified. The changes primarily implement a new read-only view of existing campaign reporting data.

Let me know if you have any other questions!