Ligtas Dagupan is a crisis coordination platform for citizens, volunteers, and local responders in Dagupan City, Philippines. Its interface brings incident reports, volunteer offers, city offices, and tide information into a shared map.
I worked on the web application and its data flow, including the map-component refactor and shared data hooks recorded in the repository. This case study focuses on inspectable implementation decisions rather than assuming an official city deployment or measured emergency-response outcomes.
Purpose and constraints#
Location is central to this product. A report needs enough context to place it on the map, an offer needs a meaningful service location, and a tracker needs to find the same record the map displays.
The reporting workflow supports browser geolocation and manual pin adjustment. The documented report lifecycle moves through pending, dispatched, and resolved states. Volunteer offers have their own availability states, so an incident and a relief resource remain distinct kinds of information.
The existing screenshot above shows the public map interface. It demonstrates the presentation and navigation, not a live incident count or a record of an actual emergency.
Architecture and implementation scope#
Next.js and React provide the application interface. Leaflet displays location-based records, while Supabase supplies authentication, PostgreSQL data, storage, and real-time database change events.
The repository separates incident markers, offer markers, city-office markers, map styling, and data hooks. My refactor moved shared incident and volunteer queries into useMapData.ts, allowing the map and history view to read the same React Query cache.
| Data | Source | Update behavior |
|---|---|---|
| Incidents | Supabase incidents | Cache invalidated by database changes |
| Volunteer offers | Supabase volunteer_offers | Shared cache and reference-counted subscription |
| City offices | Supabase city_offices | Refetched on map mount; no real-time channel in this hook |
| Donation events | Sui event query | Testnet ledger polls the configured event type |
Design decision: share subscriptions as well as records#
Before the refactor, the map and history panel each queried the same tables and opened their own real-time channels. The shared hook uses one cached query per data type and reference-counted channels keyed by table.
When another consumer mounts, it increments the channel's count. When a consumer unmounts, it decrements the count; the last consumer removes the channel. Database events invalidate the corresponding query rather than trying to patch every view independently.
This removes the duplicate-subscription path when the history panel is opened. It is an architectural outcome visible in source, not a measured bandwidth or latency percentage.
Weather and donation boundaries#
The repository documents a tide pipeline using cached and published records with weather inputs from Stormglass and Open-Meteo. Computed risk values and third-party inputs need timestamps and interpretation; their presence does not establish forecast accuracy or official emergency guidance.
The inspected donation ledger queries Sui DonationEvent records and links to a testnet explorer. It displays the returned events, amounts, and transaction references. This supports an inspectable testnet donation flow rather than a claim about production relief funds or independently verified disbursement.
Demonstrable outcomes and limits#
The code contains shared incident and volunteer data hooks, separate marker components, and tide auto-publication tests. The existence of those tests is source evidence; this portfolio update does not claim to have rerun the other repository's complete test suite.
Deployment configuration, data quality, responder adoption, access-control review, and real-world reliability require their own validation. No response-time improvement, active-user count, or forecast-accuracy figure is asserted here.
Explore the project#
Open the Ligtas Dagupan demo for the public interface. The application source is private; the implementation observations above come from the repository's shared map hooks, donation ledger, project documentation, and commit history.