Skip to main content

ContentActions

Provides action buttons for blog posts, guides, and kickstarts including copying content for LLM and viewing as markdown.

Props

PropTypeRequiredDefaultDescription
contentBlogpost | Guide | KickstartYes-Content data from Contentstack
type'blog' | 'guide' | 'kickstart'Yes-Content type to determine field names and routes
classNamestringNo''Additional CSS classes for the wrapper
layout'stacked' | 'inline'No'stacked'Layout style for actions
fullGuideUrlstringNo-URL for the full guide markdown (shows "Full Guide Markdown" button when set)

Usage

import ContentActions from '@/components/organisms/ContentActions';

// For blog posts
<ContentActions content={blogPost} type="blog" />

// For guides
<ContentActions content={guide} type="guide" />

// For kickstarts
<ContentActions content={kickstart} type="kickstart" />

// Inline layout (header/meta row)
<ContentActions content={guide} type="guide" layout="inline" />

// Guide with full guide link (parent or chapter)
<ContentActions content={guide} type="guide" layout="inline" fullGuideUrl="/guides/my-guide/full.md" />

Features

  • Copy for LLM: Formats content (title, authors, dates, content) for LLM consumption and copies to clipboard
  • View as Markdown: Links to markdown version at /blog/[slug].md or /guides/[...slug].md
  • Full Guide Markdown: Links to /guides/{slug}/full.md (all chapters concatenated). Only shown when fullGuideUrl is provided.
  • Shows "Copied!" feedback when content is copied
  • Uses icons from the Icons component
  • Works with blog posts, guides, and kickstarts

Actions

Copy for LLM

Formats the content into a structured text format including:

  • Title (from blog_content.title or guide_content.title)
  • Authors
  • Published/Updated dates (date fallback to created_at)
  • Full content text

View as Markdown

Links to the markdown route for the current content:

  • Blogs: /blog/[slug].md
  • Guides: /guides/[...slug].md
  • Kickstarts: /kickstarts/[...slug].md

Full Guide Markdown

Only rendered when fullGuideUrl is provided. Links to the full guide markdown route (/guides/{slug}/full.md) which returns all chapters concatenated into a single document. Used on both parent guide pages and chapter pages.

Notes

  • Client-side component (uses 'use client')
  • Uses usePathname to extract slug from current route
  • Copy feedback disappears after 2 seconds
  • Automatically handles different content field names based on type (blog_content, guide_content, kickstart_content)