modern-cms 1.0.0

package/template/apps/api/prisma/seed-our-charities.ts

@@ -0,0 +1,231 @@
+import "dotenv/config";
+import { PrismaClient } from "@prisma/client";
+import { createEmptyPage, createNode, insertNode, setContainerColumnCount } from "@pgcms/shared";
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+
+// Builds a demo "Our Charities" page, structurally modeled on the kind of nonprofit
+// charities-listing page you'd find at an organization like sigbi.org/what-we-do/our-charities/
+// (intro -> charity listings -> impact stats -> donation deadline -> foundation blurb ->
+// testimonials -> gallery -> video -> map -> news -> donate -> join CTA -> footer), using
+// original/generic content and placeholder imagery — not any real organization's text,
+// logo, or trademarks. Exercises every component type currently in the registry.
+
+const PLACEHOLDER = (label: string, size = "800x500") =>
+  `https://placehold.co/${size}/1e293b/ffffff?text=${encodeURIComponent(label)}`;
+// For images used as a *background behind real heading text* — a baked-in text label
+// would visually clash with the actual copy layered on top, so keep these blank.
+const PLACEHOLDER_BG = (size: string) => `https://placehold.co/${size}/1e293b/1e293b?text=+`;
+
+const SAMPLE_VIDEO = "https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4";
+
+export async function seedOurCharitiesPage(prisma: PrismaClient) {
+  let root = createEmptyPage();
+
+  // 1. Hero banner (image background)
+  const heroBanner = createNode("imageBackgroundSection");
+  heroBanner.props.heading = "Standing Up for Women and Girls";
+  heroBanner.props.subheading =
+    "Discover the charities and appeals our federation supports to change lives around the world.";
+  heroBanner.props.buttonText = "Donate Now";
+  heroBanner.props.buttonHref = "#donate";
+  heroBanner.style.backgroundImage = PLACEHOLDER_BG("1600x700");
+  root = insertNode(root, root.id, heroBanner);
+
+  // 2. Intro rich text
+  const intro = createNode("richText");
+  intro.props.html =
+    "<p>Every year, our federation raises funds for a small number of carefully chosen appeals. " +
+    "Explore the funds below, see the impact your support has already made, and find out how to " +
+    "give to the causes that matter most.</p>";
+  root = insertNode(root, root.id, intro);
+
+  // 3. Card grid — the charity listings themselves
+  const charities = createNode("cardGrid");
+  charities.props.heading = "Our Charities";
+  charities.props.columns = 3;
+  charities.props.cards = [
+    {
+      image: PLACEHOLDER("Benevolent Fund"),
+      title: "Benevolent Fund",
+      excerpt: "Financial assistance for members and their families facing hardship.",
+      buttonText: "Learn more",
+      href: "#benevolent-fund",
+    },
+    {
+      image: PLACEHOLDER("Education Grant"),
+      title: "Diamond Education Grant",
+      excerpt: "Funding education and skills training for women rebuilding their lives.",
+      buttonText: "Learn more",
+      href: "#education-grant",
+    },
+    {
+      image: PLACEHOLDER("Emergency Relief"),
+      title: "Emergency Relief Fund",
+      excerpt: "Rapid-response aid for communities affected by disaster and crisis.",
+      buttonText: "Learn more",
+      href: "#emergency-relief",
+    },
+  ];
+  root = insertNode(root, root.id, charities);
+
+  // 4. Impact stats
+  const stats = createNode("stats");
+  stats.props.columns = 4;
+  stats.props.items = [
+    { value: "500+", label: "Charities Supported" },
+    { value: "$2M+", label: "Raised This Year" },
+    { value: "40", label: "Countries Reached" },
+    { value: "12K", label: "Volunteer Hours" },
+  ];
+  stats.style.backgroundColor = "#f1f5f9";
+  root = insertNode(root, root.id, stats);
+
+  // 5. Countdown to the next grant cycle deadline
+  const countdown = createNode("countdown");
+  countdown.props.heading = "Next Grant Cycle Deadline";
+  countdown.props.expiredText = "Applications for this cycle are now closed — check back soon for the next round.";
+  countdown.props.buttonText = "Apply Now";
+  countdown.props.buttonHref = "#apply";
+  root = insertNode(root, root.id, countdown);
+
+  // 6. Foundation feature — two-column layout (image + copy)
+  let foundation = createNode("container");
+  foundation = setContainerColumnCount(foundation, 2);
+  const foundationImage = createNode("imageBlock");
+  foundationImage.props.src = PLACEHOLDER("Our Foundation", "700x500");
+  foundationImage.props.alt = "Our Foundation";
+  const foundationText = createNode("richText");
+  foundationText.props.html =
+    "<h2>Our Foundation</h2><p>Our federation's charitable foundation focuses on education, poverty " +
+    "prevention, and human rights for women and girls worldwide. Together with our member clubs, it " +
+    "funds grassroots projects that create lasting change.</p><p><a href=\"#foundation\">Visit the Foundation →</a></p>";
+  foundation.children[0].children.push(foundationImage);
+  foundation.children[1].children.push(foundationText);
+  root = insertNode(root, root.id, foundation);
+
+  // 7. Testimonial slider
+  const testimonials = createNode("slider");
+  testimonials.props.autoplay = true;
+  testimonials.props.slides = [
+    {
+      image: PLACEHOLDER_BG("1600x600"),
+      heading: "“The Emergency Relief Fund reached our village within days.”",
+      subheading: "Flood relief recipient, 2025",
+      buttonText: "",
+      buttonHref: "",
+    },
+    {
+      image: PLACEHOLDER_BG("1600x600"),
+      heading: "“The Education Grant let me finish my nursing degree.”",
+      subheading: "Diamond Education Grant recipient",
+      buttonText: "",
+      buttonHref: "",
+    },
+    {
+      image: PLACEHOLDER_BG("1600x600"),
+      heading: "“Membership gave me a global community of changemakers.”",
+      subheading: "Federation member since 2019",
+      buttonText: "",
+      buttonHref: "",
+    },
+  ];
+  root = insertNode(root, root.id, testimonials);
+
+  // 8. Photo gallery
+  const gallery = createNode("gallery");
+  gallery.props.columns = 4;
+  gallery.props.images = [1, 2, 3, 4].map((n) => ({ src: PLACEHOLDER(`Impact ${n}`, "500x500"), alt: `Impact photo ${n}` }));
+  root = insertNode(root, root.id, gallery);
+
+  // 9. Video background section
+  const video = createNode("videoBackgroundSection");
+  video.props.heading = "See Our Work in Action";
+  video.props.subheading = "A look at the projects your donations make possible.";
+  video.style.backgroundVideo = SAMPLE_VIDEO;
+  root = insertNode(root, root.id, video);
+
+  // 10. Map — find a local club
+  const map = createNode("mapEmbed");
+  map.props.lat = 51.5074;
+  map.props.lng = -0.1278;
+  map.props.zoom = 11;
+  root = insertNode(root, root.id, map);
+
+  // 11. Latest news
+  const news = createNode("cardGrid");
+  news.props.heading = "Latest News";
+  news.props.columns = 3;
+  news.props.cards = [
+    {
+      image: PLACEHOLDER("News 1"),
+      title: "Federation Announces Record Fundraising Year",
+      excerpt: "Member clubs raised more for our appeals in the last year than ever before.",
+      buttonText: "Read more",
+      href: "#news-1",
+    },
+    {
+      image: PLACEHOLDER("News 2"),
+      title: "Education Grant Opens for New Applications",
+      excerpt: "The Diamond Education Grant is now accepting applications for the next cohort.",
+      buttonText: "Read more",
+      href: "#news-2",
+    },
+    {
+      image: PLACEHOLDER("News 3"),
+      title: "Emergency Relief Fund Responds to Flooding",
+      excerpt: "Rapid-response aid was distributed to affected communities within 72 hours.",
+      buttonText: "Read more",
+      href: "#news-3",
+    },
+  ];
+  root = insertNode(root, root.id, news);
+
+  // 12. Donation buttons
+  const donate = createNode("buttonGroup");
+  donate.style.paddingY = "48px";
+  donate.props.buttons = [
+    { text: "Donate to Benevolent Fund", href: "#donate-benevolent", variant: "primary" },
+    { text: "Donate to Education Grant", href: "#donate-education", variant: "secondary" },
+    { text: "Donate to Emergency Relief", href: "#donate-emergency", variant: "outline" },
+  ];
+  root = insertNode(root, root.id, donate);
+
+  // 13. Join CTA
+  const cta = createNode("cta");
+  cta.props.heading = "Ready to Make a Difference?";
+  cta.props.subheading = "Join a community of changemakers standing up for women and girls worldwide.";
+  cta.props.buttonText = "Join Us";
+  cta.props.buttonHref = "#join";
+  root = insertNode(root, root.id, cta);
+
+  const data = {
+    title: "Our Charities",
+    status: "PUBLISHED" as const,
+    content: root as any,
+    seoTitle: "Our Charities",
+    seoDescription:
+      "Explore the charities and appeals we support, see our impact, and find out how to give or get involved.",
+  };
+
+  const existing = await prisma.page.findUnique({ where: { slug: "our-charities" } });
+  if (existing) {
+    await prisma.page.update({ where: { id: existing.id }, data });
+    console.log("Updated existing 'Our Charities' page");
+  } else {
+    await prisma.page.create({ data: { ...data, slug: "our-charities" } });
+    console.log("Created 'Our Charities' page");
+  }
+}
+
+if (process.argv[1] && path.resolve(process.argv[1]) === fileURLToPath(import.meta.url)) {
+  const prisma = new PrismaClient();
+  seedOurCharitiesPage(prisma)
+    .catch((err) => {
+      console.error(err);
+      process.exit(1);
+    })
+    .finally(async () => {
+      await prisma.$disconnect();
+    });
+}

