Ayush Sharma

Posted on Jun 5

From Monitoring Dashboard to Decision Support Platform: Finishing Jal-Drishti Delhi

#devchallenge #githubchallenge

GitHub “Finish-Up-A-Thon” Challenge Submission

This is a submission for the GitHub Finish-Up-A-Thon Challenge

What I Built

Jal-Drishti Delhi is an urban flooding and hydrology command center designed to explore how municipal authorities can monitor flood-prone areas, assess preparedness, and respond to flooding events across Delhi.

The project was originally built for the Urban Flooding & Hydrology Engine challenge during India Innovates 2026. It already included flood monitoring, hotspot analysis, drainage monitoring, readiness scoring, historical analytics, emergency workflows, and GIS visualization.

While the project was functional, a few planned capabilities never made it into the original version because of time constraints. When I came across the GitHub Finish-Up-A-Thon, I decided to revisit the project and complete those missing pieces rather than starting something new.

Project: Jal-Drishti Delhi
Tech Stack: React, Flask, Leaflet, Recharts
Repository: https://github.com/ayushHardeniya/Jal-Drishti-Delhi
Live Demo: https://jal-drishti-delhi-mu.vercel.app
Architecture Documentation: https://github.com/ayushHardeniya/Jal-Drishti-Delhi/blob/main/ARCHITECTURE.md

Demo

Walkthrough Video

Dashboard Before Finish-Up-A-Thon

Dashboard After Finish-Up-A-Thon

The Comeback Story

The original version already provided:

Flood hotspot monitoring
GIS visualization
Drainage network analysis
Historical flood analytics
Pre-Monsoon Readiness Scoring
Emergency response workflows

However, several parts of the original roadmap were still missing.

Before Finish-Up-A-Thon	After Finish-Up-A-Thon
Flood monitoring	Flood monitoring
Drainage analysis	Drainage analysis
Historical analytics	Historical analytics
Readiness scoring	Readiness scoring
Emergency workflows	Emergency workflows
No resource allocation recommendations	Resource Allocation Engine
No scenario planning capabilities	Flood Scenario Simulator
No centralized reporting workflow	Reports & Exports Center
No deployment recommendations	Prioritized resource recommendations
No comparative simulations	Baseline vs scenario comparison

Rather than redesigning the application, I focused on completing the operational layer that sits between monitoring and action.

1. Resource Allocation Engine

The first major addition was a Planning module.

This feature evaluates flood risk, readiness scores, drainage conditions, and available resources to generate prioritized deployment recommendations.

Each recommendation includes reasoning and estimated impact so that users can understand why a location is being prioritized.

2. Flood Scenario Simulator

The second addition was a Scenario Simulator.

This module allows users to run what-if analyses by changing rainfall intensity and operational conditions. The simulator compares baseline conditions with projected outcomes and highlights the resulting impact on risk, readiness, and response requirements.

3. Reports & Exports Center

The third addition was a Reports & Exports Center.

This brings together operational reporting, planning outputs, scenario reports, and data exports into a single workflow. The goal was to make it easier to generate and share information from within the application instead of relying on multiple pages.

Architecture Approach

One design decision I intentionally kept throughout this work was preserving the existing architecture.

The application remains a Flask + React project with no additional backend services, databases, or major structural changes.

The new functionality was integrated into the existing codebase by extending the current services, APIs, and frontend modules rather than rebuilding them.

This helped keep the project consistent while still adding meaningful capabilities.

A simplified view of the application structure is shown below.

System Overview

React Frontend
│
├─ Dashboard
├─ Hotspots
├─ Drainage
├─ Planning
├─ Scenario Simulator
├─ Reports & Exports
├─ Readiness
└─ Emergency Actions
        │
        ▼
Flask REST API
│
├─ app.py
├─ services.py
└─ data.py
        │
        ▼
Flood Risk Analysis
Readiness Scoring
Resource Allocation
Scenario Simulation
Reporting

Development Evidence

One thing I liked about this challenge was that it encouraged finishing something that already existed.

Instead of starting a new repository, I was able to revisit a project that had been sitting unfinished and complete the parts that were originally postponed.

The implementation work completed during the challenge can be viewed in the merged pull request:

Finish-Up-A-Thon Pull Request

add planning, scenario simulation nd reporting capabilities to Jal-Drishti Delhi #1

ayushHardeniya posted on Jun 05, 2026

contains the work completed while revisiting Jal-Drishti Delhi as part of the GitHub Finish-Up-A-Thon by dev community

the project originally focused on flood monitoring, analytics, readiness scoring, and emergency operations. a few planned capabilities were still missing:

Limitations before Finish-Up-A-Thon

No resource allocation recommendations
No scenario planning module
No multi-day forecast timeline
No downloadable PDF situation reports
No operational deployment recommendations
No comparative flood scenario analysis

these were part of the longer-term roadmap but were left for future development due to tiime constraints during the initial build

the goal of this update was to complete some of the planning and reporting capabilities that were left out in the original version (e.g.)

Original Modules
├─ Dashboard
├─ Hotspots
├─ Drainage
├─ Analytics
├─ Historical
├─ Readiness
└─ Emergency

New Modules
├─ Planning
├─ Scenario Simulator
└─ Reports & Exports

Added (with this PR)

Resource Allocation Engine
- prioritized deployment recommendations
- resource inventory overview
- impact estimates and reasoning for recommendations

Flood Scenario Simulator
- What-if scenario analysis
- baseline vs simulated comparisons
- response planning support

Reports & Exports Center
- centralized access to reports
- operational exports and downloads
- Consolidated reporting workflow

Other updates

Updated navigation nd page structure
Added project branding assets and favicon
Refreshed README and ARCHITECTURE documentation
Minor UI polish and consistency improvements
Added screenshots for project state before and after this finish-up-a-thon

Note: the overall architecture remains unchanged... the new functionality was integrated into the existing Flask + React application without introoducing additional backend services or major architectural changes

View on GitHub

This pull request contains the complete set of changes implemented during the Finish-Up-A-Thon, including the Planning module, Scenario Simulator, Reports & Exports Center, documentation updates, and project assets.

Commit History

GitHub commit history:
https://github.com/ayushHardeniya/Jal-Drishti-Delhi/commits/main/

Deployment History

The repository also contains additional screenshots documenting the project's state before and after the Finish-Up-A-Thon updates, available in the screenshots directory.

My Experience with GitHub Copilot

I used GitHub Copilot throughout this completion process.

Since this was an existing project, the most useful part was not generating entire features automatically but helping me move through an established codebase faster.

I used Copilot to explore implementation paths, understand existing patterns, and speed up repetitive work while keeping the overall architecture consistent.

For larger additions such as the Resource Allocation Engine, Scenario Simulator, and Reports Center, it was particularly useful for navigating the repository and reducing the amount of boilerplate involved in extending the existing system.

The final implementation still required architectural decisions, validation, testing, and integration work, but Copilot helped reduce the friction of revisiting and expanding an older project.

DEV Community