payload is working! must use webpack

.env.example

@@ -2,6 +2,7 @@
 # Keep this file up-to-date when you add new variables to \`.env\`.
 # This file will be committed to version control, so make sure not to have any secrets in it.
 # If you are cloning this repo, create a copy of this file named `.env` and populate it with your secrets.
+
 ## Next.js ##
 NODE_ENV=
 SENTRY_AUTH_TOKEN=
@@ -12,6 +13,9 @@ NEXT_PUBLIC_SENTRY_DSN=
 NEXT_PUBLIC_SENTRY_URL=https://sentry.example.com
 NEXT_PUBLIC_SENTRY_ORG=sentry
 NEXT_PUBLIC_SENTRY_PROJECT_NAME=example
+## Payload CMS ##
+PAYLOAD_SECRET=
+PAYLOAD_DB_URL=
 
 ## Convex ##
 CONVEX_SELF_HOSTED_URL=https://api.convex.example.com # convex-backend:3210

apps/next/next.config.js

@@ -1,6 +1,7 @@
-import { withSentryConfig } from '@sentry/nextjs';
 import { createJiti } from 'jiti';
 import { withPlausibleProxy } from 'next-plausible';
+import { withSentryConfig } from '@sentry/nextjs';
+import { withPayload } from '@payloadcms/next/withPayload';
 
 const jiti = createJiti(import.meta.url);
 await jiti.import('./src/env');
@@ -54,4 +55,4 @@ const sentryConfig = {
     enabled: true,
   },
 };
-export default withSentryConfig(config, sentryConfig);
+export default withSentryConfig(withPayload(config), sentryConfig);

apps/next/package.json

@@ -9,6 +9,7 @@
     "clean": "git clean -xdf .cache .next .turbo node_modules",
     "dev": "bun with-env next dev --turbo",
     "dev:tunnel": "bun with-env next dev --turbo",
+    "dev:web": "bun with-env next dev --webpack",
     "format": "prettier --check . --ignore-path ../../.gitignore",
     "lint": "eslint --flag unstable_native_nodejs_ts_config",
     "start": "bun with-env next start",
@@ -19,11 +20,15 @@
     "@convex-dev/auth": "catalog:convex",
     "@gib/backend": "workspace:*",
     "@gib/ui": "workspace:*",
+    "@payloadcms/db-postgres": "^3.80.0",
+    "@payloadcms/next": "^3.80.0",
+    "@payloadcms/richtext-lexical": "^3.80.0",
     "@sentry/nextjs": "^10.43.0",
     "@t3-oss/env-nextjs": "^0.13.10",
     "convex": "catalog:convex",
     "next": "^16.1.7",
     "next-plausible": "^3.12.5",
+    "payload": "^3.80.0",
     "react": "catalog:react19",
     "react-dom": "catalog:react19",
     "require-in-the-middle": "^7.5.2",

apps/next/payload-types.ts

