TopBar, Sidebar, and the Settings profile form previously showed a hardcoded
"ArchNest Ops" identity, a fake unread-notification count, and a static "All
Systems Operational" indicator. These now use the real logged-in user (with
a new PUT /api/auth/me endpoint to edit display name/email/avatar) and real
integration health for the sidebar status dot.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BbJV5nm8KPVH1oNJYKpnoF
Adds an events table + logEvent helper for a genuine activity log, and
a /api/integrations/resources aggregate endpoint backed by a new optional
listResources adapter method (implemented for Docker via its containers API).
StatusCards, MiddleRow, BottomRow, and Infrastructure now render real
integration/resource/event data instead of hardcoded numbers, with empty
states where no data source exists yet (AWS cost, historical trends).
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BbJV5nm8KPVH1oNJYKpnoF
Bookmarks, categories, favorites, quick access, recently added, link
health, and category breakdown are now all derived from real backend
data instead of hardcoded arrays. Adds an Add Bookmark modal (with
inline new-category creation) and a working favorite toggle, both
backed by the existing /api/bookmarks endpoints. Adds
createBookmarkCategory/updateBookmark to the API client.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BbJV5nm8KPVH1oNJYKpnoF
Replaces mock integration data in Settings.tsx with live calls to
api.listIntegrations/createIntegration/updateIntegration/testIntegration.
Also fixes apiFetch sending Content-Type: application/json on bodyless
requests, which made Fastify reject Test Connection calls with 400.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BbJV5nm8KPVH1oNJYKpnoF
- New AuthContext drives app state (loading/needs-setup/enrolling/
logged-out/logged-in) by checking GET /api/system/setup-status and
GET /api/auth/me on load; JWT stored in localStorage
- Enrollment page: step 1 creates the admin account via POST /api/setup,
step 2 lets you connect integrations (or skip) before entering the app
- Login page for returning sessions; TopBar's Sign Out now calls
logout() instead of being a dead link
- Verified end-to-end in a browser: fresh setup -> connect/skip ->
dashboard, reload persists the session, sign out -> login -> back in
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BbJV5nm8KPVH1oNJYKpnoF
- Profile section: click avatar to upload a personal photo (FileReader
preview, hover camera icon overlay), replacing static initials
- README.md rewritten with project-specific page status table, dev
setup, tech stack, and deployment notes
- design-decisions.md: add Settings Page subsection documenting layout,
section-switching, and the avatar upload technique
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BbJV5nm8KPVH1oNJYKpnoF
Drop the /network route, page, and sidebar entry. Network will instead
become a tab alongside Overview on the Infrastructure page later, so add
a disabled placeholder tab for now.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BbJV5nm8KPVH1oNJYKpnoF
First pass built from the blueprint spec: status cards row, Top Talkers,
Network Topology dot map, Interface Utilization + Alert Summary, Traffic
Over Time, Protocol Distribution, Recent Events, and footer stats bar.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BbJV5nm8KPVH1oNJYKpnoF
A world map didn't fit a small-scale infra. Show servers as a tile grid
with colored status dots (healthy/warning/critical) instead.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BbJV5nm8KPVH1oNJYKpnoF
Resource Trend stays plain per clarification; only Resource Distribution
and Infrastructure Map get the hero-style blend.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BbJV5nm8KPVH1oNJYKpnoF
Make status cards more transparent with centered, better-spaced content,
and apply the network-traffic background to Resource Trend with a
blue/orange/green/brown line set.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BbJV5nm8KPVH1oNJYKpnoF
The baked-in labels on the Resource Distribution and Infrastructure Map
background art were getting covered by the dim/shadow overlay, so switch
both cards to the blank KPI background and render the title as our own
text element on top instead.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BbJV5nm8KPVH1oNJYKpnoF
The blank KPI background didn't read well on the top status row, so
revert those to the plain card style. Add a dimming overlay to the
Resource Distribution and Infrastructure Map backgrounds to reduce
visual clutter in the middle row.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BbJV5nm8KPVH1oNJYKpnoF
Swap back to Resource Distribution + Infrastructure Map in the middle
row, drop Resource Utilization, and scale the card vignette back so
border art stays readable while still blending into the background.
Apply the new blank KPI background asset to the top status cards row.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BbJV5nm8KPVH1oNJYKpnoF
Fix radial-gradient vignette to use closest-side sizing so card border
art fades fully at edge midpoints, not just corners. Remove the Resource
Distribution donut card and expand Infrastructure Map to fill the space.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BbJV5nm8KPVH1oNJYKpnoF
Pulls in the new gold-framed hex-pattern background assets for Resource
Distribution, Infrastructure Map, and Top Resources by Utilization,
replacing the plain card styling with the baked-in border/labels.
Also stages network-kpi-bg.png in public/ for the future Network page.
Moves the hero rendering to the layout level so the banner shows the
full golden arch and sky behind the page title, search bar, and
sub-tabs row. TopBar and the search input backgrounds are now
transparent so the banner reads through cleanly.
Wires up react-router-dom so the sidebar nav actually navigates between
pages, with route-aware active highlighting and dynamic page titles.
Extracts Glance content into its own page component and adds a new
Infrastructure page matching the mockup: status cards, resource
distribution/cost breakdown donuts, infra map, top resources by
utilization, resource trend chart, recent activity, and footer stats.
Previously sat as an inline button below the nav items, disconnected
from the rest of the layout. Now it's a small circle straddling the
sidebar/content boundary, vertically centered on the viewport - the
common pattern for collapsible side panels.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BbJV5nm8KPVH1oNJYKpnoF
Sidebar: prominent gold arc logo using a cleaned transparent-background
asset (keys out the source PNG's baked-in brown texture), horizontal
icon+label nav items with larger spacing, and a filled gold-tinted
highlight box on the selected item.
Layout: main content is now a flex column filling the viewport - hero
fixed at top, middle row (Resource Overview / Recent Activity / Top
Alerts) stretches to fill available height with items distributed, and
the bottom row (Network Traffic / Shortcuts) anchored to the bottom.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BbJV5nm8KPVH1oNJYKpnoF
Sidebar expanded width 140px -> 200px and collapsed 60px -> 64px to
match mockup proportions. Hero banner now uses a fixed shorter height
with object-fit cover, a bottom mask fade, and a radial vignette so
its edges blend into the page background instead of sitting in a
bordered box. KPI cards are now semi-transparent so the hero image
bleeds through behind them.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BbJV5nm8KPVH1oNJYKpnoF
Fix System Status "Operational" text to green (was gold italic) and
bump size, and switch Shortcuts from a 2x2 grid to a single row of 4
with gold icons to match the blueprint mockup.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BbJV5nm8KPVH1oNJYKpnoF
