SaaS Platform

Alerts Monitoring Dashboard

Originally built as a take-home engineering assignment and maintained as a portfolio piece, this dashboard gives a manager a clean way to view, filter, search, and act on employee alerts — switching between direct reports and an entire reporting subtree, with server-side pagination and idempotent dismiss actions.

2 weeksSource

The Problem

Managers needed a way to monitor alerts across their team without wading through an unfiltered list or losing track of which alerts had already been actioned — especially across larger, multi-level reporting structures.

The Solution

Built a React/TypeScript frontend with fully controlled filter state and a debounced search input, paired with a Django backend that models employees as a self-referential hierarchy — enabling efficient subtree traversal for the "direct reports vs. entire subtree" toggle, plus indexed queries and deterministic seed data for testing.

Architecture

React + TypeScript frontend (components, api layer, types)

Django backend with a self-referential Employee model supporting subtree traversal

Alert model with severity/status enums and indexed fields for query performance

REST-style API endpoints with server-side pagination

Deterministic seed data fixtures for predictable local testing

Technologies Used

ReactTypeScriptDjangoTailwind CSS

Challenges

1Modeling an org hierarchy that supports efficient subtree queries without recursive query blowup
2Keeping filter, search, and pagination state fully controlled and free of UI jank
3Making the dismiss action idempotent so duplicate clicks can't produce inconsistent state

Engineering Trade-offs

1Chose a self-referential employee model over a separate closure/hierarchy table — a simpler schema with one fewer join, at the cost of subtree queries needing careful indexing to stay fast as the org grows
2Debounced search client-side instead of server-side — fewer round trips and a simpler backend, at the cost of a small delay before results update while typing
3Chose server-side pagination over loading the full alert list client-side — the UI stays fast regardless of team size, at the cost of extra query complexity to keep counts accurate across filters

Lessons Learned

1A take-home assignment is a good forcing function for clean architecture under real time pressure
2Idempotent actions are worth the extra design effort even in smaller internal tools

Related Projects

View all

Featured

SaaS Platform

Proova

Revenue attribution SaaS that tracks influencer-driven revenue from WhatsApp, DMs, and offline payments.

View project

SaaS Platform

FinOps Ops Console

An operations dashboard for refund and dispute risk, built on the insight that most chargebacks aren't fraud — they're refunds that were missed or delayed.

View project

Featured

Financial Infrastructure

TxCore

Financial transaction infrastructure with distributed backend, double-entry accounting, and webhook processing.

View project

Alerts Monitoring Dashboard