fix(env): simplify sentry_dsn validation to prevent server-side crashes on empty dsn strings

- Add BulkMailButton component for Payload list view
- Add bulkMailEndpoint handler for processing prompts
- Integrate bulk mail action into CrmContacts collection
- Update dev:clean script to skip interactive prompts

.dockerignore

@@ -1,9 +1,13 @@
-node_modules
+# Exclude all binary/dependency folders recursively
-.next
+**/node_modules
-out
+**/.pnpm-store
-dist
+**/.git
-*.log
+**/.next
-.git
+**/dist
+**/out
+**/*.log
+
+# Specific exclusions for this project
 .DS_Store
 cloned-websites
 storage
@@ -11,3 +15,11 @@ storage
 verify_ci
 pnpm_install_log.txt
 full_tree.json
+backups
+data
+
+# Ensure we don't copy the sibling's build artifacts either
+_at-mintel/**/node_modules
+_at-mintel/**/dist
+_at-mintel/**/.next
+_at-mintel/.git

.gitea/workflows/deploy.yml

@@ -325,17 +325,16 @@ jobs:
           chmod 600 ~/.ssh/id_ed25519
           ssh-keyscan -H alpha.mintel.me >> ~/.ssh/known_hosts 2>/dev/null
           echo "Re-running docker build with plain progress to capture exact logs..."
-          echo "${{ steps.discover_token.outputs.token }}" | docker login git.infra.mintel.me -u "${{ steps.discover_token.outputs.user }}" --password-stdin > login.log 2>&1
+          echo "${{ secrets.NPM_TOKEN }}" > /tmp/npm_token.txt
-          echo "${{ steps.discover_token.outputs.token }}" > /tmp/npm_token.txt
           docker build \
              --build-arg NEXT_PUBLIC_BASE_URL=${{ needs.prepare.outputs.next_public_url }} \
              --build-arg NEXT_PUBLIC_TARGET=${{ needs.prepare.outputs.target }} \
              --build-arg DIRECTUS_URL=${{ needs.prepare.outputs.directus_url }} \
-             --build-arg NPM_TOKEN=${{ steps.discover_token.outputs.token }} \
+             --build-arg NPM_TOKEN=${{ secrets.NPM_TOKEN }} \
              --secret id=NPM_TOKEN,src=/tmp/npm_token.txt \
              --progress plain \
              -t temp-image . > docker_build_failed.log 2>&1
-          cat login.log >> docker_build_failed.log
+          cat login.log >> docker_build_failed.log || true
           scp docker_build_failed.log root@alpha.mintel.me:/root/docker_build_failed.log
   # JOB 4: Deploy
   # ──────────────────────────────────────────────────────────────────────────────

.gitignore

@@ -57,3 +57,7 @@ apps/web/out/estimations/
 backups/
 
 .turbo
+# Manual build artifacts
+_at-mintel/
+local_build_*.log
+*.tar

Dockerfile

@@ -19,16 +19,18 @@ ENV CI=true
 COPY pnpm-lock.yaml pnpm-workspace.yaml package.json .npmrc* ./
 COPY apps/web/package.json ./apps/web/package.json
 # Copy sibling monorepo for linked dependencies (cloned during CI)
-COPY _at-mintel* ./_at-mintel/
+# Placing it inside /app so relative links like ../../_at-mintel resolve correctly!
+COPY _at-mintel* /app/_at-mintel/
+
 
 # Install dependencies with cache mount and dynamic .npmrc (High Fidelity pattern)
 RUN --mount=type=cache,id=pnpm,target=/pnpm/store \
     --mount=type=secret,id=NPM_TOKEN \
     export NPM_TOKEN=$(cat /run/secrets/NPM_TOKEN 2>/dev/null || echo $NPM_TOKEN) && \
-    echo "@mintel:registry=https://git.infra.mintel.me/api/packages/mmintel/npm/" > .npmrc && \
+    echo "@mintel:registry=https://npm.infra.mintel.me" > .npmrc && \
-    echo "//git.infra.mintel.me/api/packages/mmintel/npm/:_authToken=\${NPM_TOKEN}" >> .npmrc && \
+    echo "//npm.infra.mintel.me/:_authToken=\"\${NPM_TOKEN}\"" >> .npmrc && \
     echo "always-auth=true" >> .npmrc && \
-    cd _at-mintel && pnpm install --no-frozen-lockfile && pnpm build && \
+    cd /app/_at-mintel && pnpm install --no-frozen-lockfile && pnpm build && \
     cd /app && pnpm install --no-frozen-lockfile && \
     rm .npmrc
 
@@ -49,7 +51,8 @@ COPY --from=builder /app/apps/web/public ./apps/web/public
 COPY --from=builder /app/apps/web/.next/standalone ./
 COPY --from=builder /app/apps/web/.next/static ./apps/web/.next/static
 
-
+# Explicitly copy Payload dynamically generated importMap.js excluded by Standalone tracing
+COPY --from=builder /app/apps/web/app/(payload)/admin/importMap.js ./apps/web/app/(payload)/admin/importMap.js
 # Start from the app directory to ensure references solve correctly
 WORKDIR /app/apps/web
 CMD ["node", "server.js"]

apps/web/app/(payload)/admin/importMap.js

