diff --git a/apps/web/src/components/PayloadRichText.tsx b/apps/web/src/components/PayloadRichText.tsx index 0867773..e07e193 100644 --- a/apps/web/src/components/PayloadRichText.tsx +++ b/apps/web/src/components/PayloadRichText.tsx @@ -5,6 +5,39 @@ import { Mermaid } from "@/src/components/Mermaid"; import { LeadMagnet } from "@/src/components/LeadMagnet"; import { ComparisonRow } from "@/src/components/Landing/ComparisonRow"; import { mdxComponents } from "../content-engine/components"; +import React from "react"; + +/** + * Renders markdown-style inline links [text](/url) as tags. + * Used by mintelP blocks which store body text with links. + */ +function renderInlineMarkdown(text: string): React.ReactNode { + if (!text) return null; + const parts = text.split(/(\[[^\]]+\]\([^)]+\)|[^<]*<\/Marker>)/); + return parts.map((part, i) => { + const linkMatch = part.match(/\[([^\]]+)\]\(([^)]+)\)/); + if (linkMatch) { + return ( + + {linkMatch[1]} + + ); + } + const markerMatch = part.match(/([^<]*)<\/Marker>/); + if (markerMatch) { + return ( + + {markerMatch[1]} + + ); + } + return {part}; + }); +} const jsxConverters: JSXConverters = { blocks: { @@ -49,6 +82,15 @@ const jsxConverters: JSXConverters = { showShare={true} /> ), + // --- Core text blocks --- + mintelP: ({ node }: any) => ( +

+ {renderInlineMarkdown(node.fields.text)} +

+ ), + mintelTldr: ({ node }: any) => ( + {node.fields.content} + ), // --- MDX Registry Injections --- leadParagraph: ({ node }: any) => ( @@ -81,37 +123,46 @@ const jsxConverters: JSXConverters = { /> ), diagramState: ({ node }: any) => ( - +
+ + {node.fields.definition} + +
), diagramTimeline: ({ node }: any) => ( - +
+ + {node.fields.definition} + +
), diagramGantt: ({ node }: any) => ( - +
+ + {node.fields.definition} + +
), diagramPie: ({ node }: any) => ( - +
+ + {node.fields.definition} + +
), diagramSequence: ({ node }: any) => ( - +
+ + {node.fields.definition} + +
), diagramFlow: ({ node }: any) => ( - +
+ + {node.fields.definition} + +
), waterfallChart: ({ node }: any) => ( @@ -131,7 +182,7 @@ const jsxConverters: JSXConverters = { {node.fields.items?.map((item: any, i: number) => ( // @ts-ignore - {item.description} + {item.title || item.description} ))} diff --git a/apps/web/src/payload/blocks/ArchitectureBuilderBlock.ts b/apps/web/src/payload/blocks/ArchitectureBuilderBlock.ts index cab7ffe..77626be 100644 --- a/apps/web/src/payload/blocks/ArchitectureBuilderBlock.ts +++ b/apps/web/src/payload/blocks/ArchitectureBuilderBlock.ts @@ -11,12 +11,6 @@ export const ArchitectureBuilderBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "ArchitectureBuilder", - description: - "Interactive comparison between a standard SaaS rental approach and a custom Built-First (Mintel) architecture. Useful for articles discussing digital ownership, software rent vs. build, or technological assets. Requires no props.", - usageExample: "''", - }, fields: [ { name: "preset", diff --git a/apps/web/src/payload/blocks/ArticleBlockquoteBlock.ts b/apps/web/src/payload/blocks/ArticleBlockquoteBlock.ts index 4f4e3fc..506eb7b 100644 --- a/apps/web/src/payload/blocks/ArticleBlockquoteBlock.ts +++ b/apps/web/src/payload/blocks/ArticleBlockquoteBlock.ts @@ -11,12 +11,6 @@ export const ArticleBlockquoteBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "ArticleBlockquote", - description: "Styled blockquote for expert quotes or key statements.", - usageExample: - "'\n Performance ist keine IT-Kennzahl, sondern ein ökonomischer Hebel.\n'", - }, fields: [ { name: "quote", diff --git a/apps/web/src/payload/blocks/ArticleMemeBlock.ts b/apps/web/src/payload/blocks/ArticleMemeBlock.ts index 0a00669..e973552 100644 --- a/apps/web/src/payload/blocks/ArticleMemeBlock.ts +++ b/apps/web/src/payload/blocks/ArticleMemeBlock.ts @@ -10,13 +10,6 @@ export const ArticleMemeBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "ArticleMeme", - description: - "Real image-based meme from the media library. Use for static screenshots or custom memes that are not available via memegen.link.", - usageExample: - '', - }, fields: [ { name: "image", diff --git a/apps/web/src/payload/blocks/ButtonBlock.ts b/apps/web/src/payload/blocks/ButtonBlock.ts index 962c405..4fa0c7d 100644 --- a/apps/web/src/payload/blocks/ButtonBlock.ts +++ b/apps/web/src/payload/blocks/ButtonBlock.ts @@ -11,13 +11,6 @@ export const ButtonBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "Button", - description: - "DEPRECATED: Use instead for main CTAs. Only use for small secondary links.", - usageExample: - '', - }, fields: [ { name: "label", diff --git a/apps/web/src/payload/blocks/CarouselBlock.ts b/apps/web/src/payload/blocks/CarouselBlock.ts index 0269563..3ba97f8 100644 --- a/apps/web/src/payload/blocks/CarouselBlock.ts +++ b/apps/web/src/payload/blocks/CarouselBlock.ts @@ -11,13 +11,6 @@ export const CarouselBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "Carousel", - description: - "Interactive swipeable slider for multi-step explanations. IMPORTANT: items array must contain at least 2 items with substantive title and content text (no empty content).", - usageExample: - '\' B[End]", - }, fields: [ { name: "definition", diff --git a/apps/web/src/payload/blocks/DiagramGanttBlock.ts b/apps/web/src/payload/blocks/DiagramGanttBlock.ts index b1872a1..0a9aa01 100644 --- a/apps/web/src/payload/blocks/DiagramGanttBlock.ts +++ b/apps/web/src/payload/blocks/DiagramGanttBlock.ts @@ -11,12 +11,6 @@ export const DiagramGanttBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "DiagramGantt", - description: "Mermaid Gantt timeline chart. MUST output raw mermaid code.", - usageExample: - "gantt\\n title Project Roadmap\\n dateFormat YYYY-MM-DD\\n Section Design\\n Draft UI :a1, 2024-01-01, 7d", - }, fields: [ { name: "definition", diff --git a/apps/web/src/payload/blocks/DiagramPieBlock.ts b/apps/web/src/payload/blocks/DiagramPieBlock.ts index af7fd5f..0203639 100644 --- a/apps/web/src/payload/blocks/DiagramPieBlock.ts +++ b/apps/web/src/payload/blocks/DiagramPieBlock.ts @@ -11,11 +11,6 @@ export const DiagramPieBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "DiagramPie", - description: "Mermaid pie chart diagram. MUST output raw mermaid code.", - usageExample: 'pie title Market Share\\n "Chrome" : 60\\n "Safari" : 20', - }, fields: [ { name: "definition", diff --git a/apps/web/src/payload/blocks/DiagramSequenceBlock.ts b/apps/web/src/payload/blocks/DiagramSequenceBlock.ts index e32dc2f..920934a 100644 --- a/apps/web/src/payload/blocks/DiagramSequenceBlock.ts +++ b/apps/web/src/payload/blocks/DiagramSequenceBlock.ts @@ -11,13 +11,6 @@ export const DiagramSequenceBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "DiagramSequence", - description: - "Mermaid sequence diagram showing actor interactions. MUST output raw mermaid code.", - usageExample: - "sequenceDiagram\\n Client->>Server: GET /api\\n Server-->>Client: 200 OK", - }, fields: [ { name: "definition", diff --git a/apps/web/src/payload/blocks/DiagramStateBlock.ts b/apps/web/src/payload/blocks/DiagramStateBlock.ts index 0403615..df344b7 100644 --- a/apps/web/src/payload/blocks/DiagramStateBlock.ts +++ b/apps/web/src/payload/blocks/DiagramStateBlock.ts @@ -11,12 +11,6 @@ export const DiagramStateBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "DiagramState", - description: - "Mermaid state diagram showing states and transitions. MUST output raw mermaid code.", - usageExample: "stateDiagram-v2\\n [*] --> Idle\\n Idle --> Loading", - }, fields: [ { name: "definition", diff --git a/apps/web/src/payload/blocks/DiagramTimelineBlock.ts b/apps/web/src/payload/blocks/DiagramTimelineBlock.ts index e3f477b..48b0a17 100644 --- a/apps/web/src/payload/blocks/DiagramTimelineBlock.ts +++ b/apps/web/src/payload/blocks/DiagramTimelineBlock.ts @@ -11,13 +11,6 @@ export const DiagramTimelineBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "DiagramTimeline", - description: - "Mermaid timeline or journey diagram. MUST output raw mermaid code.", - usageExample: - "timeline\\n title Project Timeline\\n 2024\\n : Q1 : Planning\\n : Q2 : Execution", - }, fields: [ { name: "definition", diff --git a/apps/web/src/payload/blocks/DigitalAssetVisualizerBlock.ts b/apps/web/src/payload/blocks/DigitalAssetVisualizerBlock.ts index bc9f382..660442d 100644 --- a/apps/web/src/payload/blocks/DigitalAssetVisualizerBlock.ts +++ b/apps/web/src/payload/blocks/DigitalAssetVisualizerBlock.ts @@ -11,12 +11,6 @@ export const DigitalAssetVisualizerBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "DigitalAssetVisualizer", - description: - "Interactive visualization illustrating the financial difference between software as a liability (SaaS/rent) and software as a digital asset (Custom IP). Great for articles concerning CTO strategies, business value of code, and digital independence. Requires no props.", - usageExample: "''", - }, fields: [ { name: "assetId", diff --git a/apps/web/src/payload/blocks/FAQSectionBlock.ts b/apps/web/src/payload/blocks/FAQSectionBlock.ts index 61bfdb6..0e8342f 100644 --- a/apps/web/src/payload/blocks/FAQSectionBlock.ts +++ b/apps/web/src/payload/blocks/FAQSectionBlock.ts @@ -16,13 +16,6 @@ export const FAQSectionBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "FAQSection", - description: - "Semantic wrapper for FAQ questions at the end of the article. Put standard Markdown H3/Paragraphs inside.", - usageExample: - "'\n

Frage 1

\n Antwort 1\n
'", - }, fields: [ { name: "content", diff --git a/apps/web/src/payload/blocks/ImageTextBlock.ts b/apps/web/src/payload/blocks/ImageTextBlock.ts index aaa8c85..8aba810 100644 --- a/apps/web/src/payload/blocks/ImageTextBlock.ts +++ b/apps/web/src/payload/blocks/ImageTextBlock.ts @@ -11,12 +11,6 @@ export const ImageTextBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "ImageText", - description: "Layout component for image next to explanatory text.", - usageExample: - '\'Erklärung...\'', - }, fields: [ { name: "image", diff --git a/apps/web/src/payload/blocks/LinkedInEmbedBlock.ts b/apps/web/src/payload/blocks/LinkedInEmbedBlock.ts index 76c9036..dd5fce5 100644 --- a/apps/web/src/payload/blocks/LinkedInEmbedBlock.ts +++ b/apps/web/src/payload/blocks/LinkedInEmbedBlock.ts @@ -11,13 +11,6 @@ export const LinkedInEmbedBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "LinkedInEmbed", - description: - "Embeds a professional post from LinkedIn. Use the activity URN (e.g. urn:li:activity:1234567890).", - usageExample: - "''", - }, fields: [ { name: "url", diff --git a/apps/web/src/payload/blocks/LoadTimeSimulatorBlock.ts b/apps/web/src/payload/blocks/LoadTimeSimulatorBlock.ts index 6dbce1c..0d1b7b8 100644 --- a/apps/web/src/payload/blocks/LoadTimeSimulatorBlock.ts +++ b/apps/web/src/payload/blocks/LoadTimeSimulatorBlock.ts @@ -11,12 +11,6 @@ export const LoadTimeSimulatorBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "LoadTimeSimulator", - description: - "Interactive visual race simulating the loading experience of a slow legacy CMS vs a fast headless stack. Great for articles discussing load times, technical debt, or user frustration. Requires no props.", - usageExample: "''", - }, fields: [ { name: "initialLoadTime", diff --git a/apps/web/src/payload/blocks/MarkerBlock.ts b/apps/web/src/payload/blocks/MarkerBlock.ts index 7b3a6e3..0db623d 100644 --- a/apps/web/src/payload/blocks/MarkerBlock.ts +++ b/apps/web/src/payload/blocks/MarkerBlock.ts @@ -11,12 +11,6 @@ export const MarkerBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "Marker", - description: - "Inline highlight (yellow marker effect) for emphasizing key phrases within paragraphs.", - usageExample: "'entscheidender Wettbewerbsvorteil'", - }, fields: [ { name: "text", diff --git a/apps/web/src/payload/blocks/MemeCardBlock.ts b/apps/web/src/payload/blocks/MemeCardBlock.ts index 8ae1052..f4bd1df 100644 --- a/apps/web/src/payload/blocks/MemeCardBlock.ts +++ b/apps/web/src/payload/blocks/MemeCardBlock.ts @@ -13,7 +13,7 @@ export const MemeCardBlock: MintelBlock = { ai: { name: "MemeCard", description: - 'Real meme image from memegen.link. template must be a valid memegen.link ID. IMPORTANT: Captions must be EXTREMELY SARCASTIC and PUNCHY (mocking bad B2B agencies, max 6 words per line). Best templates: drake (2-line prefer/dislike), gru (4-step plan backfire), disastergirl (burning house), fine (this is fine dog). Use German captions. Wrap in div with className="my-8".', + "Real meme from memegen.link. ONLY use these templates: drake, distracted-bf, change-my-mind, uno-draw-25, always-has-been. Captions MUST be in German, extremely sarcastic, max 6 words per line. Use pipe | to separate caption lines. Use sparingly: MAX 1 meme per article.", usageExample: `
`, diff --git a/apps/web/src/payload/blocks/MetricBarBlock.ts b/apps/web/src/payload/blocks/MetricBarBlock.ts index bf7306a..68d6822 100644 --- a/apps/web/src/payload/blocks/MetricBarBlock.ts +++ b/apps/web/src/payload/blocks/MetricBarBlock.ts @@ -11,12 +11,6 @@ export const MetricBarBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "MetricBar", - description: - "Animated horizontal progress bar. Use multiple in sequence to compare metrics. IMPORTANT: value MUST be a real number > 0, never use 0 or placeholder values. Props: label, value (number), max (default 100), unit (default %), color (red|green|blue|slate).", - usageExample: '', - }, fields: [ { name: "title", diff --git a/apps/web/src/payload/blocks/PerformanceROICalculatorBlock.ts b/apps/web/src/payload/blocks/PerformanceROICalculatorBlock.ts index 1de5a5f..8473688 100644 --- a/apps/web/src/payload/blocks/PerformanceROICalculatorBlock.ts +++ b/apps/web/src/payload/blocks/PerformanceROICalculatorBlock.ts @@ -11,12 +11,6 @@ export const PerformanceROICalculatorBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "PerformanceROICalculator", - description: - "Interactive simulation calculator showing the monetary ROI of improving load times (based on Deloitte B2B metrics). Use exactly once in performance-related articles to provide a highly engaging simulation. Requires no props.", - usageExample: "''", - }, fields: [ { name: "baseConversionRate", diff --git a/apps/web/src/payload/blocks/PremiumComparisonChartBlock.ts b/apps/web/src/payload/blocks/PremiumComparisonChartBlock.ts index 79a8234..f87efe4 100644 --- a/apps/web/src/payload/blocks/PremiumComparisonChartBlock.ts +++ b/apps/web/src/payload/blocks/PremiumComparisonChartBlock.ts @@ -11,13 +11,6 @@ export const PremiumComparisonChartBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "PremiumComparisonChart", - description: - "Advanced chart for comparing performance metrics with industrial aesthetics.", - usageExample: - '\'\n \n\'', - }, fields: [ { name: "direction", diff --git a/apps/web/src/payload/blocks/RevenueLossCalculatorBlock.ts b/apps/web/src/payload/blocks/RevenueLossCalculatorBlock.ts index 89eaee1..53d362e 100644 --- a/apps/web/src/payload/blocks/RevenueLossCalculatorBlock.ts +++ b/apps/web/src/payload/blocks/RevenueLossCalculatorBlock.ts @@ -11,12 +11,6 @@ export const RevenueLossCalculatorBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "RevenueLossCalculator", - description: - "Interactive calculator that estimates financial loss due to slow page load times. Use to build a business case for performance optimization.", - usageExample: "", - }, fields: [ { name: "title", diff --git a/apps/web/src/payload/blocks/SectionBlock.ts b/apps/web/src/payload/blocks/SectionBlock.ts index 2b93833..c5a8d82 100644 --- a/apps/web/src/payload/blocks/SectionBlock.ts +++ b/apps/web/src/payload/blocks/SectionBlock.ts @@ -12,12 +12,6 @@ export const SectionBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "Section", - description: "Wraps a thematic section block with optional heading.", - usageExample: - "'
\n

Section Title

\n

Content here.

\n
'", - }, fields: [ { name: "title", diff --git a/apps/web/src/payload/blocks/StatsDisplayBlock.ts b/apps/web/src/payload/blocks/StatsDisplayBlock.ts index 0585a33..daeac60 100644 --- a/apps/web/src/payload/blocks/StatsDisplayBlock.ts +++ b/apps/web/src/payload/blocks/StatsDisplayBlock.ts @@ -11,13 +11,6 @@ export const StatsDisplayBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "StatsDisplay", - description: - "A single large stat card with prominent value, label, and optional subtext.", - usageExample: - '\'\'', - }, fields: [ { name: "label", diff --git a/apps/web/src/payload/blocks/StatsGridBlock.ts b/apps/web/src/payload/blocks/StatsGridBlock.ts index 0f72974..777b1d1 100644 --- a/apps/web/src/payload/blocks/StatsGridBlock.ts +++ b/apps/web/src/payload/blocks/StatsGridBlock.ts @@ -11,13 +11,6 @@ export const StatsGridBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "StatsGrid", - description: - "Grid of 2–4 stat cards in a row. Use tilde (~) to separate stats, pipe (|) to separate value|label|subtext within each stat.", - usageExample: - "''", - }, fields: [ { name: "stats", diff --git a/apps/web/src/payload/blocks/TrackedLinkBlock.ts b/apps/web/src/payload/blocks/TrackedLinkBlock.ts index 322e71e..aec27e6 100644 --- a/apps/web/src/payload/blocks/TrackedLinkBlock.ts +++ b/apps/web/src/payload/blocks/TrackedLinkBlock.ts @@ -11,13 +11,6 @@ export const TrackedLinkBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "TrackedLink", - description: - "A wrapper around next/link that tracks clicks. Use for all INTERNAL navigational links that should be tracked.", - usageExample: - '\'Jetzt anfragen\'', - }, fields: [ { name: "href", diff --git a/apps/web/src/payload/blocks/TwitterEmbedBlock.ts b/apps/web/src/payload/blocks/TwitterEmbedBlock.ts index 387ad85..80840e8 100644 --- a/apps/web/src/payload/blocks/TwitterEmbedBlock.ts +++ b/apps/web/src/payload/blocks/TwitterEmbedBlock.ts @@ -11,13 +11,6 @@ export const TwitterEmbedBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "TwitterEmbed", - description: - "Embeds a post from X.com (Twitter). Used to provide social proof, industry quotes, or examples. Provide the numerical tweetId.", - usageExample: - '\'\'', - }, fields: [ { name: "url", diff --git a/apps/web/src/payload/blocks/WaterfallChartBlock.ts b/apps/web/src/payload/blocks/WaterfallChartBlock.ts index 9bb08e4..e0740a4 100644 --- a/apps/web/src/payload/blocks/WaterfallChartBlock.ts +++ b/apps/web/src/payload/blocks/WaterfallChartBlock.ts @@ -11,15 +11,6 @@ export const WaterfallChartBlock: MintelBlock = { admin: { group: "MDX Components", }, - ai: { - name: "WaterfallChart", - description: - "A timeline visualization of network requests (waterfall). Use to show loading sequences or bottlenecks. Labels auto-color coded by type (JS, HTML, IMG).", - usageExample: `