@@ -0,0 +1,295 @@
+/* tslint:disable */
+/* eslint-disable */
+/**
+ * This file was automatically generated by Payload.
+ * DO NOT MODIFY IT BY HAND. Instead, modify your source Payload config,
+ * and re-run `payload generate:types` to regenerate this file.
+ */
+
+/**
+ * Supported timezones in IANA format.
+ *
+ * This interface was referenced by `Config`'s JSON-Schema
+ * via the `definition` "supportedTimezones".
+ */
+export type SupportedTimezones =
+  | 'Pacific/Midway'
+  | 'Pacific/Niue'
+  | 'Pacific/Honolulu'
+  | 'Pacific/Rarotonga'
+  | 'America/Anchorage'
+  | 'Pacific/Gambier'
+  | 'America/Los_Angeles'
+  | 'America/Tijuana'
+  | 'America/Denver'
+  | 'America/Phoenix'
+  | 'America/Chicago'
+  | 'America/Guatemala'
+  | 'America/New_York'
+  | 'America/Bogota'
+  | 'America/Caracas'
+  | 'America/Santiago'
+  | 'America/Buenos_Aires'
+  | 'America/Sao_Paulo'
+  | 'Atlantic/South_Georgia'
+  | 'Atlantic/Azores'
+  | 'Atlantic/Cape_Verde'
+  | 'Europe/London'
+  | 'Europe/Berlin'
+  | 'Africa/Lagos'
+  | 'Europe/Athens'
+  | 'Africa/Cairo'
+  | 'Europe/Moscow'
+  | 'Asia/Riyadh'
+  | 'Asia/Dubai'
+  | 'Asia/Baku'
+  | 'Asia/Karachi'
+  | 'Asia/Tashkent'
+  | 'Asia/Calcutta'
+  | 'Asia/Dhaka'
+  | 'Asia/Almaty'
+  | 'Asia/Jakarta'
+  | 'Asia/Bangkok'
+  | 'Asia/Shanghai'
+  | 'Asia/Singapore'
+  | 'Asia/Tokyo'
+  | 'Asia/Seoul'
+  | 'Australia/Brisbane'
+  | 'Australia/Sydney'
+  | 'Pacific/Guam'
+  | 'Pacific/Noumea'
+  | 'Pacific/Auckland'
+  | 'Pacific/Fiji';
+
+export interface Config {
+  auth: {
+    users: UserAuthOperations;
+  };
+  blocks: {};
+  collections: {
+    'payload-kv': PayloadKv;
+    users: User;
+    'payload-locked-documents': PayloadLockedDocument;
+    'payload-preferences': PayloadPreference;
+    'payload-migrations': PayloadMigration;
+  };
+  collectionsJoins: {};
+  collectionsSelect: {
+    'payload-kv': PayloadKvSelect<false> | PayloadKvSelect<true>;
+    users: UsersSelect<false> | UsersSelect<true>;
+    'payload-locked-documents': PayloadLockedDocumentsSelect<false> | PayloadLockedDocumentsSelect<true>;
+    'payload-preferences': PayloadPreferencesSelect<false> | PayloadPreferencesSelect<true>;
+    'payload-migrations': PayloadMigrationsSelect<false> | PayloadMigrationsSelect<true>;
+  };
+  db: {
+    defaultIDType: number;
+  };
+  fallbackLocale: null;
+  globals: {};
+  globalsSelect: {};
+  locale: null;
+  widgets: {
+    collections: CollectionsWidget;
+  };
+  user: User;
+  jobs: {
+    tasks: unknown;
+    workflows: unknown;
+  };
+}
+export interface UserAuthOperations {
+  forgotPassword: {
+    email: string;
+    password: string;
+  };
+  login: {
+    email: string;
+    password: string;
+  };
+  registerFirstUser: {
+    email: string;
+    password: string;
+  };
+  unlock: {
+    email: string;
+    password: string;
+  };
+}
+/**
+ * This interface was referenced by `Config`'s JSON-Schema
+ * via the `definition` "payload-kv".
+ */
+export interface PayloadKv {
+  id: number;
+  key: string;
+  data:
+    | {
+        [k: string]: unknown;
+      }
+    | unknown[]
+    | string
+    | number
+    | boolean
+    | null;
+}
+/**
+ * This interface was referenced by `Config`'s JSON-Schema
+ * via the `definition` "users".
+ */
+export interface User {
+  id: number;
+  updatedAt: string;
+  createdAt: string;
+  email: string;
+  resetPasswordToken?: string | null;
+  resetPasswordExpiration?: string | null;
+  salt?: string | null;
+  hash?: string | null;
+  loginAttempts?: number | null;
+  lockUntil?: string | null;
+  sessions?:
+    | {
+        id: string;
+        createdAt?: string | null;
+        expiresAt: string;
+      }[]
+    | null;
+  password?: string | null;
+  collection: 'users';
+}
+/**
+ * This interface was referenced by `Config`'s JSON-Schema
+ * via the `definition` "payload-locked-documents".
+ */
+export interface PayloadLockedDocument {
+  id: number;
+  document?: {
+    relationTo: 'users';
+    value: number | User;
+  } | null;
+  globalSlug?: string | null;
+  user: {
+    relationTo: 'users';
+    value: number | User;
+  };
+  updatedAt: string;
+  createdAt: string;
+}
+/**
+ * This interface was referenced by `Config`'s JSON-Schema
+ * via the `definition` "payload-preferences".
+ */
+export interface PayloadPreference {
+  id: number;
+  user: {
+    relationTo: 'users';
+    value: number | User;
+  };
+  key?: string | null;
+  value?:
+    | {
+        [k: string]: unknown;
+      }
+    | unknown[]
+    | string
+    | number
+    | boolean
+    | null;
+  updatedAt: string;
+  createdAt: string;
+}
+/**
+ * This interface was referenced by `Config`'s JSON-Schema
+ * via the `definition` "payload-migrations".
+ */
+export interface PayloadMigration {
+  id: number;
+  name?: string | null;
+  batch?: number | null;
+  updatedAt: string;
+  createdAt: string;
+}
+/**
+ * This interface was referenced by `Config`'s JSON-Schema
+ * via the `definition` "payload-kv_select".
+ */
+export interface PayloadKvSelect<T extends boolean = true> {
+  key?: T;
+  data?: T;
+}
+/**
+ * This interface was referenced by `Config`'s JSON-Schema
+ * via the `definition` "users_select".
+ */
+export interface UsersSelect<T extends boolean = true> {
+  updatedAt?: T;
+  createdAt?: T;
+  email?: T;
+  resetPasswordToken?: T;
+  resetPasswordExpiration?: T;
+  salt?: T;
+  hash?: T;
+  loginAttempts?: T;
+  lockUntil?: T;
+  sessions?:
+    | T
+    | {
+        id?: T;
+        createdAt?: T;
+        expiresAt?: T;
+      };
+}
+/**
+ * This interface was referenced by `Config`'s JSON-Schema
+ * via the `definition` "payload-locked-documents_select".
+ */
+export interface PayloadLockedDocumentsSelect<T extends boolean = true> {
+  document?: T;
+  globalSlug?: T;
+  user?: T;
+  updatedAt?: T;
+  createdAt?: T;
+}
+/**
+ * This interface was referenced by `Config`'s JSON-Schema
+ * via the `definition` "payload-preferences_select".
+ */
+export interface PayloadPreferencesSelect<T extends boolean = true> {
+  user?: T;
+  key?: T;
+  value?: T;
+  updatedAt?: T;
+  createdAt?: T;
+}
+/**
+ * This interface was referenced by `Config`'s JSON-Schema
+ * via the `definition` "payload-migrations_select".
+ */
+export interface PayloadMigrationsSelect<T extends boolean = true> {
+  name?: T;
+  batch?: T;
+  updatedAt?: T;
+  createdAt?: T;
+}
+/**
+ * This interface was referenced by `Config`'s JSON-Schema
+ * via the `definition` "collections_widget".
+ */
+export interface CollectionsWidget {
+  data?: {
+    [k: string]: unknown;
+  };
+  width: 'full';
+}
+/**
+ * This interface was referenced by `Config`'s JSON-Schema
+ * via the `definition` "auth".
+ */
+export interface Auth {
+  [k: string]: unknown;
+}
+
+
+declare module 'payload' {
+  export interface GeneratedTypes extends Config {}
+}

apps/next/src/app/(frontend)/layout.tsx

@@ -2,7 +2,7 @@ import type { Metadata, Viewport } from 'next';
 import { Geist, Geist_Mono } from 'next/font/google';
 import { env } from '@/env';
 
-import '@/app/styles.css';
+import '@/app/(frontend)/styles.css';
 
 import Footer from '@/components/layout/footer';
 import Header from '@/components/layout/header';

apps/next/src/app/(frontend)/styles.css

@@ -2,7 +2,7 @@
 @import 'tw-animate-css';
 @import '@gib/tailwind-config/theme';
 
-@source '../../../../packages/ui/src/*.{ts,tsx}';
+@source '../../../../../packages/ui/src/*.{ts,tsx}';
 
 @custom-variant dark (&:where(.dark, .dark *));
 @custom-variant light (&:where(.light, .light *));

apps/next/src/app/(payload)/admin/[[...segments]]/not-found.tsx

@@ -0,0 +1,24 @@
+/* THIS FILE WAS GENERATED AUTOMATICALLY BY PAYLOAD. */
+/* DO NOT MODIFY IT BECAUSE IT COULD BE REWRITTEN AT ANY TIME. */
+import type { Metadata } from 'next'
+
+import config from '@payload-config'
+import { NotFoundPage, generatePageMetadata } from '@payloadcms/next/views'
+import { importMap } from '../importMap'
+
+type Args = {
+  params: Promise<{
+    segments: string[]
+  }>
+  searchParams: Promise<{
+    [key: string]: string | string[]
+  }>
+}
+
+export const generateMetadata = ({ params, searchParams }: Args): Promise<Metadata> =>
+  generatePageMetadata({ config, params, searchParams })
+
+const NotFound = ({ params, searchParams }: Args) =>
+  NotFoundPage({ config, params, searchParams, importMap })
+
+export default NotFound