package/template/apps/api/prisma/seed-templates.ts

@@ -0,0 +1,154 @@
+// One-off: seeds a handful of starter PageTemplate rows so a new page can begin from
+// a real, populated layout instead of a blank canvas. Idempotent (matches by name).
+import "dotenv/config";
+import { PrismaClient } from "@prisma/client";
+import { createEmptyPage, createNode, insertNode } from "@pgcms/shared";
+
+const prisma = new PrismaClient();
+
+const PLACEHOLDER = (label: string, size = "1600x700") =>
+  `https://placehold.co/${size}/0b1220/ffffff?text=${encodeURIComponent(label)}`;
+
+function landingPage() {
+  let root = createEmptyPage();
+
+  const hero = createNode("hero");
+  hero.props.heading = "Build your next website in minutes";
+  hero.props.subheading = "A visual, drag-and-drop CMS with everything a modern site needs — no code required.";
+  hero.props.primaryButtonText = "Get Started";
+  hero.props.primaryButtonHref = "#";
+  hero.props.backgroundAnimationEnabled = true;
+  hero.style.minHeight = "480px";
+  root = insertNode(root, root.id, hero);
+
+  const stats = createNode("stats");
+  root = insertNode(root, root.id, stats);
+
+  const cardGrid = createNode("cardGrid");
+  cardGrid.props.heading = "Everything you need";
+  root = insertNode(root, root.id, cardGrid);
+
+  const testimonial = createNode("testimonial");
+  root = insertNode(root, root.id, testimonial);
+
+  const pricing = createNode("pricingTable");
+  root = insertNode(root, root.id, pricing);
+
+  const cta = createNode("cta");
+  root = insertNode(root, root.id, cta);
+
+  return root;
+}
+
+function aboutPage() {
+  let root = createEmptyPage();
+
+  const hero = createNode("imageBackgroundSection");
+  hero.props.heading = "About Us";
+  hero.props.subheading = "Learn about our mission, our story, and the people behind it.";
+  hero.style.backgroundImage = PLACEHOLDER("About");
+  hero.style.minHeight = "360px";
+  root = insertNode(root, root.id, hero);
+
+  const richText = createNode("richText");
+  richText.props.html =
+    "<h2>Our Story</h2><p>Replace this with your company's story — where you started, what you believe in, and where you're headed.</p>";
+  root = insertNode(root, root.id, richText);
+
+  const team = createNode("teamGrid");
+  root = insertNode(root, root.id, team);
+
+  const logoCloud = createNode("logoCloud");
+  logoCloud.props.heading = "Trusted by teams at";
+  root = insertNode(root, root.id, logoCloud);
+
+  return root;
+}
+
+function servicesPage() {
+  let root = createEmptyPage();
+
+  const hero = createNode("hero");
+  hero.props.heading = "Our Services";
+  hero.props.subheading = "What we offer, and how it helps you.";
+  root = insertNode(root, root.id, hero);
+
+  const cardGrid = createNode("cardGrid");
+  cardGrid.props.heading = "What we do";
+  root = insertNode(root, root.id, cardGrid);
+
+  const timeline = createNode("timeline");
+  timeline.props.heading = "How it works";
+  root = insertNode(root, root.id, timeline);
+
+  const accordion = createNode("accordion");
+  root = insertNode(root, root.id, accordion);
+
+  const cta = createNode("cta");
+  root = insertNode(root, root.id, cta);
+
+  return root;
+}
+
+function blogHomePage() {
+  let root = createEmptyPage();
+
+  const hero = createNode("richText");
+  hero.props.html = "<h1>Blog</h1><p>The latest updates, stories, and insights.</p>";
+  hero.style.textAlign = "center";
+  hero.style.paddingY = "64px";
+  root = insertNode(root, root.id, hero);
+
+  const list = createNode("collectionList");
+  list.props.collectionSlug = "blog";
+  root = insertNode(root, root.id, list);
+
+  return root;
+}
+
+function contactPage() {
+  let root = createEmptyPage();
+
+  const hero = createNode("richText");
+  hero.props.html = "<h1>Contact Us</h1><p>We'd love to hear from you.</p>";
+  hero.style.textAlign = "center";
+  hero.style.paddingY = "48px";
+  root = insertNode(root, root.id, hero);
+
+  const form = createNode("contactForm");
+  root = insertNode(root, root.id, form);
+
+  const map = createNode("mapEmbed");
+  root = insertNode(root, root.id, map);
+
+  return root;
+}
+
+const TEMPLATES: { name: string; category: string; build: () => ReturnType<typeof createEmptyPage> }[] = [
+  { name: "Landing Page", category: "Marketing", build: landingPage },
+  { name: "About Us", category: "Company", build: aboutPage },
+  { name: "Services", category: "Marketing", build: servicesPage },
+  { name: "Blog Home", category: "Content", build: blogHomePage },
+  { name: "Contact", category: "Company", build: contactPage },
+];
+
+async function main() {
+  for (const t of TEMPLATES) {
+    const existing = await prisma.pageTemplate.findFirst({ where: { name: t.name } });
+    if (existing) {
+      console.log(`Skipping "${t.name}" — already exists.`);
+      continue;
+    }
+    await prisma.pageTemplate.create({
+      data: { name: t.name, category: t.category, content: t.build() as object },
+    });
+    console.log(`Created template "${t.name}".`);
+  }
+}
+
+main()
+  .catch((err) => {
+    console.error(err);
+    process.exitCode = 1;
+  })
+  .finally(() => prisma.$disconnect());

