fix(examples): update live-preview example to ESM (#12570)

Partial fix for #12551.

The Live Preview example was unable to boot because it was running
CommonJS instead of ESM.

examples/live-preview/next-env.d.ts

@@ -2,4 +2,4 @@
 /// <reference types="next/image-types/global" />
 
 // NOTE: This file should not be edited
-// see https://nextjs.org/docs/app/building-your-application/configuring/typescript for more information.
+// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.

examples/live-preview/package.json

@@ -3,6 +3,7 @@
   "version": "1.0.0",
   "description": "Payload Live Preview example.",
   "license": "MIT",
+  "type": "module",
   "main": "dist/server.js",
   "scripts": {
     "build": "cross-env NODE_OPTIONS=--no-deprecation next build",

examples/live-preview/src/migrations/seed.ts

@@ -1,8 +1,9 @@
 import type { MigrateUpArgs } from '@payloadcms/db-mongodb'
 
 import type { Page } from '../payload-types'
+import { DefaultDocumentIDType } from 'payload'
 
-export const home: Partial<Page> = {
+export const home = (id: DefaultDocumentIDType): Partial<Page> => ({
   slug: 'home',
   richText: [
     {
@@ -41,11 +42,26 @@ export const home: Partial<Page> = {
         {
           text: ' you can edit this page in the admin panel and see the changes reflected here in real time.',
         },
+        ...(id
+          ? [
+              {
+                text: ' To get started, visit ',
+              },
+              {
+                type: 'link',
+                children: [{ text: 'this page' }],
+                linkType: 'custom',
+                newTab: true,
+                url: `/admin/collections/pages/${id}/preview`,
+              },
+              { text: '.' },
+            ]
+          : []),
       ],
     },
   ],
   title: 'Home',
-}
+})
 
 export const examplePage: Partial<Page> = {
   slug: 'example-page',
@@ -83,11 +99,18 @@ export async function up({ payload }: MigrateUpArgs): Promise<void> {
     data: examplePage as any, // eslint-disable-line
   })
 
-  const homepageJSON = JSON.parse(JSON.stringify(home))
+  const { id: ogHomePageID } = await payload.create({
-
-  const { id: homePageID } = await payload.create({
     collection: 'pages',
-    data: homepageJSON,
+    data: {
+      title: 'Home',
+      richText: [],
+    },
+  })
+
+  const { id: homePageID } = await payload.update({
+    id: ogHomePageID,
+    collection: 'pages',
+    data: home(ogHomePageID),
   })
 
   await payload.updateGlobal({
@@ -121,7 +144,7 @@ export async function up({ payload }: MigrateUpArgs): Promise<void> {
             type: 'custom',
             label: 'Dashboard',
             reference: undefined,
-            url: 'http://localhost:3000/admin',
+            url: '/admin',
           },
         },
       ],

examples/live-preview/src/payload-types.ts

@@ -6,10 +6,66 @@
  * 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: {
     pages: Page;
     users: User;