- app/(app)/products/[id]/docs/[folder]/[slug]/page.tsx: server-route
die doc laadt (scope-checked via productAccessFilter), frontmatter
parseert, en op basis van ?edit=1 viewer of editor toont. Fallback
voor unparseable frontmatter toont errors + raw content in <pre>.
- product-doc-viewer.tsx: server-component met frontmatter-kop
(title + status-badge + audience/applies_to/last_updated meta) en
body via <Markdown> (XSS-safe).
- product-doc-editor.tsx: client-wrapper rond MarkdownDocEditor met
parseProductDocMd validator + updateProductDocAction + cancelHref.
- delete-product-doc-button.tsx: AlertDialog confirm + delete-action
+ DemoTooltip + redirect-na-success. Disabled in demo.
- Edit-knop conditioneel verborgen bij disabled folder (T-1071 voegt
banner toe); delete blijft altijd zichtbaar voor cleanup.
- Button met `render={<Link/>}` ipv asChild (CLAUDE.md hardstop
base-ui pattern).
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
44 lines
1.4 KiB
TypeScript
44 lines
1.4 KiB
TypeScript
'use client'
|
|
|
|
// Editor-wrapper voor Product Docs. Dunne wrapper rond MarkdownDocEditor
|
|
// (shared) die de product-doc-specifieke action + validator injecteert.
|
|
// Onderdeel van de viewer-page (T-1069) — wordt getoond wanneer `?edit=1`
|
|
// in de searchParams staat.
|
|
|
|
import { useRouter } from 'next/navigation'
|
|
|
|
import { MarkdownDocEditor } from '@/components/shared/markdown-doc-editor'
|
|
import { parseProductDocMd } from '@/lib/product-doc-parser'
|
|
import { updateProductDocAction } from '@/actions/product-docs'
|
|
|
|
interface Props {
|
|
docId: string
|
|
initialValue: string
|
|
/** URL waar de gebruiker naar terug navigeert na annuleren of opslaan. */
|
|
cancelHref: string
|
|
}
|
|
|
|
function frontmatterValidator(value: string) {
|
|
const r = parseProductDocMd(value)
|
|
return r.ok ? [] : r.errors
|
|
}
|
|
|
|
export function ProductDocEditor({ docId, initialValue, cancelHref }: Props) {
|
|
const router = useRouter()
|
|
|
|
return (
|
|
<MarkdownDocEditor
|
|
storageKey={`product-doc-${docId}`}
|
|
initialValue={initialValue}
|
|
validate={frontmatterValidator}
|
|
onSave={(value) => updateProductDocAction(docId, value)}
|
|
onSaved={() => router.refresh()}
|
|
onCancel={() => router.push(cancelHref)}
|
|
placeholder={`---\ntitle: "..."\nstatus: draft\n---\n\n# Inhoud\n`}
|
|
validationErrorsHeader="YAML-frontmatter fouten"
|
|
debugId="product-doc-editor"
|
|
debugComponentName="ProductDocEditor"
|
|
debugFile="components/product-docs/product-doc-editor.tsx"
|
|
/>
|
|
)
|
|
}
|