Using Claude Sonnet 4.5 to build a CSAT Dashboard
Experiment
Our research team at BrightHR runs monthly CSAT surveys with Admins, Managers, and Employees. Respondents score both the service and the product out of 5. Surveys run for one week each month via Userpilot, displayed directly in our applications.
Then comes the tedious part: exporting CSV files, manually cleaning data, grouping responses, categorising feedback in spreadsheets, generating insights, and emailing summaries to Service teams. Effective? Sure. Scalable? Absolutely not. Time-consuming? You have no idea.
The goal wasn't just to visualise scores. Anyone can make a chart. What product teams actually need is to understand what's working, what's broken, and where to focus improvement efforts across different roles and regions. Fast.
So I built the CSAT Tracker. It transforms raw CSV survey data into actionable insights through interactive visualisations and AI-assisted theme detection. No manual processing. No spreadsheet gymnastics. Just upload your data and start exploring patterns.
Here's the interesting bit: I wanted this to handle sensitive customer feedback without sending anything to external servers. Everything processes client-side in your browser. No APIs. No data transmission. Your feedback stays yours.
Built entirely in VSCode using GitHub Copilot Chat with Claude Sonnet 4.5. Proving you can create production-ready applications with AI assistance when you know what you're building toward.
What I Was Trying To Solve
Product teams need to identify satisfaction trends quickly. Like, really quickly. Not "spend three days in Excel then send an email" quickly. More like "open the dashboard and know where the problems are" quickly.
Regional differences matter too. What works in the UK might not work in Australia. Territory-level views let teams optimise for local contexts rather than painting everything with the same brush.
And when ratings tank, you need details. Not aggregates. Actual quotes from actual users explaining what went wrong. That's where the low-ratings drill-down becomes essential.
The technical challenge was making CSV processing feel instant while running complex analysis entirely client-side. Transform messy survey data into meaningful insights without external dependencies, keeping everything private by default.
What It Does
Dashboard analytics show period comparisons - current month versus previous month with clear visual indicators. Score cards break down CSAT percentages and response counts by role (Admin, Manager, Employee). Interactive line charts track historical trends. Territory breakdown table shows detailed scores per region.
Here's where it gets useful: AI-powered theme analysis running entirely in your browser. Client-side NLP categorises open-ended feedback into themes automatically. Sentiment classification (positive, negative, neutral) using the AFINN-165 wordlist. Detects across 10+ categories - performance issues, service quality, usability, feature requests, bugs, all that. Stacked bar charts showing theme frequency with sentiment-based colour coding.
Low ratings intelligence with multi-select filters for territory, role, star rating, and time period. Full-text search across feedback. One-click CSV export of filtered results. Detailed response cards showing full context.
CSAT calculation follows industry standard: (Ratings ≥ 4 stars / Total ratings) × 100.
Territory mapping handles UK / IE (GB, UK, IE), CA, ANZ (AU, NZ), plus a combined Global view.
All analysis runs in-browser using Papa Parse for CSV processing and Recharts for visualisations. Nothing leaves your machine.
Why It Matters
Product teams get faster insights without manual analysis. Theme categorisation surfaces specific improvement areas immediately instead of requiring someone to read through hundreds of responses categorising them manually.
Territory-level views support localised UX optimisation. What frustrates Australian users might not even register for UK users. Now you can see those differences and address them specifically.
Low-ratings analysis highlights concrete pain points with full qualitative context. Not just "54% gave us 2 stars" but actual quotes like "the mobile app crashes every time I try to submit leave requests."
Client-side architecture benefits are significant:
- Zero API or infrastructure costs (deploy it anywhere)
- Instant analysis of thousands of responses (no server round-trips)
- Privacy-first processing (data never leaves the browser)
- Offline capability (works without internet after initial load)
- Infinite scalability without backend changes (just client CPU)
Export and filtering tools streamline reporting workflows. Filter down to the exact segment you care about, export to CSV, share with stakeholders. Done.
What I Built It With
React 19 for modern hooks and concurrent features. Vite 7 for fast builds. React Router 7 for navigation.
Tailwind CSS v4 with @tailwindcss/vite plugin. shadcn/ui component system on Radix UI primitives. Lucide React for icons.
Data processing with Papa Parse for CSV. Recharts for LineChart, PieChart, BarChart. Compromise.js for natural language processing. Sentiment library based on AFINN-165 wordlist.
Everything computes client-side. Maximum privacy, zero server costs, instant performance.