@actuate-media/cms-admin 0.14.1 → 0.16.0

package/dist/views/post-editor/PostTemplateEditor.js

@@ -0,0 +1,144 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import { AlertTriangle, ArrowLeft, Layout, Loader2, Save } from 'lucide-react';
+import { toast } from 'sonner';
+import { ConfirmDialog } from '../../components/ui/ConfirmDialog.js';
+import { ErrorBoundary } from '../../components/ErrorBoundary.js';
+import { addSection, createSection, duplicateSection, fetchTemplateForEditor, reorderSections, removeSection, saveTemplate, toggleSectionVisibility, updateSectionContent, updateSectionMeta, updateSectionSettings, validateTemplate, } from '../../lib/post-editor-service.js';
+import { DEFAULT_VIEWPORT } from '../page-editor/viewports.js';
+import { SectionsPanel } from '../page-editor/SectionsPanel.js';
+import { SectionInspector } from '../page-editor/SectionInspector.js';
+import { AddSectionModal } from '../page-editor/AddSectionModal.js';
+import { PostEditorCanvas } from './PostEditorCanvas.js';
+import { PostHeaderPanel } from './PostHeaderPanel.js';
+function deriveCanEdit(session) {
+    const role = session?.user?.role;
+    if (!role)
+        return true;
+    return ['ADMIN', 'EDITOR'].includes(role);
+}
+const SAMPLE_CONTEXT = {
+    title: 'Sample Post Title',
+    excerpt: 'A short summary that previews how the header excerpt will look.',
+    body: 'This is sample body copy.\n\nIt shows how the Article Body section renders the post body once an author writes a post with this template.',
+    publishDate: new Date().toISOString(),
+    category: 'Category',
+    author: { name: 'Author Name', bio: 'A short example author bio for the preview.' },
+};
+export function PostTemplateEditor({ postType, config, session, onNavigate, }) {
+    const [template, setTemplate] = useState(null);
+    const [loading, setLoading] = useState(true);
+    const [loadError, setLoadError] = useState(null);
+    // selection: a section id, the special 'header' panel, or nothing.
+    const [selected, setSelected] = useState(null);
+    const [viewport, setViewport] = useState(DEFAULT_VIEWPORT);
+    const [dirty, setDirty] = useState(false);
+    const [saving, setSaving] = useState(false);
+    const [addOpen, setAddOpen] = useState(false);
+    const [deleteTargetId, setDeleteTargetId] = useState(null);
+    const [leaveTarget, setLeaveTarget] = useState(null);
+    const canEdit = useMemo(() => deriveCanEdit(session), [session]);
+    const typeLabel = useMemo(() => {
+        const col = config?.collections?.[postType];
+        return col?.labels?.singular ?? postType;
+    }, [config, postType]);
+    useEffect(() => {
+        let cancelled = false;
+        setLoading(true);
+        setLoadError(null);
+        fetchTemplateForEditor(postType)
+            .then((t) => {
+            if (!cancelled)
+                setTemplate(t);
+        })
+            .catch((err) => {
+            if (!cancelled)
+                setLoadError(err instanceof Error ? err.message : 'Failed to load template');
+        })
+            .finally(() => {
+            if (!cancelled)
+                setLoading(false);
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [postType]);
+    useEffect(() => {
+        if (!dirty)
+            return;
+        function onBeforeUnload(e) {
+            e.preventDefault();
+            e.returnValue = '';
+        }
+        window.addEventListener('beforeunload', onBeforeUnload);
+        return () => window.removeEventListener('beforeunload', onBeforeUnload);
+    }, [dirty]);
+    const mutateSections = useCallback((fn) => {
+        setTemplate((prev) => (prev ? { ...prev, sections: fn(prev.sections) } : prev));
+        setDirty(true);
+    }, []);
+    const handleHeaderChange = useCallback((patch) => {
+        setTemplate((prev) => (prev ? { ...prev, header: { ...prev.header, ...patch } } : prev));
+        setDirty(true);
+    }, []);
+    const handleAdd = useCallback((type) => {
+        const section = createSection(type);
+        mutateSections((s) => addSection(s, section));
+        setSelected({ kind: 'section', id: section.id });
+        setAddOpen(false);
+    }, [mutateSections]);
+    const selectedSectionId = selected?.kind === 'section' ? selected.id : null;
+    const handleSave = useCallback(async () => {
+        if (!template)
+            return;
+        const result = validateTemplate(template);
+        if (result.errors.length > 0) {
+            toast.error(result.errors[0]);
+            return;
+        }
+        setSaving(true);
+        try {
+            const saved = await saveTemplate(template);
+            setTemplate(saved);
+            setDirty(false);
+            toast.success('Template saved');
+        }
+        catch (err) {
+            toast.error(err instanceof Error ? err.message : 'Failed to save template');
+        }
+        finally {
+            setSaving(false);
+        }
+    }, [template]);
+    const guardedNavigate = useCallback((path) => {
+        if (dirty)
+            setLeaveTarget(path);
+        else
+            onNavigate(path);
+    }, [dirty, onNavigate]);
+    if (loading) {
+        return (_jsxs("div", { className: "bg-background flex h-full items-center justify-center", children: [_jsx(Loader2, { className: "text-muted-foreground h-6 w-6 animate-spin", "aria-hidden": true }), _jsx("span", { className: "sr-only", children: "Loading template editor\u2026" })] }));
+    }
+    if (loadError || !template) {
+        return (_jsx("div", { className: "bg-background flex h-full items-center justify-center p-6", children: _jsxs("div", { className: "border-destructive/30 bg-destructive/5 flex max-w-md items-center gap-3 rounded-lg border p-4", children: [_jsx(AlertTriangle, { className: "text-destructive shrink-0", size: 20, "aria-hidden": true }), _jsxs("div", { className: "min-w-0", children: [_jsx("p", { className: "text-foreground text-sm font-medium", children: "Failed to load template" }), _jsx("p", { className: "text-muted-foreground mt-1 text-sm", children: loadError ?? 'Not found.' }), _jsx("button", { type: "button", onClick: () => onNavigate('/posts/types'), className: "text-primary mt-2 text-sm font-medium hover:underline", children: "Back to Post Types" })] })] }) }));
+    }
+    const selectedSection = template.sections.find((s) => s.id === selectedSectionId) ?? null;
+    return (_jsxs(ErrorBoundary, { children: [_jsxs("div", { className: "bg-background flex h-full flex-col overflow-hidden", children: [_jsxs("header", { className: "bg-card border-border flex h-14 shrink-0 items-center justify-between gap-4 border-b px-4", children: [_jsxs("nav", { "aria-label": "Breadcrumb", className: "flex min-w-0 items-center gap-1.5 text-sm", children: [_jsxs("button", { type: "button", onClick: () => guardedNavigate('/posts/types'), className: "text-muted-foreground hover:text-foreground inline-flex shrink-0 items-center gap-1.5", children: [_jsx(ArrowLeft, { className: "h-4 w-4", "aria-hidden": true }), "Post Types"] }), _jsx("span", { className: "text-muted-foreground", "aria-hidden": true, children: "/" }), _jsxs("span", { className: "text-foreground truncate font-medium", children: [typeLabel, " Template"] }), dirty && (_jsx("span", { className: "text-muted-foreground ml-2 text-xs", "aria-live": "polite", children: "Unsaved changes" }))] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs("button", { type: "button", onClick: () => setSelected({ kind: 'header' }), className: `inline-flex items-center gap-1.5 rounded-lg border px-3 py-1.5 text-sm font-medium transition-colors ${selected?.kind === 'header'
+                                            ? 'border-primary bg-accent text-foreground'
+                                            : 'border-border text-foreground hover:bg-accent'}`, children: [_jsx(Layout, { className: "h-4 w-4", "aria-hidden": true }), "Header"] }), _jsxs("button", { type: "button", onClick: handleSave, disabled: !canEdit || saving || !dirty, className: "bg-primary text-primary-foreground hover:bg-primary/90 inline-flex items-center gap-1.5 rounded-lg px-3.5 py-1.5 text-sm font-medium transition-colors disabled:cursor-not-allowed disabled:opacity-50", children: [saving ? (_jsx(Loader2, { className: "h-3.5 w-3.5 animate-spin", "aria-hidden": true })) : (_jsx(Save, { className: "h-3.5 w-3.5", "aria-hidden": true })), "Save"] })] })] }), _jsxs("div", { className: "flex flex-1 overflow-hidden", children: [_jsx(SectionsPanel, { sections: template.sections, selectedId: selectedSectionId, canEdit: canEdit, onSelect: (id) => setSelected({ kind: 'section', id }), onReorder: (ids) => mutateSections((s) => reorderSections(s, ids)), onToggleVisibility: (id) => mutateSections((s) => toggleSectionVisibility(s, id)), onDuplicate: (id) => mutateSections((s) => duplicateSection(s, id)), onRequestDelete: (id) => setDeleteTargetId(id), onAdd: () => setAddOpen(true) }), _jsx("div", { className: "flex-1 overflow-hidden", children: _jsx(PostEditorCanvas, { sections: template.sections, header: template.header, context: SAMPLE_CONTEXT, selectedId: selectedSectionId, viewport: viewport, onSelect: (id) => setSelected({ kind: 'section', id }), onAddSection: () => setAddOpen(true) }) }), selected?.kind === 'header' && (_jsx(PostHeaderPanel, { header: template.header, canEdit: canEdit, onClose: () => setSelected(null), onChange: handleHeaderChange })), selectedSection && (_jsx(SectionInspector, { section: selectedSection, canEdit: canEdit, onClose: () => setSelected(null), onContentChange: (patch) => mutateSections((s) => updateSectionContent(s, selectedSection.id, patch)), onSettingsChange: (patch) => mutateSections((s) => updateSectionSettings(s, selectedSection.id, patch)), onMetaChange: (patch) => mutateSections((s) => updateSectionMeta(s, selectedSection.id, patch)), onToggleVisibility: () => mutateSections((s) => toggleSectionVisibility(s, selectedSection.id)) }))] })] }), _jsx(AddSectionModal, { open: addOpen, scope: "post", onClose: () => setAddOpen(false), onAdd: handleAdd }), _jsx(ConfirmDialog, { open: deleteTargetId !== null, onClose: () => setDeleteTargetId(null), onConfirm: () => {
+                    if (deleteTargetId) {
+                        mutateSections((s) => removeSection(s, deleteTargetId));
+                        if (selectedSectionId === deleteTargetId)
+                            setSelected(null);
+                    }
+                    setDeleteTargetId(null);
+                }, title: "Delete section?", description: "This removes the section from the template. You can undo by leaving without saving.", confirmLabel: "Delete", destructive: true }), _jsx(ConfirmDialog, { open: leaveTarget !== null, onClose: () => setLeaveTarget(null), onConfirm: () => {
+                    const target = leaveTarget;
+                    setLeaveTarget(null);
+                    setDirty(false);
+                    if (target)
+                        onNavigate(target);
+                }, title: "Discard unsaved changes?", description: "You have unsaved changes that will be lost if you leave now.", confirmLabel: "Leave", cancelLabel: "Stay", destructive: true })] }));
+}
+//# sourceMappingURL=PostTemplateEditor.js.map

package/dist/views/post-editor/PostTemplateEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PostTemplateEditor.js","sourceRoot":"","sources":["../../../src/views/post-editor/PostTemplateEditor.tsx"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@actuate-media/cms-admin",
-  "version": "0.14.1",
+  "version": "0.16.0",
   "repository": {
     "type": "git",
     "url": "https://github.com/actuate-media/actuatecms.git",
@@ -87,7 +87,7 @@
     "tailwindcss": "^4.0.0",
     "typescript": "^5.7.0",
     "vitest": "^3.0.0",
-    "@actuate-media/cms-core": "0.25.1",
+    "@actuate-media/cms-core": "0.27.0",
     "@actuate-media/component-blocks": "0.2.0"
   },
   "scripts": {

package/src/AdminRoot.tsx

@@ -1,6 +1,7 @@
 'use client'
 
-import { useState, useMemo, useEffect, useRef } from 'react'
+import { useState, useMemo, useEffect, useRef, useCallback } from 'react'
+import { toast } from 'sonner'
 import { Layout } from './layout/Layout.js'
 import { useAdminRouter } from './router/index.js'
 import { ensureCsrfToken } from './lib/api.js'
@@ -26,8 +27,20 @@ import { ThemeProvider } from './components/ThemeProvider.js'
 import { LocaleProvider } from './components/LocaleProvider.js'
 import { useKeyboardShortcuts } from './hooks/useKeyboardShortcuts.js'
 import { PageBuilder } from './views/page-builder/PageBuilder.js'
+import { PageSectionEditor } from './views/page-editor/PageSectionEditor.js'
+import { PagePreview } from './views/page-editor/PagePreview.js'
 import { SavedSections } from './views/page-builder/SavedSections.js'
 import { PageTemplates } from './views/page-builder/PageTemplates.js'
+import { Widgets } from './views/page-builder/Widgets.js'
+import { PagesListView } from './views/Pages/PagesListView.js'
+import { PageTagManager } from './views/Pages/PageTagManager.js'
+import { PostsListView } from './views/Posts/PostsListView.js'
+import { PostTypesView } from './views/Posts/PostTypesView.js'
+import { NewPostPicker } from './views/Posts/NewPostPicker.js'
+import { NewPostTypeInstructions } from './views/Posts/NewPostTypeInstructions.js'
+import { PostSectionEditor } from './views/post-editor/PostSectionEditor.js'
+import { PostTemplateEditor } from './views/post-editor/PostTemplateEditor.js'
+import { PostPreview } from './views/post-editor/PostPreview.js'
 
 export interface AdminRootProps {
   config: any
@@ -58,9 +71,45 @@ function AdminShell({
   onLogin,
   captchaConfig,
 }: AdminRootProps) {
-  const { currentPath, navigate, matchRoute } = useAdminRouter(basePath, initialPath)
+  const { currentPath, navigate, matchRoute, buildHref } = useAdminRouter(basePath, initialPath)
   const [shortcutHelpOpen, setShortcutHelpOpen] = useState(false)
 
+  // Open a preview route in a new browser tab so it behaves like a normal,
+  // shareable page (its own URL, no admin chrome — see the standalone branch
+  // below). The blank tab is opened synchronously inside the click gesture so
+  // popup blockers permit it; `prepare` (e.g. saving an unsaved draft) runs
+  // before we point the tab at the URL, guaranteeing the preview reflects the
+  // latest saved content. If `prepare` rejects, the tab is closed.
+  const openPreview = useCallback(
+    (path: string, prepare?: () => Promise<boolean | void> | boolean | void) => {
+      if (typeof window === 'undefined') return
+      const tab = window.open('about:blank', '_blank')
+      if (!tab) {
+        toast.error('Enable pop-ups for this site to open the preview in a new tab.')
+        return
+      }
+      const go = (ok: boolean | void) => {
+        if (ok === false) {
+          tab?.close()
+          return
+        }
+        if (tab && !tab.closed) {
+          // Sever the opener link for safety, then load the real URL.
+          try {
+            tab.opener = null
+          } catch {
+            /* cross-origin guard — never throws for same-origin admin */
+          }
+          tab.location.replace(buildHref(path))
+        }
+      }
+      Promise.resolve(prepare?.())
+        .then(go)
+        .catch(() => tab?.close())
+    },
+    [buildHref],
+  )
+
   useBranding(config)
   useAdminPageTitle(config, currentPath)
 
@@ -178,6 +227,142 @@ function AdminShell({
       return <MediaBrowser onNavigate={navigate} />
     }
 
+    // ─── Posts area ────────────────────────────────────────────────
+    // These take priority over the per-collection `/<slug>` matcher
+    // below so a consumer-defined `posts` collection can't accidentally
+    // shadow the aggregate Posts view.
+    if (matchRoute('/posts/types/new')) {
+      return <NewPostTypeInstructions onNavigate={navigate} />
+    }
+    // Per-type template editor — must match before `/posts/types/:slug/edit`
+    // is irrelevant (distinct last segment) but stays grouped with the type
+    // routes so it can't be shadowed by the generic `/posts/:type/*` block.
+    const postTypeTemplate = matchRoute('/posts/types/:slug/template')
+    if (postTypeTemplate?.slug) {
+      return (
+        <PostTemplateEditor
+          postType={postTypeTemplate.slug}
+          config={config}
+          session={session}
+          onNavigate={navigate}
+        />
+      )
+    }
+    const postTypeEdit = matchRoute('/posts/types/:slug/edit')
+    if (postTypeEdit?.slug) {
+      // V1 falls through to the per-collection list view; future
+      // PR introduces a dedicated PostTypeEditor with field-level
+      // metadata. The list view is the natural per-type management
+      // surface today (it already shows posts in that type).
+      return (
+        <CollectionList collectionSlug={postTypeEdit.slug} config={config} onNavigate={navigate} />
+      )
+    }
+    if (matchRoute('/posts/types')) {
+      return <PostTypesView onNavigate={navigate} />
+    }
+    if (matchRoute('/posts/new')) {
+      return <NewPostPicker onNavigate={navigate} />
+    }
+    if (matchRoute('/posts')) {
+      return <PostsListView onNavigate={navigate} />
+    }
+    // Section-based Post editor. These `/posts/:type/*` patterns are tested
+    // AFTER every `/posts/types/*` route above so `:type` cannot swallow the
+    // reserved "types" segment.
+    const postNew = matchRoute('/posts/:type/new')
+    if (postNew?.type) {
+      return (
+        <PostSectionEditor
+          postType={postNew.type}
+          config={config}
+          session={session}
+          onNavigate={navigate}
+          onOpenPreview={openPreview}
+        />
+      )
+    }
+    const postPreview = matchRoute('/posts/:type/:id/preview')
+    if (postPreview?.type && postPreview?.id) {
+      return (
+        <PostPreview
+          postType={postPreview.type}
+          documentId={postPreview.id}
+          session={session}
+          onNavigate={navigate}
+        />
+      )
+    }
+    const postEdit = matchRoute('/posts/:type/:id/edit')
+    if (postEdit?.type && postEdit?.id) {
+      return (
+        <PostSectionEditor
+          postType={postEdit.type}
+          documentId={postEdit.id}
+          config={config}
+          session={session}
+          onNavigate={navigate}
+          onOpenPreview={openPreview}
+        />
+      )
+    }
+
+    // ─── Pages area ────────────────────────────────────────────────
+    // Ordering matters: tag routes and /pages/new must be tested before
+    // the `/pages/:id` matcher, otherwise `:id` swallows "tags"/"new".
+    if (matchRoute('/pages/tags/new')) {
+      return <PageTagManager onNavigate={navigate} startCreating />
+    }
+    const pageTagEdit = matchRoute('/pages/tags/:id/edit')
+    if (pageTagEdit?.id) {
+      // The manager is a single CRUD surface; deep-linking to a tag just
+      // opens the manager (inline edit lives per-row).
+      return <PageTagManager onNavigate={navigate} />
+    }
+    if (matchRoute('/pages/tags')) {
+      return <PageTagManager onNavigate={navigate} />
+    }
+    if (matchRoute('/pages/new')) {
+      return (
+        <PageSectionEditor
+          config={config}
+          session={session}
+          onNavigate={navigate}
+          onOpenPreview={openPreview}
+        />
+      )
+    }
+    const pagePreview = matchRoute('/pages/:id/preview')
+    if (pagePreview?.id) {
+      return <PagePreview documentId={pagePreview.id} onNavigate={navigate} />
+    }
+    const pageEdit = matchRoute('/pages/:id/edit')
+    if (pageEdit?.id) {
+      return (
+        <PageSectionEditor
+          documentId={pageEdit.id}
+          config={config}
+          session={session}
+          onNavigate={navigate}
+          onOpenPreview={openPreview}
+        />
+      )
+    }
+    const pageEditBare = matchRoute('/pages/:id')
+    if (pageEditBare?.id) {
+      return (
+        <PageSectionEditor
+          documentId={pageEditBare.id}
+          config={config}
+          session={session}
+          onNavigate={navigate}
+        />
+      )
+    }
+    if (matchRoute('/pages')) {
+      return <PagesListView onNavigate={navigate} />
+    }
+
     if (matchRoute('/forms/new')) {
       return <FormEditor onNavigate={navigate} />
     }
@@ -225,6 +410,10 @@ function AdminShell({
       return <PageTemplates onNavigate={navigate} />
     }
 
+    if (matchRoute('/widgets')) {
+      return <Widgets onNavigate={navigate} />
+    }
+
     if (matchRoute('/users')) {
       return <Users onNavigate={navigate} />
     }
@@ -264,10 +453,21 @@ function AdminShell({
       'script-tags',
       'saved-sections',
       'page-templates',
+      'widgets',
       'users',
       'settings',
       'page-builder',
       'collections',
+      // `pages` is reserved so the Pages list/editor/tag routes above
+      // own the `/pages/*` namespace and can't be shadowed by a
+      // consumer-defined `pages` collection. The per-collection list is
+      // still reachable via `/collections/pages`.
+      'pages',
+      // `posts` is reserved so the aggregate Posts area is reachable
+      // even if a consumer defines a collection literally called
+      // `posts`. The per-type collection list is still available via
+      // `/collections/posts`.
+      'posts',
     ])
 
     for (const [slug, def] of collectionMap) {
@@ -354,6 +554,17 @@ function AdminShell({
     )
   }
 
+  // Preview routes render as standalone pages (no sidebar/header) so a
+  // new-tab preview looks like the real published page rather than an
+  // embedded admin view. Everything else gets the full admin chrome.
+  if (currentPath.endsWith('/preview')) {
+    return (
+      <div className="bg-background h-full min-h-screen">
+        <ErrorBoundary>{renderView()}</ErrorBoundary>
+      </div>
+    )
+  }
+
   return (
     <Layout config={config} session={session} currentPath={currentPath} onNavigate={navigate}>
       <ErrorBoundary>{renderView()}</ErrorBoundary>

package/src/__tests__/components/posts-badges.test.tsx

@@ -0,0 +1,77 @@
+// @vitest-environment happy-dom
+import { describe, expect, it } from 'vitest'
+import { render, screen } from '@testing-library/react'
+import {
+  PostStatusBadge,
+  PostTypeBadge,
+  SeoScoreIndicator,
+  seoScorePalette,
+  paletteFor,
+} from '../../components/posts/badges.js'
+
+describe('seoScorePalette', () => {
+  it('returns gray for null', () => {
+    expect(seoScorePalette(null)).toBe('gray')
+  })
+  it.each([
+    [80, 'green'],
+    [100, 'green'],
+    [79, 'orange'],
+    [60, 'orange'],
+    [59, 'red'],
+    [1, 'red'],
+    [0, 'gray'],
+  ])('score %i → %s', (input, expected) => {
+    expect(seoScorePalette(input)).toBe(expected)
+  })
+})
+
+describe('paletteFor', () => {
+  it('falls back to gray for unknown colors', () => {
+    const p = paletteFor('chartreuse')
+    expect(p.bg).toContain('muted')
+  })
+  it('returns gray for null', () => {
+    const p = paletteFor(null)
+    expect(p.bg).toContain('muted')
+  })
+  it('returns purple tokens for "purple"', () => {
+    const p = paletteFor('purple')
+    expect(p.bg).toMatch(/violet/)
+    expect(p.border).toMatch(/violet/)
+  })
+})
+
+describe('SeoScoreIndicator', () => {
+  it('renders a dash for missing score', () => {
+    render(<SeoScoreIndicator score={null} />)
+    expect(screen.getByText('—')).toBeTruthy()
+  })
+  it('renders the numeric score when present', () => {
+    render(<SeoScoreIndicator score={88} />)
+    expect(screen.getByText('88')).toBeTruthy()
+  })
+})
+
+describe('PostStatusBadge', () => {
+  it('renders the human label for each status', () => {
+    render(<PostStatusBadge status="PUBLISHED" />)
+    expect(screen.getByText('Published')).toBeTruthy()
+  })
+  it('uses an aria-label so screen readers get a clean Status: foo announcement', () => {
+    const { container } = render(<PostStatusBadge status="SCHEDULED" />)
+    expect(container.querySelector('[aria-label="Status: Scheduled"]')).toBeTruthy()
+  })
+})
+
+describe('PostTypeBadge', () => {
+  it('renders as a static span when no onClick is provided', () => {
+    const { container } = render(<PostTypeBadge label="Blog" color="purple" />)
+    expect(container.querySelector('span')?.textContent).toBe('Blog')
+    expect(container.querySelector('button')).toBeNull()
+  })
+  it('renders as a button when onClick is provided', () => {
+    render(<PostTypeBadge label="Blog" color="purple" onClick={() => {}} />)
+    expect(screen.getByRole('button', { name: 'Blog' })).toBeTruthy()
+  })
+})