package/template/apps/api/prisma/seed.ts

@@ -0,0 +1,191 @@
+import "dotenv/config";
+import bcrypt from "bcryptjs";
+import { PrismaClient } from "@prisma/client";
+import { createEmptyPage, createNode, insertNode } from "@pgcms/shared";
+import { seedAdvancedHomepage } from "./seed-homepage.ts";
+import { seedOurCharitiesPage } from "./seed-our-charities.ts";
+
+const prisma = new PrismaClient();
+
+const PLACEHOLDER = (label: string, size = "1200x630") =>
+  `https://placehold.co/${size}/0b1220/ffffff?text=${encodeURIComponent(label)}`;
+
+async function seedDemoCollections() {
+  const newsCollection = await prisma.collection.upsert({
+    where: { slug: "news" },
+    update: {},
+    create: { name: "News", slug: "news" },
+  });
+  const eventsCollection = await prisma.collection.upsert({
+    where: { slug: "events" },
+    update: {},
+    create: { name: "Events", slug: "events" },
+  });
+
+  const now = new Date();
+
+  function buildItemContent(title: string, subtitle: string) {
+    let root = createEmptyPage();
+    const hero = createNode("imageBackgroundSection");
+    hero.props.heading = title;
+    hero.props.subheading = subtitle;
+    hero.style.backgroundImage = PLACEHOLDER(title, "1600x700");
+    hero.style.minHeight = "420px";
+    root = insertNode(root, root.id, hero);
+    const body = createNode("richText");
+    body.props.html =
+      "<p>This is demo content generated by the seed script. Replace it using the page builder to publish your own articles, events, and resources.</p>" +
+      "<h3>What you'll get</h3><ul><li>Reusable sections and blocks</li><li>Performance-friendly motion</li><li>SEO fields and OpenGraph images</li></ul>";
+    root = insertNode(root, root.id, body);
+    return root;
+  }
+
+  const newsItems = [
+    {
+      slug: "record-fundraising-year",
+      title: "Federation Announces Record Fundraising Year",
+      excerpt:
+        "Member clubs raised more for our appeals in the last year than ever before.",
+    },
+    {
+      slug: "education-grant-opens",
+      title: "Education Grant Opens for New Applications",
+      excerpt:
+        "The Diamond Education Grant is now accepting applications for the next cohort.",
+    },
+    {
+      slug: "emergency-fund-response",
+      title: "Emergency Relief Fund Responds to Flooding",
+      excerpt:
+        "Rapid-response aid was distributed to affected communities within 72 hours.",
+    },
+  ];
+  for (const item of newsItems) {
+    await prisma.collectionItem.upsert({
+      where: {
+        collectionId_slug: { collectionId: newsCollection.id, slug: item.slug },
+      },
+      update: {
+        title: item.title,
+        excerpt: item.excerpt,
+        coverImage: PLACEHOLDER(item.title, "1200x630"),
+        content: buildItemContent(item.title, item.excerpt) as any,
+        status: "PUBLISHED",
+        publishedAt: now,
+        seoTitle: item.title,
+        seoDescription: item.excerpt,
+        ogImage: PLACEHOLDER(item.title, "1200x630"),
+      },
+      create: {
+        collectionId: newsCollection.id,
+        slug: item.slug,
+        title: item.title,
+        excerpt: item.excerpt,
+        coverImage: PLACEHOLDER(item.title, "1200x630"),
+        content: buildItemContent(item.title, item.excerpt) as any,
+        status: "PUBLISHED",
+        publishedAt: now,
+        seoTitle: item.title,
+        seoDescription: item.excerpt,
+        ogImage: PLACEHOLDER(item.title, "1200x630"),
+      },
+    });
+  }
+
+  const eventItems = [
+    {
+      slug: "global-convention-2026",
+      title: "Global Convention 2026",
+      excerpt: "Three days of workshops, speakers, and member-led sessions.",
+    },
+    {
+      slug: "regional-leadership-summit",
+      title: "Regional Leadership Summit",
+      excerpt: "Skill-building sessions for club leaders and new members.",
+    },
+    {
+      slug: "community-action-week",
+      title: "Community Action Week",
+      excerpt:
+        "A coordinated week of grassroots projects across local clubs worldwide.",
+    },
+  ];
+  for (const item of eventItems) {
+    await prisma.collectionItem.upsert({
+      where: {
+        collectionId_slug: {
+          collectionId: eventsCollection.id,
+          slug: item.slug,
+        },
+      },
+      update: {
+        title: item.title,
+        excerpt: item.excerpt,
+        coverImage: PLACEHOLDER(item.title, "1200x630"),
+        content: buildItemContent(item.title, item.excerpt) as any,
+        status: "PUBLISHED",
+        publishedAt: now,
+        seoTitle: item.title,
+        seoDescription: item.excerpt,
+        ogImage: PLACEHOLDER(item.title, "1200x630"),
+      },
+      create: {
+        collectionId: eventsCollection.id,
+        slug: item.slug,
+        title: item.title,
+        excerpt: item.excerpt,
+        coverImage: PLACEHOLDER(item.title, "1200x630"),
+        content: buildItemContent(item.title, item.excerpt) as any,
+        status: "PUBLISHED",
+        publishedAt: now,
+        seoTitle: item.title,
+        seoDescription: item.excerpt,
+        ogImage: PLACEHOLDER(item.title, "1200x630"),
+      },
+    });
+  }
+}
+
+async function main() {
+  const email = process.env.SEED_ADMIN_EMAIL ?? "admin@example.com";
+  const password = process.env.SEED_ADMIN_PASSWORD ?? "ChangeMe123!";
+
+  const existingAdmin = await prisma.user.findUnique({ where: { email } });
+  if (!existingAdmin) {
+    const passwordHash = await bcrypt.hash(password, 10);
+    await prisma.user.create({ data: { email, passwordHash, role: "ADMIN" } });
+    console.log(`Seeded admin user: ${email}`);
+  } else {
+    console.log(`Admin user already exists: ${email}`);
+  }
+
+  const themeCount = await prisma.siteTheme.count();
+  if (themeCount === 0) {
+    await prisma.siteTheme.create({
+      data: {
+        siteName: "Global Impact Alliance",
+        primaryColor: "#f97316",
+        secondaryColor: "#0b1220",
+        backgroundColor: "#ffffff",
+        textColor: "#111827",
+        headingFont: "Poppins",
+        bodyFont: "Inter",
+        logoUrl: "https://placehold.co/180x48/ffffff/0b1220?text=Global+Impact",
+        faviconUrl: "https://placehold.co/64x64/f97316/0b1220?text=G",
+      },
+    });
+  }
+
+  await seedDemoCollections();
+  await seedAdvancedHomepage(prisma);
+  await seedOurCharitiesPage(prisma);
+}
+
+main()
+  .catch((err) => {
+    console.error(err);
+    process.exit(1);
+  })
+  .finally(async () => {
+    await prisma.$disconnect();
+  });