apps/next/src/app/(payload)/admin/[[...segments]]/page.tsx

@@ -0,0 +1,24 @@
+/* THIS FILE WAS GENERATED AUTOMATICALLY BY PAYLOAD. */
+/* DO NOT MODIFY IT BECAUSE IT COULD BE REWRITTEN AT ANY TIME. */
+import type { Metadata } from 'next'
+
+import config from '@payload-config'
+import { RootPage, generatePageMetadata } from '@payloadcms/next/views'
+import { importMap } from '../importMap'
+
+type Args = {
+  params: Promise<{
+    segments: string[]
+  }>
+  searchParams: Promise<{
+    [key: string]: string | string[]
+  }>
+}
+
+export const generateMetadata = ({ params, searchParams }: Args): Promise<Metadata> =>
+  generatePageMetadata({ config, params, searchParams })
+
+const Page = ({ params, searchParams }: Args) =>
+  RootPage({ config, params, searchParams, importMap })
+
+export default Page

apps/next/src/app/(payload)/admin/importMap.js

@@ -0,0 +1,5 @@
+import { CollectionCards as CollectionCards_f9c02e79a4aed9a3924487c0cd4cafb1 } from '@payloadcms/next/rsc'
+
+export const importMap = {
+  "@payloadcms/next/rsc#CollectionCards": CollectionCards_f9c02e79a4aed9a3924487c0cd4cafb1
+}

apps/next/src/app/(payload)/api/[...slug]/route.ts

@@ -0,0 +1,19 @@
+/* THIS FILE WAS GENERATED AUTOMATICALLY BY PAYLOAD. */
+/* DO NOT MODIFY IT BECAUSE IT COULD BE REWRITTEN AT ANY TIME. */
+import config from '@payload-config'
+import '@payloadcms/next/css'
+import {
+  REST_DELETE,
+  REST_GET,
+  REST_OPTIONS,
+  REST_PATCH,
+  REST_POST,
+  REST_PUT,
+} from '@payloadcms/next/routes'
+
+export const GET = REST_GET(config)
+export const POST = REST_POST(config)
+export const DELETE = REST_DELETE(config)
+export const PATCH = REST_PATCH(config)
+export const PUT = REST_PUT(config)
+export const OPTIONS = REST_OPTIONS(config)

apps/next/src/app/(payload)/api/graphql-playground/route.ts

@@ -0,0 +1,7 @@
+/* THIS FILE WAS GENERATED AUTOMATICALLY BY PAYLOAD. */
+/* DO NOT MODIFY IT BECAUSE IT COULD BE REWRITTEN AT ANY TIME. */
+import config from '@payload-config'
+import '@payloadcms/next/css'
+import { GRAPHQL_PLAYGROUND_GET } from '@payloadcms/next/routes'
+
+export const GET = GRAPHQL_PLAYGROUND_GET(config)

apps/next/src/app/(payload)/api/graphql/route.ts

@@ -0,0 +1,8 @@
+/* THIS FILE WAS GENERATED AUTOMATICALLY BY PAYLOAD. */
+/* DO NOT MODIFY IT BECAUSE IT COULD BE REWRITTEN AT ANY TIME. */
+import config from '@payload-config'
+import { GRAPHQL_POST, REST_OPTIONS } from '@payloadcms/next/routes'
+
+export const POST = GRAPHQL_POST(config)
+
+export const OPTIONS = REST_OPTIONS(config)

apps/next/src/app/(payload)/layout.tsx

