stack/docs
Madison bfa8624fb4
[Docs][ui][Site] - Adds open/copy buttons to pages. (#902)
<!--

Make sure you've read the CONTRIBUTING.md guidelines:
https://github.com/stack-auth/stack-auth/blob/dev/CONTRIBUTING.md

-->

<img width="324" height="252" alt="image"
src="https://github.com/user-attachments/assets/b7096a0c-9764-4fe7-b521-458d6e1d47b5"
/>

<!-- RECURSEML_SUMMARY:START -->
## High-level PR Summary
This PR adds two new interactive components to the documentation pages:
a "Copy Markdown" button that allows users to copy the raw markdown
content of a page, and an "Open" dropdown menu that provides options to
open the current page in various AI tools (Scira AI, ChatGPT, Claude,
and T3 Chat). The implementation includes a new `page-actions.tsx`
component file with the `LLMCopyButton` and `ViewOptions` components,
and updates the documentation page layout to incorporate these new
buttons in the header alongside the page title.

⏱️ Estimated Review Time: 5-15 minutes

<details>
<summary>💡 Review Order Suggestion</summary>

| Order | File Path |
|-------|-----------|
| 1 | `docs/src/components/page-actions.tsx` |
| 2 | `docs/src/app/docs/[[...slug]]/page.tsx` |
</details>



<!-- RECURSEML_SUMMARY:END -->
<!-- ELLIPSIS_HIDDEN -->


----

> [!IMPORTANT]
> Adds `LLMCopyButton` and `ViewOptions` to documentation pages for
copying markdown and opening in AI tools.
> 
>   - **New Features**:
> - Added `LLMCopyButton` in `page-actions.tsx` to copy markdown content
to clipboard.
> - Added `ViewOptions` in `page-actions.tsx` to open pages in AI tools
(Scira AI, ChatGPT, Claude, T3 Chat).
>   - **Integration**:
> - Integrated `LLMCopyButton` and `ViewOptions` into `page.tsx` header
layout.
> - Adjusted header layout in `page.tsx` to align title and new buttons.
> 
> <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 b51bb98d4e. 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
[e48ffa6..3cbe5a5](e48ffa67ee...3cbe5a5861)_

 No bugs found, your code is sparkling clean

<details>
<summary> Files analyzed, no issues (2)</summary>

  • `docs/src/components/page-actions.tsx`
  • `docs/src/app/docs/[[...slug]]/page.tsx`
</details>

[![Need help? Join our
Discord](https://img.shields.io/badge/Need%20help%3F%20Join%20our%20Discord-5865F2?style=plastic&logo=discord&logoColor=white)](https://discord.gg/n3SsVDAW6U)
<!-- RECURSEML_ANALYSIS:END -->

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* Added header actions on docs pages: a button to copy the page Markdown
to clipboard and an “Open” menu to launch external AI chat tools or view
the source.
* **Documentation**
* Updated docs page header layout so the title is left-aligned with
action controls on the right for easier access.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

<!-- CURSOR_SUMMARY -->
---

> [!NOTE]
> Adds header actions to docs pages: copy raw Markdown and open the page
in external AI tools.
> 
> - **Docs UI**:
>   - **New components** in `docs/src/components/page-actions.tsx`:
> - `LLMCopyButton`: copies raw Markdown to clipboard with simple
caching.
> - `ViewOptions`: popover with links to external AI tools (Scira,
ChatGPT, Claude, T3 Chat).
>   - **Integration** in `docs/src/app/docs/[[...slug]]/page.tsx`:
> - Wraps `DocsTitle` with a header row and adds `LLMCopyButton` and
`ViewOptions`.
>     - Passes `markdownUrl` as ``${page.url}.mdx`` for both actions.
> 
> <sup>Written by [Cursor
Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit
5578cc9d37. 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>
2025-09-28 13:53:18 -05:00
..
content [Docs][site] - AI Chat now looks at MCP server (#860) 2025-09-20 12:05:00 -07:00
lib Update AI chatbot prompt 2025-07-16 13:38:12 -07:00
public Re-add CLI auth docs 2025-07-03 15:43:36 -07:00
scripts init emails docs (#848) 2025-08-21 12:05:48 -05:00
src [Docs][ui][Site] - Adds open/copy buttons to pages. (#902) 2025-09-28 13:53:18 -05:00
templates Convex implementation (#913) 2025-09-24 19:16:45 +00:00
templates-api New docs (#698) 2025-06-20 13:30:01 -07:00
templates-python [Docs][MDX] Add python backend integration (#874) 2025-09-10 02:19:09 -05:00
.env.development New docs (#698) 2025-06-20 13:30:01 -07:00
.eslintrc.json New docs (#698) 2025-06-20 13:30:01 -07:00
.gitignore Docs updates (#753) 2025-07-11 10:00:02 -07:00
CHANGELOG.md chore: update package versions 2025-09-26 23:16:39 -05:00
cli.json New docs (#698) 2025-06-20 13:30:01 -07:00
docs-platform.yml Convex implementation (#913) 2025-09-24 19:16:45 +00:00
next.config.mjs Add API docs to llms.txt file. (#766) 2025-07-15 11:13:32 -05:00
package.json chore: update package versions 2025-09-26 23:16:39 -05:00
postcss.config.mjs New docs (#698) 2025-06-20 13:30:01 -07:00
README.md New docs (#698) 2025-06-20 13:30:01 -07:00
source.config.ts New docs (#698) 2025-06-20 13:30:01 -07:00
tsconfig.json New docs (#698) 2025-06-20 13:30:01 -07:00

stack-docs

This is a Next.js application generated with Create Fumadocs.

Run development server:

npm run dev
# or
pnpm dev
# or
yarn dev

Open http://localhost:3000 with your browser to see the result.

Explore

In the project, you can see:

  • lib/source.ts: Code for content source adapter, loader() provides the interface to access your content.
  • app/layout.config.tsx: Shared options for layouts, optional but preferred to keep.
Route Description
app/(home) The route group for your landing page and other pages.
app/docs The documentation layout and pages.
app/api The documentation for API pages.
app/api/search/route.ts The Route Handler for search.

Fumadocs MDX

A source.config.ts config file has been included, you can customise different options like frontmatter schema.

Read the Introduction for further details.

Learn More

To learn more about Next.js and Fumadocs, take a look at the following resources: