Grouping collections in admin

default discord avatar
\ ឵឵឵last year
7

Is there a straightforward way to group collections in the admin panel? I have a large (and growing) number of collections that would benefit enormously from being able to be organized in some sort of a hierarchy, similar to the way fields have groups.

  • default discord avatar
    akshaylast year

    There is a way to group collections in nav bar if it helps -

    https://payloadcms.com/docs/configuration/collections#admin-options
  • default discord avatar
    \ ឵឵឵last year

    Perfect! Exactly what I was hoping for.

  • @\ ឵឵឵ something like this might also be useful 👼



    const groupCollections = (group: string, collections: CollectionConfig[]): CollectionConfig[] => {
      return collections.map(collection => {
        return {
          ...collection,
          admin: {
            ...collection.admin,
            group,
          },
        }
      })
    }
    
    const ContentCollections = [Posts, Pages]
    
    const configToBuild: Config = {
      // ...rest of config,
      collections: [
        ...groupCollections('Content', ContentCollections),
      ],
    }
  • default discord avatar
    \ ឵឵឵last year

    I like it 🙂 Nice one!

  • default discord avatar
    snailedlt9 months ago

    This is almost exactly what I'm looking for... but how do I make it localized with I18n?



    This is how I solved it:


    const groupCollections = (group: string | Record<string, string>, collections: CollectionConfig[]): CollectionConfig[] => {
      return collections.map(collection => {
        return {
          ...collection,
          admin: {
            ...collection.admin,
            group,
          },
        }
      })
    }
    
    const ContentCollections = [Posts, Pages]
    const configToBuild: Config = {
      // ...rest of config,
      collections: [
        ...groupCollections({en: 'Content', es: 'Contentido'}, ContentCollections),
      ],
    }


    I don't know how to change the group name of the default User collection though. Is it possible without making a collectionconfig for it?



    @jarrod_not_jared


    It would be neat if grouping inside of payload.config.ts was possible out of the box without creating that method btw. Imo, it's a much more practical way to group collections, than doing it inside every collection config.



    Perhaps it could look something like this?


    const configToBuild: Config = {
      // ...rest of config,
      collections: {
        {
          group: { en: "Content", es: "Contentido"},
          collections: [Posts, Pages]
        },
        {
          group: { en: "Users", es: "Usuarios"},
          collections: [Users, UserGroups, UserPrivileges]
        },
      },
    }
  • discord user avatar
    jarrod_not_jared
    9 months ago

    Yeah that would be a large api lift though as it would affect a lot of code. I am not sure that is the pattern I would like to see. It's a bit awkward having collections inside of collections. For now I think the method abstraction is the way to go.

  • default discord avatar
    snailedlt9 months ago

    Agreed. It's not the best way to do it, but being able to change groups easily in the payload.config.ts file would be very neat



    how about something like this instead?


    const configToBuild: Config = {
      // ...rest of config,
      collections: [Posts, Pages,Users, UserGroups, UserPrivileges],
      admin {
        collectionGroups: {
          group: { en: "Content", es: "Contentido"},
          collections: [Posts, Pages]
        },
        {
          group: { en: "Users", es: "Usuarios"},
          collections: [Users, UserGroups, UserPrivileges]
        },
      }
    }
Star on GitHub

Star

Chat on Discord

Discord

online

Can't find what you're looking for?

Get help straight from the Payload team with an Enterprise License.