package/template/apps/api/src/env.ts

@@ -0,0 +1,61 @@
+import "dotenv/config";
+
+function required(name: string): string {
+  const value = process.env[name];
+  if (!value) throw new Error(`Missing required env var: ${name}`);
+  return value;
+}
+
+export type StorageProviderName = "s3" | "azure" | "cloudinary";
+
+// Defaults to "s3" so every install that predates this setting (no STORAGE_PROVIDER in
+// its .env) keeps behaving exactly as before, unchanged.
+const storageProvider = (process.env.STORAGE_PROVIDER || "s3") as StorageProviderName;
+
+function s3Config() {
+  return {
+    endpoint: required("S3_ENDPOINT"),
+    region: process.env.S3_REGION ?? "us-east-1",
+    accessKeyId: required("S3_ACCESS_KEY_ID"),
+    secretAccessKey: required("S3_SECRET_ACCESS_KEY"),
+    bucket: required("S3_BUCKET"),
+    forcePathStyle: process.env.S3_FORCE_PATH_STYLE !== "false",
+    publicUrl: required("S3_PUBLIC_URL"),
+  };
+}
+
+function azureConfig() {
+  return {
+    connectionString: required("AZURE_STORAGE_CONNECTION_STRING"),
+    container: required("AZURE_STORAGE_CONTAINER"),
+    // Optional — set when serving through a CDN/custom domain instead of the storage
+    // account's own blob endpoint. Unset falls back to the blob client's own .url.
+    publicUrl: process.env.AZURE_STORAGE_PUBLIC_URL,
+  };
+}
+
+function cloudinaryConfig() {
+  return {
+    cloudName: required("CLOUDINARY_CLOUD_NAME"),
+    apiKey: required("CLOUDINARY_API_KEY"),
+    apiSecret: required("CLOUDINARY_API_SECRET"),
+    folder: process.env.CLOUDINARY_FOLDER || "pgcms",
+  };
+}
+
+export const env = {
+  port: Number(process.env.API_PORT ?? 4000),
+  webOrigin: process.env.WEB_ORIGIN ?? "http://localhost:3000",
+  jwtSecret: required("JWT_SECRET"),
+  jwtExpiresIn: process.env.JWT_EXPIRES_IN ?? "7d",
+  cookieName: process.env.COOKIE_NAME ?? "pgcms_token",
+  // Only the selected provider's vars are actually required — an S3 install is never
+  // forced to set Azure/Cloudinary credentials, and vice versa (see lib/storage/).
+  storageProvider,
+  s3: storageProvider === "s3" ? s3Config() : undefined,
+  azure: storageProvider === "azure" ? azureConfig() : undefined,
+  cloudinary: storageProvider === "cloudinary" ? cloudinaryConfig() : undefined,
+  formsWebhookUrl: process.env.FORMS_WEBHOOK_URL,
+  revalidateUrl: process.env.REVALIDATE_URL,
+  revalidateSecret: process.env.REVALIDATE_SECRET,
+};