feat(docs): add live API status indicator to sidebar#7589
feat(docs): add live API status indicator to sidebar#7589ArthurGamby wants to merge 1 commit intomainfrom
Conversation
Adds a compact status indicator in the docs sidebar footer that fetches from the Prisma Statuspage API and polls every 5 minutes. Shows a colored dot with pulse animation for non-operational states. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
WalkthroughA new StatusIndicator component fetches Prisma system status data and displays it in the DocsLayout sidebar footer. The layout configuration switches from a simple collapsible setting to an object-based approach that renders the status indicator as a footer element with styling and standard div props support. Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~22 minutes 🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
|
The latest updates on your projects. Learn more about Argos notifications ↗︎
|
There was a problem hiding this comment.
🧹 Nitpick comments (1)
apps/docs/src/components/status-indicator.tsx (1)
29-32: Add explicit HTTP status check for better error handling.The code should verify the response status before parsing JSON. If the API returns a non-2xx response, attempting to parse the error response as JSON can fail silently. Add a check like
if (!res.ok) throw new Error(...)to fail fast on server errors.Regarding caching: the API explicitly sets
cache-control: max-age=3, public, stale-while-revalidate=30, stale-if-error=3600, so the component isn't relying on "default browser caching." The polling interval is 5 minutes, which is well beyond the 3-second fresh window, so cache freshness is not a practical concern here. Thestale-if-errorpolicy is actually beneficial for resilience during outages.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@apps/docs/src/components/status-indicator.tsx` around lines 29 - 32, The fetch chain in status-indicator.tsx should verify HTTP success before parsing: inside the fetch(...).then((res) => ...) step check res.ok and throw a descriptive Error (including res.status and/or res.statusText) when !res.ok so non-2xx responses skip JSON parsing; keep the downstream .then((data: StatusResponse) => setStatus(data.status)) and the .catch(() => setStatus(null)) as-is so failures result in null status. Reference: the fetch call that sets StatusResponse and calls setStatus.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Nitpick comments:
In `@apps/docs/src/components/status-indicator.tsx`:
- Around line 29-32: The fetch chain in status-indicator.tsx should verify HTTP
success before parsing: inside the fetch(...).then((res) => ...) step check
res.ok and throw a descriptive Error (including res.status and/or
res.statusText) when !res.ok so non-2xx responses skip JSON parsing; keep the
downstream .then((data: StatusResponse) => setStatus(data.status)) and the
.catch(() => setStatus(null)) as-is so failures result in null status.
Reference: the fetch call that sets StatusResponse and calls setStatus.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: 27e65f20-d5f8-4534-a25e-bcb6d89dd8b6
📒 Files selected for processing (2)
apps/docs/src/app/(docs)/(default)/layout.tsxapps/docs/src/components/status-indicator.tsx
Summary
Test plan
pnpm devand verify the status indicator appears below the sidebar cardshttps://www.prisma-status.com🤖 Generated with Claude Code
Summary by CodeRabbit
Release Notes