Skip to content

Commit

Permalink
fix(ui): disableBulkEdit on ui fields, defaults to true (#8540)
Browse files Browse the repository at this point in the history 
Fixes #8534

UI fields are now excluded by default from the bulk edit view fields
options.
If you need to have the UI field there, you can provide:
```ts
admin: {
  disableBulkEdit: false
}
```
  • Loading branch information
@r1tsuu
r1tsuu authored Oct 4, 2024
1 parent 157b1e1 commit cf8347f
Show file tree
Hide file tree
Showing 5 changed files with 26 additions and 18 deletions.
20 changes: 10 additions & 10 deletions docs/admin/fields.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,21 +40,21 @@ export const CollectionConfig: CollectionConfig = {

The following options are available:

| Option | Description |
| ------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **`condition`** | Programmatically show / hide fields based on other fields. [More details](../admin/fields#conditional-logic). |
| **`components`** | All Field Components can be swapped out for [Custom Components](../admin/components) that you define. [More details](../admin/fields). |
| **`description`** | Helper text to display alongside the field to provide more information for the editor. [More details](../admin/fields#description). |
| Option | Description |
| ----------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **`condition`** | Programmatically show / hide fields based on other fields. [More details](../admin/fields#conditional-logic). |
| **`components`** | All Field Components can be swapped out for [Custom Components](../admin/components) that you define. [More details](../admin/fields). |
| **`description`** | Helper text to display alongside the field to provide more information for the editor. [More details](../admin/fields#description). |
| **`position`** | Specify if the field should be rendered in the sidebar by defining `position: 'sidebar'`. |
| **`width`** | Restrict the width of a field. You can pass any string-based value here, be it pixels, percentages, etc. This property is especially useful when fields are nested within a `Row` type where they can be organized horizontally. |
| **`style`** | [CSS Properties](https://developer.mozilla.org/en-US/docs/Web/CSS) to inject into the root element of the field. |
| **`className`** | Attach a [CSS class attribute](https://developer.mozilla.org/en-US/docs/Web/CSS/Class_selectors) to the root DOM element of a field. |
| **`style`** | [CSS Properties](https://developer.mozilla.org/en-US/docs/Web/CSS) to inject into the root element of the field. |
| **`className`** | Attach a [CSS class attribute](https://developer.mozilla.org/en-US/docs/Web/CSS/Class_selectors) to the root DOM element of a field. |
| **`readOnly`** | Setting a field to `readOnly` has no effect on the API whatsoever but disables the admin component's editability to prevent editors from modifying the field's value. |
| **`disabled`** | If a field is `disabled`, it is completely omitted from the [Admin Panel](../admin/overview). |
| **`disableBulkEdit`** | Set `disableBulkEdit` to `true` to prevent fields from appearing in the select options when making edits for multiple documents. |
| **`disabled`** | If a field is `disabled`, it is completely omitted from the [Admin Panel](../admin/overview). |
| **`disableBulkEdit`** | Set `disableBulkEdit` to `true` to prevent fields from appearing in the select options when making edits for multiple documents. Defaults to `true` for UI fields. |
| **`disableListColumn`** | Set `disableListColumn` to `true` to prevent fields from appearing in the list view column selector. |
| **`disableListFilter`** | Set `disableListFilter` to `true` to prevent fields from appearing in the list view filter options. |
| **`hidden`** | Will transform the field into a `hidden` input type. Its value will still submit with requests in the Admin Panel, but the field itself will not be visible to editors. |
| **`hidden`** | Will transform the field into a `hidden` input type. Its value will still submit with requests in the Admin Panel, but the field itself will not be visible to editors. |

## Field Components

Expand Down
12 changes: 6 additions & 6 deletions docs/fields/ui.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,14 +28,14 @@ export const MyUIField: Field = {

## Config Options

| Option | Description |
| ------------------------------- | ---------------------------------------------------------------------------------------------------------------------- |
| **`name`** \* | A unique identifier for this field. |
| **`label`** | Human-readable label for this UI field. |
| Option | Description |
| ------------------------------- | ------------------------------------------------------------------------------------------------------------------- |
| **`name`** \* | A unique identifier for this field. |
| **`label`** | Human-readable label for this UI field. |
| **`admin.components.Field`** \* | React component to be rendered for this field within the Edit View. [More](../admin/components/#field-component) |
| **`admin.components.Cell`** | React component to be rendered as a Cell within collection List views. [More](../admin/components/#field-component) |
| **`admin.disableListColumn`** | Set `disableListColumn` to `true` to prevent the UI field from appearing in the list view column selector. |
| **`custom`** | Extension point for adding custom data (e.g. for plugins) |
| **`admin.disableListColumn`** | Set `disableListColumn` to `true` to prevent the UI field from appearing in the list view column selector. |
| **`custom`** | Extension point for adding custom data (e.g. for plugins) |

_\* An asterisk denotes that a property is required._

Expand Down
4 changes: 4 additions & 0 deletions packages/payload/src/fields/config/sanitize.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -289,6 +289,10 @@ export const sanitizeFields = async ({
}
}

if (field.type === 'ui' && typeof field.admin.disableBulkEdit === 'undefined') {
field.admin.disableBulkEdit = true
}

if ('_sanitized' in field) {
field._sanitized = true
}
Expand Down
4 changes: 4 additions & 0 deletions packages/payload/src/fields/config/types.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -832,6 +832,10 @@ export type UIField = {
condition?: Condition
/** Extension point to add your custom data. Available in server and client. */
custom?: Record<string, any>
/**
* Set `false` make the UI field appear in the list view column selector. `true` by default for UI fields.
* @default true
*/
disableBulkEdit?: boolean
/**
* Shows / hides fields from appearing in the list view column selector.
Expand Down
4 changes: 2 additions & 2 deletions packages/ui/src/elements/FieldSelect/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -90,9 +90,9 @@ const reduceFields = ({
}

return fields?.reduce((fieldsToUse, field) => {
// escape for a variety of reasons
// escape for a variety of reasons, include ui fields as they have `name`.
if (
fieldAffectsData(field) &&
(fieldAffectsData(field) || field.type === 'ui') &&
(field.admin.disableBulkEdit ||
field.unique ||
field.admin.hidden ||
Expand Down

0 comments on commit cf8347f

Please sign in to comment.