Files
payloadcms/test/joins/config.ts
Said Akhrarov cd546b3125 feat(ui): add support for disabling join field row types (#12738)
### What?
This PR adds a new `admin.disableRowTypes` config to `'join'` fields
which hides the `"Type"` column from the relationship table.

### Why?
While the collection type column _can be_ helpful for providing
information, it's not always necessary and can sometimes be redundant
when the field only has a singular relationTo. Hiding it can be helpful
by removing visual noise and providing editors the data directly.

### How?
By threading `admin.disableRowTypes` directly to the `getTableState`
function of the `RelationshipTable` component.

**With row types** (via `admin.disableRowTypes: false | undefined` OR
default for polymorphic):

![image](https://github.com/user-attachments/assets/22b55477-cf56-4b0e-a845-e6f2b39efe3b)

**Without row types** (default for monomorphic):

![image](https://github.com/user-attachments/assets/3a2bb0ba-2d5e-4299-8689-249b2d3fefe2)
2025-10-03 11:10:10 +01:00

360 lines
7.6 KiB
TypeScript

import { fileURLToPath } from 'node:url'
import path from 'path'
import { buildConfigWithDefaults } from '../buildConfigWithDefaults.js'
import { Categories } from './collections/Categories.js'
import { CategoriesVersions } from './collections/CategoriesVersions.js'
import { FolderPoly1 } from './collections/FolderPoly1.js'
import { FolderPoly2 } from './collections/FolderPoly2.js'
import { HiddenPosts } from './collections/HiddenPosts.js'
import { Posts } from './collections/Posts.js'
import { SelfJoins } from './collections/SelfJoins.js'
import { Singular } from './collections/Singular.js'
import { Uploads } from './collections/Uploads.js'
import { Versions } from './collections/Versions.js'
import { seed } from './seed.js'
import {
categoriesJoinRestrictedSlug,
collectionRestrictedSlug,
localizedCategoriesSlug,
localizedPostsSlug,
postsSlug,
restrictedCategoriesSlug,
restrictedPostsSlug,
} from './shared.js'
const filename = fileURLToPath(import.meta.url)
const dirname = path.dirname(filename)
export default buildConfigWithDefaults({
admin: {
importMap: {
baseDir: path.resolve(dirname),
},
user: 'users',
},
collections: [
{
slug: 'users',
auth: true,
fields: [
{
type: 'join',
collection: 'posts',
on: 'author',
name: 'posts',
},
],
},
Posts,
Categories,
HiddenPosts,
Uploads,
Versions,
CategoriesVersions,
Singular,
SelfJoins,
{
slug: localizedPostsSlug,
admin: {
useAsTitle: 'title',
},
fields: [
{
name: 'title',
type: 'text',
localized: true,
},
{
name: 'category',
type: 'relationship',
localized: true,
relationTo: localizedCategoriesSlug,
},
],
},
{
slug: localizedCategoriesSlug,
admin: {
useAsTitle: 'name',
},
fields: [
{
name: 'name',
type: 'text',
},
{
name: 'relatedPosts',
type: 'join',
collection: localizedPostsSlug,
on: 'category',
localized: true,
},
],
},
{
slug: restrictedCategoriesSlug,
admin: {
useAsTitle: 'name',
},
fields: [
{
name: 'name',
type: 'text',
},
{
// this field is misconfigured to have `where` constraint using a restricted field
name: 'restrictedPosts',
type: 'join',
collection: postsSlug,
on: 'category',
where: {
restrictedField: { equals: 'restricted' },
},
},
],
},
{
slug: categoriesJoinRestrictedSlug,
admin: {
useAsTitle: 'name',
},
fields: [
{
name: 'name',
type: 'text',
},
{
// join collection with access.read: () => false which should not populate
name: 'collectionRestrictedJoin',
type: 'join',
collection: collectionRestrictedSlug,
on: 'category',
},
],
},
{
slug: restrictedPostsSlug,
admin: {
useAsTitle: 'title',
},
fields: [
{
name: 'title',
type: 'text',
},
{
name: 'restrictedField',
type: 'text',
access: {
read: () => false,
update: () => false,
},
},
{
name: 'category',
type: 'relationship',
relationTo: restrictedCategoriesSlug,
},
],
},
{
slug: collectionRestrictedSlug,
admin: {
useAsTitle: 'title',
},
access: {
read: () => ({ canRead: { equals: true } }),
},
fields: [
{
name: 'title',
type: 'text',
},
{
name: 'canRead',
type: 'checkbox',
defaultValue: false,
},
{
name: 'category',
type: 'relationship',
relationTo: categoriesJoinRestrictedSlug,
},
],
},
{
slug: 'depth-joins-1',
fields: [
{
name: 'rel',
type: 'relationship',
relationTo: 'depth-joins-2',
},
{
name: 'joins',
type: 'join',
collection: 'depth-joins-3',
on: 'rel',
maxDepth: 2,
},
],
},
{
slug: 'depth-joins-2',
fields: [
{
name: 'joins',
type: 'join',
collection: 'depth-joins-1',
on: 'rel',
maxDepth: 2,
},
],
},
{
slug: 'depth-joins-3',
fields: [
{
name: 'rel',
type: 'relationship',
relationTo: 'depth-joins-1',
},
],
},
{
slug: 'multiple-collections-parents',
access: { read: () => true },
fields: [
{
type: 'join',
name: 'children',
collection: ['multiple-collections-1', 'multiple-collections-2'],
on: 'parent',
admin: {
defaultColumns: ['title', 'name', 'description'],
},
},
],
},
{
slug: 'multiple-collections-1',
access: { read: () => true },
admin: { useAsTitle: 'title' },
fields: [
{
type: 'relationship',
relationTo: 'multiple-collections-parents',
name: 'parent',
},
{
name: 'title',
type: 'text',
},
{
name: 'name',
type: 'text',
},
],
},
{
slug: 'multiple-collections-2',
access: { read: () => true },
admin: { useAsTitle: 'title' },
fields: [
{
type: 'relationship',
relationTo: 'multiple-collections-parents',
name: 'parent',
},
{
name: 'title',
type: 'text',
},
{
name: 'description',
type: 'text',
},
],
},
{
slug: 'folders',
fields: [
{
type: 'relationship',
relationTo: 'folders',
name: 'folder',
},
{
name: 'title',
type: 'text',
},
{
type: 'join',
name: 'children',
collection: ['folders', 'example-pages', 'example-posts'],
on: 'folder',
admin: {
defaultColumns: ['title', 'name', 'description'],
},
},
],
},
{
slug: 'example-pages',
admin: { useAsTitle: 'title' },
fields: [
{
type: 'relationship',
relationTo: 'folders',
name: 'folder',
},
{
name: 'title',
type: 'text',
},
{
name: 'name',
type: 'text',
},
],
},
{
slug: 'example-posts',
admin: { useAsTitle: 'title' },
fields: [
{
type: 'relationship',
relationTo: 'folders',
name: 'folder',
},
{
name: 'title',
type: 'text',
},
{
name: 'description',
type: 'text',
},
],
},
FolderPoly1,
FolderPoly2,
],
localization: {
locales: [
{ label: '(en)', code: 'en' },
{ label: '(es)', code: 'es' },
],
defaultLocale: 'en',
},
onInit: async (payload) => {
if (process.env.SEED_IN_CONFIG_ONINIT !== 'false') {
await seed(payload)
}
},
typescript: {
outputFile: path.resolve(dirname, 'payload-types.ts'),
},
})