Add button for duplicating a row in an array #1261
Labels
Comments
|
Having looked a bit further into this, it seems this would potentially be doable via an Array Field Template: https://github.com/mozilla-services/react-jsonschema-form/blob/master/docs/advanced-customization.md - any of you know examples where a similar thing has been done? |
|
I don't know of an example of this being implemented, but I think you're right about the array field template. If you'd like to contribute a PR back to rjsf that does this, it would make sense to allow the duplicate functionality to be enabled through a property in the uiSchema such as |
7 tasks
|
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Please leave a comment if this is still an issue for you. Thank you. |
heath-freenome
added a commit
to heath-freenome/react-jsonschema-form
that referenced
this issue
Mar 15, 2023
Fixes rjsf-team#1261 and rjsf-team#1712 - In `@rjsf/utils`, updated types and functions to support array field copy AND global options in the `UiSchema` as follows: - Updated the `ArrayFieldTemplateItemType` to add support for copying array items - Refactored `UIOptionsBaseType` to extract the `addable`, `orderable`, `removable`, `label` and `duplicateKeySuffixSeparator` into a new `GlobalUISchemaOptions` type that adds `copyable` - Extended `UIOptionsBaseType` from `GlobalUISchemaOptions` - In `UiSchema` added a new optional `ui:globalOptions` prop of type `GlobalUISchemaOptions` and a new `UI_GLOBAL_OPTIONS_KEY` constant - Added a new optional prop `globalUiOptions` object of type `GlobalUISchemaOptions` in `Registry` as well as `CopyButton` in `ButtonTemplates` - Updated `getUiOptions()` and `getDisplayLabel()` (and its `SchemaUtilsType` counterpart) to take an optional `GlobalUISchemaOptions` parameter that is used to include global options into the returned `uiOptions` - In `@rjsf/core`, added support for array field copy and global options in the `UiSchema` as follows: - Updated `ArrayField` to handle global UI Options by passing in `registry.globalUiOptions` into `getUiOptions()` and by exposing the new `hasCopy` flag and `onCopyIndexClick` callback - Updated `ObjectField` to handle global UI Options for `duplicateKeySuffixSeparator` and also added support for the new `TranslatableString.InvalidObjectField` translation into a `Markdown` - Updated `SchemaField` to handle global UI Options for `label` - Added a new `CopyButton` implementation that was registered in the `ButtonTemplates` - Updated `ArrayFieldItemTemplate` to render the `CopyButton` when `hasCopy` is true, calling `onCopyIndexClick` on click - Updated `Form` to extract the `ui:globalOptions` from the `uiSchema` and set it into the `registry` as `globalUiOptions` - Updated tests to verify all the new functionality - In all the themes, added support for array field copy as follows: - Added a new `CopyButton` implementation that was registered in the `ButtonTemplates` - Updated `ArrayFieldItemTemplate` to render the `CopyButton` when `hasCopy` is true, calling `onCopyIndexClick` on click - Updated the Array tests to verify that copy shows up when `copyable` is true - In `@rjsf/antd` and `@rjsf/semantic-ui` updated the styles to support the additional button in `ArrayFieldItemTemplate` - In `@rjsf/fluent-ui`, fixed some bad style errors in the console by removing the `;` at the end of the `fontFamily` custom styles - In `@rjsf/semantic-ui`, removed some bad property warnings by changing the `inverted` prop from `false` to `'false'` - In `@rjsf/docs`, updated the documentation for all the copy feature and global `UiSchema` options type updates - Also replaced all `js(x)` code blocks with `ts(x)` code blocks to be complete - Updated the `CHANGELOG.md` accordingly
heath-freenome
added a commit
to heath-freenome/react-jsonschema-form
that referenced
this issue
Mar 15, 2023
Fixes rjsf-team#1261 and rjsf-team#1712 by adding copy array item capability as well as global `UiSchema` options - In `@rjsf/utils`, updated types and functions to support array field copy AND global options in the `UiSchema` as follows: - Updated the `ArrayFieldTemplateItemType` to add support for copying array items - Refactored `UIOptionsBaseType` to extract the `addable`, `orderable`, `removable`, `label` and `duplicateKeySuffixSeparator` into a new `GlobalUISchemaOptions` type that adds `copyable` - Extended `UIOptionsBaseType` from `GlobalUISchemaOptions` - In `UiSchema` added a new optional `ui:globalOptions` prop of type `GlobalUISchemaOptions` and a new `UI_GLOBAL_OPTIONS_KEY` constant - Added a new optional prop `globalUiOptions` object of type `GlobalUISchemaOptions` in `Registry` as well as `CopyButton` in `ButtonTemplates` - Updated `getUiOptions()` and `getDisplayLabel()` (and its `SchemaUtilsType` counterpart) to take an optional `GlobalUISchemaOptions` parameter that is used to include global options into the returned `uiOptions` - In `@rjsf/core`, added support for array field copy and global options in the `UiSchema` as follows: - Updated `ArrayField` to handle global UI Options by passing in `registry.globalUiOptions` into `getUiOptions()` and by exposing the new `hasCopy` flag and `onCopyIndexClick` callback - Updated `ObjectField` to handle global UI Options for `duplicateKeySuffixSeparator` and also added support for the new `TranslatableString.InvalidObjectField` translation into a `Markdown` - Updated `SchemaField` to handle global UI Options for `label` - Added a new `CopyButton` implementation that was registered in the `ButtonTemplates` - Updated `ArrayFieldItemTemplate` to render the `CopyButton` when `hasCopy` is true, calling `onCopyIndexClick` on click - Updated `Form` to extract the `ui:globalOptions` from the `uiSchema` and set it into the `registry` as `globalUiOptions` - Updated tests to verify all the new functionality - In all the themes, added support for array field copy as follows: - Added a new `CopyButton` implementation that was registered in the `ButtonTemplates` - Updated `ArrayFieldItemTemplate` to render the `CopyButton` when `hasCopy` is true, calling `onCopyIndexClick` on click - Updated the Array tests to verify that copy shows up when `copyable` is true - In `@rjsf/antd` and `@rjsf/semantic-ui` updated the styles to support the additional button in `ArrayFieldItemTemplate` - In `@rjsf/fluent-ui`, fixed some bad style errors in the console by removing the `;` at the end of the `fontFamily` custom styles - In `@rjsf/semantic-ui`, removed some bad property warnings by changing the `inverted` prop from `false` to `'false'` - In `@rjsf/docs`, updated the documentation for all the copy feature and global `UiSchema` options type updates - Also replaced all `js(x)` code blocks with `ts(x)` code blocks to be complete - Updated the `CHANGELOG.md` accordingly
heath-freenome
added a commit
to heath-freenome/react-jsonschema-form
that referenced
this issue
Mar 15, 2023
Fixes rjsf-team#1261 and rjsf-team#1712 by adding copy array item capability as well as global `UiSchema` options - In `@rjsf/utils`, updated types and functions to support array field copy AND global options in the `UiSchema` as follows: - Updated the `ArrayFieldTemplateItemType` to add support for copying array items - Added a new `TranslatableString` enums `CopyButton` and `InvalidObjectField` that localizes the information extracted from `ObjectField` as markdown - Refactored `UIOptionsBaseType` to extract the `addable`, `orderable`, `removable`, `label` and `duplicateKeySuffixSeparator` into a new `GlobalUISchemaOptions` type that adds `copyable` - Extended `UIOptionsBaseType` from `GlobalUISchemaOptions` - In `UiSchema` added a new optional `ui:globalOptions` prop of type `GlobalUISchemaOptions` and a new `UI_GLOBAL_OPTIONS_KEY` constant - Added a new optional prop `globalUiOptions` object of type `GlobalUISchemaOptions` in `Registry` as well as `CopyButton` in `ButtonTemplates` - Updated `getUiOptions()` and `getDisplayLabel()` (and its `SchemaUtilsType` counterpart) to take an optional `GlobalUISchemaOptions` parameter that is used to include global options into the returned `uiOptions` - In `@rjsf/core`, added support for array field copy and global options in the `UiSchema` as follows: - Updated `ArrayField` to handle global UI Options by passing in `registry.globalUiOptions` into `getUiOptions()` and by exposing the new `hasCopy` flag and `onCopyIndexClick` callback - Updated `ObjectField` to handle global UI Options for `duplicateKeySuffixSeparator` and also added support for the new `TranslatableString.InvalidObjectField` translation into a `Markdown` - Updated `SchemaField` to handle global UI Options for `label` - Added a new `CopyButton` implementation that was registered in the `ButtonTemplates` - Updated `ArrayFieldItemTemplate` to render the `CopyButton` when `hasCopy` is true, calling `onCopyIndexClick` on click - Updated `Form` to extract the `ui:globalOptions` from the `uiSchema` and set it into the `registry` as `globalUiOptions` - Updated tests to verify all the new functionality - In all the themes, added support for array field copy as follows: - Added a new `CopyButton` implementation that was registered in the `ButtonTemplates` - Updated `ArrayFieldItemTemplate` to render the `CopyButton` when `hasCopy` is true, calling `onCopyIndexClick` on click - Updated the Array tests to verify that copy shows up when `copyable` is true - In `@rjsf/antd` and `@rjsf/semantic-ui` updated the styles to support the additional button in `ArrayFieldItemTemplate` - In `@rjsf/fluent-ui`, fixed some bad style errors in the console by removing the `;` at the end of the `fontFamily` custom styles - In `@rjsf/semantic-ui`, removed some bad property warnings by changing the `inverted` prop from `false` to `'false'` - In `@rjsf/docs`, updated the documentation for all the copy feature and global `UiSchema` options type updates - Also replaced all `js(x)` code blocks with `ts(x)` code blocks to be complete - Updated the `CHANGELOG.md` accordingly
8 tasks
heath-freenome
added a commit
to heath-freenome/react-jsonschema-form
that referenced
this issue
Mar 16, 2023
Fixes rjsf-team#1261 and rjsf-team#1712 by adding copy array item capability as well as global `UiSchema` options - In `@rjsf/utils`, updated types and functions to support array field copy AND global options in the `UiSchema` as follows: - Updated the `ArrayFieldTemplateItemType` to add support for copying array items - Added a new `TranslatableString` enums `CopyButton` and `InvalidObjectField` that localizes the information extracted from `ObjectField` as markdown - Refactored `UIOptionsBaseType` to extract the `addable`, `orderable`, `removable`, `label` and `duplicateKeySuffixSeparator` into a new `GlobalUISchemaOptions` type that adds `copyable` - Extended `UIOptionsBaseType` from `GlobalUISchemaOptions` - In `UiSchema` added a new optional `ui:globalOptions` prop of type `GlobalUISchemaOptions` and a new `UI_GLOBAL_OPTIONS_KEY` constant - Added a new optional prop `globalUiOptions` object of type `GlobalUISchemaOptions` in `Registry` as well as `CopyButton` in `ButtonTemplates` - Updated `getUiOptions()` and `getDisplayLabel()` (and its `SchemaUtilsType` counterpart) to take an optional `GlobalUISchemaOptions` parameter that is used to include global options into the returned `uiOptions` - In `@rjsf/core`, added support for array field copy and global options in the `UiSchema` as follows: - Updated `ArrayField` to handle global UI Options by passing in `registry.globalUiOptions` into `getUiOptions()` and by exposing the new `hasCopy` flag and `onCopyIndexClick` callback - Updated `ObjectField` to handle global UI Options for `duplicateKeySuffixSeparator` and also added support for the new `TranslatableString.InvalidObjectField` translation into a `Markdown` - Updated `SchemaField` to handle global UI Options for `label` - Added a new `CopyButton` implementation that was registered in the `ButtonTemplates` - Updated `ArrayFieldItemTemplate` to render the `CopyButton` when `hasCopy` is true, calling `onCopyIndexClick` on click - Updated `Form` to extract the `ui:globalOptions` from the `uiSchema` and set it into the `registry` as `globalUiOptions` - Updated tests to verify all the new functionality - In all the themes, added support for array field copy as follows: - Added a new `CopyButton` implementation that was registered in the `ButtonTemplates` - Updated `ArrayFieldItemTemplate` to render the `CopyButton` when `hasCopy` is true, calling `onCopyIndexClick` on click - Updated the Array tests to verify that copy shows up when `copyable` is true - In `@rjsf/antd` and `@rjsf/semantic-ui` updated the styles to support the additional button in `ArrayFieldItemTemplate` - In `@rjsf/fluent-ui`, fixed some bad style errors in the console by removing the `;` at the end of the `fontFamily` custom styles - In `@rjsf/semantic-ui`, removed some bad property warnings by changing the `inverted` prop from `false` to `'false'` - In `@rjsf/docs`, updated the documentation for all the copy feature and global `UiSchema` options type updates - Also replaced all `js(x)` code blocks with `ts(x)` code blocks to be complete - Updated the `CHANGELOG.md` accordingly
heath-freenome
added a commit
that referenced
this issue
Mar 16, 2023
* feature: Reimplement and improve #1719 to Add array field copy Fixes #1261 and #1712 by adding copy array item capability as well as global `UiSchema` options - In `@rjsf/utils`, updated types and functions to support array field copy AND global options in the `UiSchema` as follows: - Updated the `ArrayFieldTemplateItemType` to add support for copying array items - Added a new `TranslatableString` enums `CopyButton` and `InvalidObjectField` that localizes the information extracted from `ObjectField` as markdown - Refactored `UIOptionsBaseType` to extract the `addable`, `orderable`, `removable`, `label` and `duplicateKeySuffixSeparator` into a new `GlobalUISchemaOptions` type that adds `copyable` - Extended `UIOptionsBaseType` from `GlobalUISchemaOptions` - In `UiSchema` added a new optional `ui:globalOptions` prop of type `GlobalUISchemaOptions` and a new `UI_GLOBAL_OPTIONS_KEY` constant - Added a new optional prop `globalUiOptions` object of type `GlobalUISchemaOptions` in `Registry` as well as `CopyButton` in `ButtonTemplates` - Updated `getUiOptions()` and `getDisplayLabel()` (and its `SchemaUtilsType` counterpart) to take an optional `GlobalUISchemaOptions` parameter that is used to include global options into the returned `uiOptions` - In `@rjsf/core`, added support for array field copy and global options in the `UiSchema` as follows: - Updated `ArrayField` to handle global UI Options by passing in `registry.globalUiOptions` into `getUiOptions()` and by exposing the new `hasCopy` flag and `onCopyIndexClick` callback - Updated `ObjectField` to handle global UI Options for `duplicateKeySuffixSeparator` and also added support for the new `TranslatableString.InvalidObjectField` translation into a `Markdown` - Updated `SchemaField` to handle global UI Options for `label` - Added a new `CopyButton` implementation that was registered in the `ButtonTemplates` - Updated `ArrayFieldItemTemplate` to render the `CopyButton` when `hasCopy` is true, calling `onCopyIndexClick` on click - Updated `Form` to extract the `ui:globalOptions` from the `uiSchema` and set it into the `registry` as `globalUiOptions` - Updated tests to verify all the new functionality - In all the themes, added support for array field copy as follows: - Added a new `CopyButton` implementation that was registered in the `ButtonTemplates` - Updated `ArrayFieldItemTemplate` to render the `CopyButton` when `hasCopy` is true, calling `onCopyIndexClick` on click - Updated the Array tests to verify that copy shows up when `copyable` is true - In `@rjsf/antd` and `@rjsf/semantic-ui` updated the styles to support the additional button in `ArrayFieldItemTemplate` - In `@rjsf/fluent-ui`, fixed some bad style errors in the console by removing the `;` at the end of the `fontFamily` custom styles - In `@rjsf/semantic-ui`, removed some bad property warnings by changing the `inverted` prop from `false` to `'false'` - In `@rjsf/docs`, updated the documentation for all the copy feature and global `UiSchema` options type updates - Also replaced all `js(x)` code blocks with `ts(x)` code blocks to be complete - Updated the `CHANGELOG.md` accordingly * Apply suggestions from code review - Responded to reviewer and self feedback Co-authored-by: Nick Grosenbacher <nickgrosenbacher@gmail.com> * Update packages/utils/src/getUiOptions.ts * - Fixed format issue --------- Co-authored-by: Nick Grosenbacher <nickgrosenbacher@gmail.com>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Description
Arrays currently support buttons for adding/moving/deleting a row.
However, often it would be very useful to have a button for duplicating a row. The reason is that the array system is often used to create several semi-similar rows. The duplication button would save massive time for users.
I couldn't find prior discussions of this, but would be happy to hear your thoughts.
Martin
The text was updated successfully, but these errors were encountered: