<!--
Make sure you've read the CONTRIBUTING.md guidelines:
https://github.com/stack-auth/stack-auth/blob/dev/CONTRIBUTING.md
-->
Adds JWT docs and JWT viewer component to docs
<img width="1182" height="668" alt="image"
src="https://github.com/user-attachments/assets/f4196dd9-e159-420e-9d78-a3928983f126"
/>
<!-- RECURSEML_SUMMARY:START -->
## High-level PR Summary
This PR adds comprehensive JWT (JSON Web Token) documentation and an
interactive JWT viewer component to the Stack Auth documentation. The
main additions are a new documentation page explaining JWT concepts,
structure, and usage within Stack Auth, along with a React component
that allows users to decode and inspect JWT tokens. The JWT viewer can
automatically load the current user's session token if they are signed
in, or accept manually pasted tokens. The documentation provides
examples of both client-side and server-side JWT usage, security
considerations, troubleshooting guidance, and best practices. The PR
also includes necessary updates to metadata files and component exports
to integrate the new content into the documentation platform.
⏱️ Estimated Review Time: 15-30 minutes
<details>
<summary>💡 Review Order Suggestion</summary>
| Order | File Path |
|-------|-----------|
| 1 | `docs/templates/concepts/jwt.mdx` |
| 2 | `docs/src/components/mdx/jwt-viewer.tsx` |
| 3 | `docs/docs-platform.yml` |
| 4 | `docs/src/components/mdx/index.ts` |
| 5 | `docs/src/mdx-components.tsx` |
| 6 | `docs/templates/meta.json` |
| 7 | `docs/templates-python/meta.json` |
</details>
<!-- RECURSEML_SUMMARY:END -->
<!-- ELLIPSIS_HIDDEN -->
----
> [!IMPORTANT]
> Adds a new JWT concepts page and an interactive `JWTViewer` component,
integrating it into MDX and navigation, with `jose` added for decoding.
>
> - **Docs**:
> - Add `concepts/jwt.mdx` with JWT structure, claims, examples,
verification, security, and best practices.
> - Include JWT page in navigation: `docs-platform.yml`,
`templates/meta.json`, and Python `templates-python/meta.json`.
> - **UI Component**:
> - Add `JWTViewer` in `docs/src/components/mdx/jwt-viewer.tsx` to
decode JWTs (header, payload, signature), show time-based indicators,
and load current user token via `useUser()`.
> - Export and register in MDX: `docs/src/components/mdx/index.ts`,
`docs/src/mdx-components.tsx`.
> - **Dependencies**:
> - Add `jose` to `docs/package.json` (lockfile updated).
>
> <sup>This description was created by </sup>[<img alt="Ellipsis"
src="https://img.shields.io/badge/Ellipsis-blue?color=175173">](https://www.ellipsis.dev?ref=stack-auth%2Fstack-auth&utm_source=github&utm_medium=referral)<sup>
for f25e369599. You can
[customize](https://app.ellipsis.dev/stack-auth/settings/summaries) this
summary. It will automatically update as commits are pushed.</sup>
----
<!-- ELLIPSIS_HIDDEN -->
<!-- RECURSEML_ANALYSIS:START -->
## Review by RecurseML
_🔍 Review performed on
[ad34cfe..a135bbd](ad34cfecc2...a135bbdd77)_
✨ No bugs found, your code is sparkling clean
<details>
<summary>✅ Files analyzed, no issues (3)</summary>
• `docs/src/components/mdx/jwt-viewer.tsx`
• `docs/src/mdx-components.tsx`
• `docs/src/components/mdx/index.ts`
</details>
<details>
<summary>⏭️ Files skipped (trigger manually) (4)</summary>
| Locations | Trigger Analysis |
|-----------|:------------------:|
`docs/docs-platform.yml` |
[
`docs/templates-python/meta.json` |
[
`docs/templates/concepts/jwt.mdx` |
[
`docs/templates/meta.json` |
[
</details>
[](https://discord.gg/n3SsVDAW6U)
<!-- RECURSEML_ANALYSIS:END -->
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Interactive JWT Viewer in the docs: paste or auto-load a token to
inspect header, payload, signature with live decoding, validity/time
indicators, per-field copy controls, and "load my token".
* **Documentation**
* New "JWT" concept page covering structure, claims, examples,
client/server/manual usage, security, troubleshooting, and best
practices.
* JWT page added to site navigation and enabled across Next, React, JS,
and Python docs.
* **Chores**
* Added runtime dependency to support JWT decoding in the docs.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
<!-- CURSOR_SUMMARY -->
---
> [!NOTE]
> Adds a new JWT concepts page and an interactive `JWTViewer` component,
integrating it into MDX and navigation, with `jose` added for decoding.
>
> - **Docs**:
> - Add `concepts/jwt.mdx` with JWT structure, claims, examples,
verification, security, and best practices.
> - Include JWT page in navigation: `docs-platform.yml`,
`templates/meta.json`, and Python `templates-python/meta.json`.
> - **UI Component**:
> - Add `JWTViewer` in `docs/src/components/mdx/jwt-viewer.tsx` to
decode JWTs (header, payload, signature), show time-based indicators,
and load current user token via `useUser()`.
> - Export and register in MDX: `docs/src/components/mdx/index.ts`,
`docs/src/mdx-components.tsx`.
> - **Dependencies**:
> - Add `jose` to `docs/package.json` (lockfile updated).
>
> <sup>Written by [Cursor
Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit
837fffb848. This will update automatically
on new commits. Configure
[here](https://cursor.com/dashboard?tab=bugbot).</sup>
<!-- /CURSOR_SUMMARY -->
---------
Co-authored-by: Konsti Wohlwend <n2d4xc@gmail.com>
<!--
Make sure you've read the CONTRIBUTING.md guidelines:
https://github.com/stack-auth/stack-auth/blob/dev/CONTRIBUTING.md
-->
<!-- ELLIPSIS_HIDDEN -->
----
> [!IMPORTANT]
> Introduces an interactive documentation browser and MCP server for
testing, with new API handling and enriched API spec display.
>
> - **New Features**:
> - Adds `route.ts` to handle API requests for listing and retrieving
documentation using MCP.
> - Implements `McpBrowserPage` in `page.tsx` for interactive
documentation browsing.
> - Displays full documentation content and enriched API specs for API
pages.
> - **Dependencies**:
> - Adds `@modelcontextprotocol/sdk`, `@vercel/mcp-adapter`, and
`posthog-node` to `package.json`.
> - **Misc**:
> - Integrates PostHog for analytics in `route.ts`.
>
> <sup>This description was created by </sup>[<img alt="Ellipsis"
src="https://img.shields.io/badge/Ellipsis-blue?color=175173">](https://www.ellipsis.dev?ref=stack-auth%2Fstack-auth&utm_source=github&utm_medium=referral)<sup>
for a80967c8b5. You can
[customize](https://app.ellipsis.dev/stack-auth/settings/summaries) this
summary. It will automatically update as commits are pushed.</sup>
----
<!-- ELLIPSIS_HIDDEN -->
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Interactive documentation browser with list and detail panes,
selection, loading states, and user-friendly error messages.
* Shows full documentation content and, for API pages, enriched OpenAPI
details when available.
* **Chores**
* Added dependencies to enable the documentation browser, MCP backend
integration, and analytics (PostHog).
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
<!--
Make sure you've read the CONTRIBUTING.md guidelines:
https://github.com/stack-auth/stack-auth/blob/dev/CONTRIBUTING.md
-->
<!-- ELLIPSIS_HIDDEN -->
----
> [!IMPORTANT]
> Integrates PostHog for page view tracking in the documentation site
with necessary rewrites and components.
>
> - **Integration**:
> - Adds PostHog integration to track page views in `layout.tsx` using
`PostHogPageView` and `CSPostHogProvider`.
> - Adds `posthog-js` to `package.json` dependencies.
> - **Rewrites**:
> - Adds proxy rewrites in `next.config.mjs` to prevent ad blockers from
blocking PostHog requests.
> - **Components**:
> - Creates `PostHogPageView` in `pageview.tsx` and
`pageview-dynamic.tsx` to capture page views.
> - Implements `CSPostHogProvider` in `posthog-provider.tsx` to
initialize PostHog with specific settings.
>
> <sup>This description was created by </sup>[<img alt="Ellipsis"
src="https://img.shields.io/badge/Ellipsis-blue?color=175173">](https://www.ellipsis.dev?ref=stack-auth%2Fstack-auth&utm_source=github&utm_medium=referral)<sup>
for 5551f4ffc4. You can
[customize](https://app.ellipsis.dev/stack-auth/settings/summaries) this
summary. It will automatically update as commits are pushed.</sup>
<!-- ELLIPSIS_HIDDEN -->
<!--
Make sure you've read the CONTRIBUTING.md guidelines:
https://github.com/stack-auth/stack-auth/blob/dev/CONTRIBUTING.md
-->
<!-- ELLIPSIS_HIDDEN -->
----
> [!IMPORTANT]
> This pull request updates the Stack Auth documentation structure,
enhances navigation and layout functionalities, and introduces new
components for improved user experience.
>
> - **Behavior**:
> - Introduces `PlatformRedirect` component in `platform-redirect.tsx`
for redirecting users to their preferred platform.
> - Adds `usePlatformPreference` hook in `use-platform-preference.ts`
for managing platform preferences.
> - Updates `getSmartRedirectUrl()` in `navigation-utils.ts` to use
`getSmartPlatformRedirect()`.
> - **Layout and Navigation**:
> - Enhances sidebar functionality with collapsible sections in
`docs.tsx` and `sidebar-context.tsx`.
> - Adds `DocsSidebarCollapseTrigger` in `docs.tsx` for sidebar
collapse/expand functionality.
> - Updates `SharedHeader` in `shared-header.tsx` to include
platform-aware navigation links.
> - **Documentation Structure**:
> - Updates `meta.json` files in `templates` to reflect new
documentation structure.
> - Renames `overview.mdx` to `index.mdx` in `sdk` and `components`
directories.
> - Adds detailed documentation for `Team`, `TeamUser`, and
`ContactChannel` in respective `.mdx` files.
>
> <sup>This description was created by </sup>[<img alt="Ellipsis"
src="https://img.shields.io/badge/Ellipsis-blue?color=175173">](https://www.ellipsis.dev?ref=stack-auth%2Fstack-auth&utm_source=github&utm_medium=referral)<sup>
for 21e55737cb. You can
[customize](https://app.ellipsis.dev/stack-auth/settings/summaries) this
summary. It will automatically update as commits are pushed.</sup>
<!-- ELLIPSIS_HIDDEN -->
---------
Co-authored-by: Stack-Bot <madison@stack-auth.com>
Co-authored-by: ellipsis-dev[bot] <65095814+ellipsis-dev[bot]@users.noreply.github.com>
Co-authored-by: Konsti Wohlwend <n2d4xc@gmail.com>
<!--
Fixes generation script, adds new oauth docs pages, fixes bottom
navigation, adds mobile support, sidebar changes.
-->
<!-- ELLIPSIS_HIDDEN -->
----
> [!IMPORTANT]
> This PR adds OAuth provider documentation, enhances mobile navigation,
and updates Python-specific documentation for Stack Auth.
>
> - **OAuth Providers**:
> - Adds documentation for GitHub, Google, Facebook, Microsoft, Spotify,
Discord, GitLab, Apple, Bitbucket, LinkedIn, and X (Twitter) in
`docs/templates/concepts/auth-providers/`.
> - Updates `docs/docs-platform.yml` to include new OAuth provider
pages.
> - **Mobile Support**:
> - Enhances bottom navigation for mobile devices in
`docs/src/app/(home)/layout.tsx` and `docs/src/app/api/layout.tsx`.
> - Introduces `AIChatDrawer` and `AuthPanel` components for
mobile-friendly interactions.
> - **Documentation Enhancements**:
> - Adds Python-specific documentation for user authentication and team
management in `docs/templates-python/concepts/`.
> - Updates `docs/templates-python/meta.json` to include new Python
documentation pages.
> - Refines search functionality and UI components for better user
experience.
>
> <sup>This description was created by </sup>[<img alt="Ellipsis"
src="https://img.shields.io/badge/Ellipsis-blue?color=175173">](https://www.ellipsis.dev?ref=stack-auth%2Fstack-auth&utm_source=github&utm_medium=referral)<sup>
for bf759151d8. You can
[customize](https://app.ellipsis.dev/stack-auth/settings/summaries) this
summary. It will automatically update as commits are pushed.</sup>
<!-- ELLIPSIS_HIDDEN -->
---------
Co-authored-by: Konsti Wohlwend <n2d4xc@gmail.com>
