Add network map preview page - #11
Merged
Merged
Conversation
Adds a /network-map page showing HyperBit's physical infrastructure on a real Leaflet map: Milano (Seeweb, Green Building) as the main PoP, MINAP (Seeweb) and PCIX (Naquadria, Piacenza) as active IX presence, and STIX (Bolzano) and VSIX (Università di Padova) as IX in activation. Also updates the peering-policy and homepage data so PCIX shows as active instead of upcoming, and applies non-breaking npm audit fixes. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Gi7xzut8CHZDzi4RgDRG3w
There was a problem hiding this comment.
Pull request overview
This PR adds a new /network-map subpage to visualize HyperBit’s physical infrastructure using Leaflet/OpenStreetMap tiles, and updates peering data so PCIX is treated as active (not “in activation”), while wiring the new page into existing site navigation.
Changes:
- Added
/network-mappage that renders a Leaflet map with markers, legend, and a sites table sourced from shared network data. - Introduced
networkSites(PoP/IX metadata) andadditionalActiveIxes(extra active IX rows) in$lib/data/network. - Linked the new page from the main nav/footer and added CSS for map + Leaflet dark-theme overrides; updated dependencies to include Leaflet/types.
Reviewed changes
Copilot reviewed 7 out of 8 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
| src/routes/peering-policy/+page.svelte | Renders additional active IX rows sourced from additionalActiveIxes. |
| src/routes/network-map/+page.svelte | New network map page using Leaflet with markers/popups + sites table. |
| src/lib/data/network.ts | Adds networkSites + additionalActiveIxes; updates upcoming IX list. |
| src/lib/components/SiteNav.svelte | Adds “Network Map” link in navigation. |
| src/lib/components/SiteFooter.svelte | Adds “Network Map” link in footer. |
| src/app.css | Adds styling for the map panel and Leaflet dark theme overrides. |
| package.json | Adds leaflet dependency and @types/leaflet dev dependency. |
| package-lock.json | Locks updated transitive deps and new Leaflet/type packages. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Comment on lines
+35
to
+49
| for (const site of networkSites) { | ||
| const icon = L.divIcon({ | ||
| className: '', | ||
| html: markerHtml(site), | ||
| iconSize: [16, 16], | ||
| iconAnchor: [8, 8] | ||
| }); | ||
| L.marker([site.lat, site.lon], { icon, title: site.name }) | ||
| .addTo(map) | ||
| .bindPopup( | ||
| `<strong>${site.name}</strong><br>${site.facility}<br>${site.city} — ${ | ||
| site.status === 'active' ? 'Active' : 'In activation' | ||
| }` | ||
| ); | ||
| } |
| <div class="container panel-grid panel-grid-2"> | ||
| <article class="subpage-panel map-panel"> | ||
| <p class="panel-index">Physical map</p> | ||
| <div class="map-frame" bind:this={mapEl} role="img" aria-label="Map of HyperBit PoP and IX presence in Italy"></div> |
Comment on lines
13
to
+21
| // Single source of truth for the peering numbers shown across the page. | ||
| export const peering = { | ||
| ix: 'MINAP Milano', | ||
| peerCountLabel: '110+', | ||
| upcomingIxes: ['PCIX', 'VSIX','STIX', 'NINE-IX'] | ||
| upcomingIxes: ['STIX', 'VSIX', 'NINE-IX'] | ||
| } as const; | ||
|
|
||
| // Additional active IXPs beyond `peering.ix` (which carries the headline peer count). | ||
| export const additionalActiveIxes = [{ name: 'PCIX Piacenza', peersLabel: '—' }] as const; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
/network-mappage with a real (Leaflet + OpenStreetMap/CARTO dark tiles) map of HyperBit's physical infrastructure: Milano (Seeweb, Green Building) as the main PoP, MINAP (Seeweb) and PCIX (Naquadria, Piacenza) as active IX presence, and STIX (Bolzano) and VSIX (Università di Padova) as IX in activation.src/lib/data/network.ts#networkSitesas the single source of truth for PoP/IX site data (facility, city, coordinates, status).peering-policyand the homepage summary so PCIX shows as active instead of upcoming (it moved fromupcomingIxesto a newadditionalActiveIxeslist), matching the corrected status.npm audit fixupdates (leaves 3 low-severitycookieadvisories that would otherwise require downgrading@sveltejs/kitto a pre-1.0 version).Test plan
npm run check(svelte-check, 0 errors/warnings)npm run build(prerender succeeds, confirming Leaflet is not touched during SSR)/network-mapin a local browser: markers, popups, legend, status table and dark-theme Leaflet controls all render correctly (map tiles didn't load only inside this sandbox due to its restricted network egress; expect normal loading once deployed)Generated by Claude Code