@@ -0,0 +1,31 @@
+/* THIS FILE WAS GENERATED AUTOMATICALLY BY PAYLOAD. */
+/* DO NOT MODIFY IT BECAUSE IT COULD BE REWRITTEN AT ANY TIME. */
+import config from '@payload-config'
+import '@payloadcms/next/css'
+import type { ServerFunctionClient } from 'payload'
+import { handleServerFunctions, RootLayout } from '@payloadcms/next/layouts'
+import React from 'react'
+
+import { importMap } from './admin/importMap.js'
+import './custom.scss'
+
+type Args = {
+  children: React.ReactNode
+}
+
+const serverFunction: ServerFunctionClient = async function (args) {
+  'use server'
+  return handleServerFunctions({
+    ...args,
+    config,
+    importMap,
+  })
+}
+
+const Layout = ({ children }: Args) => (
+  <RootLayout config={config} importMap={importMap} serverFunction={serverFunction}>
+    {children}
+  </RootLayout>
+)
+
+export default Layout

apps/next/src/env.ts

@@ -9,6 +9,8 @@ export const env = createEnv({
     SKIP_ENV_VALIDATION: z.boolean().default(false),
     SENTRY_AUTH_TOKEN: z.string(),
     CI: z.boolean().default(false),
+    PAYLOAD_SECRET: z.string(),
+    PAYLOAD_DB_URL: z.string(),
   },
 
   /**
@@ -32,6 +34,8 @@ export const env = createEnv({
     SKIP_ENV_VALIDATION: process.env.SKIP_ENV_VALIDATION,
     SENTRY_AUTH_TOKEN: process.env.SENTRY_AUTH_TOKEN,
     CI: process.env.CI,
+    PAYLOAD_SECRET: process.env.PAYLOAD_SECRET,
+    PAYLOAD_DB_URL: process.env.PAYLOAD_DB_URL,
     NEXT_PUBLIC_SITE_URL: process.env.NEXT_PUBLIC_SITE_URL,
     NEXT_PUBLIC_CONVEX_URL: process.env.NEXT_PUBLIC_CONVEX_URL,
     NEXT_PUBLIC_PLAUSIBLE_URL: process.env.NEXT_PUBLIC_PLAUSIBLE_URL,

apps/next/src/payload.config.ts

@@ -0,0 +1,18 @@
+import { postgresAdapter } from '@payloadcms/db-postgres';
+import { lexicalEditor } from '@payloadcms/richtext-lexical';
+import { buildConfig } from 'payload';
+import sharp from 'sharp';
+
+import { env } from './env';
+
+export default buildConfig({
+  editor: lexicalEditor(),
+  collections: [],
+  secret: env.PAYLOAD_SECRET ?? '',
+  db: postgresAdapter({
+    pool: {
+      connectionString: env.PAYLOAD_DB_URL,
+    },
+  }),
+  sharp,
+});

apps/next/tsconfig.json

@@ -5,7 +5,8 @@
     "jsx": "preserve",
     "types": ["node"],
     "paths": {
-      "@/*": ["./src/*"]
+      "@/*": ["./src/*"],
+      "@payload-config": ["./src/payload.config.ts"]
     },
     "plugins": [{ "name": "next" }]
   },

docker/.env.example

@@ -11,6 +11,8 @@ NEXT_PUBLIC_PLAUSIBLE_URL=https://plausible.gbrown.org
 NEXT_PUBLIC_SENTRY_DSN=
 NEXT_PUBLIC_SENTRY_ORG=sentry
 NEXT_PUBLIC_SENTRY_PROJECT_NAME=
+PAYLOAD_SECRET=
+PAYLOAD_DB_URL=
 
 # Convex Environment Variables
 BACKEND_TAG=latest
@@ -30,7 +32,7 @@ DISABLE_BEACON=true
 REDACT_LOGS_TO_CLIENT=true
 DO_NOT_REQUIRE_SSL=true
 NEXT_PUBLIC_DEPLOYMENT_URL=https://api.convex.gbrown.org
-#POSTGRES_URL=
+POSTGRES_URL=
 #DATABASE_URL=
 #CONVEX_RELEASE_VERSION_DEV=
 #ACTIONS_USER_TIMEOUT_SECS=

docker/compose.yml

@@ -19,6 +19,8 @@ services:
       - NEXT_PUBLIC_SENTRY_URL=${NEXT_PUBLIC_SENTRY_URL}
       - NEXT_PUBLIC_SENTRY_ORG=${NEXT_PUBLIC_SENTRY_ORG:-sentry}
       - NEXT_PUBLIC_SENTRY_PROJECT_NAME=${NEXT_PUBLIC_SENTRY_PROJECT_NAME}
+      - PAYLOAD_SECRET=${PAYLOAD_SECRET}
+      - PAYLOAD_DB_URL=${PAYLOAD_DB_URL}
     hostname: ${NEXT_CONTAINER_NAME}
     domainname: ${NEXT_DOMAIN_NAME}
     networks: ['${NETWORK:-nginx-bridge}']
@@ -40,13 +42,13 @@ services:
     labels: ['com.centurylinklabs.watchtower.enable=true']
     environment:
       - INSTANCE_NAME
-      - INSTANCE_SECRET
-      - CONVEX_CLOUD_ORIGIN=${CONVEX_CLOUD_ORIGIN:-http://${BACKEND_CONTAINER_NAME:-convex-backend}:${BACKEND_PORT:-3210}}
-      - CONVEX_SITE_ORIGIN=${CONVEX_SITE_ORIGIN:-http://${BACKEND_CONTAINER_NAME:-convex-backend}:${SITE_PROXY_PORT:-3211}}
-      - DISABLE_BEACON
-      - REDACT_LOGS_TO_CLIENT
-      - DO_NOT_REQUIRE_SSL
-      #- DATABASE_URL=${DATABASE_URL:-}
+      #- INSTANCE_SECRET
+      - CONVEX_CLOUD_ORIGIN=${CONVEX_CLOUD_ORIGIN:-http://${BACKEND_CONTAINER_NAME:-stpeteit-backend}:${BACKEND_PORT:-3210}}
+      - CONVEX_SITE_ORIGIN=${CONVEX_SITE_ORIGIN:-http://${BACKEND_CONTAINER_NAME:-stpeteit-backend}:${SITE_PROXY_PORT:-3211}}
+      - DISABLE_BEACON=${DISABLE_BEACON:-true}
+      - REDACT_LOGS_TO_CLIENT=${REDACT_LOGS_TO_CLIENT:-true}
+      - DO_NOT_REQUIRE_SSL=${DO_NOT_REQUIRE_SSL:-false}
+      - POSTGRES_URL=${POSTGRES_URL}
     stdin_open: true
     tty: true
     restart: unless-stopped

package.json

@@ -39,6 +39,7 @@
     "dev": "turbo run dev",
     "dev:tunnel": "turbo run dev:tunnel",
     "dev:next": "turbo run dev -F @gib/next -F @gib/backend",
+    "dev:next:web": "turbo run dev:web -F @gib/next -F @gib/backend",
     "dev:expo": "turbo run dev -F @gib/expo -F @gib/backend",
     "dev:backend": "turbo run dev -F @gib/backend",
     "dev:expo:tunnel": "turbo run dev:tunnel -F @gib/expo -F @gib/backend",

packages/backend/package.json

@@ -14,6 +14,7 @@
   "scripts": {
     "dev": "bun with-env convex dev",
     "dev:tunnel": "bun with-env convex dev",
+    "dev:web": "bun with-env convex dev",
     "setup": "bun with-env convex dev --until-success",
     "clean": "git clean -xdf .cache .turbo dist node_modules",
     "format": "prettier --check . --ignore-path ../../.gitignore",

turbo.json

@@ -11,6 +11,8 @@
     "NEXT_PUBLIC_SENTRY_URL",
     "NEXT_PUBLIC_SENTRY_ORG",
     "NEXT_PUBLIC_SENTRY_PROJECT_NAME",
+    "PAYLOAD_SECRET",
+    "PAYLOAD_DB_URL",
     "CONVEX_SELF_HOSTED_URL",
     "CONVEX_SELF_HOSTED_ADMIN_KEY",
     "CONVEX_SITE_URL",
@@ -19,7 +21,7 @@
     "USESEND_FROM_EMAIL",
     "AUTH_AUTHENTIK_ID",
     "AUTH_AUTHENTIK_SECRET",
-    "AUTH_AUTHENTIK_ISSUER"
+    "AUTH_AUTHENTIK_ISSUER",
   ],
   "globalPassThroughEnv": ["NODE_ENV"],
   "ui": "tui",
@@ -39,6 +41,10 @@
       "cache": false,
       "persistent": false
     },
+    "dev:web": {
+      "cache": false,
+      "persistent": false
+    },
     "format": {
       "outputs": [".cache/.prettiercache"],
       "outputLogs": "new-only"