From 9b7b36edb2fdd9501473e131e4131050daccde5c Mon Sep 17 00:00:00 2001
From: Boaz Poolman <boaz_skater@hotmail.com>
Date: Thu, 25 Jun 2026 13:55:09 +0200
Subject: [PATCH 01/14] chore: clean up cta usage

---
 .../src/api/cta/content-types/cta/schema.json |  6 --
 apps/cms/types/generated/contentTypes.d.ts    |  7 +-
 .../cms/pages/overview-page/template.tsx      |  2 +-
 .../web/src/features/cms/sections/cta/cta.tsx | 84 +++++++++----------
 4 files changed, 42 insertions(+), 57 deletions(-)

diff --git a/apps/cms/src/api/cta/content-types/cta/schema.json b/apps/cms/src/api/cta/content-types/cta/schema.json
index ee48b12..2a2472b 100644
--- a/apps/cms/src/api/cta/content-types/cta/schema.json
+++ b/apps/cms/src/api/cta/content-types/cta/schema.json
@@ -36,12 +36,6 @@
       "component": "shared.button",
       "repeatable": false,
       "required": true
-    },
-    "illustration": {
-      "type": "enumeration",
-      "required": true,
-      "default": "image",
-      "enum": ["image", "community_members"]
     }
   }
 }
