Merge pull request #1152 from CodeForAfrica/fix/trustlab_project_setup

Improve `@/trustlab` Project Setup

Author: kilemensi

apps/trustlab/next.config.mjs

@@ -8,10 +8,21 @@ const outputFileTracingRoot = PROJECT_ROOT
 
 /** @type {import('next').NextConfig} */
 const nextConfig = {
-  transpilePackages: ["@commons-ui/core", "@commons-ui/next"],
-  reactStrictMode: true,
+  images: {
+    domains: process.env.NEXT_PUBLIC_IMAGE_DOMAINS?.split(",")
+      .map((d) => d.trim())
+      .filter(Boolean),
+    unoptimized:
+      process.env.NEXT_PUBLIC_IMAGE_UNOPTIMIZED?.trim()?.toLowerCase() ===
+      "true",
+  },
   output: "standalone",
   outputFileTracingRoot,
+  // TODO(kilemensi): There is an upstream bug on this @ https://github.com/vercel/next.js/issues/51478
+  //                  `js`, `ts`, `tsx` are just to make sure there is more than one item;
+  //                  we SHOULDN'T use them in pages router!
+  pageExtensions: ["page.js", "js", "ts", "tsx"],
+  reactStrictMode: true,
   webpack: (config) => {
     config.module.rules.push(
       {
@@ -29,14 +40,7 @@ const nextConfig = {
     config.experiments = { ...config.experiments, topLevelAwait: true };
     return config;
   },
-  images: {
-    domains: process.env.NEXT_PUBLIC_IMAGE_DOMAINS?.split(",")
-      ?.map((d) => d.trim())
-      ?.filter((d) => d),
-    unoptimized:
-      process.env.NEXT_PUBLIC_IMAGE_UNOPTIMIZED?.trim()?.toLowerCase() ===
-      "true",
-  },
+  transpilePackages: ["@commons-ui/core", "@commons-ui/next"],
 };
 
 export default withPayload(nextConfig);

apps/trustlab/package.json

@@ -19,16 +19,17 @@
     "@commons-ui/payload": "workspace:*",
     "@mui/utils": "catalog:",
     "@next/third-parties": "catalog:",
-    "@payloadcms/db-sqlite": "catalog:payload-v3",
     "@payloadcms/db-mongodb": "catalog:payload-v3",
+    "@payloadcms/email-nodemailer": "catalog:payload-v3",
     "@payloadcms/next": "catalog:payload-v3",
     "@payloadcms/plugin-cloud-storage": "catalog:payload-v3",
-    "@payloadcms/richtext-lexical": "catalog:payload-v3",
-    "@payloadcms/storage-s3": "catalog:payload-v3",
     "@payloadcms/plugin-seo": "catalog:payload-v3",
     "@payloadcms/plugin-nested-docs": "catalog:payload-v3",
+    "@payloadcms/richtext-lexical": "catalog:payload-v3",
+    "@payloadcms/storage-s3": "catalog:payload-v3",
     "@payloadcms/ui": "catalog:payload-v3",
     "cross-env": "catalog:",
+    "graphql": "catalog:payload-v3",
     "next": "catalog:",
     "next-seo": "catalog:",
     "payload": "catalog:payload-v3",

apps/trustlab/payload.config.ts

@@ -1,6 +1,7 @@
 import sharp from "sharp";
 import { lexicalEditor } from "@payloadcms/richtext-lexical";
 import { mongooseAdapter } from "@payloadcms/db-mongodb";
+import { nodemailerAdapter } from "@payloadcms/email-nodemailer";
 import { buildConfig, CollectionConfig, GlobalConfig } from "payload";
 import path from "path";
 import { fileURLToPath } from "url";
@@ -23,9 +24,27 @@ const csrf =
     ?.map((d) => d.trim())
     ?.filter(Boolean) ?? [];
 
+let email = nodemailerAdapter();
+if (process.env.SMTP_HOST && process.env.SMTP_PASS) {
+  const smtpPort = Number(process.env.SMTP_PORT) || 587;
+  email = nodemailerAdapter({
+    defaultFromAddress:
+      process.env.SMTP_FROM_ADDRESS || "[email protected]",
+    defaultFromName: process.env.SENDGRID_FROM_NAME || "TrustLab CMS",
+    // Any Nodemailer transport can be used
+    transportOptions: {
+      host: process.env.SMTP_HOST,
+      port: smtpPort,
+      secure: smtpPort === 465, // true for port 465, false (the default) for others
+      auth: {
+        user: process.env.SMTP_USER || "apikey",
+        pass: process.env.SMTP_PASS,
+      },
+    },
+  });
+}
+
 export default buildConfig({
-  serverURL: process.env.NEXT_PUBLIC_APP_URL,
-  editor: lexicalEditor(),
   admin: {
     importMap: {
       baseDir: path.resolve(dirname),
@@ -34,6 +53,11 @@ export default buildConfig({
   collections: [Pages, Media, Users] as CollectionConfig[],
   cors,
   csrf,
+  db: mongooseAdapter({
+    url: process.env.MONGO_URL || "",
+  }),
+  email,
+  editor: lexicalEditor(),
   globals: [SiteSettings] as GlobalConfig[],
   ...(locales?.length
     ? {
@@ -44,14 +68,11 @@ export default buildConfig({
         },
       }
     : undefined),
+  plugins: [...plugins],
   secret: process.env.PAYLOAD_SECRET || "",
-  db: mongooseAdapter({
-    url: process.env.MONGO_URL || "",
-  }),
+  serverURL: process.env.NEXT_PUBLIC_APP_URL,
+  sharp,
   typescript: {
     outputFile: path.resolve(dirname, "payload-types.ts"),
   },
-  plugins: [...plugins],
-
-  sharp,
 });

apps/trustlab/src/lib/payload/index.js

@@ -1,4 +1,8 @@
-import payload from "payload";
+import { getPayload } from "payload";
+
+import config from "@payload-config";
+
+const payload = await getPayload({ config });
 
 async function findPage(slug, options) {
   return payload.find({

apps/trustlab/src/payload/utils/locales.js

@@ -1,5 +1,5 @@
 export const locales = process.env.NEXT_PUBLIC_LOCALES?.split(",")
-  ?.map((l) => l.trim())
+  .map((l) => l.trim())
   .filter(Boolean) || ["en"];
 export const defaultLocale =
-  process.env.NEXT_PUBLIC_LOCALES?.trim() || locales?.[0];
+  process.env.NEXT_PUBLIC_DEFAULT_LOCALE?.trim() || locales?.[0];

apps/trustlab/turbo.json

@@ -2,7 +2,6 @@
   "extends": ["//"],
   "tasks": {
     "build": {
-      "dependsOn": ["^build(.*)"],
       "env": [
         "S3_BUCKET",
         "S3_REGION",