A group field with no heading

[gamellis]

I'm using a space character to hide the group heading, which works 😬 but feels a little icky. It would be great to add a group and change the data model of a collection without needing a heading, and I have created a custom field UI component to add a heading where I don't what a group in the data but would like to break fields up.

Examples:
A little future-proofing the data with a yield object that wraps a single field.

{
    name: 'yield',
    label: ' ', // no heading
    type: 'group',
    admin: {
      hideGutter: true
    },
    fields: [
      {
        name: 'servings',
        label: 'Number of servings',
        type: 'number',
        min: 1
      }
    ]
  },

This data set should not be broken into groups for the API but is difficult for people to scan when not broken into groups.

{
    type: 'ui',
    name: 'proximates',
    admin: {
      components: {
        Field: () => Heading({ label: 'Proximates' })
      }
    }
  },
  ...createNutritionGroup(PROXIMATES),
  {
    type: 'ui',
    name: 'protein',
    admin: {
      components: {
        Field: () => Heading({ label: 'Protein' })
      }
    }
  },
  ...createNutritionGroup(PROTEIN),
  {
    type: 'ui',
    name: 'carbohydrates',
    admin: {
      components: {
        Field: () => Heading({ label: 'Carbohydrates' })
      }
    }
  } ... continues

[jacobsfletch]

Ok if I'm following along, since your labels are static it sounds like you could return your yield field from a function, something like this:

const makeYield = (heading) => ({
  name: 'yield',
  label:  heading,
  type: 'group',
  admin: {
    hideGutter: true
  },
  fields: [
    {
      name: 'servings',
      label: 'Number of servings',
      type: 'number',
      min: 1
    }
  ]
})

Then use it in your config (no need for UI fields):

{
  makeYield('proximities'),
  ...
}

Would something like this work for you? Otherwise if you need dynamic labels, we could potentially build something similar the RowLabel component on array fields.

[gamellis]

Thanks for taking a look at this, Jacob. I think I've confused things by showing two different examples 🤦‍♂️. I'll simplify by only referencing the first ask. I want to change the shape of the data with a group field without affecting the UI within the collection.

db looks like:

MyCollection: {
    yield: {
        servings: 2
    }
}

But the UI doesn't show the heading or gutters. Sorry for making the examples confusing.

Also, is it possible to create a custom field that would group fields without effect the UI layer?