Migrate payload version 2

.gitignore

@@ -51,4 +51,6 @@ apps/promisetracker/public/data/**
 !apps/promisetracker/public/data/README.md
 
 # Storybook
-storybook-static
+storybook-static
+
+mongo-keyfile

Makefile

@@ -0,0 +1,14 @@
+# Makefile
+
+.PHONY: charterafrica mongodb mongodb-keyfile
+
+charterafrica:
+	docker compose --env-file apps/charterafrica/.env.local up charterafrica --build -d
+
+mongodb:
+	docker compose --env-file apps/charterafrica/.env.local up --wait mongodb
+
+mongodb-keyfile:
+	openssl rand -base64 741 > ./mongo-keyfile
+	chmod 600 ./mongo-keyfile
+

apps/charterafrica/.env

@@ -4,5 +4,5 @@ NEXT_PUBLIC_SEO_DISABLED=true
 
 PAYLOAD_PUBLIC_LOCALES="en, fr, pt"
 PAYLOAD_PUBLIC_DEFAULT_LOCALE=en
-
+MIGRATIONS_DIR=./migrations
 SENTRY_ENV=local

apps/charterafrica/README.md

@@ -16,7 +16,23 @@ and modify the `.env.local` file according to your needs.
 
 The default `.env` file is for the publicly visible environment variables.
 **DO NOT** include any secrets in it. All secrets should go into `env.local`.
-For more, see <<nextjs env var docs>>
+For more, see NextJS env var docs [here](https://nextjs.org/docs/basic-features/environment-variables).
+
+## Database setup
+
+Generate a new MongoDB keyfile by running the following command:
+NB: Run this command on the root directory
+
+```bash
+make mongodb-keyfile
+```
+
+Start the database server:
+NB: Run this command on the root directory
+
+```bash
+make mongodb
+```
 
 Then run the development server:
 

apps/charterafrica/migrations/20240111_075951_update_blocks_rename_collection_to_items.ts

@@ -0,0 +1,36 @@
+import { MigrateUpArgs, MigrateDownArgs } from "@payloadcms/db-mongodb";
+
+export async function up({ payload }: MigrateUpArgs): Promise<void> {
+  const { db } = payload;
+  const collection = db.collections["pages"];
+  const result = await collection.updateMany(
+    { "blocks.collection": { $exists: true } },
+    {
+      $set: {
+        "blocks.$.items": "$blocks.$.collection",
+      },
+      $unset: {
+        "blocks.$.collection": "",
+      },
+    },
+  );
+
+  console.log(`${result.modifiedCount} documents updated.`);
+}
+
+export async function down({ payload }: MigrateDownArgs): Promise<void> {
+  const { db } = payload;
+  const collection = db.collections["pages"];
+  const result = await collection.updateMany(
+    { "blocks.items": { $exists: true } },
+    {
+      $set: {
+        "blocks.$.collection": "$blocks.$.items",
+      },
+      $unset: {
+        "blocks.$.items": "",
+      },
+    },
+  );
+  console.log(`${result.modifiedCount} documents updated.`);
+}

apps/charterafrica/migrations/20240118_131136_versions_v1_v2.ts

@@ -0,0 +1,103 @@
+import { MigrateUpArgs, MigrateDownArgs } from "@payloadcms/db-mongodb";
+
+export async function up({ payload }: MigrateUpArgs): Promise<void> {
+  async function migrateCollectionDocs(slug: string, docsAtATime = 100) {
+    const VersionsModel = payload.db.versions[slug];
+    const remainingDocs = await VersionsModel.aggregate(
+      [
+        // Sort so that newest are first
+        {
+          $sort: {
+            updatedAt: -1,
+          },
+        },
+        // Group by parent ID
+        // take the $first of each
+        {
+          $group: {
+            _id: "$parent",
+            _versionID: { $first: "$_id" },
+            createdAt: { $first: "$createdAt" },
+            latest: { $first: "$latest" },
+            updatedAt: { $first: "$updatedAt" },
+            version: { $first: "$version" },
+          },
+        },
+        {
+          $match: {
+            latest: { $eq: null },
+          },
+        },
+        {
+          $limit: docsAtATime,
+        },
+      ],
+      {
+        allowDiskUse: true,
+      },
+    ).exec();
+
+    if (!remainingDocs || remainingDocs.length === 0) {
+      const newVersions = await VersionsModel.find({
+        latest: {
+          $eq: true,
+        },
+      });
+
+      if (newVersions?.length) {
+        payload.logger.info(
+          `Migrated ${newVersions.length} documents in the "${slug}" versions collection.`,
+        );
+      }
+
+      return;
+    }
+
+    const remainingDocIds = remainingDocs.map((doc) => doc._versionID);
+
+    await VersionsModel.updateMany(
+      {
+        _id: {
+          $in: remainingDocIds,
+        },
+      },
+      {
+        latest: true,
+      },
+    );
+
+    await migrateCollectionDocs(slug);
+  }
+
+  // For each collection
+  await Promise.all(
+    payload.config.collections.map(async ({ slug, versions }) => {
+      if (versions?.drafts) {
+        return migrateCollectionDocs(slug);
+      }
+    }),
+  );
+
+  // For each global
+  await Promise.all(
+    payload.config.globals.map(async ({ slug, versions }) => {
+      if (versions) {
+        const VersionsModel = payload.db.versions[slug];
+
+        await VersionsModel.findOneAndUpdate(
+          {},
+          { latest: true },
+          {
+            sort: { updatedAt: -1 },
+          },
+        ).exec();
+
+        payload.logger.info(`Migrated the "${slug}" global.`);
+      }
+    }),
+  );
+}
+
+export async function down({ payload }: MigrateDownArgs): Promise<void> {
+  // Migration code
+}

apps/charterafrica/package.json

@@ -51,9 +51,12 @@
     "@nivo/pie": "^0.84.0",
     "@nivo/tooltip": "^0.84.0",
     "@nivo/waffle": "^0.84.0",
-    "@payloadcms/plugin-cloud-storage": "^1.1.1",
-    "@payloadcms/plugin-nested-docs": "^1.0.9",
-    "@payloadcms/plugin-seo": "^1.0.15",
+    "@payloadcms/bundler-webpack": "^1.0.6",
+    "@payloadcms/db-mongodb": "^1.4.0",
+    "@payloadcms/plugin-cloud-storage": "^1.1.2",
+    "@payloadcms/plugin-nested-docs": "^1.0.11",
+    "@payloadcms/plugin-seo": "^2.2.0",
+    "@payloadcms/richtext-slate": "^1.4.0",
     "@react-spring/web": "^9.7.3",
     "@sentry/nextjs": "^7.86.0",
     "airtable": "^0.12.2",
@@ -65,7 +68,7 @@
     "next": "^14.0.4",
     "next-seo": "^6.4.0",
     "nodemailer-sendgrid": "^1.0.3",
-    "payload": "^1.15.8",
+    "payload": "^2.9.0",
     "prop-types": "^15.8.1",
     "qs": "^6.11.2",
     "react": "^18.2.0",
@@ -74,7 +77,7 @@
     "react-share": "^5.0.3",
     "react-swipeable-views-react-18-fix": "^0.14.1",
     "scheduler": "^0.23.0",
-    "sharp": "^0.33.0",
+    "sharp": "^0.33.2",
     "slate": "^0.101.1",
     "swr": "^2.2.4",
     "video.js": "^8.6.1",

apps/charterafrica/payload.config.ts

@@ -6,6 +6,9 @@ import nestedDocs from "@payloadcms/plugin-nested-docs";
 import seo from "@payloadcms/plugin-seo";
 import dotenv from "dotenv";
 import { buildConfig } from "payload/config";
+import { slateEditor } from "@payloadcms/richtext-slate";
+import { mongooseAdapter } from "@payloadcms/db-mongodb";
+import { webpackBundler } from "@payloadcms/bundler-webpack";
 
 import Authors from "./src/payload/collections/Authors";
 import CommunityPlatforms from "./src/payload/collections/CommunityPlatforms";
@@ -73,6 +76,14 @@ const adapter = s3Adapter({
 
 export default buildConfig({
   serverURL: appURL,
+  editor: slateEditor({}),
+  routes: {
+    admin: "/admin",
+  },
+  db: mongooseAdapter({
+    url: process.env.MONGO_URL,
+    migrationDir: process.env.MIGRATIONS_DIR,
+  }),
   collections: [
     Authors,
     CommunityPlatforms,
@@ -110,6 +121,7 @@ export default buildConfig({
         },
       }
     : undefined),
+
   admin: {
     webpack: (config) => ({
       ...config,
@@ -123,6 +135,7 @@ export default buildConfig({
         },
       },
     }),
+    bundler: webpackBundler(),
   },
   cors,
   csrf,
@@ -170,7 +183,7 @@ export default buildConfig({
       generateTitle: ({ doc }: any) => doc?.title?.value as string,
       generateURL: ({ doc, locale }: any) =>
         doc?.slug?.value ? `${appURL}/${locale}/${doc.slug.value}` : undefined,
-    } as any),
+    }),
     nestedDocs({
       collections: ["pages"],
       generateLabel: (_, doc) => doc.title as string,

apps/charterafrica/server.ts

@@ -48,7 +48,6 @@ const start = async (): Promise<void> => {
           }
         : undefined),
       secret: process.env.PAYLOAD_SECRET_KEY,
-      mongoURL: process.env.MONGO_URL,
       express: server,
       onInit: (initPayload) => {
         initPayload.logger.info(

apps/charterafrica/src/payload/blocks/DemocracyHelpdeskPageContent.js

@@ -1,3 +1,5 @@
+import { slateEditor } from "@payloadcms/richtext-slate";
+
 import linkGroup from "../fields/linkGroup";
 import richText from "../fields/richText";
 
@@ -11,10 +13,22 @@ const HelpdeskPageContent = {
         fr: "La description",
         pt: "Descrição",
       },
-      admin: {
-        elements: ["h2", "h3", "h4", "h5", "h6", "link", "ol", "ul", "indent"],
-        leaves: ["bold", "code", "italic", "strikethrough", "underline"],
-      },
+      editor: slateEditor({
+        admin: {
+          elements: [
+            "h2",
+            "h3",
+            "h4",
+            "h5",
+            "h6",
+            "link",
+            "ol",
+            "ul",
+            "indent",
+          ],
+          leaves: ["bold", "code", "italic", "strikethrough", "underline"],
+        },
+      }),
       localized: true,
     }),
     linkGroup(),