cms.c2sgmbh/BUG_REPORT_CUSTOM_VIEWS.md

Bug Report: Custom Admin Components cause TypeError with path-to-regexp

Summary

ALL custom admin components registered via admin.components cause a TypeError: Missing parameter name at 5 error from path-to-regexp when used together with @payloadcms/plugin-multi-tenant. This includes views, afterNavLinks, and beforeNavLinks.

Environment

• Payload Version: 3.68.4
• Next.js Version: 15.5.9
• React Version: 19.2.3
• Node.js Version: 22.x
• Database: PostgreSQL 17.6
• Plugin: @payloadcms/plugin-multi-tenant 3.68.4

Steps to Reproduce

1. Create a Payload 3.x project with the multi-tenant plugin
2. Add a custom view to the admin config:

// payload.config.ts
export default buildConfig({
  admin: {
    user: Users.slug,
    components: {
      views: {
        MyCustomView: {
          Component: '@/components/admin/MyCustomView#MyCustomView',
          path: '/my-custom-view',
        },
      },
    },
  },
  plugins: [
    multiTenantPlugin({
      tenantsSlug: 'tenants',
      collections: { /* ... */ },
    }),
    // other plugins...
  ],
})

3. Create a simple client component:

// src/components/admin/MyCustomView.tsx
'use client'

import React from 'react'

export const MyCustomView: React.FC = () => {
  return (
    <div style={{ padding: '2rem' }}>
      <h1>Custom View</h1>
    </div>
  )
}

export default MyCustomView

4. Build and run the project
5. Navigate to /admin/my-custom-view

Expected Behavior

The custom view should render correctly.

Actual Behavior

A server-side error occurs with the following message in production:

Uncaught Error: An error occurred in the Server Components render.
The specific message is omitted in production builds to avoid leaking sensitive details.

When running in development or checking server logs, the actual error is:

⨯ TypeError: Missing parameter name at 5
    at <unknown> (.next/server/chunks/XXXX.js:5:9989)
    at <unknown> (.next/server/chunks/XXXX.js:5:10666)
    at g (.next/server/chunks/XXXX.js:5:11896)
    at e (.next/server/chunks/824.js:96:517138)
    at <unknown> (.next/server/app/(payload)/admin/[[...segments]]/page.js:1:31665)
    at Array.find (<anonymous>)
    at <unknown> (.next/server/app/(payload)/admin/[[...segments]]/page.js:1:31644)
    at ax (.next/server/app/(payload)/admin/[[...segments]]/page.js:1:34637) {
  digest: '3964718924'
}

Additional Context

What works:

• Admin panel WITHOUT any custom components (completely empty admin.components or omitted entirely)

What fails:

• ANY custom component registered via admin.components, including:
  • views - custom admin views
  • afterNavLinks - components after nav links (e.g., TenantBreadcrumb)
  • beforeNavLinks - components before nav links
• Even the simplest component without any dependencies triggers the error

Investigation findings:

• The error originates from path-to-regexp (version 6.3.0)
• The error occurs during route matching in handleEndpoints.js
• The error message "Missing parameter name at 5" suggests an invalid route pattern like /: is being generated somewhere
• This happens regardless of the view path used (tested with /dashboard, /tenant-dashboard, /test-dashboard)
• The issue appears to be triggered by the combination of ANY custom component and the multi-tenant plugin
• Initially appeared to work in development but fails consistently in production builds

Workaround

Completely disable ALL custom components:

admin: {
  user: Users.slug,
  // ALL custom components disabled - triggers path-to-regexp error with multi-tenant plugin
  // components: {
  //   afterNavLinks: ['...'],
  //   beforeNavLinks: ['...'],
  //   views: { ... },
  // },
},

Related Plugins

• @payloadcms/plugin-multi-tenant (may be related to the conflict)
• @payloadcms/plugin-redirects
• @payloadcms/plugin-seo
• @payloadcms/plugin-form-builder
• @payloadcms/plugin-nested-docs