Skip to content

feat(docs): DR-7628 replace AI prompt banner with inline copy prompt button#7654

Open
ArthurGamby wants to merge 1 commit intomainfrom
dr-7628-copy-prompt-inline-button
Open

feat(docs): DR-7628 replace AI prompt banner with inline copy prompt button#7654
ArthurGamby wants to merge 1 commit intomainfrom
dr-7628-copy-prompt-inline-button

Conversation

@ArthurGamby
Copy link
Contributor

@ArthurGamby ArthurGamby commented Mar 16, 2026

Summary

  • Remove the large AIPromptBanner component that rendered between page description and body content
  • Add a small "Copy Prompt" button inline next to the existing "Copy Markdown" button in the page header actions bar
  • Delete the now-unused ai-prompt-banner.tsx component

Linear

https://linear.app/prisma-company/issue/DR-7628/replace-ai-prompt-banner-with-inline-copy-prompt-button

Test plan

  • Visit a guide page with an AI prompt (e.g. Next.js, Nuxt) and verify the "Copy Prompt" button appears next to "Copy Markdown"
  • Click the "Copy Prompt" button and verify the prompt content is copied to clipboard
  • Verify the button shows a check icon after clicking (same feedback as "Copy Markdown")
  • Visit a page without an AI prompt and verify no "Copy Prompt" button appears
  • Verify the large banner no longer renders between description and body

Summary by CodeRabbit

  • Improvements
    • Refined prompt copying functionality in documentation pages for better user experience.
    • Reorganized UI elements to streamline access to copy prompt features.

@vercel
Copy link

vercel bot commented Mar 16, 2026

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

Project Deployment Actions Updated (UTC)
blog Ready Ready Preview, Comment Mar 16, 2026 0:23am
docs Ready Ready Preview, Comment Mar 16, 2026 0:23am
eclipse Ready Ready Preview, Comment Mar 16, 2026 0:23am

Request Review

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Mar 16, 2026

Walkthrough

This pull request refactors the prompt-copying functionality by removing the AIPromptBanner component and introducing a new CopyPromptButton component within page-actions.tsx. The main docs page is updated to import and integrate the new button component for conditional rendering when prompt content exists.

Changes

Cohort / File(s) Summary
Component Relocation
apps/docs/src/components/ai-prompt-banner.tsx
Entire AIPromptBanner component removed; functionality migrated to a new CopyPromptButton in page-actions.tsx.
New Button Component
apps/docs/src/components/page-actions.tsx
Added new exported CopyPromptButton component with clipboard copy functionality using the useCopyButton hook; includes import consolidation and minor refactoring of conditional expressions to single-line format.
Integration
apps/docs/src/app/(docs)/(default)/[[...slug]]/page.tsx
Removed AIPromptBanner import and usage; added CopyPromptButton import and integrated conditional rendering in the header area; simplified component signature with inlined param types.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

The refactoring is straightforward—relocating component functionality with clear one-to-one mapping between removal and addition. The logic remains unchanged (copy-to-clipboard with visual feedback), and the scope is limited to three closely related files. The main review points are verifying the integration flow and confirming no edge cases in the conditional rendering were missed.

🚥 Pre-merge checks | ✅ 2 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.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: replacing a large AI prompt banner with an inline copy prompt button in the docs.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

📝 Coding Plan
  • Generate coding plan for human review comments

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

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

Tip

CodeRabbit can use TruffleHog to scan for secrets in your code with verification capabilities.

Add a TruffleHog config file (e.g. trufflehog-config.yml, trufflehog.yml) to your project to customize detectors and scanning behavior. The tool runs only when a config file is present.

@argos-ci
Copy link

argos-ci bot commented Mar 16, 2026

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

Build Status Details Updated (UTC)
default (Inspect) ✅ No changes detected - Mar 16, 2026, 12:29 PM

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)
apps/docs/src/components/page-actions.tsx (1)

79-93: ⚠️ Potential issue | 🟠 Major

LLMCopyButton can still copy error/404 payloads instead of markdown.

You added fallback cache lookup on Line 79, but the uncached path still fetches only markdownUrl and copies res.text() without checking res.ok. For routes that require /index.mdx, this can cache/copy the wrong content.

Proposed fix
   try {
-      await navigator.clipboard.write([
-        new ClipboardItem({
-          "text/plain": fetch(markdownUrl).then(async (res) => {
-            const content = await res.text();
-            cache.set(markdownUrl, content);
-            return content;
-          }),
-        }),
-      ]);
+      const { content, resolvedUrl } = await fetchMarkdownWithFallback(markdownUrl);
+      cache.set(resolvedUrl, content);
+      cache.set(markdownUrl, content);
+      await navigator.clipboard.writeText(content);
   } finally {
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@apps/docs/src/components/page-actions.tsx` around lines 79 - 93, The
LLMCopyButton logic currently fetches markdownUrl and unconditionally uses
res.text(), which allows error/404 HTML to be cached and copied; update the
fetch path used inside navigator.clipboard.write to check response.ok and only
use and cache res.text() when res.ok is true, otherwise attempt fetching
fallbackUrl (if provided) and only cache/copy successful responses; ensure you
reference the existing cache lookup and the ClipboardItem creation that uses
fetch(markdownUrl) and adjust it to throw or fallback when res.ok is false so
error payloads are never written to cache or clipboard.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Outside diff comments:
In `@apps/docs/src/components/page-actions.tsx`:
- Around line 79-93: The LLMCopyButton logic currently fetches markdownUrl and
unconditionally uses res.text(), which allows error/404 HTML to be cached and
copied; update the fetch path used inside navigator.clipboard.write to check
response.ok and only use and cache res.text() when res.ok is true, otherwise
attempt fetching fallbackUrl (if provided) and only cache/copy successful
responses; ensure you reference the existing cache lookup and the ClipboardItem
creation that uses fetch(markdownUrl) and adjust it to throw or fallback when
res.ok is false so error payloads are never written to cache or clipboard.

ℹ️ Review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 39b99d02-ca0a-489b-b3ad-b10325324425

📥 Commits

Reviewing files that changed from the base of the PR and between b5b35c3 and 3b841bc.

📒 Files selected for processing (3)
  • apps/docs/src/app/(docs)/(default)/[[...slug]]/page.tsx
  • apps/docs/src/components/ai-prompt-banner.tsx
  • apps/docs/src/components/page-actions.tsx
💤 Files with no reviewable changes (1)
  • apps/docs/src/components/ai-prompt-banner.tsx

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant