chore: safely uses deepMerge

packages/payload/package.json

@@ -52,7 +52,6 @@
     "find-up": "4.1.0",
     "get-tsconfig": "^4.7.2",
     "http-status": "1.6.2",
-    "is-plain-object": "5.0.0",
     "joi": "^17.12.1",
     "json-schema-to-typescript": "11.0.3",
     "jsonwebtoken": "9.0.1",

packages/payload/src/collections/config/sanitize.ts

@@ -1,5 +1,4 @@
 import merge from 'deepmerge'
-import { isPlainObject } from 'is-plain-object'
 
 import type { Config } from '../../config/types.d.ts'
 import type { CollectionConfig, SanitizedCollectionConfig } from './types.d.ts'
@@ -15,6 +14,7 @@ import mergeBaseFields from '../../fields/mergeBaseFields.js'
 import { extractTranslations } from '../../translations/extractTranslations.js'
 import getBaseUploadFields from '../../uploads/getBaseFields.js'
 import { formatLabels } from '../../utilities/formatLabels.js'
+import { isPlainObject } from '../../utilities/isPlainObject.js'
 import baseVersionFields from '../../versions/baseFields.js'
 import { authDefaults, defaults } from './defaults.js'
 

packages/payload/src/config/sanitize.ts

@@ -1,6 +1,5 @@
 import { translations } from '@payloadcms/translations/api'
 import merge from 'deepmerge'
-import { isPlainObject } from 'is-plain-object'
 
 import type {
   Config,
@@ -16,6 +15,7 @@ import { InvalidConfiguration } from '../errors/index.js'
 import sanitizeGlobals from '../globals/config/sanitize.js'
 import getPreferencesCollection from '../preferences/preferencesCollection.js'
 import checkDuplicateCollections from '../utilities/checkDuplicateCollections.js'
+import { isPlainObject } from '../utilities/isPlainObject.js'
 import { defaults } from './defaults.js'
 
 const sanitizeAdminConfig = (configToSanitize: Config): Partial<SanitizedConfig> => {

packages/payload/src/utilities/isPlainObject.ts

@@ -0,0 +1,29 @@
+function isObject(o: unknown): boolean {
+  return Object.prototype.toString.call(o) === '[object Object]'
+}
+
+export function isPlainObject(o: unknown): boolean {
+  // Is this a React component?
+  if (typeof o === 'object' && '$$typeof' in o && typeof o.$$typeof === 'symbol') {
+    return false
+  }
+
+  if (isObject(o) === false) return false
+
+  // If has modified constructor
+  const ctor = o.constructor
+  if (ctor === undefined) return true
+
+  // If has modified prototype
+  const prot = ctor.prototype
+  if (isObject(prot) === false) return false
+
+  // If constructor does not have an Object-specific method
+  // eslint-disable-next-line no-prototype-builtins
+  if (prot.hasOwnProperty('isPrototypeOf') === false) {
+    return false
+  }
+
+  // Most likely a plain Object
+  return true
+}

test/CustomDashboard.tsx

@@ -0,0 +1,7 @@
+'use client'
+
+import React from 'react'
+
+export const CustomDashboard: React.FC = () => {
+  return <h1>hello</h1>
+}

test/buildConfigWithDefaults.ts

@@ -30,6 +30,7 @@ import { buildConfig as buildPayloadConfig } from '../packages/payload/src/confi
 //   lexicalEditor,
 // } from '../packages/richtext-lexical/src'
 import { slateEditor } from '../packages/richtext-slate/src/index.js'
+import { CustomDashboard } from './CustomDashboard.js'
 
 // process.env.PAYLOAD_DATABASE = 'postgres'
 
@@ -66,6 +67,13 @@ export function buildConfigWithDefaults(testConfig?: Partial<Config>): Promise<S
   const config: Config = {
     db: databaseAdapters[process.env.PAYLOAD_DATABASE || 'mongoose'],
     secret: 'TEST_SECRET',
+    admin: {
+      components: {
+        views: {
+          Dashboard: CustomDashboard,
+        },
+      },
+    },
     editor: slateEditor({
       admin: {
         upload: {