This PR moves the logic for rendering diff field components in the version comparison view from the client to the server. This allows us to expose more customization options to the server-side Payload Config. For example, users can now pass their own diff components for fields - even including RSCs. This PR also cleans up the version view types Implements the following from https://github.com/payloadcms/payload/discussions/4197: - allow for customization of diff components - more control over versions screens in general TODO: - [x] Bring getFieldPaths fixes into core - [x] Cleanup and test with scrutiny. Ensure all field types display their diffs correctly - [x] Review public API for overriding field types, add docs - [x] Add e2e test for new public API
79 lines
2.2 KiB
TypeScript
79 lines
2.2 KiB
TypeScript
import { fileURLToPath } from 'node:url'
|
|
import path from 'path'
|
|
const filename = fileURLToPath(import.meta.url)
|
|
const dirname = path.dirname(filename)
|
|
import { buildConfigWithDefaults } from '../buildConfigWithDefaults.js'
|
|
import AutosavePosts from './collections/Autosave.js'
|
|
import CustomIDs from './collections/CustomIDs.js'
|
|
import { Diff } from './collections/Diff.js'
|
|
import DisablePublish from './collections/DisablePublish.js'
|
|
import DraftPosts from './collections/Drafts.js'
|
|
import DraftWithMax from './collections/DraftsWithMax.js'
|
|
import LocalizedPosts from './collections/Localized.js'
|
|
import { Media } from './collections/Media.js'
|
|
import Posts from './collections/Posts.js'
|
|
import VersionPosts from './collections/Versions.js'
|
|
import AutosaveGlobal from './globals/Autosave.js'
|
|
import DisablePublishGlobal from './globals/DisablePublish.js'
|
|
import DraftGlobal from './globals/Draft.js'
|
|
import DraftWithMaxGlobal from './globals/DraftWithMax.js'
|
|
import LocalizedGlobal from './globals/LocalizedGlobal.js'
|
|
import { seed } from './seed.js'
|
|
|
|
export default buildConfigWithDefaults({
|
|
admin: {
|
|
importMap: {
|
|
baseDir: path.resolve(dirname),
|
|
},
|
|
// The autosave test uses this format in order to compare timestamps in the UI
|
|
dateFormat: 'MMMM do yyyy, h:mm:ss a',
|
|
},
|
|
collections: [
|
|
DisablePublish,
|
|
Posts,
|
|
AutosavePosts,
|
|
DraftPosts,
|
|
DraftWithMax,
|
|
LocalizedPosts,
|
|
VersionPosts,
|
|
CustomIDs,
|
|
Diff,
|
|
Media,
|
|
],
|
|
globals: [AutosaveGlobal, DraftGlobal, DraftWithMaxGlobal, DisablePublishGlobal, LocalizedGlobal],
|
|
indexSortableFields: true,
|
|
localization: {
|
|
defaultLocale: 'en',
|
|
locales: [
|
|
{
|
|
code: 'en',
|
|
label: 'English',
|
|
},
|
|
{
|
|
code: 'es',
|
|
label: {
|
|
en: 'Spanish',
|
|
es: 'Español',
|
|
de: 'Spanisch',
|
|
},
|
|
},
|
|
{
|
|
code: 'de',
|
|
label: {
|
|
en: 'German',
|
|
es: 'Alemán',
|
|
de: 'Deutsch',
|
|
},
|
|
},
|
|
],
|
|
},
|
|
onInit: async (payload) => {
|
|
if (process.env.SEED_IN_CONFIG_ONINIT !== 'false') {
|
|
await seed(payload)
|
|
}
|
|
},
|
|
typescript: {
|
|
outputFile: path.resolve(dirname, 'payload-types.ts'),
|
|
},
|
|
})
|