@@ -1 +1,117 @@
-export const importMap = {};
+import { AiMediaButtons as AiMediaButtons_1d402a78164f07306f77dce953e62e11 } from "@mintel/payload-ai/components/AiMediaButtons";
+import { OptimizeButton as OptimizeButton_338ff118e214cff355f6d710d1a381fb } from "@mintel/payload-ai/components/OptimizeButton";
+import { GenerateSlugButton as GenerateSlugButton_5baeea8510d263708dd253e86d55e0b4 } from "@mintel/payload-ai/components/FieldGenerators/GenerateSlugButton";
+import { default as default_76cec558bd86098fa1dab70b12eb818f } from "@/src/payload/components/TagSelector";
+import { GenerateThumbnailButton as GenerateThumbnailButton_e5e8c00f1c031f15175fef0ff67513dc } from "@mintel/payload-ai/components/FieldGenerators/GenerateThumbnailButton";
+import { RscEntryLexicalCell as RscEntryLexicalCell_44fe37237e0ebf4470c9990d8cb7b07e } from "@payloadcms/richtext-lexical/rsc";
+import { RscEntryLexicalField as RscEntryLexicalField_44fe37237e0ebf4470c9990d8cb7b07e } from "@payloadcms/richtext-lexical/rsc";
+import { LexicalDiffComponent as LexicalDiffComponent_44fe37237e0ebf4470c9990d8cb7b07e } from "@payloadcms/richtext-lexical/rsc";
+import { BlocksFeatureClient as BlocksFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from "@payloadcms/richtext-lexical/client";
+import { AiFieldButton as AiFieldButton_9125bc0af442fbb1889d8de3dff98501 } from "@mintel/payload-ai/components/FieldGenerators/AiFieldButton";
+import { InlineToolbarFeatureClient as InlineToolbarFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from "@payloadcms/richtext-lexical/client";
+import { HorizontalRuleFeatureClient as HorizontalRuleFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from "@payloadcms/richtext-lexical/client";
+import { UploadFeatureClient as UploadFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from "@payloadcms/richtext-lexical/client";
+import { BlockquoteFeatureClient as BlockquoteFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from "@payloadcms/richtext-lexical/client";
+import { RelationshipFeatureClient as RelationshipFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from "@payloadcms/richtext-lexical/client";
+import { LinkFeatureClient as LinkFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from "@payloadcms/richtext-lexical/client";
+import { ChecklistFeatureClient as ChecklistFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from "@payloadcms/richtext-lexical/client";
+import { OrderedListFeatureClient as OrderedListFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from "@payloadcms/richtext-lexical/client";
+import { UnorderedListFeatureClient as UnorderedListFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from "@payloadcms/richtext-lexical/client";
+import { IndentFeatureClient as IndentFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from "@payloadcms/richtext-lexical/client";
+import { AlignFeatureClient as AlignFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from "@payloadcms/richtext-lexical/client";
+import { HeadingFeatureClient as HeadingFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from "@payloadcms/richtext-lexical/client";
+import { ParagraphFeatureClient as ParagraphFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from "@payloadcms/richtext-lexical/client";
+import { InlineCodeFeatureClient as InlineCodeFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from "@payloadcms/richtext-lexical/client";
+import { SuperscriptFeatureClient as SuperscriptFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from "@payloadcms/richtext-lexical/client";
+import { SubscriptFeatureClient as SubscriptFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from "@payloadcms/richtext-lexical/client";
+import { StrikethroughFeatureClient as StrikethroughFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from "@payloadcms/richtext-lexical/client";
+import { UnderlineFeatureClient as UnderlineFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from "@payloadcms/richtext-lexical/client";
+import { BoldFeatureClient as BoldFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from "@payloadcms/richtext-lexical/client";
+import { ItalicFeatureClient as ItalicFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from "@payloadcms/richtext-lexical/client";
+import { default as default_2ebf44fdf8ebc607cf0de30cff485248 } from "@/src/payload/components/ColorPicker";
+import { default as default_a1c6da8fb7dd9846a8b07123ff256d09 } from "@/src/payload/components/IconSelector";
+import { ConvertInquiryButton as ConvertInquiryButton_09fd670bce023a947ab66e4eebea5168 } from "@/src/payload/components/ConvertInquiryButton";
+import { AiAnalyzeButton as AiAnalyzeButton_51a6009c2b12d068d736ffd2b8182c71 } from "@/src/payload/components/AiAnalyzeButton";
+import { GanttChartView as GanttChartView_0162b82db971e8f1e27fbdd0aaa2f1f4 } from "@/src/payload/views/GanttChart";
+import { ChatWindowProvider as ChatWindowProvider_258e2d0901cb901e46c3eeed91676211 } from "@mintel/payload-ai/components/ChatWindow/index";
+import { S3ClientUploadHandler as S3ClientUploadHandler_f97aa6c64367fa259c5bc0567239ef24 } from "@payloadcms/storage-s3/client";
+import { CollectionCards as CollectionCards_f9c02e79a4aed9a3924487c0cd4cafb1 } from "@payloadcms/next/rsc";
+
+export const importMap = {
+  "@mintel/payload-ai/components/AiMediaButtons#AiMediaButtons":
+    AiMediaButtons_1d402a78164f07306f77dce953e62e11,
+  "@mintel/payload-ai/components/OptimizeButton#OptimizeButton":
+    OptimizeButton_338ff118e214cff355f6d710d1a381fb,
+  "@mintel/payload-ai/components/FieldGenerators/GenerateSlugButton#GenerateSlugButton":
+    GenerateSlugButton_5baeea8510d263708dd253e86d55e0b4,
+  "@/src/payload/components/TagSelector#default":
+    default_76cec558bd86098fa1dab70b12eb818f,
+  "@mintel/payload-ai/components/FieldGenerators/GenerateThumbnailButton#GenerateThumbnailButton":
+    GenerateThumbnailButton_e5e8c00f1c031f15175fef0ff67513dc,
+  "@payloadcms/richtext-lexical/rsc#RscEntryLexicalCell":
+    RscEntryLexicalCell_44fe37237e0ebf4470c9990d8cb7b07e,
+  "@payloadcms/richtext-lexical/rsc#RscEntryLexicalField":
+    RscEntryLexicalField_44fe37237e0ebf4470c9990d8cb7b07e,
+  "@payloadcms/richtext-lexical/rsc#LexicalDiffComponent":
+    LexicalDiffComponent_44fe37237e0ebf4470c9990d8cb7b07e,
+  "@payloadcms/richtext-lexical/client#BlocksFeatureClient":
+    BlocksFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton":
+    AiFieldButton_9125bc0af442fbb1889d8de3dff98501,
+  "@payloadcms/richtext-lexical/client#InlineToolbarFeatureClient":
+    InlineToolbarFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#HorizontalRuleFeatureClient":
+    HorizontalRuleFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#UploadFeatureClient":
+    UploadFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#BlockquoteFeatureClient":
+    BlockquoteFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#RelationshipFeatureClient":
+    RelationshipFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#LinkFeatureClient":
+    LinkFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#ChecklistFeatureClient":
+    ChecklistFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#OrderedListFeatureClient":
+    OrderedListFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#UnorderedListFeatureClient":
+    UnorderedListFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#IndentFeatureClient":
+    IndentFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#AlignFeatureClient":
+    AlignFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#HeadingFeatureClient":
+    HeadingFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#ParagraphFeatureClient":
+    ParagraphFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#InlineCodeFeatureClient":
+    InlineCodeFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#SuperscriptFeatureClient":
+    SuperscriptFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#SubscriptFeatureClient":
+    SubscriptFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#StrikethroughFeatureClient":
+    StrikethroughFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#UnderlineFeatureClient":
+    UnderlineFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#BoldFeatureClient":
+    BoldFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#ItalicFeatureClient":
+    ItalicFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@/src/payload/components/ColorPicker#default":
+    default_2ebf44fdf8ebc607cf0de30cff485248,
+  "@/src/payload/components/IconSelector#default":
+    default_a1c6da8fb7dd9846a8b07123ff256d09,
+  "@/src/payload/components/ConvertInquiryButton#ConvertInquiryButton":
+    ConvertInquiryButton_09fd670bce023a947ab66e4eebea5168,
+  "@/src/payload/components/AiAnalyzeButton#AiAnalyzeButton":
+    AiAnalyzeButton_51a6009c2b12d068d736ffd2b8182c71,
+  "@/src/payload/views/GanttChart#GanttChartView":
+    GanttChartView_0162b82db971e8f1e27fbdd0aaa2f1f4,
+  "@mintel/payload-ai/components/ChatWindow/index#ChatWindowProvider":
+    ChatWindowProvider_258e2d0901cb901e46c3eeed91676211,
+  "@payloadcms/storage-s3/client#S3ClientUploadHandler":
+    S3ClientUploadHandler_f97aa6c64367fa259c5bc0567239ef24,
+  "@payloadcms/next/rsc#CollectionCards":
+    CollectionCards_f9c02e79a4aed9a3924487c0cd4cafb1,
+};

apps/web/next.config.mjs

@@ -10,17 +10,21 @@ const dirname = path.dirname(filename);
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   serverExternalPackages: [
-    '@mintel/content-engine',
-    '@mintel/concept-engine',
-    '@mintel/estimation-engine',
-    '@mintel/payload-ai',
-    '@mintel/pdf',
     'canvas',
     'sharp',
     'puppeteer',
     'require-in-the-middle',
     'import-in-the-middle' // Sentry 10+ instrumentation dependencies
   ],
+  transpilePackages: [
+    '@mintel/content-engine',
+    '@mintel/concept-engine',
+    '@mintel/estimation-engine',
+    '@mintel/meme-generator',
+    '@mintel/payload-ai',
+    '@mintel/pdf',
+    '@mintel/thumbnail-generator'
+  ],
   images: {
     remotePatterns: [
       {

apps/web/package.json

@@ -7,7 +7,7 @@
     "dev": "pnpm run seed:context && next dev --webpack --hostname 0.0.0.0",
     "dev:native": "DATABASE_URI=postgres://payload:payload@127.0.0.1:54321/payload PAYLOAD_SECRET=dev-secret pnpm run seed:context && DATABASE_URI=postgres://payload:payload@127.0.0.1:54321/payload PAYLOAD_SECRET=dev-secret next dev --webpack",
     "seed:context": "node --import tsx --experimental-loader ./ignore-css.mjs ./seed-context.ts",
-    "build": "next build --webpack",
+    "build": "payload generate:importmap && next build --webpack",
     "start": "next start",
     "lint": "eslint app src scripts video",
     "test": "echo \"No tests configured\"",
@@ -41,7 +41,7 @@
     "@mintel/content-engine": "link:../../../at-mintel/packages/content-engine",
     "@mintel/estimation-engine": "link:../../../at-mintel/packages/estimation-engine",
     "@mintel/meme-generator": "link:../../../at-mintel/packages/meme-generator",
-    "@mintel/payload-ai": "^1.9.15",
+    "@mintel/payload-ai": "link:../../../at-mintel/packages/payload-ai",
     "@mintel/pdf": "link:../../../at-mintel/packages/pdf-library",
     "@mintel/thumbnail-generator": "link:../../../at-mintel/packages/thumbnail-generator",
     "@next/mdx": "^16.1.6",

apps/web/payload.config.ts

@@ -26,12 +26,30 @@ import { Projects } from "./src/payload/collections/Projects";
 const filename = fileURLToPath(import.meta.url);
 const dirname = path.dirname(filename);
 
+const isCLI =
+  process.argv.includes("migrate") ||
+  process.argv.includes("generate:importmap");
+let aiPlugin: any;
+if (!isCLI) {
+  const { payloadChatPlugin } = await import("@mintel/payload-ai");
+  aiPlugin = payloadChatPlugin({
+    enabled: true,
+    mcpServers: [],
+    renderChatBubble: false, // disable dynamic injection since it's added statically below
+  });
+}
+
 export default buildConfig({
   admin: {
     user: Users.slug,
     importMap: {
       baseDir: path.resolve(dirname),
     },
+    components: {
+      providers: [
+        "@mintel/payload-ai/components/ChatWindow/index#ChatWindowProvider",
+      ],
+    },
   },
   collections: [
     Users,
@@ -79,6 +97,7 @@ export default buildConfig({
       connectionString:
         process.env.DATABASE_URI || process.env.POSTGRES_URI || "",
     },
+    push: false,
   }),
   sharp,
   plugins: [
@@ -103,6 +122,7 @@ export default buildConfig({
           }),
         ]
       : []),
+    ...(aiPlugin ? [aiPlugin] : []),
   ],
   endpoints: [
     {

apps/web/src/components/PayloadRichText.tsx

@@ -1,4 +1,7 @@
-import { RichText } from "@payloadcms/richtext-lexical/react";
+import {
+  RichText,
+  defaultJSXConverters,
+} from "@payloadcms/richtext-lexical/react";
 import type { JSXConverters } from "@payloadcms/richtext-lexical/react";
 import { MemeCard } from "@/src/components/MemeCard";
 import { Mermaid } from "@/src/components/Mermaid";
@@ -40,6 +43,20 @@ function renderInlineMarkdown(text: string): React.ReactNode {
 }
 
 const jsxConverters: JSXConverters = {
+  ...defaultJSXConverters,
+  // Override paragraph to filter out leftover <TableOfContents /> raw text
+  paragraph: ({ node, nodesToJSX }: any) => {
+    const children = node?.children;
+    if (
+      children?.length === 1 &&
+      children[0]?.type === "text" &&
+      children[0]?.text?.trim()?.startsWith("<") &&
+      children[0]?.text?.trim()?.endsWith("/>")
+    ) {
+      return null; // suppress raw JSX component text like <TableOfContents />
+    }
+    return <p>{nodesToJSX({ nodes: children })}</p>;
+  },
   blocks: {
     memeCard: ({ node }: any) => (
       <div className="my-8">
@@ -179,12 +196,22 @@ const jsxConverters: JSXConverters = {
     ),
     iconList: ({ node }: any) => (
       <mdxComponents.IconList>
-        {node.fields.items?.map((item: any, i: number) => (
+        {node.fields.items?.map((item: any, i: number) => {
-          // @ts-ignore
+          const isCheck = item.icon === "check" || !item.icon;
-          <mdxComponents.IconListItem key={i} icon={item.icon || "check"}>
+          const isCross = item.icon === "x" || item.icon === "cross";
-            {item.title || item.description}
+          const isBullet = item.icon === "circle" || item.icon === "bullet";
-          </mdxComponents.IconListItem>
+          return (
-        ))}
+            // @ts-ignore
+            <mdxComponents.IconListItem
+              key={i}
+              check={isCheck}
+              cross={isCross}
+              bullet={isBullet}
+            >
+              {item.title || item.description}
+            </mdxComponents.IconListItem>
+          );
+        })}
       </mdxComponents.IconList>
     ),
     statsGrid: ({ node }: any) => {
@@ -210,8 +237,8 @@ const jsxConverters: JSXConverters = {
       <mdxComponents.Carousel
         items={
           node.fields.slides?.map((s: any) => ({
-            title: s.caption || "Image",
+            title: s.title || s.caption || "Slide",
-            content: "",
+            content: s.content || s.caption || "",
             icon: undefined,
           })) || []
         }

apps/web/src/components/simulations/LoadTimeSimulator.tsx

@@ -1,14 +1,16 @@
 "use client";
 
-import React, { useState, useEffect } from 'react';
+import React, { useState, useEffect, useRef } from 'react';
 import { ComponentShareButton } from '../ComponentShareButton';
 import { Reveal } from '../Reveal';
-import { Play, RotateCcw } from 'lucide-react';
+import { RotateCcw } from 'lucide-react';
 
 export function LoadTimeSimulator({ className = '' }: { className?: string }) {
     const [isRunning, setIsRunning] = useState(false);
     const [timeElapsed, setTimeElapsed] = useState(0);
     const [legacyState, setLegacyState] = useState(0);
+    const [hasAutoStarted, setHasAutoStarted] = useState(false);
+    const containerRef = useRef<HTMLDivElement>(null);
     const [mintelState, setMintelState] = useState(0);
 
     useEffect(() => {
@@ -36,6 +38,25 @@ export function LoadTimeSimulator({ className = '' }: { className?: string }) {
         return () => clearInterval(interval);
     }, [isRunning, timeElapsed]);
 
+    // Auto-start the race when scrolled into viewport
+    useEffect(() => {
+        if (hasAutoStarted) return;
+        const el = containerRef.current;
+        if (!el) return;
+        const observer = new IntersectionObserver(
+            ([entry]) => {
+                if (entry.isIntersecting) {
+                    setHasAutoStarted(true);
+                    setIsRunning(true);
+                    observer.disconnect();
+                }
+            },
+            { threshold: 0.4 }
+        );
+        observer.observe(el);
+        return () => observer.disconnect();
+    }, [hasAutoStarted]);
+
     const startRace = () => {
         setTimeElapsed(0);
         setLegacyState(0);
@@ -45,7 +66,7 @@ export function LoadTimeSimulator({ className = '' }: { className?: string }) {
 
     return (
         <Reveal direction="up" delay={0.1}>
-            <div className={`not-prose max-w-4xl mx-auto my-12 relative group ${className}`}>
+            <div ref={containerRef} className={`not-prose max-w-4xl mx-auto my-12 relative group ${className}`}>
                 <div className="absolute -inset-1 bg-gradient-to-r from-red-100 to-emerald-100 rounded-3xl blur opacity-30" />
 
                 <div id="sim-load-time" className="relative bg-white rounded-2xl border border-slate-200 shadow-sm overflow-hidden flex flex-col">
@@ -63,13 +84,15 @@ export function LoadTimeSimulator({ className = '' }: { className?: string }) {
                                 Simulieren Sie den Unterschied zwischen dynamischem Server-Rendering (PHP/MySQL) und statischer Edge-Auslieferung (<span className="font-mono bg-slate-200 px-1 rounded text-[10px]">TTV &lt; 500ms</span>).
                             </p>
                         </div>
-                        <button
+                        {timeElapsed > 0 && !isRunning && (
-                            onClick={startRace}
+                            <button
-                            className="shrink-0 flex items-center gap-2 px-6 py-2.5 bg-slate-900 !text-white rounded-full font-bold text-sm hover:hover:bg-black hover:scale-105 active:scale-95 transition-all shadow-md"
+                                onClick={startRace}
-                        >
+                                className="shrink-0 flex items-center gap-2 px-6 py-2.5 bg-slate-900 !text-white rounded-full font-bold text-sm hover:hover:bg-black hover:scale-105 active:scale-95 transition-all shadow-md"
-                            {timeElapsed > 0 ? <RotateCcw size={16} /> : <Play size={16} />}
+                            >
-                            {timeElapsed > 0 ? "Neustart" : "Rennen Starten"}
+                                <RotateCcw size={16} />
-                        </button>
+                                Neustart
+                            </button>
+                        )}
                     </div>
 
                     <div className="grid md:grid-cols-2 divide-y md:divide-y-0 md:divide-x divide-slate-100 bg-slate-50/50">

apps/web/src/lib/env.ts

@@ -22,7 +22,7 @@ const envExtension = {
     .default("https://analytics.infra.mintel.me"),
 
   // Error Tracking
-  SENTRY_DSN: z.string().url().optional(),
+  SENTRY_DSN: z.string().optional(),
 };
 
 /**

apps/web/src/payload/blocks/ArticleBlockquoteBlock.ts

@@ -19,7 +19,7 @@ export const ArticleBlockquoteBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den mehrzeiligen Text für quote ein.",
@@ -31,7 +31,7 @@ export const ArticleBlockquoteBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für author ein.",
@@ -43,7 +43,7 @@ export const ArticleBlockquoteBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für role ein.",

apps/web/src/payload/blocks/ArticleMemeBlock.ts

@@ -25,7 +25,7 @@ export const ArticleMemeBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für alt ein.",
@@ -37,7 +37,7 @@ export const ArticleMemeBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für caption ein.",

apps/web/src/payload/blocks/ArticleQuoteBlock.ts

@@ -26,7 +26,7 @@ export const ArticleQuoteBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den mehrzeiligen Text für quote ein.",
@@ -39,7 +39,7 @@ export const ArticleQuoteBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für author ein.",
@@ -51,7 +51,7 @@ export const ArticleQuoteBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für role ein.",
@@ -63,7 +63,7 @@ export const ArticleQuoteBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für source ein.",
@@ -75,7 +75,7 @@ export const ArticleQuoteBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für sourceUrl ein.",

apps/web/src/payload/blocks/BoldNumberBlock.ts

@@ -26,7 +26,7 @@ export const BoldNumberBlock: MintelBlock = {
         description: "e.g. 53% or 2.5M€",
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
       },
@@ -38,7 +38,7 @@ export const BoldNumberBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für label ein.",
@@ -50,7 +50,7 @@ export const BoldNumberBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für source ein.",
@@ -62,7 +62,7 @@ export const BoldNumberBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für sourceUrl ein.",

apps/web/src/payload/blocks/ButtonBlock.ts

@@ -19,7 +19,7 @@ export const ButtonBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für label ein.",

apps/web/src/payload/blocks/CarouselBlock.ts

@@ -16,6 +16,16 @@ export const CarouselBlock: MintelBlock = {
       name: "slides",
       type: "array",
       fields: [
+        {
+          name: "title",
+          type: "text",
+          admin: { description: "Titel der Slide-Karte." },
+        },
+        {
+          name: "content",
+          type: "textarea",
+          admin: { description: "Beschreibungstext der Slide-Karte." },
+        },
         {
           name: "image",
           type: "upload",
@@ -28,7 +38,7 @@ export const CarouselBlock: MintelBlock = {
           admin: {
             components: {
               afterInput: [
-                "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+                "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
               ],
             },
             description: "Geben Sie den Text für caption ein.",

apps/web/src/payload/blocks/ComparisonRowBlock.ts

@@ -31,7 +31,7 @@ export const ComparisonRowBlock: MintelBlock = {
         description: "Optional overarching description for the comparison.",
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
       },
@@ -44,7 +44,7 @@ export const ComparisonRowBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für negativeLabel ein.",
@@ -57,7 +57,7 @@ export const ComparisonRowBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für negativeText ein.",
@@ -71,7 +71,7 @@ export const ComparisonRowBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für positiveLabel ein.",
@@ -84,7 +84,7 @@ export const ComparisonRowBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für positiveText ein.",

apps/web/src/payload/blocks/DiagramFlowBlock.ts

@@ -19,7 +19,7 @@ export const DiagramFlowBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den mehrzeiligen Text für definition ein.",

apps/web/src/payload/blocks/DiagramGanttBlock.ts

@@ -19,7 +19,7 @@ export const DiagramGanttBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den mehrzeiligen Text für definition ein.",

apps/web/src/payload/blocks/DiagramPieBlock.ts

@@ -19,7 +19,7 @@ export const DiagramPieBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den mehrzeiligen Text für definition ein.",

apps/web/src/payload/blocks/DiagramSequenceBlock.ts

@@ -19,7 +19,7 @@ export const DiagramSequenceBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den mehrzeiligen Text für definition ein.",

apps/web/src/payload/blocks/DiagramStateBlock.ts

@@ -19,7 +19,7 @@ export const DiagramStateBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den mehrzeiligen Text für definition ein.",

apps/web/src/payload/blocks/DiagramTimelineBlock.ts

@@ -19,7 +19,7 @@ export const DiagramTimelineBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den mehrzeiligen Text für definition ein.",

apps/web/src/payload/blocks/ExternalLinkBlock.ts

@@ -32,7 +32,7 @@ export const ExternalLinkBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für label ein.",

apps/web/src/payload/blocks/H2Block.ts

@@ -15,7 +15,7 @@ export const H2Block: MintelBlock = {
         description: "Geben Sie den Text für die H2-Überschrift ein.",
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
       },

apps/web/src/payload/blocks/H3Block.ts

@@ -15,7 +15,7 @@ export const H3Block: MintelBlock = {
         description: "Geben Sie den Text für die H3-Überschrift ein.",
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
       },

apps/web/src/payload/blocks/HeadingBlock.ts

@@ -25,7 +25,7 @@ export const HeadingBlock: MintelBlock = {
         description: "Der Text der Überschrift.",
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
       },

apps/web/src/payload/blocks/IconListBlock.ts

@@ -44,7 +44,7 @@ export const IconListBlock: MintelBlock = {
           admin: {
             components: {
               afterInput: [
-                "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+                "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
               ],
             },
             description: "Geben Sie den Text für title ein.",
@@ -56,7 +56,7 @@ export const IconListBlock: MintelBlock = {
           admin: {
             components: {
               afterInput: [
-                "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+                "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
               ],
             },
             description: "Geben Sie den mehrzeiligen Text für description ein.",

apps/web/src/payload/blocks/ImageTextBlock.ts

@@ -26,7 +26,7 @@ export const ImageTextBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den mehrzeiligen Text für text ein.",

apps/web/src/payload/blocks/LeadMagnetBlock.ts

@@ -27,7 +27,7 @@ export const LeadMagnetBlock: MintelBlock = {
         description: "The strong headline for the Call-to-Action",
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
       },
@@ -40,7 +40,7 @@ export const LeadMagnetBlock: MintelBlock = {
         description: "The value proposition text.",
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
       },
@@ -53,7 +53,7 @@ export const LeadMagnetBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für buttonText ein.",

apps/web/src/payload/blocks/LeadParagraphBlock.ts

@@ -26,7 +26,7 @@ export const LeadParagraphBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den mehrzeiligen Text für text ein.",

apps/web/src/payload/blocks/MarkerBlock.ts

@@ -19,7 +19,7 @@ export const MarkerBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für text ein.",

apps/web/src/payload/blocks/MemeCardBlock.ts

@@ -28,7 +28,7 @@ export const MemeCardBlock: MintelBlock = {
           "The template ID from memegen.link (e.g. 'drake', 'disastergirl')",
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
       },
@@ -42,7 +42,7 @@ export const MemeCardBlock: MintelBlock = {
           "Pipe-separated captions for the meme (e.g. 'Legacy Code|Mintel Stack'). Maximum 6 words per line.",
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
       },

apps/web/src/payload/blocks/MermaidBlock.ts

@@ -36,7 +36,7 @@ export const MermaidBlock: MintelBlock = {
         description: "Optional title displayed above the diagram.",
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
       },
@@ -59,7 +59,7 @@ export const MermaidBlock: MintelBlock = {
           "The raw Mermaid.js syntax (e.g. graph TD... shadowing, loops, etc.).",
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
       },

apps/web/src/payload/blocks/MetricBarBlock.ts

@@ -19,7 +19,7 @@ export const MetricBarBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für label ein.",
@@ -44,7 +44,7 @@ export const MetricBarBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für unit ein.",

apps/web/src/payload/blocks/ParagraphBlock.ts

@@ -26,7 +26,7 @@ export const ParagraphBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den mehrzeiligen Text für text ein.",

apps/web/src/payload/blocks/PerformanceChartBlock.ts

@@ -19,7 +19,7 @@ export const PerformanceChartBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für title ein.",

apps/web/src/payload/blocks/PremiumComparisonChartBlock.ts

@@ -18,7 +18,7 @@ export const PremiumComparisonChartBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für title ein.",
@@ -30,7 +30,7 @@ export const PremiumComparisonChartBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für subtitle ein.",
@@ -47,7 +47,7 @@ export const PremiumComparisonChartBlock: MintelBlock = {
           admin: {
             components: {
               afterInput: [
-                "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+                "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
               ],
             },
             description: "Geben Sie den Text für label ein.",
@@ -75,7 +75,7 @@ export const PremiumComparisonChartBlock: MintelBlock = {
           admin: {
             components: {
               afterInput: [
-                "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+                "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
               ],
             },
             description: "Geben Sie den Text für unit ein.",
@@ -95,7 +95,7 @@ export const PremiumComparisonChartBlock: MintelBlock = {
           admin: {
             components: {
               afterInput: [
-                "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+                "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
               ],
             },
             description: "Geben Sie den Text für description ein.",

apps/web/src/payload/blocks/RevenueLossCalculatorBlock.ts

@@ -19,7 +19,7 @@ export const RevenueLossCalculatorBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für title ein.",

apps/web/src/payload/blocks/SectionBlock.ts

@@ -19,7 +19,7 @@ export const SectionBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für title ein.",

apps/web/src/payload/blocks/StatsDisplayBlock.ts

@@ -18,7 +18,7 @@ export const StatsDisplayBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für label ein.",
@@ -31,7 +31,7 @@ export const StatsDisplayBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für value ein.",
@@ -43,7 +43,7 @@ export const StatsDisplayBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für subtext ein.",

apps/web/src/payload/blocks/StatsGridBlock.ts

@@ -23,7 +23,7 @@ export const StatsGridBlock: MintelBlock = {
           admin: {
             components: {
               afterInput: [
-                "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+                "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
               ],
             },
             description: "Geben Sie den Text für label ein.",
@@ -36,7 +36,7 @@ export const StatsGridBlock: MintelBlock = {
           admin: {
             components: {
               afterInput: [
-                "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+                "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
               ],
             },
             description: "Geben Sie den Text für value ein.",

apps/web/src/payload/blocks/TLDRBlock.ts

@@ -26,7 +26,7 @@ export const TLDRBlock: MintelBlock = {
         description: "The summary content for the TLDR box.",
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
       },

apps/web/src/payload/blocks/TrackedLinkBlock.ts

@@ -25,7 +25,7 @@ export const TrackedLinkBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für label ein.",

apps/web/src/payload/blocks/WaterfallChartBlock.ts

@@ -18,7 +18,7 @@ export const WaterfallChartBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für title ein.",
@@ -35,7 +35,7 @@ export const WaterfallChartBlock: MintelBlock = {
           admin: {
             components: {
               afterInput: [
-                "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+                "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
               ],
             },
             description: "Geben Sie den Text für label ein.",

apps/web/src/payload/blocks/WebVitalsScoreBlock.ts

@@ -36,7 +36,7 @@ export const WebVitalsScoreBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für description ein.",

apps/web/src/payload/blocks/YouTubeEmbedBlock.ts

@@ -31,7 +31,7 @@ export const YouTubeEmbedBlock: MintelBlock = {
       admin: {
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/AiFieldButton#AiFieldButton",
+            "@mintel/payload-ai/components/FieldGenerators/AiFieldButton#AiFieldButton",
           ],
         },
         description: "Geben Sie den Text für title ein.",

apps/web/src/payload/collections/CrmContacts.ts

@@ -1,5 +1,5 @@
 import type { CollectionConfig } from "payload";
-
+import { bulkMailEndpointHandler } from "../endpoints/bulkMailEndpoint";
 export const CrmContacts: CollectionConfig = {
   slug: "crm-contacts",
   labels: {
@@ -12,7 +12,21 @@ export const CrmContacts: CollectionConfig = {
     group: "CRM",
     description:
       "Contacts are the individual people linked to an Account. A person should only be created once and can be assigned to a company here.",
+    components: {
+      views: {
+        list: {
+          actions: ["@/src/payload/components/BulkMailButton#BulkMailButton"],
+        },
+      },
+    },
   },
+  endpoints: [
+    {
+      path: "/bulk-mail",
+      method: "post",
+      handler: bulkMailEndpointHandler,
+    },
+  ],
   access: {
     read: ({ req: { user } }) => Boolean(user),
     create: ({ req: { user } }) => Boolean(user),

apps/web/src/payload/collections/Media.ts

@@ -1,7 +1,7 @@
 import type { CollectionConfig } from "payload";
 import path from "path";
 import { fileURLToPath } from "url";
-import { replicateMediaHandler } from "@mintel/payload-ai/endpoints/replicateMediaEndpoint.js";
+import { replicateMediaHandler } from "@mintel/payload-ai/endpoints/replicateMediaEndpoint";
 
 const filename = fileURLToPath(import.meta.url);
 const dirname = path.dirname(filename);

apps/web/src/payload/collections/Posts.ts

@@ -39,7 +39,7 @@ export const Posts: CollectionConfig = {
         position: "sidebar",
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/GenerateSlugButton#GenerateSlugButton",
+            "@mintel/payload-ai/components/FieldGenerators/GenerateSlugButton#GenerateSlugButton",
           ],
         },
       },
@@ -100,7 +100,7 @@ export const Posts: CollectionConfig = {
         position: "sidebar",
         components: {
           afterInput: [
-            "@mintel/payload-ai/components/GenerateThumbnailButton#GenerateThumbnailButton",
+            "@mintel/payload-ai/components/FieldGenerators/GenerateThumbnailButton#GenerateThumbnailButton",
           ],
         },
       },

apps/web/src/payload/components/BulkMailButton.tsx

@@ -0,0 +1,147 @@
+"use client";
+
+import React, { useState } from "react";
+import { useSelection, Button, toast } from "@payloadcms/ui";
+
+export const BulkMailButton: React.FC = () => {
+  const { selected } = useSelection();
+  const [isOpen, setIsOpen] = useState(false);
+  const [prompt, setPrompt] = useState("");
+  const [isTest, setIsTest] = useState(true);
+  const [isLoading, setIsLoading] = useState(false);
+
+  const selectedCount = Object.keys(selected).length;
+
+  if (selectedCount === 0) {
+    return null;
+  }
+
+  const handleBulkMail = async () => {
+    setIsLoading(true);
+    try {
+      const contactIds = Object.keys(selected);
+
+      const response = await fetch("/api/crm-contacts/bulk-mail", {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+        },
+        body: JSON.stringify({
+          contactIds,
+          instructions: prompt,
+          isTest,
+        }),
+      });
+
+      const data = await response.json();
+
+      if (data.success) {
+        toast.success(
+          `Successfully sent emails to ${contactIds.length} contacts.`,
+        );
+        setIsOpen(false);
+      } else {
+        toast.error(`Failed: ${data.error}`);
+      }
+    } catch (e: any) {
+      toast.error(`An error occurred: ${e.message}`);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  return (
+    <div style={{ display: "inline-block", marginLeft: "1rem" }}>
+      <Button
+        onClick={() => setIsOpen(true)}
+        buttonStyle="primary"
+        size="small"
+      >
+        🤖 AI Bulk Mail ({selectedCount})
+      </Button>
+
+      {isOpen && (
+        <div
+          style={{
+            position: "fixed",
+            top: 0,
+            left: 0,
+            right: 0,
+            bottom: 0,
+            backgroundColor: "rgba(0,0,0,0.5)",
+            zIndex: 9999,
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+          }}
+        >
+          <div
+            style={{
+              background: "var(--theme-elevation-100, #fff)",
+              color: "var(--theme-text, #000)",
+              padding: "2rem",
+              borderRadius: "8px",
+              width: "500px",
+              maxWidth: "90vw",
+            }}
+          >
+            <h2 style={{ marginTop: 0 }}>AI Bulk Mail</h2>
+            <p>
+              Generate and send personalized emails to {selectedCount} contacts.
+            </p>
+
+            <div style={{ marginBottom: "1rem" }}>
+              <label style={{ display: "block", marginBottom: "0.5rem" }}>
+                <strong>Prompt / Instructions for AI</strong>
+              </label>
+              <textarea
+                value={prompt}
+                onChange={(e) => setPrompt(e.target.value)}
+                placeholder="e.g. Mache ein Angebot für ein neues Messe-Design"
+                style={{
+                  width: "100%",
+                  height: "100px",
+                  padding: "0.5rem",
+                  borderRadius: "4px",
+                  border: "1px solid var(--theme-elevation-400, #ccc)",
+                }}
+              />
+            </div>
+
+            <div style={{ marginBottom: "1.5rem" }}>
+              <label
+                style={{ display: "flex", alignItems: "center", gap: "0.5rem" }}
+              >
+                <input
+                  type="checkbox"
+                  checked={isTest}
+                  onChange={(e) => setIsTest(e.target.checked)}
+                />
+                <strong>Test Mode</strong> (Send all emails to yourself)
+              </label>
+            </div>
+
+            <div
+              style={{
+                display: "flex",
+                gap: "1rem",
+                justifyContent: "flex-end",
+              }}
+            >
+              <Button
+                buttonStyle="secondary"
+                onClick={() => setIsOpen(false)}
+                disabled={isLoading}
+              >
+                Cancel
+              </Button>
+              <Button onClick={handleBulkMail} disabled={isLoading || !prompt}>
+                {isLoading ? "Sending..." : "Send Emails"}
+              </Button>
+            </div>
+          </div>
+        </div>
+      )}
+    </div>
+  );
+};

apps/web/src/payload/endpoints/bulkMailEndpoint.ts

@@ -0,0 +1,191 @@
+import { PayloadRequest } from "payload";
+
+export const bulkMailEndpointHandler = async (req: PayloadRequest) => {
+  try {
+    let body: any = {};
+    if (req.body) {
+      try {
+        body = (await req.json?.()) || {};
+      } catch (_e) {
+        body = req.body;
+      }
+    }
+
+    const { contactIds, instructions, isTest } = body;
+
+    if (!req.user) {
+      return Response.json(
+        { success: false, error: "Unauthorized" },
+        { status: 401 },
+      );
+    }
+
+    if (!Array.isArray(contactIds) || contactIds.length === 0) {
+      return Response.json(
+        { success: false, error: "No contacts selected" },
+        { status: 400 },
+      );
+    }
+
+    const OPENROUTER_KEY =
+      process.env.OPENROUTER_KEY || process.env.OPENROUTER_API_KEY;
+    if (!OPENROUTER_KEY) {
+      return Response.json(
+        { success: false, error: "Missing OPENROUTER_API_KEY" },
+        { status: 500 },
+      );
+    }
+
+    const sentEmails = [];
+    const interactions = [];
+
+    for (const contactId of contactIds) {
+      // Fetch contact with account populated
+      const contact = await req.payload.findByID({
+        collection: "crm-contacts",
+        id: contactId,
+        depth: 1,
+      });
+
+      if (!contact || !contact.email) continue;
+
+      const account = contact.account as any;
+      const accountInfo = account
+        ? `
+Company Name: ${account.name || "Unknown"}
+Website: ${account.website || "Unknown"}
+Industry: ${account.industry || "Unknown"}
+Website Status: ${account.websiteStatus || "Unknown"}
+Internal Notes: ${account.notes || "None"}
+      `
+        : "No company information available.";
+
+      const prompt = `You are an expert sales/business development AI assistant. Write a professional, personalized German B2B outreach email ("Anschreiben").
+      
+CONTEXT ABOUT THE CONTACT:
+Name: ${contact.fullName || contact.firstName || "Unknown"}
+Role: ${contact.role || "Unknown"}
+
+CONTEXT ABOUT THEIR COMPANY:
+${accountInfo}
+
+USER INSTRUCTIONS / GOAL OF THE EMAIL:
+${instructions}
+
+CRITICAL INSTRUCTIONS:
+1. Write the email subject on the FIRST line as: "SUBJECT: <Your Subject>"
+2. The rest of the message should be the email body.
+3. Keep it professional and natural in German (Sie-form unless you think Du is appropriate based on the industry, but prefer Sie).
+4. Output only the email text, no markdown code blocks around it. No extra chit-chat.
+`;
+
+      const res = await fetch("https://openrouter.ai/api/v1/chat/completions", {
+        method: "POST",
+        headers: {
+          Authorization: `Bearer ${OPENROUTER_KEY}`,
+          "Content-Type": "application/json",
+        },
+        body: JSON.stringify({
+          model: "google/gemini-3-flash-preview",
+          messages: [{ role: "user", content: prompt }],
+        }),
+      });
+
+      const data = await res.json();
+      const generatedText = data.choices?.[0]?.message?.content?.trim() || "";
+
+      if (!generatedText) {
+        console.error("AI Generation failed for contact", contactId);
+        continue;
+      }
+
+      // Parse subject and body
+      const lines = generatedText.split("\n");
+      let subject = "Information von Mintel";
+      let bodyText = generatedText;
+
+      if (lines[0].startsWith("SUBJECT:")) {
+        subject = lines[0].replace("SUBJECT:", "").trim();
+        bodyText = lines.slice(1).join("\n").trim();
+      }
+
+      // Use a simple HTML wrapper to preserve line breaks
+      const htmlBody = `<p>${bodyText.replace(/\n/g, "<br/>")}</p>`;
+
+      const targetEmail = isTest ? req.user.email : contact.email;
+
+      // Send the email
+      await req.payload.sendEmail({
+        to: targetEmail,
+        subject: (isTest ? "[TEST] " : "") + subject,
+        html: htmlBody,
+      });
+
+      sentEmails.push({ contactId, email: targetEmail });
+
+      if (!isTest) {
+        // Log interaction
+        const interaction = await req.payload.create({
+          collection: "crm-interactions",
+          data: {
+            type: "email",
+            subject: `Outbound AI Mail: ${subject}`,
+            date: new Date().toISOString(),
+            contact: contact.id,
+            account: account?.id,
+            content: {
+              root: {
+                type: "root",
+                format: "",
+                indent: 0,
+                version: 1,
+                direction: "ltr",
+                children: [
+                  {
+                    type: "paragraph",
+                    format: "",
+                    indent: 0,
+                    version: 1,
+                    direction: "ltr",
+                    children: [
+                      {
+                        type: "text",
+                        mode: "normal",
+                        style: "",
+                        detail: 0,
+                        format: 0,
+                        text: bodyText,
+                        version: 1,
+                      },
+                    ],
+                  },
+                ],
+              },
+            },
+          },
+        });
+        interactions.push(interaction.id);
+
+        // Update lead temperature to "warm" if it's currently cold and the status is lead
+        if (
+          account &&
+          account.status === "lead" &&
+          account.leadTemperature === "cold"
+        ) {
+          await req.payload.update({
+            collection: "crm-accounts",
+            id: account.id,
+            data: {
+              leadTemperature: "warm",
+            },
+          });
+        }
+      }
+    }
+
+    return Response.json({ success: true, sentEmails, testMode: isTest });
+  } catch (e: any) {
+    console.error("Bulk Mail error", e);
+    return Response.json({ success: false, error: e.message }, { status: 500 });
+  }
+};

package.json

@@ -6,7 +6,7 @@
   "scripts": {
     "dev": "bash -c 'trap \"COMPOSE_PROJECT_NAME=mintel-me docker-compose -f docker-compose.dev.yml down\" EXIT INT TERM; docker network create infra 2>/dev/null || true && COMPOSE_PROJECT_NAME=mintel-me docker-compose -f docker-compose.dev.yml down && COMPOSE_PROJECT_NAME=mintel-me docker-compose -f docker-compose.dev.yml up app postgres-db --remove-orphans'",
     "dev:docker": "docker network create infra 2>/dev/null || true && echo \"\\n🚀 Dockerized Environment Starting...\\n\\n📱 App:      http://mintel.localhost\\n🚦 Caddy Proxy: http://localhost:80\\n\" && COMPOSE_PROJECT_NAME=mintel-me docker-compose -f docker-compose.dev.yml up app postgres-db",
-    "dev:clean": "pnpm dev:stop && rm -rf apps/web/.next apps/web/node_modules && pnpm install && pnpm dev",
+    "dev:clean": "pnpm dev:stop && rm -rf apps/web/.next apps/web/node_modules && pnpm install && CI=true pnpm dev",
     "dev:stop": "COMPOSE_PROJECT_NAME=mintel-me docker-compose -f docker-compose.dev.yml down",
     "dev:local": "pnpm -r dev",
     "build": "pnpm -r build",

pnpm-lock.yaml

@@ -119,8 +119,8 @@ importers:
         specifier: link:../../../at-mintel/packages/meme-generator
         version: link:../../../at-mintel/packages/meme-generator
       "@mintel/payload-ai":
-        specifier: ^1.9.15
+        specifier: link:../../../at-mintel/packages/payload-ai
-        version: 1.9.15(@payloadcms/next@3.77.0(graphql@16.12.0)(monaco-editor@0.55.1)(next@16.1.6(@opentelemetry/api@1.9.0)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(sass@1.77.4))(payload@3.77.0(graphql@16.12.0)(typescript@5.9.3))(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(typescript@5.9.3))(@payloadcms/ui@3.77.0(monaco-editor@0.55.1)(next@16.1.6(@opentelemetry/api@1.9.0)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(sass@1.77.4))(payload@3.77.0(graphql@16.12.0)(typescript@5.9.3))(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(typescript@5.9.3))(payload@3.77.0(graphql@16.12.0)(typescript@5.9.3))(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(typescript@5.9.3)(ws@8.19.0)
+        version: link:../../../at-mintel/packages/payload-ai
       "@mintel/pdf":
         specifier: link:../../../at-mintel/packages/pdf-library
         version: link:../../../at-mintel/packages/pdf-library
@@ -314,7 +314,7 @@ importers:
         specifier: ^0.18.5
         version: 0.18.5
       zod:
-        specifier: ^3.25.76
+        specifier: ^3.23.8
         version: 3.25.76
     devDependencies:
       "@eslint/eslintrc":