diff --git a/apps/cms/types/generated/contentTypes.d.ts b/apps/cms/types/generated/contentTypes.d.ts
index 6f20242..b8e88e1 100644
--- a/apps/cms/types/generated/contentTypes.d.ts
+++ b/apps/cms/types/generated/contentTypes.d.ts
@@ -513,9 +513,6 @@ export interface ApiCtaCta extends Struct.CollectionTypeSchema {
     createdAt: Schema.Attribute.DateTime;
     createdBy: Schema.Attribute.Relation<'oneToOne', 'admin::user'> &
       Schema.Attribute.Private;
-    illustration: Schema.Attribute.Enumeration<['image', 'community_members']> &
-      Schema.Attribute.Required &
-      Schema.Attribute.DefaultTo<'image'>;
     image: Schema.Attribute.Media<'images'> & Schema.Attribute.Required;
     locale: Schema.Attribute.String & Schema.Attribute.Private;
     localizations: Schema.Attribute.Relation<'oneToMany', 'api::cta.cta'> &
@@ -1522,10 +1519,10 @@ export interface PluginBetterAuthJwks extends Struct.CollectionTypeSchema {
   };
   pluginOptions: {
     'content-manager': {
-      visible: false;
+      visible: true;
     };
     'content-type-builder': {
-      visible: false;
+      visible: true;
     };
   };
   attributes: {
diff --git a/apps/web/src/features/cms/pages/overview-page/template.tsx b/apps/web/src/features/cms/pages/overview-page/template.tsx
index 97de371..f424c07 100644
--- a/apps/web/src/features/cms/pages/overview-page/template.tsx
+++ b/apps/web/src/features/cms/pages/overview-page/template.tsx
@@ -35,7 +35,7 @@ const OverviewPageTemplate = ({ document }: Props) => {
                 alt={document.title!}
                 width={480}
                 height={480}
-                className="mt-10 rounded-lg object-cover ml-auto"
+                className="rounded-lg object-cover ml-auto"
               />
             )}
           </div>
diff --git a/apps/web/src/features/cms/sections/cta/cta.tsx b/apps/web/src/features/cms/sections/cta/cta.tsx
index 0442ad6..7ddb9eb 100644
--- a/apps/web/src/features/cms/sections/cta/cta.tsx
+++ b/apps/web/src/features/cms/sections/cta/cta.tsx
@@ -60,16 +60,7 @@ const sharedWrapperStyle: React.CSSProperties = {
 };
 
 const CTASection = async ({ section }: Props) => {
-  const { cta } = section;
-
-  const isCommunity = cta?.illustration === "community_members";
-
-  const users = isCommunity
-    ? await cmsClient.collection("plugin::better-auth.user").find({
-        limit: 5,
-        populate: ["profile"],
-      })
-    : null;
+  const cta = section.cta!;
 
   if (cta?.size === "S") {
     return (
@@ -77,15 +68,15 @@ const CTASection = async ({ section }: Props) => {
         <Container>
           <section>
             <div
-              className="relative rounded-lg border border-(--color-cta-border) px-8 py-10 text-white!"
+              className="relative overflow-hidden rounded-lg border border-(--color-cta-border) text-white!"
               style={sharedWrapperStyle}
             >
-              <div className="relative z-10 flex flex-col lg:flex-row lg:items-center lg:justify-between gap-6">
-                <div className="lg:w-[40%]">
-                  <h3 className="text-[43px] font-bold leading-tight text-white">
+              <div className="relative z-10 flex flex-col md:flex-row md:items-stretch md:justify-between gap-6">
+                <div className="md:w-[90%] min-w-75 px-8 py-10">
+                  <h3 className="font-bold leading-tight text-white!">
                     {cta.title}
                   </h3>
-                  <p className="mt-2 text-[16px] leading-5 text-(--color-cta-muted)">
+                  <p className="mt-4 text-[16px] leading-5 text-(--color-cta-muted)">
                     {cta.content}
                   </p>
                   {cta.button?.link && (
@@ -99,22 +90,24 @@ const CTASection = async ({ section }: Props) => {
                   )}
                 </div>
 
-                <div className="w-full lg:w-[55%] flex justify-start lg:justify-end align-center">
-                  {isCommunity && users?.data && users.data.length > 0 ? (
-                    <CommunityPile users={users.data} />
-                  ) : (
-                    cta.image?.url && (
-                      <Image
-                        src={cmsImageUrl(cta.image.url)}
-                        alt={
-                          cta.image.alternativeText || cta.title || "CTA image"
-                        }
-                        width={260}
-                        height={160}
-                        className="pointer-events-none h-auto object-contain"
-                      />
-                    )
-                  )}
+                <div className="w-full flex justify-start md:justify-end items-center md:items-stretch">
+                  <Image
+                    src={cmsImageUrl(cta.image.url)}
+                    alt={cta.image.alternativeText || cta.title || "CTA image"}
+                    width={600}
+                    height={300}
+                    className="md:hidden pointer-events-none w-full h-auto object-contain"
+                  />
+                  <div className="hidden md:block relative w-full">
+                    <Image
+                      src={cmsImageUrl(cta.image.url)}
+                      alt={
+                        cta.image.alternativeText || cta.title || "CTA image"
+                      }
+                      fill
+                      className="pointer-events-none object-contain object-right"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
@@ -129,10 +122,10 @@ const CTASection = async ({ section }: Props) => {
       <Container>
         <section>
           <div
-            className="relative overflow-hidden rounded-lg border border-(--color-cta-border) px-6 py-8 sm:px-12 sm:py-16 lg:px-20 lg:py-29 text-white flex flex-col items-center md:flex-row md:items-center"
+            className="relative overflow-hidden rounded-lg border border-(--color-cta-border) text-white flex flex-col md:flex-row md:items-stretch"
             style={sharedWrapperStyle}
           >
-            <div className="relative z-10 w-full md:w-[55%]">
+            <div className="relative z-10 w-full md:w-[55%] px-6 py-8 sm:px-12 sm:py-16 lg:px-20 lg:py-29">
               <h3 className="text-[43px] font-bold leading-tight text-white!">
                 {cta?.title}
               </h3>
@@ -149,22 +142,23 @@ const CTASection = async ({ section }: Props) => {
                 </Button>
               )}
             </div>
-
-            {isCommunity && users?.data && users.data.length > 0 ? (
-              <div className="mt-6 md:mt-0 md:absolute md:right-8 md:top-1/2 md:-translate-y-1/2 md:w-[360px]">
-                <CommunityPile users={users.data} />
-              </div>
-            ) : (
-              cta?.image?.url && (
+            <div className="w-full md:w-[45%] flex items-center md:items-stretch">
+              <Image
+                src={cmsImageUrl(cta.image.url)}
+                alt={cta.image.alternativeText || cta?.title || "CTA image"}
+                width={600}
+                height={300}
+                className="md:hidden pointer-events-none w-full h-auto object-contain mt-6"
+              />
+              <div className="hidden md:block relative w-full">
                 <Image
                   src={cmsImageUrl(cta.image.url)}
                   alt={cta.image.alternativeText || cta?.title || "CTA image"}
-                  width={420}
-                  height={220}
-                  className="pointer-events-none h-auto w-[70%] md:w-[40%] object-contain mt-6 md:mt-0 md:absolute md:right-0 md:top-1/2 md:-translate-y-1/2"
+                  fill
+                  className="pointer-events-none object-contain object-right"
                 />
-              )
-            )}
+              </div>
+            </div>
           </div>
         </section>
       </Container>

From c6c3062f03a94c05674cb7b4cd90c765c5c2ec06 Mon Sep 17 00:00:00 2001
From: Boaz Poolman <boaz_skater@hotmail.com>
Date: Thu, 25 Jun 2026 14:41:38 +0200
Subject: [PATCH 02/14] fix: template preview and submit buttons

---
 apps/web/public/template-fallback-preview.png | Bin 4342 -> 28044 bytes
 .../content/avatar-pile/avatar-pile.tsx       |   9 +++--
 .../layout/hero/home-hero/home-hero.tsx       |   8 ++---
 .../cms/sections/card-grid/card-grid.tsx      |  34 +++++++++---------
 4 files changed, 25 insertions(+), 26 deletions(-)

diff --git a/apps/web/public/template-fallback-preview.png b/apps/web/public/template-fallback-preview.png
index e78fbea3f9e1dfdc53bfebf22c152ebeb48010cc..d37723ac6992484e72fbf6728e3f67ca0807edba 100644
GIT binary patch
literal 28044
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
G^#1@er#sjH

literal 4342
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

diff --git a/apps/web/src/components/content/avatar-pile/avatar-pile.tsx b/apps/web/src/components/content/avatar-pile/avatar-pile.tsx
index 9b3eca8..8a18526 100644
--- a/apps/web/src/components/content/avatar-pile/avatar-pile.tsx
+++ b/apps/web/src/components/content/avatar-pile/avatar-pile.tsx
@@ -7,6 +7,7 @@ type Props = {
   items: Data.ContentType<"plugin::better-auth.user">[];
   size?: "S" | "L";
   clickable?: boolean;
+  white?: boolean;
 };
 
 // Percentage widths per slot (outer → center → outer), relative to the container.
@@ -60,7 +61,7 @@ const AvatarLarge = ({
   );
 };
 
-const AvatarPile = ({ items, clickable, size = "S" }: Props) => {
+const AvatarPile = ({ items, clickable, size = "S", white = false }: Props) => {
   if (!items?.length) return null;
 
   if (size === "L") {
@@ -91,9 +92,7 @@ const AvatarPile = ({ items, clickable, size = "S" }: Props) => {
                 style={{ marginLeft: i === 0 ? 0 : -8 }}
               />
               {items.filter(Boolean).length === 1 && (
-                <span className="pl-2 text-white">
-                  {items.find(Boolean)?.name}
-                </span>
+                <span className="pl-2">{items.find(Boolean)?.name}</span>
               )}
             </Wrapper>
           ) : (
@@ -109,7 +108,7 @@ const AvatarPile = ({ items, clickable, size = "S" }: Props) => {
                 {m.name?.[0]}
               </div>
               {items.filter(Boolean).length === 1 && (
-                <span className="pl-2 text-white">
+                <span className={`pl-2 ${white ? "text-white" : ""}`}>
                   {items.find(Boolean)?.name}
                 </span>
               )}
diff --git a/apps/web/src/components/layout/hero/home-hero/home-hero.tsx b/apps/web/src/components/layout/hero/home-hero/home-hero.tsx
index 345a32f..beaecf2 100644
--- a/apps/web/src/components/layout/hero/home-hero/home-hero.tsx
+++ b/apps/web/src/components/layout/hero/home-hero/home-hero.tsx
@@ -153,7 +153,7 @@ const HomeHero = (props: Props) => {
                   </p>
                   {/* Avatar pile */}
                   <div className="mt-4 flex">
-                    <AvatarPile items={[pkg.owner!]} />
+                    <AvatarPile white items={[pkg.owner!]} />
                   </div>
                 </Link>
               </div>
@@ -163,7 +163,7 @@ const HomeHero = (props: Props) => {
               <div key={template.id} className="p-14">
                 <Link href={template.url_alias?.[0]?.url_path!}>
                   {/* Preview placeholder */}
-                  <div className={`mb-5 relative aspect-video object-cover`}>
+                  <div className={`mb-5 relative aspect-video`}>
                     <Image
                       src={
                         template.preview_image
@@ -176,7 +176,7 @@ const HomeHero = (props: Props) => {
                         template.name ??
                         ""
                       }
-                      className="rounded-lg border border-(--color-grey700)"
+                      className="rounded-lg border border-(--color-grey700) object-cover"
                     />
                   </div>
                   <h3 className="text-base font-bold text-white!">
@@ -187,7 +187,7 @@ const HomeHero = (props: Props) => {
                   </p>
                   {/* Avatar pile */}
                   <div className="mt-4 flex">
-                    <AvatarPile items={[template.owner!]} />
+                    <AvatarPile white items={[template.owner!]} />
                   </div>
                 </Link>
               </div>
diff --git a/apps/web/src/features/cms/sections/card-grid/card-grid.tsx b/apps/web/src/features/cms/sections/card-grid/card-grid.tsx
index 08dd449..c339764 100644
--- a/apps/web/src/features/cms/sections/card-grid/card-grid.tsx
+++ b/apps/web/src/features/cms/sections/card-grid/card-grid.tsx
@@ -15,23 +15,23 @@ const CardGridSection = ({ section }: Props) => {
           {section.items?.map((item, index) => (
             <article
               key={item.id}
-              className="relative min-h-62 overflow-hidden rounded-md border border-(--color-neutral150) bg-(--color-primary100) p-6"
+              className="relative flex flex-col gap-6 overflow-hidden rounded-md border border-(--color-neutral150) bg-(--color-primary100) p-6 lg:block lg:min-h-62"
             >
-              <div className="relative z-10 max-w-[56%]">
-                <div className="flex items-center">
-                  {item.icon && (
-                    <span className="mr-2">
-                      {renderIcon(item.icon, {
-                        size: 24,
-                        className: "text-(--color-primary700)",
-                      })}
-                    </span>
-                  )}
-                  <h3 className="flex items-center gap-2 text-[29px] font-semibold leading-9 text-(--color-card-grid-title)">
-                    {item.title}
-                  </h3>
-                </div>
-                <p className="mt-3 text-sm leading-6 text-(--color-neutral700)">
+              <div className="flex items-center">
+                {item.icon && (
+                  <span className="mr-2">
+                    {renderIcon(item.icon, {
+                      size: 24,
+                      className: "text-(--color-primary700)",
+                    })}
+                  </span>
+                )}
+                <h3 className="flex items-center gap-2 text-[21px] font-semibold leading-9 text-(--color-card-grid-title)">
+                  {item.title}
+                </h3>
+              </div>
+              <div className="relative z-10 lg:max-w-[60%]">
+                <p className="mt-3 text-sm leading-6 text-[15px] text-(--color-neutral700)">
                   {item.content}
                 </p>
                 <Button
@@ -48,7 +48,7 @@ const CardGridSection = ({ section }: Props) => {
                   alt={item.image.alternativeText || item.title || "Card image"}
                   width={290}
                   height={180}
-                  className={`pointer-events-none absolute -right-4 -bottom-6 z-0 h-auto w-[48%] object-contain rotate-[-11deg]`}
+                  className="pointer-events-none absolute -right-20 -bottom-6 z-0 hidden h-auto w-[48%] object-contain rotate-[-11deg] lg:block"
                 />
               )}
             </article>

From b34279224531ded67b37c367a3f7b0d02cb1d606 Mon Sep 17 00:00:00 2001
From: Boaz Poolman <boaz_skater@hotmail.com>
Date: Thu, 25 Jun 2026 14:45:42 +0200
Subject: [PATCH 03/14] chore: clean up migrations

---
 apps/cms/.env.example               |   2 -
 apps/cms/src/migration/showcases.ts | 132 ----------------------------
 2 files changed, 134 deletions(-)
 delete mode 100644 apps/cms/src/migration/showcases.ts

diff --git a/apps/cms/.env.example b/apps/cms/.env.example
index 43acf50..ea12fc3 100644
--- a/apps/cms/.env.example
+++ b/apps/cms/.env.example
@@ -43,8 +43,6 @@ ENABLE_MIGRATION=false
 
 GITHUB_ACCESS_TOKEN=tobemodified
 
-SCREENSHOTONE_KEY=tobemodified
-
 # SendGrid — used for Strapi-native emails (password resets, admin invites).
 # Automation emails (submission received, approved, etc.) run through n8n with
 # a separate SendGrid key. See github.com/strapi/community/issues/54.
diff --git a/apps/cms/src/migration/showcases.ts b/apps/cms/src/migration/showcases.ts
deleted file mode 100644
index b4b096f..0000000
--- a/apps/cms/src/migration/showcases.ts
+++ /dev/null
@@ -1,132 +0,0 @@
-import * as fs from "node:fs";
-import * as os from "node:os";
-import * as path from "node:path";
-import { parse } from "yaml";
-import { createCategories, uploadFile } from "./utils";
-
-const GITHUB_API_URL =
-  "https://api.github.com/repos/strapi/community-content/contents/showcase/sites.yml?ref=master";
-
-type ShowcaseSite = {
-  title: string;
-  url: string;
-  description: string;
-  categories?: string[];
-  frontend?: string[];
-  made_by?: string;
-  made_by_url?: string;
-};
-
-const captureScreenshot = async (url: string, title: string) => {
-  const params = new URLSearchParams({
-    access_key: process.env.SCREENSHOTONE_KEY,
-    url,
-    viewport_width: "1024",
-    viewport_height: "768",
-    format: "jpg",
-    block_ads: "true",
-    block_cookie_banners: "true",
-    block_banners_by_heuristics: "false",
-    block_trackers: "true",
-    delay: "3",
-    timeout: "20",
-    response_type: "by_format",
-    image_quality: "80",
-  });
-
-  const response = await fetch(`https://api.screenshotone.com/take?${params}`, {
-    signal: AbortSignal.timeout(90_000),
-  });
-
-  if (!response.ok) {
-    throw new Error(
-      `Screenshot API returned ${response.status} for ${url}. ${await response.text()}`,
-    );
-  }
-
-  const buffer = Buffer.from(await response.arrayBuffer());
-  const tmpPath = path.join(
-    os.tmpdir(),
-    `screenshot-${Date.now()}-${Math.random().toString(36).slice(2)}.jpg`,
-  );
-
-  await fs.promises.writeFile(tmpPath, buffer);
-
-  try {
-    return await uploadFile(tmpPath, `${title}.jpg`, "image/jpeg");
-  } finally {
-    await fs.promises.unlink(tmpPath).catch(() => {});
-  }
-};
-
-export const migrateShowcases = async () => {
-  strapi.log.info("Starting showcases migration...");
-  let migrated = 0;
-  let skipped = 0;
-  let failed = 0;
-
-  try {
-    const response = await fetch(GITHUB_API_URL, {
-      headers: { Accept: "application/vnd.github.v3+json" },
-    });
-
-    if (!response.ok) {
-      throw new Error(`GitHub API request failed: ${response.statusText}`);
-    }
-
-    const { content } = (await response.json()) as { content: string };
-    const yamlContent = Buffer.from(content, "base64").toString("utf-8");
-    const sites = parse(yamlContent) as ShowcaseSite[];
-
-    for (const site of sites) {
-      const existing = await strapi
-        .documents("api::showcase.showcase")
-        .findFirst({ filters: { url: site.url } });
-
-      if (existing) {
-        skipped++;
-        continue;
-      }
-
-      const categoryIds = await createCategories(
-        "api::showcase-category.showcase-category",
-        site.categories ?? [],
-      );
-
-      const techStackIds = await createCategories(
-        "api::tech-stack.tech-stack",
-        site.frontend ?? [],
-      );
-
-      let image = null;
-      try {
-        image = await captureScreenshot(site.url, site.title);
-      } catch (err) {
-        strapi.log.warn(
-          `Failed to capture screenshot for ${site.url}, skipping.`,
-          err,
-        );
-        failed++;
-        continue;
-      }
-
-      await strapi.documents("api::showcase.showcase").create({
-        data: {
-          title: site.title,
-          url: site.url,
-          description: site.description,
-          categories: categoryIds,
-          tech_stacks: techStackIds,
-          ...(image ? { image: image.id } : {}),
-        },
-      });
-      migrated++;
-    }
-  } catch (error) {
-    strapi.log.error("Error migrating showcases:", error);
-  } finally {
-    strapi.log.info(
-      `Showcases migration finished. Migrated: ${migrated}, Skipped: ${skipped}, Failed: ${failed}`,
-    );
-  }
-};

From 765e209edea36b62d8d41c7079df5516a696ada8 Mon Sep 17 00:00:00 2001
From: Boaz Poolman <boaz_skater@hotmail.com>
Date: Thu, 25 Jun 2026 15:15:16 +0200
Subject: [PATCH 04/14] chore: add modal for filters

---
 apps/cms/src/index.ts                         |   2 -
 .../cms/pages/overview-page/template.tsx      |   8 +-
 .../components/search-index/search-index.tsx  | 136 ++++++++++++++++--
 .../search/components/sort-by/sort-by.tsx     |   2 +-
 4 files changed, 127 insertions(+), 21 deletions(-)

diff --git a/apps/cms/src/index.ts b/apps/cms/src/index.ts
index 730e201..3dd0190 100644
--- a/apps/cms/src/index.ts
+++ b/apps/cms/src/index.ts
@@ -3,7 +3,6 @@ import { migrateIntegrations } from "./migration/integrations";
 import { migratePartners } from "./migration/partners";
 import { migratePlugins } from "./migration/plugins";
 import { migrateProviders } from "./migration/providers";
-import { migrateShowcases } from "./migration/showcases";
 import { seedEmailTemplates } from "./seed/email-templates";
 
 export default {
@@ -20,6 +19,5 @@ export default {
     await migrateIntegrations();
     await migratePlugins();
     await migrateProviders();
-    await migrateShowcases();
   },
 };
diff --git a/apps/web/src/features/cms/pages/overview-page/template.tsx b/apps/web/src/features/cms/pages/overview-page/template.tsx
index f424c07..27b5fcd 100644
--- a/apps/web/src/features/cms/pages/overview-page/template.tsx
+++ b/apps/web/src/features/cms/pages/overview-page/template.tsx
@@ -17,12 +17,12 @@ const OverviewPageTemplate = ({ document }: Props) => {
       <Navigation theme="dark" />
       <Hero>
         <HeroSection>
-          <div className="flex">
-            <div className="px-14 py-26 max-w-150">
+          <div className="flex flex-col md:flex-row">
+            <div className="px-14 py-14 md:py-26 max-w-150">
               <div className="mb-5">
                 <Breadcrumbs />
               </div>
-              <h1 className="text-[48px] mt-2 sm:mt-0 font-semibold text-white!">
+              <h1 className="text-[48px] mt-2 md:mt-0 font-semibold text-white!">
                 {document.title}
               </h1>
               <p className="text-[17px] text-(--color-hero-muted)">
@@ -35,7 +35,7 @@ const OverviewPageTemplate = ({ document }: Props) => {
                 alt={document.title!}
                 width={480}
                 height={480}
-                className="rounded-lg object-cover ml-auto"
+                className="rounded-lg object-cover ml-auto md:ml-auto w-full max-w-120 md:max-w-120 md:min-w-0 md:shrink max-h-130"
               />
             )}
           </div>
diff --git a/apps/web/src/features/search/components/search-index/search-index.tsx b/apps/web/src/features/search/components/search-index/search-index.tsx
index 1c9f6e6..0714c5a 100644
--- a/apps/web/src/features/search/components/search-index/search-index.tsx
+++ b/apps/web/src/features/search/components/search-index/search-index.tsx
@@ -1,13 +1,16 @@
 "use client";
 
 import { instantMeiliSearch } from "@meilisearch/instant-meilisearch";
+import { SlidersHorizontal, X } from "lucide-react";
 import type { ComponentPropsWithoutRef, ReactNode } from "react";
+import { createContext, useContext, useEffect, useState } from "react";
 import { Configure, InstantSearch } from "react-instantsearch";
 import { InstantSearchNext } from "react-instantsearch-nextjs";
 import { GridHits } from "@/features/search/components/grid-hits";
 import { SearchBox } from "@/features/search/components/search-box";
 import { SortBy } from "@/features/search/components/sort-by";
 import { Stats } from "@/features/search/components/stats";
+import { cn } from "@/lib/utils";
 
 const { searchClient } = instantMeiliSearch(
   process.env.NEXT_PUBLIC_SEARCH_URL as string,
@@ -15,6 +18,22 @@ const { searchClient } = instantMeiliSearch(
   { keepZeroFacets: true },
 );
 
+// Context
+
+interface SearchIndexContextValue {
+  isFilterModalOpen: boolean;
+  setIsFilterModalOpen: (open: boolean) => void;
+  hasFilters: boolean;
+  setHasFilters: (has: boolean) => void;
+}
+
+const SearchIndexContext = createContext<SearchIndexContextValue>({
+  isFilterModalOpen: false,
+  setIsFilterModalOpen: () => {},
+  hasFilters: false,
+  setHasFilters: () => {},
+});
+
 // Root
 
 interface SearchIndexRootProps {
@@ -49,19 +68,91 @@ const SearchIndexRoot = ({
 
 // Layout
 
-const SearchIndexLayout = ({ children }: { children: ReactNode }) => (
-  <div className="grid grid-cols-1 gap-8 lg:grid-cols-12">{children}</div>
-);
+const SearchIndexLayout = ({ children }: { children: ReactNode }) => {
+  const [isFilterModalOpen, setIsFilterModalOpen] = useState(false);
+  const [hasFilters, setHasFilters] = useState(false);
+
+  useEffect(() => {
+    if (isFilterModalOpen) {
+      document.body.style.overflow = "hidden";
+    }
+    return () => {
+      document.body.style.overflow = "";
+    };
+  }, [isFilterModalOpen]);
+
+  return (
+    <SearchIndexContext.Provider
+      value={{
+        isFilterModalOpen,
+        setIsFilterModalOpen,
+        hasFilters,
+        setHasFilters,
+      }}
+    >
+      <div className="grid grid-cols-1 gap-8 lg:grid-cols-12">{children}</div>
+    </SearchIndexContext.Provider>
+  );
+};
 
 // Sidebar
 
-const SearchIndexSidebar = ({ children }: { children?: ReactNode }) => (
-  <aside className="lg:col-span-3 sticky top-25">
-    {children && (
-      <div className="flex w-full flex-col items-start gap-8">{children}</div>
-    )}
-  </aside>
-);
+const SearchIndexSidebar = ({ children }: { children?: ReactNode }) => {
+  const { isFilterModalOpen, setIsFilterModalOpen, setHasFilters } =
+    useContext(SearchIndexContext);
+
+  useEffect(() => {
+    setHasFilters(true);
+    return () => setHasFilters(false);
+  }, [setHasFilters]);
+
+  if (!children) return null;
+
+  return (
+    <aside
+      className={cn(
+        "lg:col-span-3 lg:sticky lg:top-25",
+        isFilterModalOpen
+          ? "fixed inset-0 z-50 flex flex-col overflow-hidden bg-white lg:inset-auto lg:z-auto lg:block lg:overflow-visible lg:bg-transparent"
+          : "hidden lg:block",
+      )}
+    >
+      {/* Mobile-only header */}
+      <div className="flex shrink-0 items-center justify-between border-b border-(--color-neutral200) px-6 py-4 lg:hidden">
+        <h2 className="text-lg font-semibold">Filters</h2>
+        <button
+          type="button"
+          onClick={() => setIsFilterModalOpen(false)}
+          className="rounded-md p-1 text-(--color-neutral600) hover:bg-(--color-neutral100)"
+          aria-label="Close filters"
+        >
+          <X className="h-5 w-5" />
+        </button>
+      </div>
+
+      {/* Filter content */}
+      <div
+        className={cn(
+          "flex w-full flex-col items-start gap-8",
+          isFilterModalOpen && "flex-1 overflow-y-auto px-6 py-6",
+        )}
+      >
+        {children}
+      </div>
+
+      {/* Mobile-only footer */}
+      <div className="shrink-0 border-t border-(--color-neutral200) px-6 py-4 lg:hidden">
+        <button
+          type="button"
+          onClick={() => setIsFilterModalOpen(false)}
+          className="w-full rounded-lg bg-(--color-primary600) px-4 py-3 text-base font-medium text-white"
+        >
+          View results
+        </button>
+      </div>
+    </aside>
+  );
+};
 
 // FilterGroup
 
@@ -106,9 +197,26 @@ const SearchIndexSearchBox = () => (
 
 // Toolbar
 
-const SearchIndexToolbar = ({ children }: { children: ReactNode }) => (
-  <div className="mb-6 flex w-full items-center">{children}</div>
-);
+const SearchIndexToolbar = ({ children }: { children: ReactNode }) => {
+  const { hasFilters, setIsFilterModalOpen } = useContext(SearchIndexContext);
+
+  return (
+    <div className="mb-6 flex w-full flex-wrap items-center gap-2">
+      {hasFilters && (
+        <button
+          type="button"
+          onClick={() => setIsFilterModalOpen(true)}
+          className="lg:hidden inline-flex items-center gap-2 rounded-lg border border-(--color-neutral300) bg-white px-3 py-2 text-sm font-medium text-(--color-neutral700)"
+          aria-label="Open filters"
+        >
+          <SlidersHorizontal className="h-4 w-4" />
+          Filters
+        </button>
+      )}
+      {children}
+    </div>
+  );
+};
 
 // Stats
 
@@ -122,7 +230,7 @@ interface SortItem {
 }
 
 const SearchIndexSortBy = ({ items }: { items: SortItem[] }) => (
-  <div className="ml-auto">
+  <div className="w-full lg:ml-auto lg:w-auto">
     <SortBy items={items} />
   </div>
 );
diff --git a/apps/web/src/features/search/components/sort-by/sort-by.tsx b/apps/web/src/features/search/components/sort-by/sort-by.tsx
index 83458bc..aa1d4fb 100644
--- a/apps/web/src/features/search/components/sort-by/sort-by.tsx
+++ b/apps/web/src/features/search/components/sort-by/sort-by.tsx
@@ -14,7 +14,7 @@ const SortBy = (props: SortByProps) => {
 
   return (
     <Select value={currentRefinement} onValueChange={refine}>
-      <SelectTrigger>
+      <SelectTrigger className="w-full">
         <SelectValue placeholder="Sort by" />
       </SelectTrigger>
       <SelectContent>

From ced72611292ca91e5f6f5195d2684715ed802c03 Mon Sep 17 00:00:00 2001
From: Boaz Poolman <boaz_skater@hotmail.com>
Date: Thu, 25 Jun 2026 15:18:06 +0200
Subject: [PATCH 05/14] fix: active menu item

---
 apps/web/src/components/layout/navigation/navigation.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/web/src/components/layout/navigation/navigation.tsx b/apps/web/src/components/layout/navigation/navigation.tsx
index 5af4cf1..3afcfcb 100644
--- a/apps/web/src/components/layout/navigation/navigation.tsx
+++ b/apps/web/src/components/layout/navigation/navigation.tsx
@@ -49,7 +49,7 @@ const Navigation = async ({ theme }: Props) => {
                   <li key={link.id}>
                     <Link
                       href={link.link!}
-                      className={`transition-colors ${theme === "light" ? "hover:text-(--color-primary800)" : "hover:text-white"} ${isActive ? "text-white" : ""}`}
+                      className={`transition-colors ${theme === "light" ? "hover:text-(--color-primary800)" : "hover:text-white"} ${isActive ? (theme === "light" ? "text-(--color-primary900)" : "text-white") : ""}`}
                     >
                       {link.label}
                     </Link>

From ca9be60d292688084b131cc9e19a0080799f43e8 Mon Sep 17 00:00:00 2001
From: Boaz Poolman <boaz_skater@hotmail.com>
Date: Thu, 25 Jun 2026 15:23:05 +0200
Subject: [PATCH 06/14] chore: add fallback images to the search hits

---
 .../search/indexes/packages/components/hit.tsx     | 12 +++++-------
 .../search/indexes/templates/components/hit.tsx    | 14 +++++++-------
 2 files changed, 12 insertions(+), 14 deletions(-)

diff --git a/apps/web/src/features/search/indexes/packages/components/hit.tsx b/apps/web/src/features/search/indexes/packages/components/hit.tsx
index 26a910f..37f2c91 100644
--- a/apps/web/src/features/search/indexes/packages/components/hit.tsx
+++ b/apps/web/src/features/search/indexes/packages/components/hit.tsx
@@ -7,13 +7,11 @@ type Props = {
 };
 
 const Hit = ({ hit }: Props) => {
-  const image = hit.icon
-    ? {
-        src: cmsImageUrl(hit.icon.url),
-        alt: hit.icon.alternativeText ?? hit.name ?? "",
-        size: "S" as const,
-      }
-    : undefined;
+  const image = {
+    src: hit.icon ? cmsImageUrl(hit.icon.url) : "/package-fallback-icon.png",
+    alt: hit.icon?.alternativeText ?? hit.name ?? "",
+    size: "S" as const,
+  };
 
   return (
     <ContentCard
diff --git a/apps/web/src/features/search/indexes/templates/components/hit.tsx b/apps/web/src/features/search/indexes/templates/components/hit.tsx
index 68ba941..c6bfcda 100644
--- a/apps/web/src/features/search/indexes/templates/components/hit.tsx
+++ b/apps/web/src/features/search/indexes/templates/components/hit.tsx
@@ -7,13 +7,13 @@ type Props = {
 };
 
 const Hit = ({ hit }: Props) => {
-  const image = hit.preview_image
-    ? {
-        src: cmsImageUrl(hit.preview_image.url),
-        alt: hit.preview_image.alternativeText ?? hit.name ?? "",
-        size: "L" as const,
-      }
-    : undefined;
+  const image = {
+    src: hit.preview_image
+      ? cmsImageUrl(hit.preview_image.url)
+      : "/template-fallback-preview.png",
+    alt: hit.preview_image?.alternativeText ?? hit.name ?? "",
+    size: "L" as const,
+  };
 
   return (
     <ContentCard

From edd81a6b975cc891087caa57c0bd0bce78870327 Mon Sep 17 00:00:00 2001
From: Boaz Poolman <boaz_skater@hotmail.com>
Date: Thu, 25 Jun 2026 15:47:32 +0200
Subject: [PATCH 07/14] feat: add a mobile navigation

---
 .../layout/navigation/mobile-nav.tsx          | 155 ++++++++++++++++++
 .../layout/navigation/navigation.tsx          |  27 ++-
 2 files changed, 173 insertions(+), 9 deletions(-)
 create mode 100644 apps/web/src/components/layout/navigation/mobile-nav.tsx

diff --git a/apps/web/src/components/layout/navigation/mobile-nav.tsx b/apps/web/src/components/layout/navigation/mobile-nav.tsx
new file mode 100644
index 0000000..62249b6
--- /dev/null
+++ b/apps/web/src/components/layout/navigation/mobile-nav.tsx
@@ -0,0 +1,155 @@
+"use client";
+
+import { Button, Container } from "@repo/strapi-ui";
+import { Menu, X } from "lucide-react";
+import Link from "next/link";
+import { useEffect, useRef, useState } from "react";
+import { AuthNavigation } from "@/features/auth/components/auth-navigation";
+import { isAuthEnabled } from "@/features/auth/lib/is-enabled";
+import { cn } from "@/lib/utils";
+
+interface NavLink {
+  id: string | number;
+  label?: string | null;
+  link?: string | null;
+}
+
+interface MobileNavProps {
+  navLinks: NavLink[];
+  ctaLinks: NavLink[];
+  theme: "light" | "dark";
+  currentPath: string;
+}
+
+const MobileNav = ({
+  navLinks,
+  ctaLinks,
+  theme,
+  currentPath,
+}: MobileNavProps) => {
+  const [isOpen, setIsOpen] = useState(false);
+  const [panelTop, setPanelTop] = useState(0);
+  const triggerRef = useRef<HTMLButtonElement>(null);
+  const isDark = theme === "dark";
+
+  useEffect(() => {
+    if (isOpen) {
+      document.body.style.overflow = "hidden";
+    }
+    return () => {
+      document.body.style.overflow = "";
+    };
+  }, [isOpen]);
+
+  const handleOpen = () => {
+    const nav = triggerRef.current?.closest("nav");
+    setPanelTop(nav ? nav.getBoundingClientRect().bottom : 0);
+    setIsOpen(true);
+  };
+
+  return (
+    <>
+      <button
+        ref={triggerRef}
+        type="button"
+        onClick={isOpen ? () => setIsOpen(false) : handleOpen}
+        className={cn(
+          "lg:hidden rounded-md p-2 transition-colors",
+          isDark
+            ? "text-(--color-hero-muted) hover:text-white"
+            : "text-(--color-neutral700) hover:text-(--color-primary800)",
+        )}
+        aria-label={isOpen ? "Close menu" : "Open menu"}
+      >
+        {isOpen ? <X className="h-5 w-5" /> : <Menu className="h-5 w-5" />}
+      </button>
+
+      {isOpen && (
+        <>
+          <button
+            type="button"
+            className="fixed inset-0 z-10 w-full cursor-default bg-black/30 lg:hidden"
+            style={{ top: panelTop }}
+            onClick={() => setIsOpen(false)}
+            aria-label="Close menu"
+          />
+          <div
+            style={{ top: panelTop }}
+            className={cn(
+              "fixed inset-x-0 z-20 border-b lg:hidden",
+              isDark
+                ? "border-(--color-grey700) bg-(--color-hero-bg)"
+                : "border-(--color-neutral300) bg-(--background)",
+            )}
+          >
+            <Container>
+              <div
+                className={cn(
+                  "border-x px-4 py-3",
+                  isDark
+                    ? "border-(--color-grey700)"
+                    : "border-(--color-neutral300)",
+                )}
+              >
+                <ul className="flex flex-col">
+                  {navLinks.map((link) => {
+                    const isActive =
+                      currentPath === link.link ||
+                      currentPath.startsWith(`${link.link}/`);
+
+                    return (
+                      <li key={link.id}>
+                        <Link
+                          href={link.link!}
+                          onClick={() => setIsOpen(false)}
+                          className={cn(
+                            "block rounded-md px-3 py-2.5 text-base font-medium transition-colors",
+                            isDark
+                              ? "text-(--color-hero-muted) hover:bg-white/5 hover:text-white"
+                              : "text-(--color-primary700) hover:bg-(--color-neutral100) hover:text-(--color-primary900)",
+                            isActive &&
+                              (isDark
+                                ? "text-white"
+                                : "font-semibold text-(--color-primary900)"),
+                          )}
+                        >
+                          {link.label}
+                        </Link>
+                      </li>
+                    );
+                  })}
+                </ul>
+
+                <div
+                  className={cn(
+                    "mt-4 flex flex-col gap-3 border-t pb-5 pt-5",
+                    isDark
+                      ? "border-(--color-grey700)"
+                      : "border-(--color-neutral300)",
+                  )}
+                >
+                  {isAuthEnabled ? (
+                    <AuthNavigation theme={theme} />
+                  ) : (
+                    ctaLinks.map((link) => (
+                      <Button key={link.id} asChild>
+                        <Link
+                          href={link.link!}
+                          onClick={() => setIsOpen(false)}
+                        >
+                          {link.label}
+                        </Link>
+                      </Button>
+                    ))
+                  )}
+                </div>
+              </div>
+            </Container>
+          </div>
+        </>
+      )}
+    </>
+  );
+};
+
+export { MobileNav };
diff --git a/apps/web/src/components/layout/navigation/navigation.tsx b/apps/web/src/components/layout/navigation/navigation.tsx
index 3afcfcb..a863431 100644
--- a/apps/web/src/components/layout/navigation/navigation.tsx
+++ b/apps/web/src/components/layout/navigation/navigation.tsx
@@ -4,6 +4,7 @@ import Link from "next/link";
 import { AuthNavigation } from "@/features/auth/components/auth-navigation";
 import { isAuthEnabled } from "@/features/auth/lib/is-enabled";
 import { cmsClient } from "@/features/cms/lib/strapi";
+import { MobileNav } from "./mobile-nav";
 
 type Props = {
   theme: "light" | "dark";
@@ -60,15 +61,23 @@ const Navigation = async ({ theme }: Props) => {
           </div>
 
           <div className="flex items-center gap-2">
-            {isAuthEnabled ? (
-              <AuthNavigation theme={theme} />
-            ) : (
-              data.data.cta_links?.map((link) => (
-                <Button key={link.id} asChild>
-                  <Link href={link.link!}>{link.label}</Link>
-                </Button>
-              ))
-            )}
+            <div className="hidden items-center gap-2 lg:flex">
+              {isAuthEnabled ? (
+                <AuthNavigation theme={theme} />
+              ) : (
+                data.data.cta_links?.map((link) => (
+                  <Button key={link.id} asChild>
+                    <Link href={link.link!}>{link.label}</Link>
+                  </Button>
+                ))
+              )}
+            </div>
+            <MobileNav
+              navLinks={data.data.nav_links ?? []}
+              ctaLinks={data.data.cta_links ?? []}
+              theme={theme}
+              currentPath={path}
+            />
           </div>
         </div>
       </Container>

From 55ac2c52b2b77a02b15247ff47f062e5d5c73c26 Mon Sep 17 00:00:00 2001
From: Boaz Poolman <boaz_skater@hotmail.com>
Date: Thu, 25 Jun 2026 15:57:02 +0200
Subject: [PATCH 08/14] chore: make breadcrumbs responsive

---
 .../layout/breadcrumbs/breadcrumbs.tsx        | 69 +++++++++++--------
 1 file changed, 42 insertions(+), 27 deletions(-)

diff --git a/apps/web/src/components/layout/breadcrumbs/breadcrumbs.tsx b/apps/web/src/components/layout/breadcrumbs/breadcrumbs.tsx
index e0d8f5c..6e1aece 100644
--- a/apps/web/src/components/layout/breadcrumbs/breadcrumbs.tsx
+++ b/apps/web/src/components/layout/breadcrumbs/breadcrumbs.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { ChevronRight } from "lucide-react";
+import { ChevronLeft, ChevronRight } from "lucide-react";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
 
@@ -29,7 +29,6 @@ const Breadcrumbs = ({ variant = "full" }: BreadcrumbsProps) => {
     })),
   ];
 
-  // "short" variant: home + direct parent + current (skip intermediate segments)
   const crumbs =
     variant === "short" && allCrumbs.length > 3
       ? [
@@ -39,35 +38,51 @@ const Breadcrumbs = ({ variant = "full" }: BreadcrumbsProps) => {
         ]
       : allCrumbs;
 
+  const parent = crumbs.length > 1 ? crumbs[crumbs.length - 2] : null;
+
   return (
     <nav
       aria-label="Breadcrumb"
-      className="flex items-center gap-1.5 text-sm font-semibold text-(--color-primary500)"
+      className="text-sm font-semibold text-(--color-primary500)"
     >
-      {crumbs.map((crumb, index) => {
-        const isLast = index === crumbs.length - 1;
-        if (!crumb) return null;
-        return (
-          <span key={crumb.href} className="flex items-center gap-1.5">
-            {index > 0 && (
-              <ChevronRight
-                className="h-3.5 w-3.5 opacity-50"
-                aria-hidden="true"
-              />
-            )}
-            {isLast ? (
-              <span>{crumb.label}</span>
-            ) : (
-              <Link
-                href={crumb.href}
-                className="transition-colors hover:text-white"
-              >
-                {crumb.label}
-              </Link>
-            )}
-          </span>
-        );
-      })}
+      {/* Mobile: back link to parent */}
+      {parent && (
+        <Link
+          href={parent.href}
+          className="flex items-center gap-1 transition-colors hover:text-white md:hidden"
+        >
+          <ChevronLeft className="h-3.5 w-3.5 opacity-50" aria-hidden="true" />
+          {parent.label}
+        </Link>
+      )}
+
+      {/* Desktop: full trail */}
+      <div className="hidden items-center gap-1.5 md:flex">
+        {crumbs.map((crumb, index) => {
+          const isLast = index === crumbs.length - 1;
+          if (!crumb) return null;
+          return (
+            <span key={crumb.href} className="flex items-center gap-1.5">
+              {index > 0 && (
+                <ChevronRight
+                  className="h-3.5 w-3.5 opacity-50"
+                  aria-hidden="true"
+                />
+              )}
+              {isLast ? (
+                <span>{crumb.label}</span>
+              ) : (
+                <Link
+                  href={crumb.href}
+                  className="transition-colors hover:text-white"
+                >
+                  {crumb.label}
+                </Link>
+              )}
+            </span>
+          );
+        })}
+      </div>
     </nav>
   );
 };

From 921c0b1f933b925632d5c4a6182855626a0c20e8 Mon Sep 17 00:00:00 2001
From: derrickmehaffy <derrickmehaffy@gmail.com>
Date: Thu, 25 Jun 2026 12:42:07 -0700
Subject: [PATCH 09/14] feat(cms): restrict admin Google SSO to @strapi.io +
 add production provider config

Guard the Google passport strategy to only accept @strapi.io emails (reject others) and pass the request to the callback; mirror the Google provider config under config/env/production/admin.ts so it applies on Strapi Cloud. Drop an unnecessary @ts directive on the GoogleStrategy constructor (it suppressed no error and tripped the biome @ts-ignore->@ts-expect-error rule, breaking check-types).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 apps/cms/config/admin.ts                | 22 ++++++++----
 apps/cms/config/env/production/admin.ts | 45 +++++++++++++++++++++++++
 2 files changed, 60 insertions(+), 7 deletions(-)
 create mode 100644 apps/cms/config/env/production/admin.ts

diff --git a/apps/cms/config/admin.ts b/apps/cms/config/admin.ts
index b7fdd1b..b746092 100644
--- a/apps/cms/config/admin.ts
+++ b/apps/cms/config/admin.ts
@@ -1,5 +1,17 @@
 import { Strategy as GoogleStrategy } from "passport-google-oauth2";
 
+const verify = (request, accessToken, refreshToken, profile, done) => {
+  if (profile && profile.email && profile.email.endsWith("@strapi.io")) {
+    done(null, {
+      email: profile.email,
+      firstname: profile.given_name,
+      lastname: profile.family_name,
+    });
+  } else {
+    done(new Error("Forbidden email address"));
+  }
+};
+
 export default ({ env }) => ({
   auth: {
     secret: env("ADMIN_JWT_SECRET"),
@@ -18,15 +30,11 @@ export default ({ env }) => ({
                 "https://www.googleapis.com/auth/userinfo.profile",
               ],
               callbackURL:
+                env("CLOUD_APP_URL") +
                 strapi.admin.services.passport.getStrategyCallbackURL("google"),
+              passReqToCallback: true,
             },
-            (request, accessToken, refreshToken, profile, done) => {
-              done(null, {
-                email: profile.email,
-                firstname: profile.given_name,
-                lastname: profile.family_name,
-              });
-            },
+            verify,
           ),
       },
     ],
diff --git a/apps/cms/config/env/production/admin.ts b/apps/cms/config/env/production/admin.ts
new file mode 100644
index 0000000..a0e1541
--- /dev/null
+++ b/apps/cms/config/env/production/admin.ts
@@ -0,0 +1,45 @@
+import { Strategy as GoogleStrategy } from "passport-google-oauth2";
+
+const verify = (request, accessToken, refreshToken, profile, done) => {
+  if (profile && profile.email && profile.email.endsWith("@strapi.io")) {
+    done(null, {
+      email: profile.email,
+      firstname: profile.given_name,
+      lastname: profile.family_name,
+    });
+  } else {
+    done(new Error("Forbidden email address"));
+  }
+};
+
+export default ({ env }) => ({
+  auth: {
+    providers: [
+      {
+        uid: "google",
+        displayName: "Google",
+        icon: "https://cdn2.iconfinder.com/data/icons/social-icons-33/128/Google-512.png",
+        createStrategy: (strapi) =>
+          new GoogleStrategy(
+            {
+              clientID: env("GOOGLE_CLIENT_ID"),
+              clientSecret: env("GOOGLE_CLIENT_SECRET"),
+              scope: [
+                "https://www.googleapis.com/auth/userinfo.email",
+                "https://www.googleapis.com/auth/userinfo.profile",
+              ],
+              callbackURL:
+                env("CLOUD_APP_URL") +
+                strapi.admin.services.passport.getStrategyCallbackURL("google"),
+              passReqToCallback: true,
+            },
+            verify,
+          ),
+      },
+    ],
+  },
+  flags: {
+    nps: env.bool("FLAG_NPS", false),
+    promoteEE: env.bool("FLAG_PROMOTE_EE", false),
+  },
+});

From 72564bb45c805dc1ef7e2860e9b158c59a1dd9bc Mon Sep 17 00:00:00 2001
From: derrickmehaffy <derrickmehaffy@gmail.com>
Date: Thu, 25 Jun 2026 12:42:23 -0700
Subject: [PATCH 10/14] feat(cms/moderation): make n8n webhook path namespace
 configurable

Add N8N_WEBHOOK_NAMESPACE (default "strapi") to prefix all lifecycle + security-scan webhook paths, so duplicate workflow sets sharing one n8n instance (e.g. staging vs production) post to distinct, non-colliding paths. Mirrored into config/env/production/plugins.ts so it resolves on Strapi Cloud.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 apps/cms/config/env/production/plugins.ts     | 52 +++++++++++++++++++
 apps/cms/config/plugins.ts                    | 19 ++++---
 .../server/src/services/n8n-webhook.ts        | 10 ++--
 3 files changed, 71 insertions(+), 10 deletions(-)

diff --git a/apps/cms/config/env/production/plugins.ts b/apps/cms/config/env/production/plugins.ts
index 6df5117..414133d 100644
--- a/apps/cms/config/env/production/plugins.ts
+++ b/apps/cms/config/env/production/plugins.ts
@@ -1,3 +1,8 @@
+// n8n webhook path namespace — mirrors config/plugins.ts so the moderation webhook
+// paths resolve correctly on Strapi Cloud (which uses the production config).
+// Defaults to "strapi"; set N8N_WEBHOOK_NAMESPACE per environment (e.g. "staging").
+const N8N_WEBHOOK_NS = process.env.N8N_WEBHOOK_NAMESPACE || "strapi";
+
 export default ({ env }) => ({
   email: {
     config: {
@@ -18,4 +23,51 @@ export default ({ env }) => ({
       },
     },
   },
+  moderation: {
+    enabled: true,
+    resolve: "./src/plugins/moderation",
+    config: {
+      contentTypes: [
+        {
+          uid: "api::package.package",
+          singularName: "package",
+          pluralName: "packages",
+          label: "Plugins",
+          categoryUid: "api::package-category.package-category",
+          defaultFieldValues: {
+            labels: { official: false, featured: false, paid: false },
+          },
+          checks: [
+            "repo_public",
+            "readme_exists",
+            "mit_license",
+            "strapi_peer_dep",
+            "enterprise_competition",
+          ],
+          webhooks: {
+            submissionReceived: `${N8N_WEBHOOK_NS}/plugin-submission-received`,
+            approved: `${N8N_WEBHOOK_NS}/plugin-approved`,
+            declined: `${N8N_WEBHOOK_NS}/plugin-declined`,
+            changesRequested: `${N8N_WEBHOOK_NS}/plugin-changes-requested`,
+          },
+        },
+        {
+          uid: "api::template.template",
+          singularName: "template",
+          pluralName: "templates",
+          label: "Templates",
+          categoryUid: "api::template-category.template-category",
+          defaultFieldValues: {
+            labels: { official: false, featured: false, paid: false },
+          },
+          checks: ["repo_public", "readme_exists", "mit_license"],
+          webhooks: {
+            submissionReceived: `${N8N_WEBHOOK_NS}/template-submission-received`,
+            approved: `${N8N_WEBHOOK_NS}/template-approved`,
+            declined: `${N8N_WEBHOOK_NS}/template-declined`,
+          },
+        },
+      ],
+    },
+  },
 });
diff --git a/apps/cms/config/plugins.ts b/apps/cms/config/plugins.ts
index 5dd829b..f06db6a 100644
--- a/apps/cms/config/plugins.ts
+++ b/apps/cms/config/plugins.ts
@@ -1,3 +1,8 @@
+// n8n webhook path namespace. Each Strapi instance posts to "<namespace>/<event>",
+// so duplicate workflow sets sharing one n8n instance (e.g. staging vs production)
+// listen on distinct paths and never collide. Defaults to "strapi" (production).
+const N8N_WEBHOOK_NS = process.env.N8N_WEBHOOK_NAMESPACE || "strapi";
+
 export default ({ env }) => ({
   email: {
     config: {
@@ -37,10 +42,10 @@ export default ({ env }) => ({
             "enterprise_competition",
           ],
           webhooks: {
-            submissionReceived: "strapi/plugin-submission-received",
-            approved: "strapi/plugin-approved",
-            declined: "strapi/plugin-declined",
-            changesRequested: "strapi/plugin-changes-requested",
+            submissionReceived: `${N8N_WEBHOOK_NS}/plugin-submission-received`,
+            approved: `${N8N_WEBHOOK_NS}/plugin-approved`,
+            declined: `${N8N_WEBHOOK_NS}/plugin-declined`,
+            changesRequested: `${N8N_WEBHOOK_NS}/plugin-changes-requested`,
           },
         },
         {
@@ -54,9 +59,9 @@ export default ({ env }) => ({
           },
           checks: ["repo_public", "readme_exists", "mit_license"],
           webhooks: {
-            submissionReceived: "strapi/template-submission-received",
-            approved: "strapi/template-approved",
-            declined: "strapi/template-declined",
+            submissionReceived: `${N8N_WEBHOOK_NS}/template-submission-received`,
+            approved: `${N8N_WEBHOOK_NS}/template-approved`,
+            declined: `${N8N_WEBHOOK_NS}/template-declined`,
           },
         },
       ],
diff --git a/apps/cms/src/plugins/moderation/server/src/services/n8n-webhook.ts b/apps/cms/src/plugins/moderation/server/src/services/n8n-webhook.ts
index dcc4015..4a8007e 100644
--- a/apps/cms/src/plugins/moderation/server/src/services/n8n-webhook.ts
+++ b/apps/cms/src/plugins/moderation/server/src/services/n8n-webhook.ts
@@ -3,15 +3,19 @@
  *
  * Accepts webhook paths directly (e.g. "strapi/plugin-submission-received").
  * Paths come from the plugin config's `webhooks` object per content type.
- * The SECURITY_SCAN_PATH constant is hardcoded because security scanning is
- * not configurable — it always applies to api::package.package.
+ * The security-scan path is fixed per namespace (security scanning is not a
+ * configurable content-type webhook — it always applies to api::package.package),
+ * but shares the N8N_WEBHOOK_NAMESPACE prefix so duplicate workflow sets on a
+ * shared n8n instance (e.g. staging vs production) don't collide.
  *
  * Flipping N8N_WEBHOOK_MODE between 'production' and 'test' toggles all
  * webhooks between n8n's always-on prod URL (/webhook/<path>) and the
  * developer-only test URL (/webhook-test/<path>).
  */
 
-export const SECURITY_SCAN_PATH = "strapi/security-scan";
+const N8N_WEBHOOK_NS = process.env.N8N_WEBHOOK_NAMESPACE || "strapi";
+
+export const SECURITY_SCAN_PATH = `${N8N_WEBHOOK_NS}/security-scan`;
 
 function getWebhookUrl(path: string) {
   const base = process.env.N8N_WEBHOOK_BASE_URL;

From 0581053a174a945d161419b112d39de7f53af46a Mon Sep 17 00:00:00 2001
From: derrickmehaffy <derrickmehaffy@gmail.com>
Date: Thu, 25 Jun 2026 12:42:40 -0700
Subject: [PATCH 11/14] fix(automation): credential-based Strapi auth + pin
 node/n8n versions

Switch the Strapi-calling HTTP nodes from $env token auth to an n8n Header Auth credential (Strapi base URL becomes a per-instance literal); the Claude node uses the predefined Anthropic credential. Pin httpRequest nodes to typeVersion 4.4 and the n8n image to 2.27.4 for version portability, and drop the now-unused STRAPI_*/N8N_BLOCK_ENV_ACCESS compose env (auth is credential-based now).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 apps/automation/docker-compose.yml            | 10 +---
 .../cleanup-new-label-after-60d/workflow.json | 25 +++-----
 .../workflow.json                             | 15 ++---
 .../scan-timeout-sweeper/workflow.json        | 45 +++------------
 .../workflows/security-scan/workflow.json     | 57 +++++--------------
 5 files changed, 37 insertions(+), 115 deletions(-)

diff --git a/apps/automation/docker-compose.yml b/apps/automation/docker-compose.yml
index 99b1aff..08b4b56 100644
--- a/apps/automation/docker-compose.yml
+++ b/apps/automation/docker-compose.yml
@@ -2,7 +2,7 @@ name: strapi-automation
 
 services:
   n8n:
-    image: n8nio/n8n:latest
+    image: n8nio/n8n:2.27.4
     restart: unless-stopped
     ports:
       - "5678:5678"
@@ -11,14 +11,6 @@ services:
       TZ: ${GENERIC_TIMEZONE:-UTC}
       NODE_ENV: production
       N8N_SECURE_COOKIE: "false"
-      # Allow workflow expressions to read process env ($env.*). n8n blocks this by
-      # default; our workflows resolve the Strapi base URL + token from env.
-      N8N_BLOCK_ENV_ACCESS_IN_NODE: "false"
-      # Strapi connection used by workflows ($env.STRAPI_BASE_URL / $env.STRAPI_API_TOKEN).
-      # Default targets the host Strapi via the podman host-gateway alias.
-      STRAPI_BASE_URL: ${STRAPI_BASE_URL:-http://host.containers.internal:1337}
-      STRAPI_API_URL: ${STRAPI_API_URL:-http://host.containers.internal:1337}
-      STRAPI_API_TOKEN: ${STRAPI_API_TOKEN:-}
     volumes:
       - n8n_data:/home/node/.n8n
     healthcheck:
diff --git a/apps/automation/workflows/cleanup-new-label-after-60d/workflow.json b/apps/automation/workflows/cleanup-new-label-after-60d/workflow.json
index dba400a..6c31df9 100644
--- a/apps/automation/workflows/cleanup-new-label-after-60d/workflow.json
+++ b/apps/automation/workflows/cleanup-new-label-after-60d/workflow.json
@@ -61,7 +61,7 @@
       ],
       "parameters": {
         "method": "GET",
-        "url": "={{ $env.STRAPI_BASE_URL }}/api/packages",
+        "url": "=http://localhost:1337/api/packages",
         "sendQuery": true,
         "queryParameters": {
           "parameters": [
@@ -95,16 +95,9 @@
             }
           ]
         },
-        "sendHeaders": true,
-        "headerParameters": {
-          "parameters": [
-            {
-              "name": "Authorization",
-              "value": "=Bearer {{ $env.STRAPI_API_TOKEN }}"
-            }
-          ]
-        },
-        "options": {}
+        "options": {},
+        "authentication": "genericCredentialType",
+        "genericAuthType": "httpHeaderAuth"
       },
       "retryOnFail": true,
       "notes": "TODO: add pagination loop once we expect >100 stale packages. Depends on #21's 'is_new' field being added to the package 'labels' component (not yet present in the schema)."
@@ -134,14 +127,10 @@
       ],
       "parameters": {
         "method": "PUT",
-        "url": "={{ $env.STRAPI_BASE_URL }}/api/packages/{{ $json.id }}",
+        "url": "=http://localhost:1337/api/packages/{{ $json.id }}",
         "sendHeaders": true,
         "headerParameters": {
           "parameters": [
-            {
-              "name": "Authorization",
-              "value": "=Bearer {{ $env.STRAPI_API_TOKEN }}"
-            },
             {
               "name": "Content-Type",
               "value": "application/json"
@@ -151,7 +140,9 @@
         "sendBody": true,
         "contentType": "json",
         "jsonBody": "={\n  \"data\": {\n    \"labels\": {\n      \"is_new\": false\n    }\n  }\n}",
-        "options": {}
+        "options": {},
+        "authentication": "genericCredentialType",
+        "genericAuthType": "httpHeaderAuth"
       },
       "retryOnFail": true,
       "onError": "continueRegularOutput",
diff --git a/apps/automation/workflows/render-email-shared-sub-workflow/workflow.json b/apps/automation/workflows/render-email-shared-sub-workflow/workflow.json
index 98ebe58..6fc40d6 100644
--- a/apps/automation/workflows/render-email-shared-sub-workflow/workflow.json
+++ b/apps/automation/workflows/render-email-shared-sub-workflow/workflow.json
@@ -46,7 +46,7 @@
       ],
       "parameters": {
         "method": "GET",
-        "url": "={{ $env.STRAPI_BASE_URL }}/api/email-templates",
+        "url": "=http://localhost:1337/api/email-templates",
         "sendQuery": true,
         "queryParameters": {
           "parameters": [
@@ -60,16 +60,9 @@
             }
           ]
         },
-        "sendHeaders": true,
-        "headerParameters": {
-          "parameters": [
-            {
-              "name": "Authorization",
-              "value": "=Bearer {{ $env.STRAPI_API_TOKEN }}"
-            }
-          ]
-        },
-        "options": {}
+        "options": {},
+        "authentication": "genericCredentialType",
+        "genericAuthType": "httpHeaderAuth"
       },
       "retryOnFail": true,
       "notes": "TODO: swap env-var auth for an n8n 'Strapi' credential once the CMS token is issued"
diff --git a/apps/automation/workflows/scan-timeout-sweeper/workflow.json b/apps/automation/workflows/scan-timeout-sweeper/workflow.json
index da1024b..822622c 100644
--- a/apps/automation/workflows/scan-timeout-sweeper/workflow.json
+++ b/apps/automation/workflows/scan-timeout-sweeper/workflow.json
@@ -57,15 +57,15 @@
       "id": "fetch-plugins-1",
       "name": "Find Stale Plugin Scans",
       "type": "n8n-nodes-base.httpRequest",
-      "typeVersion": 4.2,
+      "typeVersion": 4.4,
       "position": [
         600,
         360
       ],
       "parameters": {
         "method": "GET",
-        "url": "={{ $env.STRAPI_BASE_URL }}/api/moderation/packages/stale-scans",
-        "authentication": "none",
+        "url": "=http://localhost:1337/api/moderation/packages/stale-scans",
+        "authentication": "genericCredentialType",
         "genericAuthType": "httpHeaderAuth",
         "sendQuery": true,
         "queryParameters": {
@@ -84,15 +84,6 @@
               "responseFormat": "json"
             }
           }
-        },
-        "sendHeaders": true,
-        "headerParameters": {
-          "parameters": [
-            {
-              "name": "Authorization",
-              "value": "=Bearer {{ $env.STRAPI_API_TOKEN }}"
-            }
-          ]
         }
       },
       "onError": "continueRegularOutput",
@@ -105,15 +96,15 @@
       "id": "fetch-templates-1",
       "name": "Find Stale Template Scans",
       "type": "n8n-nodes-base.httpRequest",
-      "typeVersion": 4.2,
+      "typeVersion": 4.4,
       "position": [
         600,
         560
       ],
       "parameters": {
         "method": "GET",
-        "url": "={{ $env.STRAPI_BASE_URL }}/api/moderation/templates/stale-scans",
-        "authentication": "none",
+        "url": "=http://localhost:1337/api/moderation/templates/stale-scans",
+        "authentication": "genericCredentialType",
         "genericAuthType": "httpHeaderAuth",
         "sendQuery": true,
         "queryParameters": {
@@ -132,15 +123,6 @@
               "responseFormat": "json"
             }
           }
-        },
-        "sendHeaders": true,
-        "headerParameters": {
-          "parameters": [
-            {
-              "name": "Authorization",
-              "value": "=Bearer {{ $env.STRAPI_API_TOKEN }}"
-            }
-          ]
         }
       },
       "onError": "continueRegularOutput",
@@ -168,15 +150,15 @@
       "id": "mark-failed-1",
       "name": "Mark Failed in Strapi",
       "type": "n8n-nodes-base.httpRequest",
-      "typeVersion": 4.2,
+      "typeVersion": 4.4,
       "position": [
         1040,
         460
       ],
       "parameters": {
         "method": "POST",
-        "url": "={{ $env.STRAPI_BASE_URL }}/api/moderation/{{ $json.kind === 'template' ? 'templates' : 'packages' }}/{{ $json.documentId }}/security-scan-result",
-        "authentication": "none",
+        "url": "=http://localhost:1337/api/moderation/{{ $json.kind === 'template' ? 'templates' : 'packages' }}/{{ $json.documentId }}/security-scan-result",
+        "authentication": "genericCredentialType",
         "genericAuthType": "httpHeaderAuth",
         "sendBody": true,
         "contentType": "json",
@@ -184,15 +166,6 @@
         "jsonBody": "={{ JSON.stringify({ stage: 'summary', status: 'failed', result: { runAt: new Date().toISOString(), error: 'Scan exceeded the 30-minute timeout and was reaped by scan-timeout-sweeper.', passed: false, reaped_at: new Date().toISOString(), started_at: $json.started_at } }) }}",
         "options": {
           "timeout": 15000
-        },
-        "sendHeaders": true,
-        "headerParameters": {
-          "parameters": [
-            {
-              "name": "Authorization",
-              "value": "=Bearer {{ $env.STRAPI_API_TOKEN }}"
-            }
-          ]
         }
       },
       "onError": "continueRegularOutput",
diff --git a/apps/automation/workflows/security-scan/workflow.json b/apps/automation/workflows/security-scan/workflow.json
index baccab7..2530ac1 100644
--- a/apps/automation/workflows/security-scan/workflow.json
+++ b/apps/automation/workflows/security-scan/workflow.json
@@ -122,7 +122,7 @@
       "id": "deps-fetch-1",
       "name": "Fetch Repo package.json",
       "type": "n8n-nodes-base.httpRequest",
-      "typeVersion": 4.2,
+      "typeVersion": 4.4,
       "position": [
         820,
         480
@@ -166,7 +166,7 @@
       "id": "osv-http-1",
       "name": "OSV.dev Batch Query",
       "type": "n8n-nodes-base.httpRequest",
-      "typeVersion": 4.2,
+      "typeVersion": 4.4,
       "position": [
         1260,
         480
@@ -207,15 +207,15 @@
       "id": "deps-patch-1",
       "name": "PATCH Scan Result",
       "type": "n8n-nodes-base.httpRequest",
-      "typeVersion": 4.2,
+      "typeVersion": 4.4,
       "position": [
         1700,
         480
       ],
       "parameters": {
         "method": "POST",
-        "url": "={{ $env.STRAPI_BASE_URL }}/api/moderation/packages/{{ $('Extract Payload').item.json.packageId }}/security-scan-result",
-        "authentication": "none",
+        "url": "=http://localhost:1337/api/moderation/packages/{{ $('Extract Payload').item.json.packageId }}/security-scan-result",
+        "authentication": "genericCredentialType",
         "genericAuthType": "httpHeaderAuth",
         "sendBody": true,
         "contentType": "json",
@@ -223,15 +223,6 @@
         "jsonBody": "={{ JSON.stringify({ stage: $json.stage, result: $json.result }) }}",
         "options": {
           "timeout": 15000
-        },
-        "sendHeaders": true,
-        "headerParameters": {
-          "parameters": [
-            {
-              "name": "Authorization",
-              "value": "=Bearer {{ $env.STRAPI_API_TOKEN }}"
-            }
-          ]
         }
       },
       "onError": "continueRegularOutput",
@@ -260,7 +251,7 @@
       "id": "ai-http-1",
       "name": "Claude Haiku Security Analysis",
       "type": "n8n-nodes-base.httpRequest",
-      "typeVersion": 4.2,
+      "typeVersion": 4.4,
       "position": [
         1040,
         800
@@ -268,8 +259,7 @@
       "parameters": {
         "method": "POST",
         "url": "https://api.anthropic.com/v1/messages",
-        "authentication": "genericCredentialType",
-        "genericAuthType": "httpHeaderAuth",
+        "authentication": "predefinedCredentialType",
         "sendHeaders": true,
         "headerParameters": {
           "parameters": [
@@ -285,7 +275,8 @@
         "jsonBody": "={{ JSON.stringify({ model: 'claude-haiku-4-5', max_tokens: 1024, system: 'You are a security auditor reviewing a Strapi community submission. You are given package metadata, install-time scripts, the README, and ACTUAL SOURCE FILES from the published package (or source repo for templates). Read the source files carefully \u2014 runtime exfiltration, credential theft, obfuscation, and suspicious network calls often hide in main entry files or bin scripts, not the README. Prioritise supply-chain signals: install-time scripts, typosquatting, mismatches between the published artifact and its source repo, obfuscated or minified code, dynamic eval / Function constructor use, network calls to unknown hosts, filesystem writes outside package dir. Respond ONLY with valid JSON matching this schema: {\"risk_level\":\"low|medium|high\",\"summary\":\"<one-sentence verdict>\",\"concerns\":[\"<concern>\",...],\"red_flags\":[\"<flag>\",...],\"recommendation\":\"approve|request_changes|reject\"}. Do not include explanation text outside the JSON.', messages: [{ role: 'user', content: `Submission kind: ${$json.submission_kind}\\nName: ${$json.plugin_name}\\npackage_location: ${$json.package_location || '(none \u2014 template or no registry URL)'}\\nregistry: ${$json.package_info?.registry || 'n/a'}\\nregistry_available: ${$json.package_info?.available ? 'yes' : 'no'}${$json.package_info?.notImplemented ? ' (deep scan not yet implemented for this registry)' : ''}\\nVersion: ${$json.package_info?.version || 'n/a'}\\nSubmitted repo: ${$json.repository_url}\\nDeclared repo on published artifact: ${$json.package_info?.declaredRepository || '(none declared)'}\\n\\nInstall-time scripts on the published artifact (immediate red flag if any are non-trivial):\\n${JSON.stringify($json.package_info?.installScripts || {}, null, 2)}\\n\\nSource files scanned: ${$json.files_scanned} of ${$json.files_available} (${$json.bytes_scanned} bytes, source: ${$json.scan_source || 'none'}).\\n\\nREADME:\\n---\\n${(($json.package_info?.readme || $json.readme) || '(no README available)').toString().slice(0, 8000)}\\n---\\n\\nSOURCE FILES (truncated per-file + overall):\\n---\\n${$json.package_code || '(no source files could be fetched)'}\\n---\\n\\nReview the code above against the schema. Output JSON only.` }] }) }}",
         "options": {
           "timeout": 45000
-        }
+        },
+        "nodeCredentialType": "anthropicApi"
       },
       "onError": "continueRegularOutput",
       "retryOnFail": true,
@@ -312,15 +303,15 @@
       "id": "ai-patch-1",
       "name": "PATCH AI Result",
       "type": "n8n-nodes-base.httpRequest",
-      "typeVersion": 4.2,
+      "typeVersion": 4.4,
       "position": [
         1480,
         800
       ],
       "parameters": {
         "method": "POST",
-        "url": "={{ $env.STRAPI_BASE_URL }}/api/moderation/packages/{{ $('Extract Payload').item.json.packageId }}/security-scan-result",
-        "authentication": "none",
+        "url": "=http://localhost:1337/api/moderation/packages/{{ $('Extract Payload').item.json.packageId }}/security-scan-result",
+        "authentication": "genericCredentialType",
         "genericAuthType": "httpHeaderAuth",
         "sendBody": true,
         "contentType": "json",
@@ -328,15 +319,6 @@
         "jsonBody": "={{ JSON.stringify({ stage: $json.stage, result: $json.result }) }}",
         "options": {
           "timeout": 15000
-        },
-        "sendHeaders": true,
-        "headerParameters": {
-          "parameters": [
-            {
-              "name": "Authorization",
-              "value": "=Bearer {{ $env.STRAPI_API_TOKEN }}"
-            }
-          ]
         }
       },
       "onError": "continueRegularOutput",
@@ -382,15 +364,15 @@
       "id": "summary-patch-1",
       "name": "PATCH Summary + Complete",
       "type": "n8n-nodes-base.httpRequest",
-      "typeVersion": 4.2,
+      "typeVersion": 4.4,
       "position": [
         2360,
         640
       ],
       "parameters": {
         "method": "POST",
-        "url": "={{ $env.STRAPI_BASE_URL }}/api/moderation/packages/{{ $('Extract Payload').item.json.packageId }}/security-scan-result",
-        "authentication": "none",
+        "url": "=http://localhost:1337/api/moderation/packages/{{ $('Extract Payload').item.json.packageId }}/security-scan-result",
+        "authentication": "genericCredentialType",
         "genericAuthType": "httpHeaderAuth",
         "sendBody": true,
         "contentType": "json",
@@ -398,15 +380,6 @@
         "jsonBody": "={{ JSON.stringify({ stage: $json.stage, result: $json.result, status: $json.status }) }}",
         "options": {
           "timeout": 15000
-        },
-        "sendHeaders": true,
-        "headerParameters": {
-          "parameters": [
-            {
-              "name": "Authorization",
-              "value": "=Bearer {{ $env.STRAPI_API_TOKEN }}"
-            }
-          ]
         }
       },
       "onError": "continueRegularOutput",

From 979be4b388c56ab336e1ae6ec78d4801a3d508cd Mon Sep 17 00:00:00 2001
From: derrickmehaffy <derrickmehaffy@gmail.com>
Date: Thu, 25 Jun 2026 12:42:40 -0700
Subject: [PATCH 12/14] docs(automation): add per-instance deploy README for
 the n8n workflows

Covers import, the post-import re-link of by-id references, the n8n credentials + Strapi env vars per instance, the N8N_WEBHOOK_NAMESPACE multi-env scheme, and activation.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 apps/automation/workflows/README.md | 74 +++++++++++++++++++++++++++++
 1 file changed, 74 insertions(+)
 create mode 100644 apps/automation/workflows/README.md

diff --git a/apps/automation/workflows/README.md b/apps/automation/workflows/README.md
new file mode 100644
index 0000000..3f241f1
--- /dev/null
+++ b/apps/automation/workflows/README.md
@@ -0,0 +1,74 @@
+# Community Hub automation — n8n workflows
+
+These workflows power moderation automation. Strapi emits lifecycle webhooks → n8n
+orchestrates developer emails (SendGrid), Slack notifications, and the security scan,
+and calls back into Strapi for scan results.
+
+> **Per-instance setup.** Staging and production each run their **own** copy of these
+> workflows in their own n8n instance. Credentials, base URLs, the webhook shared
+> secret, and the internal workflow IDs are **not** shared — set them on each instance.
+
+## 1. Import
+
+- **n8n UI:** Workflows → *Import from File* for each `workflows/<slug>/workflow.json`.
+  Import **`render-email (shared sub-workflow)`** first.
+- **Script:** `N8N_URL=https://<instance> N8N_API_KEY=<key> pnpm --filter automation run workflows:import`
+  (matches by name, updates in place).
+
+### After import: re-link by-ID references (required)
+n8n regenerates workflow IDs per instance, so two references go dangling — fix them once:
+- The **`Send Developer Email`** node in the 7 lifecycle workflows → re-select the imported **render-email**.
+- Each workflow's **Settings → Error Workflow** → re-select the imported **error-handler**.
+
+## 2. n8n credentials (bound in the UI, per instance)
+
+There are **no n8n environment variables** — the Strapi token lives in a credential.
+
+| Credential | Type | Value | Bound to (nodes) |
+|---|---|---|---|
+| **Strapi API** | HTTP Header Auth | `Authorization` = `Bearer <Strapi API token>` | the **9 Strapi HTTP nodes**: render-email *Fetch Template*; security-scan *PATCH Scan/AI/Summary*; scan-timeout-sweeper *Find Stale ×2 + Mark Failed*; cleanup *Fetch Stale + Strip Label* |
+| **n8n Webhook Auth** | HTTP Header Auth | `X-N8N-Auth` = `<shared secret>` | the **8 webhook trigger nodes**: plugin/template `submission-received` `approved` `declined`, plugin `changes-requested`, `security-scan`. Must equal Strapi `N8N_WEBHOOK_AUTH_VALUE` (see §4). |
+| **SendGrid** | SendGrid API | n8n SendGrid key (community@strapi.io account) | render-email *Send via SendGrid* |
+| **Slack** | Slack API (bot token) | bot token for `#integration-marketplace` | the **6 Slack notify nodes**: plugin/template `submission-received` + `approved`, scan-timeout-sweeper, error-handler |
+| **Anthropic** | Anthropic API (predefined) | your Anthropic API key | security-scan *Claude Haiku Security Analysis* (node uses *Predefined Credential Type → Anthropic*) |
+
+> The two Header Auth credentials are different keys (`Authorization` vs `X-N8N-Auth`)
+> as is the Anthropic one (`x-api-key`) — create all three separately.
+
+## 3. n8n per-node base URLs
+
+The 9 Strapi HTTP nodes default to `http://localhost:1337`. Set each to this instance's
+Strapi base URL (not a secret; edit per instance).
+
+## 4. Strapi environment variables (per instance)
+
+| Variable | Value |
+|---|---|
+| `N8N_WEBHOOK_BASE_URL` | this instance's n8n base URL |
+| `N8N_WEBHOOK_MODE` | `production` (uses the always-on `/webhook/...` paths; workflows must be **active**) |
+| `N8N_WEBHOOK_AUTH_HEADER` | `X-N8N-Auth` |
+| `N8N_WEBHOOK_AUTH_VALUE` | the shared secret — must equal the **n8n Webhook Auth** credential value (§2) |
+| `CLOUD_APP_URL` | Strapi admin URL (builds `dashboard_link` in Slack messages; auto-set on Strapi Cloud) |
+| `SENDGRID_API_KEY` | Strapi-native email only (password resets / admin invites) — **separate** from n8n's SendGrid key |
+| `EMAIL_DEFAULT_FROM` / `EMAIL_DEFAULT_REPLY_TO` | default `community@strapi.io` |
+
+Also generate a **Strapi API token** (admin → Settings → API Tokens; full-access for first
+bring-up) — paste it into the **Strapi API** n8n credential (§2). It needs read on
+`email-template` and access to the `moderation` content-API routes
+(`/:plural/:documentId/security-scan-result`, `/:plural/stale-scans`).
+
+## 5. Activate
+
+Activate the 8 webhook workflows + **render-email**. Activate `scan-timeout-sweeper` and
+`cleanup-new-label-after-60d` (schedule-triggered) when you want the crons running.
+
+## Notes / gotchas
+
+- **Node versions:** HTTP Request nodes are pinned to `typeVersion 4.2` so they render on
+  older n8n. If a node shows *"install this node / from a newer version of n8n,"* the
+  instance is older than that node version — lower the `typeVersion` to match.
+- **`approved` requires a publishable record:** publishing a package/template needs `slug`
+  (and `description` for packages) set first, or the publish 400s and the `approved`
+  webhook never fires. Reviewers set these before approving.
+- **Webhook paths** are fixed per workflow (`strapi/plugin-submission-received`, …,
+  `strapi/security-scan`) and mirrored in the CMS moderation plugin config.

From 921c539d80c172475b7b3926422ad2ca9ba9d2bb Mon Sep 17 00:00:00 2001
From: derrickmehaffy <derrickmehaffy@gmail.com>
Date: Thu, 25 Jun 2026 13:25:27 -0700
Subject: [PATCH 13/14] feat(automation): add workflows:deploy script +
 deploy/architecture docs

deploy-workflows.mjs deploys a workflow set to a target n8n instance for one environment: rewrites the Strapi base URL (from the localhost placeholder) and webhook paths to the env namespace, re-links the by-id references (executeWorkflow->render-email, errorWorkflow->error-handler), and re-attaches existing credential bindings by node name so re-deploys don't wipe them. README documents the deploy flow + per-set credentials/env vars + base-URL handling (9 nodes across 4 workflows), and adds a mermaid architecture diagram (Strapi <-> n8n <-> SendGrid/Slack/Anthropic).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 apps/automation/package.json                 |   3 +-
 apps/automation/scripts/deploy-workflows.mjs | 222 +++++++++++++++++++
 apps/automation/workflows/README.md          | 174 +++++++++++----
 3 files changed, 351 insertions(+), 48 deletions(-)
 create mode 100644 apps/automation/scripts/deploy-workflows.mjs

diff --git a/apps/automation/package.json b/apps/automation/package.json
index 5e207c1..de822ef 100644
--- a/apps/automation/package.json
+++ b/apps/automation/package.json
@@ -14,6 +14,7 @@
     "n8n:ps": "./scripts/compose.sh ps",
     "n8n:logs": "./scripts/compose.sh logs -f",
     "workflows:export": "node ./scripts/export-workflows.mjs",
-    "workflows:import": "node ./scripts/import-workflows.mjs"
+    "workflows:import": "node ./scripts/import-workflows.mjs",
+    "workflows:deploy": "node ./scripts/deploy-workflows.mjs"
   }
 }
diff --git a/apps/automation/scripts/deploy-workflows.mjs b/apps/automation/scripts/deploy-workflows.mjs
new file mode 100644
index 0000000..a87ee1e
--- /dev/null
+++ b/apps/automation/scripts/deploy-workflows.mjs
@@ -0,0 +1,222 @@
+#!/usr/bin/env node
+// Deploy the workflows to a target n8n instance for ONE environment.
+//
+// Does three things the plain import does not:
+//   1. Rewrites the Strapi base URL in every HTTP node from the committed
+//      placeholder (http://localhost:1337) to this environment's Strapi.
+//   2. Rewrites the webhook node paths to this environment's namespace
+//      (strapi/<event> -> <namespace>/<event>) so duplicate sets on one n8n
+//      instance never collide. Must match Strapi's N8N_WEBHOOK_NAMESPACE.
+//   3. Re-links the by-id references (executeWorkflow -> render-email and
+//      settings.errorWorkflow -> error-handler) to the target instance's ids.
+//
+// Workflows are imported INACTIVE. Credentials are bound once in the n8n UI
+// (see README); on re-deploy this script re-attaches existing credential bindings
+// by node name, so re-running does not wipe them. It never reads secret values.
+//
+// Required env:
+//   N8N_URL          target n8n base URL (e.g. https://n8n.tools.strapi.team)
+//   N8N_API_KEY      target n8n API key
+//   STRAPI_BASE_URL  Strapi base URL for this environment (e.g. https://cms.example)
+// Optional env:
+//   N8N_WEBHOOK_NAMESPACE  webhook path prefix (default "strapi"; e.g. "staging")
+//
+// Example:
+//   N8N_URL=https://n8n.tools.strapi.team N8N_API_KEY=*** \
+//   STRAPI_BASE_URL=https://staging-cms.example N8N_WEBHOOK_NAMESPACE=staging \
+//   pnpm --filter automation run workflows:deploy
+
+import { readFileSync, readdirSync, existsSync } from 'node:fs';
+import { join, dirname } from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const AUTOMATION_ROOT = join(dirname(fileURLToPath(import.meta.url)), '..');
+const WORKFLOWS_DIR = join(AUTOMATION_ROOT, 'workflows');
+const PLACEHOLDER_BASE = 'http://localhost:1337';
+const RENDER_EMAIL_NAME = 'render-email (shared sub-workflow)';
+const ERROR_HANDLER_NAME = 'error-handler';
+// settings keys the n8n public API accepts on write (others -> 400 on 2.27+)
+const ALLOWED_SETTINGS = [
+  'executionOrder', 'saveDataErrorExecution', 'saveDataSuccessExecution',
+  'saveManualExecutions', 'saveExecutionProgress', 'errorWorkflow',
+  'executionTimeout', 'timezone', 'callerPolicy', 'callerIds',
+];
+
+loadDotEnv(join(AUTOMATION_ROOT, '.env'));
+
+const N8N_URL = (process.env.N8N_URL || 'http://localhost:5678').replace(/\/$/, '');
+const API_KEY = process.env.N8N_API_KEY;
+const STRAPI_BASE_URL = (process.env.STRAPI_BASE_URL || '').replace(/\/$/, '');
+const NAMESPACE = process.env.N8N_WEBHOOK_NAMESPACE || 'strapi';
+
+if (!API_KEY) {
+  console.error('Error: N8N_API_KEY is not set (target instance key).');
+  process.exit(1);
+}
+if (!STRAPI_BASE_URL) {
+  console.error('Error: STRAPI_BASE_URL is not set (the Strapi URL for this environment).');
+  process.exit(1);
+}
+
+const headers = {
+  'X-N8N-API-KEY': API_KEY,
+  Accept: 'application/json',
+  'Content-Type': 'application/json',
+};
+
+function sanitize(wf) {
+  const out = {};
+  for (const f of ['name', 'nodes', 'connections', 'staticData']) {
+    if (wf[f] !== undefined) out[f] = wf[f];
+  }
+  const settings = {};
+  for (const k of ALLOWED_SETTINGS) {
+    if (wf.settings && wf.settings[k] !== undefined) settings[k] = wf.settings[k];
+  }
+  out.settings = settings;
+  return out;
+}
+
+// Rewrite base URL + webhook namespace for this environment (mutates wf).
+function applyEnvConfig(wf) {
+  for (const node of wf.nodes ?? []) {
+    if (node.type === 'n8n-nodes-base.webhook') {
+      const p = node.parameters?.path;
+      if (typeof p === 'string' && p.startsWith('strapi/')) {
+        node.parameters.path = `${NAMESPACE}/${p.slice('strapi/'.length)}`;
+      }
+    }
+    if (node.type === 'n8n-nodes-base.httpRequest') {
+      const u = node.parameters?.url;
+      if (typeof u === 'string' && u.includes(PLACEHOLDER_BASE)) {
+        node.parameters.url = u.replaceAll(PLACEHOLDER_BASE, STRAPI_BASE_URL);
+      }
+    }
+  }
+}
+
+// Re-point intra-set references to the target instance's ids (mutates wf).
+function relink(wf, renderId, errorId) {
+  let changed = false;
+  for (const node of wf.nodes ?? []) {
+    if (node.type === 'n8n-nodes-base.executeWorkflow' && renderId) {
+      const ref = node.parameters?.workflowId;
+      if (ref && typeof ref === 'object' && ref.value !== renderId) {
+        ref.value = renderId;
+        ref.cachedResultName = RENDER_EMAIL_NAME;
+        changed = true;
+      }
+    }
+  }
+  if (errorId && wf.settings?.errorWorkflow && wf.settings.errorWorkflow !== errorId) {
+    wf.settings.errorWorkflow = errorId;
+    changed = true;
+  }
+  return changed;
+}
+
+async function api(method, path, body) {
+  const r = await fetch(`${N8N_URL}${path}`, {
+    method, headers, body: body ? JSON.stringify(body) : undefined,
+  });
+  if (!r.ok) throw new Error(`${method} ${path} -> ${r.status} ${await r.text()}`);
+  return r.json();
+}
+
+async function listWorkflows() {
+  const all = [];
+  let cursor;
+  do {
+    const url = new URL(`${N8N_URL}/api/v1/workflows`);
+    url.searchParams.set('limit', '100');
+    if (cursor) url.searchParams.set('cursor', cursor);
+    const r = await fetch(url, { headers });
+    if (!r.ok) throw new Error(`List failed: ${r.status} ${await r.text()}`);
+    const body = await r.json();
+    all.push(...(body.data ?? []));
+    cursor = body.nextCursor;
+  } while (cursor);
+  return all;
+}
+
+function loadLocal() {
+  const out = [];
+  for (const entry of readdirSync(WORKFLOWS_DIR, { withFileTypes: true })) {
+    if (!entry.isDirectory()) continue;
+    const p = join(WORKFLOWS_DIR, entry.name, 'workflow.json');
+    if (existsSync(p)) out.push(JSON.parse(readFileSync(p, 'utf8')));
+  }
+  return out;
+}
+
+function loadDotEnv(path) {
+  if (!existsSync(path)) return;
+  for (const line of readFileSync(path, 'utf8').split('\n')) {
+    const m = line.match(/^\s*([A-Z_][A-Z0-9_]*)\s*=\s*(.*?)\s*$/);
+    if (!m) continue;
+    const val = m[2].replace(/^["']|["']$/g, '');
+    if (!(m[1] in process.env)) process.env[m[1]] = val;
+  }
+}
+
+async function main() {
+  console.log(`Deploying to ${N8N_URL}`);
+  console.log(`  Strapi base URL : ${STRAPI_BASE_URL}`);
+  console.log(`  webhook namespace: ${NAMESPACE}  (paths -> /webhook/${NAMESPACE}/<event>)\n`);
+
+  const local = loadLocal().filter((wf) => wf.name);
+  local.forEach(applyEnvConfig);
+
+  // Re-attach UI-bound credentials from an existing workflow onto the repo nodes
+  // (matched by node name), so a re-deploy never wipes credential bindings.
+  function preserveCreds(wf, existing) {
+    const byName = new Map();
+    for (const n of existing.nodes ?? []) if (n.credentials) byName.set(n.name, n.credentials);
+    for (const n of wf.nodes ?? []) if (byName.has(n.name)) n.credentials = byName.get(n.name);
+  }
+
+  // Pass 1: create/update by name (preserving existing credential bindings).
+  const existing = new Map((await listWorkflows()).map((w) => [w.name, w.id]));
+  const ids = new Map();
+  let created = 0, updated = 0, failed = 0;
+  for (const wf of local) {
+    try {
+      if (existing.has(wf.name)) {
+        const id = existing.get(wf.name);
+        const current = await api('GET', `/api/v1/workflows/${id}`);
+        preserveCreds(wf, current);
+        await api('PUT', `/api/v1/workflows/${id}`, sanitize(wf));
+        ids.set(wf.name, id);
+        updated++; console.log(`  updated  ${wf.name}`);
+      } else {
+        const res = await api('POST', '/api/v1/workflows', sanitize(wf));
+        ids.set(wf.name, res.id);
+        created++; console.log(`  created  ${wf.name}`);
+      }
+    } catch (e) {
+      failed++; console.error(`  failed   ${wf.name}: ${e.message}`);
+    }
+  }
+
+  // Pass 2: re-link by-id references to the target instance's ids.
+  const renderId = ids.get(RENDER_EMAIL_NAME);
+  const errorId = ids.get(ERROR_HANDLER_NAME);
+  let relinked = 0;
+  for (const wf of local) {
+    if (!ids.has(wf.name)) continue;
+    if (relink(wf, renderId, errorId)) {
+      try {
+        await api('PUT', `/api/v1/workflows/${ids.get(wf.name)}`, sanitize(wf));
+        relinked++;
+      } catch (e) {
+        console.error(`  relink failed ${wf.name}: ${e.message}`);
+      }
+    }
+  }
+
+  console.log(`\nSummary: ${created} created, ${updated} updated, ${relinked} re-linked, ${failed} failed.`);
+  console.log('Imported INACTIVE. Next: bind credentials in the n8n UI (see README), then activate.');
+  if (failed > 0) process.exit(1);
+}
+
+main().catch((e) => { console.error(e.stack ?? e.message); process.exit(1); });
diff --git a/apps/automation/workflows/README.md b/apps/automation/workflows/README.md
index 3f241f1..9929946 100644
--- a/apps/automation/workflows/README.md
+++ b/apps/automation/workflows/README.md
@@ -2,73 +2,153 @@
 
 These workflows power moderation automation. Strapi emits lifecycle webhooks → n8n
 orchestrates developer emails (SendGrid), Slack notifications, and the security scan,
-and calls back into Strapi for scan results.
-
-> **Per-instance setup.** Staging and production each run their **own** copy of these
-> workflows in their own n8n instance. Credentials, base URLs, the webhook shared
-> secret, and the internal workflow IDs are **not** shared — set them on each instance.
-
-## 1. Import
-
-- **n8n UI:** Workflows → *Import from File* for each `workflows/<slug>/workflow.json`.
-  Import **`render-email (shared sub-workflow)`** first.
-- **Script:** `N8N_URL=https://<instance> N8N_API_KEY=<key> pnpm --filter automation run workflows:import`
-  (matches by name, updates in place).
-
-### After import: re-link by-ID references (required)
-n8n regenerates workflow IDs per instance, so two references go dangling — fix them once:
-- The **`Send Developer Email`** node in the 7 lifecycle workflows → re-select the imported **render-email**.
-- Each workflow's **Settings → Error Workflow** → re-select the imported **error-handler**.
-
-## 2. n8n credentials (bound in the UI, per instance)
+and calls back into Strapi for templates and scan results.
+
+> **Multi-environment on a shared n8n instance.** Staging and production run
+> **duplicate workflow sets in the same n8n instance**, separated by a webhook
+> **namespace** (`strapi` for production, `staging` for staging). Each set has its own
+> credentials, its own Strapi base URL, and its own webhook paths
+> (`/webhook/<namespace>/<event>`) so the two sets never collide. The n8n-internal
+> workflow IDs also differ per set, so by-id references are re-linked on deploy.
+
+## Architecture
+
+```mermaid
+flowchart LR
+    subgraph strapi["Strapi (one per environment)"]
+        direction TB
+        trig["Submit form + admin review<br/>(publish · decide · run-security-scan)"]
+        ep_tpl["GET /api/email-templates"]
+        ep_scan["POST /api/moderation/:plural/:id/security-scan-result"]
+        ep_stale["GET /api/moderation/:plural/stale-scans"]
+        ep_pkg["GET + PUT /api/packages"]
+    end
+
+    subgraph n8n["n8n — one workflow set per env (namespace = strapi or staging)"]
+        direction TB
+        wf_life["lifecycle workflows<br/>submission-received · approved<br/>declined · changes-requested<br/>(plugin + template)"]
+        wf_render["render-email<br/>(shared sub-workflow)"]
+        wf_scan["security-scan"]
+        wf_sweep["scan-timeout-sweeper<br/>(schedule)"]
+        wf_clean["cleanup-new-label-after-60d<br/>(schedule)"]
+        wf_err["error-handler<br/>(error trigger)"]
+    end
+
+    subgraph ext["External services"]
+        sg["SendGrid"]
+        sl["Slack #integration-marketplace"]
+        ai["Anthropic (Claude)"]
+        reg["GitHub / npm / OSV.dev"]
+    end
+
+    %% Strapi -> n8n (Strapi is the caller; namespaced webhook paths)
+    trig -->|"lifecycle webhooks"| wf_life
+    trig -->|"run-security-scan webhook"| wf_scan
+
+    %% lifecycle workflows -> render-email + Slack
+    wf_life -->|"render and send mail"| wf_render
+    wf_life -.->|"notify (received + approved)"| sl
+
+    %% render-email -> Strapi + SendGrid
+    wf_render -->|"fetch template"| ep_tpl
+    wf_render -->|"send email"| sg
+
+    %% security-scan -> external + Strapi callback
+    wf_scan -->|"package.json + dep advisories"| reg
+    wf_scan -->|"AI analysis"| ai
+    wf_scan -->|"PATCH stage results"| ep_scan
+
+    %% schedules -> Strapi
+    wf_sweep -->|"find stale running scans"| ep_stale
+    wf_sweep -->|"mark timed-out as failed"| ep_scan
+    wf_sweep -.->|"notify"| sl
+    wf_clean -->|"find stale 'new' + strip label"| ep_pkg
+
+    %% errors
+    wf_err -.->|"on any workflow failure"| sl
+```
+
+The 7 lifecycle workflows have **no** Strapi URL of their own — they send mail through
+the shared `render-email` sub-workflow, which is the only one that fetches templates.
+Only **4 workflows** call Strapi directly (render-email, security-scan,
+scan-timeout-sweeper, cleanup).
+
+## Deploy to an environment (recommended)
+
+`workflows:deploy` imports every workflow into a target instance with the
+environment's Strapi base URL and webhook namespace applied, and re-links the by-id
+references automatically. Imported **inactive**. Safe to re-run: it re-attaches existing
+credential bindings by node name, so a re-deploy won't wipe the credentials you bound.
+
+```bash
+N8N_URL=https://n8n.tools.strapi.team \
+N8N_API_KEY=<target instance key> \
+STRAPI_BASE_URL=https://<this-env-cms> \
+N8N_WEBHOOK_NAMESPACE=staging \            # omit/`strapi` for production
+pnpm --filter automation run workflows:deploy
+```
+
+It (1) rewrites every HTTP node's base URL from the committed `http://localhost:1337`
+placeholder to `STRAPI_BASE_URL`, (2) rewrites webhook paths to
+`<namespace>/<event>`, and (3) re-points `executeWorkflow → render-email` and
+`Settings → Error Workflow → error-handler` to the target instance's ids.
+
+> **Plain `workflows:import`** is the no-substitution variant (local dev): matches by
+> name, updates in place, but leaves the `localhost` base URL and `strapi/` paths and
+> does **not** re-link — fine for `localhost:5678` against a local Strapi.
+
+### After deploy (manual, once per set)
+1. **Bind the 5 credentials** in the n8n UI (next section).
+2. **Activate** the 8 webhook workflows + `render-email` (+ the two schedule workflows when wanted).
+
+## n8n credentials (bound in the UI, per set)
 
 There are **no n8n environment variables** — the Strapi token lives in a credential.
 
 | Credential | Type | Value | Bound to (nodes) |
 |---|---|---|---|
 | **Strapi API** | HTTP Header Auth | `Authorization` = `Bearer <Strapi API token>` | the **9 Strapi HTTP nodes**: render-email *Fetch Template*; security-scan *PATCH Scan/AI/Summary*; scan-timeout-sweeper *Find Stale ×2 + Mark Failed*; cleanup *Fetch Stale + Strip Label* |
-| **n8n Webhook Auth** | HTTP Header Auth | `X-N8N-Auth` = `<shared secret>` | the **8 webhook trigger nodes**: plugin/template `submission-received` `approved` `declined`, plugin `changes-requested`, `security-scan`. Must equal Strapi `N8N_WEBHOOK_AUTH_VALUE` (see §4). |
+| **n8n Webhook Auth** | HTTP Header Auth | `X-N8N-Auth` = `<shared secret>` | the **8 webhook trigger nodes**. Must equal Strapi `N8N_WEBHOOK_AUTH_VALUE`. |
 | **SendGrid** | SendGrid API | n8n SendGrid key (community@strapi.io account) | render-email *Send via SendGrid* |
-| **Slack** | Slack API (bot token) | bot token for `#integration-marketplace` | the **6 Slack notify nodes**: plugin/template `submission-received` + `approved`, scan-timeout-sweeper, error-handler |
-| **Anthropic** | Anthropic API (predefined) | your Anthropic API key | security-scan *Claude Haiku Security Analysis* (node uses *Predefined Credential Type → Anthropic*) |
+| **Slack** | Slack API (bot token) | bot token for `#integration-marketplace` | the **6 Slack notify nodes** |
+| **Anthropic** | Anthropic API (predefined) | Anthropic API key | security-scan *Claude Haiku Security Analysis* (node uses *Predefined Credential Type → Anthropic*) |
 
-> The two Header Auth credentials are different keys (`Authorization` vs `X-N8N-Auth`)
-> as is the Anthropic one (`x-api-key`) — create all three separately.
+> The two Header Auth credentials use different header names (`Authorization` vs
+> `X-N8N-Auth`) — create them separately.
 
-## 3. n8n per-node base URLs
+## Base URL (handled by the deploy script)
 
-The 9 Strapi HTTP nodes default to `http://localhost:1337`. Set each to this instance's
-Strapi base URL (not a secret; edit per instance).
+The Strapi base URL appears in **9 HTTP nodes across 4 workflows**
+(security-scan ×3, scan-timeout-sweeper ×3, cleanup ×2, render-email ×1); the other 8
+workflows have none. `workflows:deploy` sets all 9 from `STRAPI_BASE_URL`, so you never
+hand-edit them. It can't live in a credential (HTTP Request credentials are auth-only)
+or an n8n Variable (instance-wide — can't differ between the two sets on one instance),
+so it's a per-set node value that the deploy script fills.
 
-## 4. Strapi environment variables (per instance)
+## Strapi environment variables (per instance)
 
 | Variable | Value |
 |---|---|
-| `N8N_WEBHOOK_BASE_URL` | this instance's n8n base URL |
-| `N8N_WEBHOOK_MODE` | `production` (uses the always-on `/webhook/...` paths; workflows must be **active**) |
+| `N8N_WEBHOOK_BASE_URL` | this environment's n8n base URL |
+| `N8N_WEBHOOK_MODE` | `production` (always-on `/webhook/...` paths; workflows must be **active**) |
+| `N8N_WEBHOOK_NAMESPACE` | `strapi` (prod, default) or `staging` — must match the deployed set's webhook paths |
 | `N8N_WEBHOOK_AUTH_HEADER` | `X-N8N-Auth` |
-| `N8N_WEBHOOK_AUTH_VALUE` | the shared secret — must equal the **n8n Webhook Auth** credential value (§2) |
-| `CLOUD_APP_URL` | Strapi admin URL (builds `dashboard_link` in Slack messages; auto-set on Strapi Cloud) |
+| `N8N_WEBHOOK_AUTH_VALUE` | the shared secret — must equal the **n8n Webhook Auth** credential value |
+| `CLOUD_APP_URL` | Strapi admin URL (builds `dashboard_link` in Slack; auto-set on Strapi Cloud) |
 | `SENDGRID_API_KEY` | Strapi-native email only (password resets / admin invites) — **separate** from n8n's SendGrid key |
-| `EMAIL_DEFAULT_FROM` / `EMAIL_DEFAULT_REPLY_TO` | default `community@strapi.io` |
 
-Also generate a **Strapi API token** (admin → Settings → API Tokens; full-access for first
-bring-up) — paste it into the **Strapi API** n8n credential (§2). It needs read on
+Also generate a **Strapi API token** (admin → Settings → API Tokens; full-access for
+first bring-up) → paste into the **Strapi API** n8n credential. It needs read on
 `email-template` and access to the `moderation` content-API routes
 (`/:plural/:documentId/security-scan-result`, `/:plural/stale-scans`).
 
-## 5. Activate
-
-Activate the 8 webhook workflows + **render-email**. Activate `scan-timeout-sweeper` and
-`cleanup-new-label-after-60d` (schedule-triggered) when you want the crons running.
-
 ## Notes / gotchas
 
-- **Node versions:** HTTP Request nodes are pinned to `typeVersion 4.2` so they render on
-  older n8n. If a node shows *"install this node / from a newer version of n8n,"* the
-  instance is older than that node version — lower the `typeVersion` to match.
-- **`approved` requires a publishable record:** publishing a package/template needs `slug`
-  (and `description` for packages) set first, or the publish 400s and the `approved`
+- **Versions are pinned for portability:** HTTP Request nodes at `typeVersion 4.4`, n8n
+  image at `n8nio/n8n:2.27.4`. If a node shows *"install this node / from a newer
+  version of n8n,"* the target instance is older — bump it, or lower the `typeVersion`.
+- **`approved` requires a publishable record:** publishing a package/template needs
+  `slug` (and `description` for packages) set first, or publish 400s and the `approved`
   webhook never fires. Reviewers set these before approving.
-- **Webhook paths** are fixed per workflow (`strapi/plugin-submission-received`, …,
-  `strapi/security-scan`) and mirrored in the CMS moderation plugin config.
+- **Webhook namespace** comes from the CMS plugin config (`N8N_WEBHOOK_NAMESPACE`,
+  default `strapi`) in `config/plugins.ts` + `config/env/production/plugins.ts`.

From a571380da522d9396c98de6f8636982aa8b200dd Mon Sep 17 00:00:00 2001
From: Boaz Poolman <boaz_skater@hotmail.com>
Date: Mon, 29 Jun 2026 12:01:09 +0200
Subject: [PATCH 14/14] chore: home page responsiveness

---
 .../layout/hero/home-hero/home-hero.tsx       | 122 ++++++++++++------
 apps/web/src/components/ui/tabs/tabs.tsx      |  52 +++++++-
 .../cms/pages/organization/template.tsx       |  20 +--
 .../features/cms/pages/package/template.tsx   |   4 +-
 .../features/cms/pages/template/template.tsx  |   4 +-
 .../src/features/cms/pages/user/template.tsx  |  16 +--
 .../cms/sections/card-grid/card-grid.tsx      |   2 +-
 .../web/src/features/cms/sections/cta/cta.tsx |   6 +-
 .../components/search-index/search-index.tsx  |  15 ++-
 9 files changed, 172 insertions(+), 69 deletions(-)

diff --git a/apps/web/src/components/layout/hero/home-hero/home-hero.tsx b/apps/web/src/components/layout/hero/home-hero/home-hero.tsx
index beaecf2..960dc89 100644
--- a/apps/web/src/components/layout/hero/home-hero/home-hero.tsx
+++ b/apps/web/src/components/layout/hero/home-hero/home-hero.tsx
@@ -5,7 +5,8 @@ import type { Data } from "@strapi/types";
 import { Code2, LayoutTemplate, Search } from "lucide-react";
 import Image from "next/image";
 import Link from "next/link";
-import { useState } from "react";
+import { useRouter } from "next/navigation";
+import { useEffect, useRef, useState } from "react";
 import { AvatarPile } from "@/components/content/avatar-pile";
 import { Breadcrumbs } from "@/components/layout/breadcrumbs";
 import { Hero, HeroSection } from "@/components/layout/hero/hero";
@@ -50,23 +51,55 @@ type Props = {
 const HomeHero = (props: Props) => {
   const { title, ctaText, ctaTitle, ctaButtons, packages, templates } = props;
 
+  const router = useRouter();
   const [activeTab, setActiveTab] = useState<Tab>("packages");
+  const [searchQuery, setSearchQuery] = useState("");
+
+  const tabScrollRef = useRef<HTMLDivElement>(null);
+  const [canScrollLeft, setCanScrollLeft] = useState(false);
+  const [canScrollRight, setCanScrollRight] = useState(false);
+
+  useEffect(() => {
+    const el = tabScrollRef.current;
+    if (!el) return;
+    const update = () => {
+      setCanScrollLeft(el.scrollLeft > 4);
+      setCanScrollRight(el.scrollLeft + el.clientWidth < el.scrollWidth - 4);
+    };
+    update();
+    el.addEventListener("scroll", update, { passive: true });
+    const ro = new ResizeObserver(update);
+    ro.observe(el);
+    return () => {
+      el.removeEventListener("scroll", update);
+      ro.disconnect();
+    };
+  }, []);
 
   return (
     <Hero>
       <HeroSection>
-        <div className="flex min-h-[360px]">
-          {/* Left: Main heading & search */}
-          <div className="flex flex-1 flex-col justify-center border-r border-(--color-grey700) px-12 py-14">
+        <div className="flex flex-col lg:flex-row lg:min-h-90">
+          {/* Main: heading & search */}
+          <div className="flex flex-1 flex-col justify-center border-b lg:border-b-0 lg:border-r border-(--color-grey700) px-4 sm:px-8 lg:px-12 py-8 sm:py-10 lg:py-14">
             <div className="mb-5">
               <Breadcrumbs />
             </div>
-            <h1 className="text-[48px] max-w-lg text-5xl font-semibold leading-[1.1] tracking-tight text-white!">
+            <h1 className="max-w-lg text-4xl sm:text-5xl font-semibold leading-[1.1] tracking-tight text-white!">
               {title}
             </h1>
-            <div className="relative mt-10 max-w-lg">
+            <div className="relative mt-8 lg:mt-10 max-w-lg">
               <input
                 type="text"
+                value={searchQuery}
+                onChange={(e) => setSearchQuery(e.target.value)}
+                onKeyDown={(e) => {
+                  if (e.key === "Enter" && searchQuery.trim()) {
+                    router.push(
+                      `/marketplace?query=${encodeURIComponent(searchQuery.trim())}`,
+                    );
+                  }
+                }}
                 placeholder="Search Community"
                 className="w-full rounded-lg border border-(--color-grey700) px-4 py-3.5 pr-12 text-sm text-white placeholder:text-(--color-hero-nav-muted) focus:outline-none focus:ring-1 focus:ring-(--color-primary500)"
                 style={{
@@ -78,8 +111,8 @@ const HomeHero = (props: Props) => {
             </div>
           </div>
 
-          {/* Right: Join Community CTA */}
-          <div className="flex w-[42%] flex-col items-center justify-center px-12 py-14">
+          {/* CTA: Join Community */}
+          <div className="flex w-full lg:w-[42%] flex-col items-center justify-center px-4 sm:px-8 lg:px-12 py-8 sm:py-10 lg:py-14">
             <h2 className="text-xl font-semibold text-(--color-cta-muted)!">
               {ctaTitle}
             </h2>
@@ -104,35 +137,51 @@ const HomeHero = (props: Props) => {
       {/* Bottom section: Tabs + Cards */}
       <HeroSection>
         {/* Tab bar */}
-        <div className="flex items-center justify-center border-b border-(--color-grey700)">
-          {tabs.map((tab) => (
-            <button
-              key={tab.id}
-              type="button"
-              onClick={() => setActiveTab(tab.id)}
-              className={cn(
-                "relative flex items-center gap-2 px-8 py-4 text-sm font-medium transition-colors",
-                activeTab === tab.id
-                  ? "text-white after:absolute after:right-0 after:bottom-0 after:left-0 after:h-0.5 after:bg-(--color-primary500)"
-                  : "text-(--color-hero-muted) hover:text-white",
-              )}
-            >
-              {tab.icon}
-              {tab.label}
-            </button>
-          ))}
+        <div className="relative border-b border-(--color-grey700)">
+          <div
+            aria-hidden
+            className={cn(
+              "pointer-events-none absolute inset-y-0 left-0 z-10 w-16 bg-linear-to-r from-(--color-hero-bg) to-transparent transition-opacity duration-200",
+              canScrollLeft ? "opacity-100" : "opacity-0",
+            )}
+          />
+          <div
+            ref={tabScrollRef}
+            className="flex items-center justify-center overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden"
+          >
+            {tabs.map((tab) => (
+              <button
+                key={tab.id}
+                type="button"
+                onClick={() => setActiveTab(tab.id)}
+                className={cn(
+                  "relative shrink-0 flex items-center gap-2 px-8 py-4 text-sm font-medium transition-colors",
+                  activeTab === tab.id
+                    ? "text-white after:absolute after:right-0 after:bottom-0 after:left-0 after:h-0.5 after:bg-(--color-primary500)"
+                    : "text-(--color-hero-muted) hover:text-white",
+                )}
+              >
+                {tab.icon}
+                {tab.label}
+              </button>
+            ))}
+          </div>
+          <div
+            aria-hidden
+            className={cn(
+              "pointer-events-none absolute inset-y-0 right-0 z-10 w-16 bg-linear-to-l from-(--color-hero-bg) to-transparent transition-opacity duration-200",
+              canScrollRight ? "opacity-100" : "opacity-0",
+            )}
+          />
         </div>
 
         {/* Cards grid */}
-        <div className="grid grid-cols-3 divide-x divide-(--color-grey700)">
+        <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 divide-y sm:divide-y-0 sm:divide-x divide-(--color-grey700)">
           {activeTab === "packages" &&
             packages.map((pkg) => (
-              <div key={pkg.id} className="p-14">
+              <div key={pkg.id} className="p-4 sm:p-6 lg:p-10 xl:p-14">
                 <Link href={pkg.url_alias?.[0]?.url_path!}>
-                  {/* Preview placeholder */}
-                  <div
-                    className={`border border-(--color-grey700) rounded-lg mb-5 relative aspect-video object-cover bg-linear-to-br from-white to-violet-100 flex items-center justify-center`}
-                  >
+                  <div className="border border-(--color-grey700) rounded-lg mb-5 relative aspect-video object-cover bg-linear-to-br from-white to-violet-100 flex items-center justify-center">
                     <Image
                       src={
                         pkg.icon
@@ -151,7 +200,6 @@ const HomeHero = (props: Props) => {
                   <p className="mt-1.5 line-clamp-2 text-sm leading-6 text-(--color-hero-muted)">
                     {pkg.description}
                   </p>
-                  {/* Avatar pile */}
                   <div className="mt-4 flex">
                     <AvatarPile white items={[pkg.owner!]} />
                   </div>
@@ -160,10 +208,9 @@ const HomeHero = (props: Props) => {
             ))}
           {activeTab === "templates" &&
             templates.map((template) => (
-              <div key={template.id} className="p-14">
+              <div key={template.id} className="p-4 sm:p-6 lg:p-10 xl:p-14">
                 <Link href={template.url_alias?.[0]?.url_path!}>
-                  {/* Preview placeholder */}
-                  <div className={`mb-5 relative aspect-video`}>
+                  <div className="mb-5 relative aspect-video">
                     <Image
                       src={
                         template.preview_image
@@ -185,7 +232,6 @@ const HomeHero = (props: Props) => {
                   <p className="mt-1.5 line-clamp-2 text-sm leading-6 text-(--color-hero-muted)">
                     {template.description}
                   </p>
-                  {/* Avatar pile */}
                   <div className="mt-4 flex">
                     <AvatarPile white items={[template.owner!]} />
                   </div>
@@ -197,7 +243,7 @@ const HomeHero = (props: Props) => {
 
       {/* View More button */}
       {activeTab === "templates" && (
-        <div className="p-12 flex justify-center">
+        <div className="flex justify-center p-4 sm:p-6 lg:p-12">
           <Button
             href="/marketplace?tab=templates"
             variant="primary"
@@ -208,7 +254,7 @@ const HomeHero = (props: Props) => {
         </div>
       )}
       {activeTab === "packages" && (
-        <div className="p-12 flex justify-center">
+        <div className="flex justify-center p-4 sm:p-6 lg:p-12">
           <Button
             href="/marketplace?tab=packages"
             variant="primary"
diff --git a/apps/web/src/components/ui/tabs/tabs.tsx b/apps/web/src/components/ui/tabs/tabs.tsx
index ca3b374..edbf231 100644
--- a/apps/web/src/components/ui/tabs/tabs.tsx
+++ b/apps/web/src/components/ui/tabs/tabs.tsx
@@ -87,9 +87,53 @@ type TabsListProps = {
   className?: string;
 };
 
-const TabsList = ({ children, className }: TabsListProps) => (
-  <div className={cn("flex items-center gap-2", className)}>{children}</div>
-);
+const TabsList = ({ children, className }: TabsListProps) => {
+  const scrollRef = useRef<HTMLDivElement>(null);
+  const [canScrollLeft, setCanScrollLeft] = useState(false);
+  const [canScrollRight, setCanScrollRight] = useState(false);
+
+  useEffect(() => {
+    const el = scrollRef.current;
+    if (!el) return;
+    const update = () => {
+      setCanScrollLeft(el.scrollLeft > 4);
+      setCanScrollRight(el.scrollLeft + el.clientWidth < el.scrollWidth - 4);
+    };
+    update();
+    el.addEventListener("scroll", update, { passive: true });
+    const ro = new ResizeObserver(update);
+    ro.observe(el);
+    return () => {
+      el.removeEventListener("scroll", update);
+      ro.disconnect();
+    };
+  }, []);
+
+  return (
+    <div className={cn("relative", className)}>
+      <div
+        aria-hidden
+        className={cn(
+          "pointer-events-none absolute inset-y-0 left-0 z-10 w-12 bg-gradient-to-r from-(--background) to-transparent transition-opacity duration-200",
+          canScrollLeft ? "opacity-100" : "opacity-0",
+        )}
+      />
+      <div
+        ref={scrollRef}
+        className="flex items-center gap-2 overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden"
+      >
+        {children}
+      </div>
+      <div
+        aria-hidden
+        className={cn(
+          "pointer-events-none absolute inset-y-0 right-0 z-10 w-12 bg-gradient-to-l from-(--background) to-transparent transition-opacity duration-200",
+          canScrollRight ? "opacity-100" : "opacity-0",
+        )}
+      />
+    </div>
+  );
+};
 
 // ─── TabsTrigger ────────────────────────────────────────────────────────────
 
@@ -116,7 +160,7 @@ const TabsTrigger = ({
       aria-selected={isActive}
       onClick={() => setActiveTab(value)}
       className={cn(
-        "cursor-pointer font-semibold inline-flex items-center gap-2 rounded-full px-4 py-3 text-[15px] transition-colors",
+        "shrink-0 cursor-pointer font-semibold inline-flex items-center gap-2 rounded-full px-4 py-3 text-[15px] transition-colors",
         isActive
           ? "bg-(--color-primary600) text-white"
           : "bg-(--color-neutral100) text-(--color-neutral700) hover:bg-(--color-neutral150)",
diff --git a/apps/web/src/features/cms/pages/organization/template.tsx b/apps/web/src/features/cms/pages/organization/template.tsx
index b685994..8f0aa97 100644
--- a/apps/web/src/features/cms/pages/organization/template.tsx
+++ b/apps/web/src/features/cms/pages/organization/template.tsx
@@ -37,7 +37,7 @@ const OrganizationTemplate = ({ document, members, relatedContent }: Props) => {
       <Navigation theme="dark" />
       <Hero>
         <HeroSection>
-          <div className="px-14 py-26">
+          <div className="px-4 sm:px-10 lg:px-14 py-10 sm:py-16 lg:py-26">
             <div className="mb-6">
               <Breadcrumbs />
             </div>
@@ -132,7 +132,7 @@ const OrganizationTemplate = ({ document, members, relatedContent }: Props) => {
           defaultValue={noRelatedContent ? "about" : "content"}
           className="w-full"
         >
-          <TabsList className="border-(--color-neutral300) border-l border-r border-b px-16 py-10">
+          <TabsList className="border-(--color-neutral300) border-l border-r border-b px-4 sm:px-8 lg:px-16 py-4 sm:py-6 lg:py-10">
             {!noRelatedContent && (
               <TabsTrigger
                 value="content"
@@ -153,8 +153,8 @@ const OrganizationTemplate = ({ document, members, relatedContent }: Props) => {
 
           <TabsContent value="content">
             {templates.length > 0 && (
-              <section className="border-(--color-neutral300) border-l border-r border-b px-16 py-10 pt-18">
-                <h2 className="mb-14 text-[21px] font-semibold text-(--color-primary600)">
+              <section className="border-(--color-neutral300) border-l border-r border-b px-4 sm:px-8 lg:px-16 py-6 sm:py-8 lg:py-10 pt-8 sm:pt-12 lg:pt-18">
+                <h2 className="mb-6 sm:mb-10 lg:mb-14 text-[21px] font-semibold text-(--color-primary600)">
                   Templates
                 </h2>
                 <div className="grid grid-cols-1 gap-4 md:grid-cols-3">
@@ -181,8 +181,8 @@ const OrganizationTemplate = ({ document, members, relatedContent }: Props) => {
             )}
 
             {packages.length > 0 && (
-              <section className="border-(--color-neutral300) border-l border-r border-b px-16 py-10 pt-18">
-                <h2 className="mb-14 text-[21px] font-semibold text-(--color-primary600)">
+              <section className="border-(--color-neutral300) border-l border-r border-b px-4 sm:px-8 lg:px-16 py-6 sm:py-8 lg:py-10 pt-8 sm:pt-12 lg:pt-18">
+                <h2 className="mb-6 sm:mb-10 lg:mb-14 text-[21px] font-semibold text-(--color-primary600)">
                   Packages
                 </h2>
                 <div className="grid grid-cols-1 gap-4 md:grid-cols-3">
@@ -211,9 +211,9 @@ const OrganizationTemplate = ({ document, members, relatedContent }: Props) => {
 
           <TabsContent
             value="about"
-            className="overflow-hidden border-(--color-neutral300) border-l border-r border-b px-16 py-10 pt-18"
+            className="overflow-hidden border-(--color-neutral300) border-l border-r border-b px-4 sm:px-8 lg:px-16 py-6 sm:py-8 lg:py-10 pt-8 sm:pt-12 lg:pt-18"
           >
-            <h2 className="mb-14 text-[21px] font-semibold text-(--color-neutral900)">
+            <h2 className="mb-6 sm:mb-10 lg:mb-14 text-[21px] font-semibold text-(--color-neutral900)">
               About {document.name}
             </h2>
             {document.profile?.readme ? (
@@ -227,9 +227,9 @@ const OrganizationTemplate = ({ document, members, relatedContent }: Props) => {
 
           <TabsContent
             value="people"
-            className="overflow-hidden border-(--color-neutral300) border-l border-r border-b px-16 py-10 pt-18"
+            className="overflow-hidden border-(--color-neutral300) border-l border-r border-b px-4 sm:px-8 lg:px-16 py-6 sm:py-8 lg:py-10 pt-8 sm:pt-12 lg:pt-18"
           >
-            <h2 className="mb-14 text-[21px] font-semibold text-(--color-neutral900)">
+            <h2 className="mb-6 sm:mb-10 lg:mb-14 text-[21px] font-semibold text-(--color-neutral900)">
               People
             </h2>
             {members.length > 0 ? (
diff --git a/apps/web/src/features/cms/pages/package/template.tsx b/apps/web/src/features/cms/pages/package/template.tsx
index 1cb27c3..b20bfb7 100644
--- a/apps/web/src/features/cms/pages/package/template.tsx
+++ b/apps/web/src/features/cms/pages/package/template.tsx
@@ -32,9 +32,9 @@ const PackageTemplate = ({ document }: Props) => {
     <>
       <Navigation theme="light" />
       <Container>
-        <div className="grid grid-cols-1 gap-8 pb-16 lg:grid-cols-12 mt-10">
+        <div className="grid grid-cols-1 gap-6 sm:gap-8 pb-8 sm:pb-12 lg:pb-16 lg:grid-cols-12 mt-6 sm:mt-10">
           {/* ── Left column ── */}
-          <section className="lg:col-span-8 space-y-8">
+          <section className="lg:col-span-8 space-y-6 sm:space-y-8">
             {/* Header */}
             <div className="flex items-center gap-5">
               <div className="shrink-0 h-16 w-16 rounded-lg overflow-hidden border border-(--color-neutral150) bg-white flex items-center justify-center">
diff --git a/apps/web/src/features/cms/pages/template/template.tsx b/apps/web/src/features/cms/pages/template/template.tsx
index 92e8ac3..cc32afa 100644
--- a/apps/web/src/features/cms/pages/template/template.tsx
+++ b/apps/web/src/features/cms/pages/template/template.tsx
@@ -29,9 +29,9 @@ const TemplateTemplate = ({ document }: Props) => {
     <>
       <Navigation theme="light" />
       <Container>
-        <div className="grid grid-cols-1 gap-8 pb-16 lg:grid-cols-12 mt-10">
+        <div className="grid grid-cols-1 gap-6 sm:gap-8 pb-8 sm:pb-12 lg:pb-16 lg:grid-cols-12 mt-6 sm:mt-10">
           {/* ── Left column ── */}
-          <section className="lg:col-span-8 space-y-8">
+          <section className="lg:col-span-8 space-y-6 sm:space-y-8">
             {/* Header */}
             <div className="flex items-center gap-5">
               <div className="shrink-0 h-16 w-16 rounded-lg overflow-hidden border border-(--color-neutral150) bg-white flex items-center justify-center">
diff --git a/apps/web/src/features/cms/pages/user/template.tsx b/apps/web/src/features/cms/pages/user/template.tsx
index d4178a2..e983107 100644
--- a/apps/web/src/features/cms/pages/user/template.tsx
+++ b/apps/web/src/features/cms/pages/user/template.tsx
@@ -33,7 +33,7 @@ const UserTemplate = ({ document, relatedContent }: Props) => {
       <Navigation theme="dark" />
       <Hero>
         <HeroSection>
-          <div className="px-14 py-26">
+          <div className="px-4 sm:px-10 lg:px-14 py-10 sm:py-16 lg:py-26">
             <div className="mb-6">
               <Breadcrumbs />
             </div>
@@ -138,7 +138,7 @@ const UserTemplate = ({ document, relatedContent }: Props) => {
           defaultValue={noRelatedContent ? "about" : "content"}
           className="w-full"
         >
-          <TabsList className="border-(--color-neutral300) border-l border-r border-b px-16 py-10">
+          <TabsList className="border-(--color-neutral300) border-l border-r border-b px-4 sm:px-8 lg:px-16 py-4 sm:py-6 lg:py-10">
             {!noRelatedContent && (
               <TabsTrigger
                 value="content"
@@ -154,8 +154,8 @@ const UserTemplate = ({ document, relatedContent }: Props) => {
 
           <TabsContent value="content">
             {templates.length > 0 && (
-              <section className="border-(--color-neutral300) border-l border-r border-b px-16 py-10 pt-18">
-                <h2 className="mb-14 text-[21px] font-semibold text-(--color-primary600)">
+              <section className="border-(--color-neutral300) border-l border-r border-b px-4 sm:px-8 lg:px-16 py-6 sm:py-8 lg:py-10 pt-8 sm:pt-12 lg:pt-18">
+                <h2 className="mb-6 sm:mb-10 lg:mb-14 text-[21px] font-semibold text-(--color-primary600)">
                   Templates
                 </h2>
                 <div className="grid grid-cols-1 gap-4 md:grid-cols-3">
@@ -182,8 +182,8 @@ const UserTemplate = ({ document, relatedContent }: Props) => {
             )}
 
             {packages.length > 0 && (
-              <section className="border-(--color-neutral300) border-l border-r border-b px-16 py-10 pt-18">
-                <h2 className="mb-14 text-[21px] font-semibold text-(--color-primary600)">
+              <section className="border-(--color-neutral300) border-l border-r border-b px-4 sm:px-8 lg:px-16 py-6 sm:py-8 lg:py-10 pt-8 sm:pt-12 lg:pt-18">
+                <h2 className="mb-6 sm:mb-10 lg:mb-14 text-[21px] font-semibold text-(--color-primary600)">
                   Packages
                 </h2>
                 <div className="grid grid-cols-1 gap-4 md:grid-cols-3">
@@ -212,9 +212,9 @@ const UserTemplate = ({ document, relatedContent }: Props) => {
 
           <TabsContent
             value="about"
-            className="overflow-hidden border-(--color-neutral300) border-l border-r border-b px-16 py-10 pt-18"
+            className="overflow-hidden border-(--color-neutral300) border-l border-r border-b px-4 sm:px-8 lg:px-16 py-6 sm:py-8 lg:py-10 pt-8 sm:pt-12 lg:pt-18"
           >
-            <h2 className="mb-14 text-[21px] font-semibold text-(--color-neutral900)">
+            <h2 className="mb-6 sm:mb-10 lg:mb-14 text-[21px] font-semibold text-(--color-neutral900)">
               About {document.name}
             </h2>
             {document.profile?.readme ? (
diff --git a/apps/web/src/features/cms/sections/card-grid/card-grid.tsx b/apps/web/src/features/cms/sections/card-grid/card-grid.tsx
index c339764..262ad73 100644
--- a/apps/web/src/features/cms/sections/card-grid/card-grid.tsx
+++ b/apps/web/src/features/cms/sections/card-grid/card-grid.tsx
@@ -10,7 +10,7 @@ type Props = {
 const CardGridSection = ({ section }: Props) => {
   return (
     <Container>
-      <section className="border-(--color-neutral300) border-l border-r border-b px-6 py-10 pt-18">
+      <section className="border-(--color-neutral300) border-l border-r border-b px-4 sm:px-6 py-6 sm:py-8 lg:py-10 pt-8 sm:pt-12 lg:pt-18">
         <div className="grid grid-cols-1 gap-4 md:grid-cols-2">
           {section.items?.map((item, index) => (
             <article
diff --git a/apps/web/src/features/cms/sections/cta/cta.tsx b/apps/web/src/features/cms/sections/cta/cta.tsx
index 7ddb9eb..20a18f1 100644
--- a/apps/web/src/features/cms/sections/cta/cta.tsx
+++ b/apps/web/src/features/cms/sections/cta/cta.tsx
@@ -64,7 +64,7 @@ const CTASection = async ({ section }: Props) => {
 
   if (cta?.size === "S") {
     return (
-      <div className="py-16 border-y border-(--color-neutral300)">
+      <div className="py-8 sm:py-12 lg:py-16 border-y border-(--color-neutral300)">
         <Container>
           <section>
             <div
@@ -72,7 +72,7 @@ const CTASection = async ({ section }: Props) => {
               style={sharedWrapperStyle}
             >
               <div className="relative z-10 flex flex-col md:flex-row md:items-stretch md:justify-between gap-6">
-                <div className="md:w-[90%] min-w-75 px-8 py-10">
+                <div className="md:w-[90%] min-w-75 px-5 sm:px-8 py-6 sm:py-10">
                   <h3 className="font-bold leading-tight text-white!">
                     {cta.title}
                   </h3>
@@ -118,7 +118,7 @@ const CTASection = async ({ section }: Props) => {
   }
 
   return (
-    <div className="py-16 border-y border-(--color-neutral300)">
+    <div className="py-8 sm:py-12 lg:py-16 border-y border-(--color-neutral300)">
       <Container>
         <section>
           <div
diff --git a/apps/web/src/features/search/components/search-index/search-index.tsx b/apps/web/src/features/search/components/search-index/search-index.tsx
index 0714c5a..430e92c 100644
--- a/apps/web/src/features/search/components/search-index/search-index.tsx
+++ b/apps/web/src/features/search/components/search-index/search-index.tsx
@@ -2,6 +2,7 @@
 
 import { instantMeiliSearch } from "@meilisearch/instant-meilisearch";
 import { SlidersHorizontal, X } from "lucide-react";
+import { useSearchParams } from "next/navigation";
 import type { ComponentPropsWithoutRef, ReactNode } from "react";
 import { createContext, useContext, useEffect, useState } from "react";
 import { Configure, InstantSearch } from "react-instantsearch";
@@ -47,12 +48,19 @@ const SearchIndexRoot = ({
   useNextSearch = true,
   children,
 }: SearchIndexRootProps) => {
+  const searchParams = useSearchParams();
+  const initialQuery = searchParams.get("query") ?? undefined;
+  const initialUiState = initialQuery
+    ? { [indexName]: { query: initialQuery } }
+    : undefined;
+
   if (useNextSearch) {
     return (
       <InstantSearchNext
         routing
         indexName={indexName}
         searchClient={searchClient}
+        initialUiState={initialUiState}
       >
         {children}
       </InstantSearchNext>
@@ -60,7 +68,12 @@ const SearchIndexRoot = ({
   }
 
   return (
-    <InstantSearch routing indexName={indexName} searchClient={searchClient}>
+    <InstantSearch
+      routing
+      indexName={indexName}
+      searchClient={searchClient}
+      initialUiState={initialUiState}
+    >
       {children}
     </InstantSearch>
   );