feat(docs): add live API status indicator to sidebar

[ArthurGamby]

Summary

• Adds a live API status indicator to the docs sidebar footer, fetching from the Prisma Statuspage API
• Shows a colored dot (green/yellow/orange/red) with pulse animation for non-operational states, polling every 5 minutes
• Hidden on mobile, gracefully returns null on fetch failure

Test plan

• Run pnpm dev and verify the status indicator appears below the sidebar cards
• Verify it links to https://www.prisma-status.com
• Verify it's hidden on mobile viewports
• Check Network tab to confirm polling every 5 minutes

🤖 Generated with Claude Code

Summary by CodeRabbit

• New Features
  • Added a status indicator to the documentation footer that shows current Prisma service health.
  • Indicator is color-coded to reflect operational, minor, major, or critical states at a glance.
  • Automatically refreshes regularly to keep displayed status up to date.
  • Includes a compact linkable display with subtle animation for non-operational states.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
blog	Ready	Preview, Comment	Mar 6, 2026 4:26pm
docs	Ready	Preview, Comment	Mar 6, 2026 4:26pm
eclipse	Ready	Preview, Comment	Mar 6, 2026 4:26pm

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: f8086b86-6ad8-4606-b48d-079488ab75da

📥 Commits

Reviewing files that changed from the base of the PR and between 5c5833d and 0ea5043.

📒 Files selected for processing (1)

• apps/docs/src/app/(docs)/(default)/layout.tsx

🚧 Files skipped from review as they are similar to previous changes (1)

• apps/docs/src/app/(docs)/(default)/layout.tsx

---

Walkthrough

Adds a new client-side StatusIndicator component that fetches Prisma status and injects it into the DocsLayout footer (apps/docs/src/app/(docs)/(default)/layout.tsx) alongside existing SidebarBannerCarousel slides; preserves existing children render order.

Changes

Cohort / File(s)	Summary
Layout: footer injection apps/docs/src/app/(docs)/(default)/layout.tsx	Imports and renders <StatusIndicator /> in the docs layout footer next to SidebarBannerCarousel slides; maintains existing children rendering order.
New component: status indicator apps/docs/src/components/status-indicator.tsx	Adds a client-side React component that fetches https://www.prisma-status.com/api/v2/status.json on mount and every 5 minutes, maps indicator to colored dot styles, shows a ping animation for non-operational states, and renders a link with status description; handles fetch errors by resetting status.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~22 minutes

🚥 Pre-merge checks | ✅ 2 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 50.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately describes the main change: adding a live API status indicator to the docs sidebar, which is precisely what the changeset implements.

_{✏️ 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.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[argos-ci]

The latest updates on your projects. Learn more about Argos notifications ↗︎

Build	Status	Details	Updated (UTC)
default (Inspect)	⚠️ Changes detected (Review)	1 removed	Mar 6, 2026, 4:32 PM

[coderabbitai]

🧹 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. The stale-if-error policy 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

📥 Commits

Reviewing files that changed from the base of the PR and between ac8da00 and 5c5833d.

📒 Files selected for processing (2)

• apps/docs/src/app/(docs)/(default)/layout.tsx
• apps/docs/src/components/status-indicator.tsx