Ihza MahendraResume
Back to ML engineering & infrastructure
ML engineering & infrastructure

Single dashboard for monitoring every learner on a training platform

An internal dashboard for the team running the platform: overall health across everyone using it, plus one-click drill-down into any single person's activity, submissions, and progress.

What it is

An internal operations dashboard used by the team running an AI training platform, not by the learners themselves. It shows two things at once: overall health across everyone on the platform right now (signups, how many people are actively working, completion rates, who looks at risk of dropping off), and a detailed drill-down into any single person: their portfolio of finished work, their overall progress story, their most recent conversation, the result of their last submission, and how the system currently reads their skill level.

What it's for

The team running the platform shouldn't have to open ten different reports to piece together what's happening with one learner. The same dashboard needs to show the big picture across everyone, flag who's struggling, and then let one click pull up everything the system knows about that specific person: the task they failed, the conversation that explains why, and the entry in their progress story that names the pattern. Reading it all from one place keeps that drill-down coherent instead of stitched across screens.

How it was built

A React 18 plus Vite plus TypeScript app, styled with Tailwind and shadcn/ui, charted with Recharts, fetching from a thin API that pre-aggregates the heavy database queries on the backend so the page never blocks waiting on them. Each panel reads its own pre-aggregated endpoint. The per-person deep-dive view alone fires fifteen parallel requests and renders KPI cards, daily trends, task breakdowns, issue trees, and several distribution panels in one screen. Panels cross-link to each other so navigation stays one click deep: a flagged issue in a distribution panel jumps straight to the specific person, the specific submission, and the specific grading call that produced it.

My role

Major contributor. Owned the per-person deep-dive view, the portfolio viewer, several aggregate panels, and the data layer that pre-aggregates the heavy queries server-side so the page does not block on them.

Built with
React 18ViteTypeScriptTailwind CSSshadcn/uiRechartsSupabase JS

Want the full technical depth, the tradeoffs, what broke, what I'd do differently? Ask the agent about this project.