[Custom fields] Add default value to options

[markkaylor]

What does it do?

• Registers every valid type of custom field for testing in examples/getstarted (this will break the admin on 4000 if you add a custom field and then try to access it in the content manager, but I think it is nice to have them to make sure they work in the CTB)
• Handles a defaultValue key on custom field option objects so that a defaultValue can be set for the option
• Validates the name on custom field options object (allowed root level type or prefixed with 'options')

Why is it needed?

• Custom field developers should be able to provide default values for their options

How to test it?

• Go to any content-type and add new field, select custom
• Choose color picker
• The color picker now adds a default value for regex, check it is pre-filled in the form modal
• Save your new field, check the schema json and confirm it was saved as follows, regex should be on the root of the attribute object

"test": {
  "pluginOptions": {
    "i18n": {
      "localized": true
    }
  },
  "type": "customField",
  "regex": "^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$",
  "customField": "plugin::color-picker.color"
}

• Go to packages/plugins/color-picker/admin/src/index.js, and add the following object to the advanced array of the custom field registration

  {
    intlLabel: {
      id: getTrad('test'),
      defaultMessage: 'Format',
    },
    name: 'options.format',
    type: 'text',
    defaultValue: 'hex',
    description: {
      id: getTrad('test'),
      defaultMessage: 'This is just a test',
    },
  }

• Do the same test as you did for regex, format should be on an options object

"test": {
  "pluginOptions": {
    "i18n": {
      "localized": true
    }
  },
  "type": "customField",
  "regex": "^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$",
  "options": {
    "format": "hex"
  },
  "customField": "plugin::color-picker.color"
}

• Go back to packages/plugins/color-picker/admin/src/index.js and change name: 'options.format' to name: 'format', save and go back to the admin, you should have an error.

[codecov]

Codecov Report

Base: 59.76% // Head: 49.80% // Decreases project coverage by -9.96% ⚠️

Coverage data is based on head (85dac95) compared to base (8253427).
Patch has no changes to coverable lines.

❗ Current head 85dac95 differs from pull request most recent head c8888bf. Consider uploading reports for the commit c8888bf to get more accurate results

Additional details and impacted files

@@            Coverage Diff             @@
##             main   #14590      +/-   ##
==========================================
- Coverage   59.76%   49.80%   -9.97%     
==========================================
  Files        1339      290    -1049     
  Lines       32669    10184   -22485     
  Branches     6189     2252    -3937     
==========================================
- Hits        19526     5072   -14454     
+ Misses      11296     4214    -7082     
+ Partials     1847      898     -949     

Flag	Coverage Δ
front	?
unit	49.80% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

Impacted Files	Coverage Δ
...ges/core/admin/admin/src/core/apis/CustomFields.js
...-builder/admin/src/components/FormModal/reducer.js
packages/plugins/color-picker/admin/src/index.js
...hooks/EditView/components/HeadersInput/Combobox.js
packages/plugins/i18n/admin/src/schemas.js
...ore/admin/admin/src/components/GuidedTour/index.js
...omponents/RelationInput/components/RelationList.js
...es/core/content-type-builder/admin/src/pluginId.js
...e/admin/admin/src/content-manager/utils/getTrad.js
...uilder/admin/src/components/ComponentList/index.js
... and 1039 more

Help us with your feedback. Take ten seconds to tell us how you rate us. Have a feature suggestion? Share it here.

☔ View full report at Codecov.
📢 Do you have feedback about the report comment? Let us know in this issue.

[Rymakarouf]

Test OK

[raphael-arce]

Hi @markkaylor is this "breaking change" maybe worth mentioning in the patch notes?
I was shown the error message: "Invariant Violation: 'type' must be prefixed with 'options.'" and struggled a bit to find out what the problem was and how to fix it.

Context: I was migrating from v4.4.7 to v4.5.6.

Also is there a specific reason why this prefix is necessary?