2020-03-20 14:21:24 +00:00
|
|
|
{
|
2020-07-11 06:42:53 +00:00
|
|
|
"editIcon": ".t--widget-propertypane-toggle",
|
|
|
|
|
"helpIcon": ".t--widget-help-control",
|
|
|
|
|
"editPropCrossButton": ".t--property-pane-close-btn",
|
2023-05-19 18:37:06 +00:00
|
|
|
"editPropBackButton": "[data-testid='t--property-pane-back-btn']",
|
2020-07-11 06:42:53 +00:00
|
|
|
"deleteWidgetIcon": ".t--widget-delete-control",
|
|
|
|
|
"dropdownSelectButton": ".t--open-dropdown-Select-Action",
|
|
|
|
|
"crossbutton": ".t--property-pane-close-btn",
|
|
|
|
|
"dropdownAction": ".t--open-dropdown-Select-Action",
|
|
|
|
|
"datatypedropdown": ".t--property-control-datatype button",
|
|
|
|
|
"Alerttypedropdown": ".t--open-dropdown-Select-type",
|
2023-05-19 18:37:06 +00:00
|
|
|
"dropdownmenu": ".rc-select-item-option-content",
|
2020-07-11 06:42:53 +00:00
|
|
|
"containerInnerText": ".t--draggable-containerwidget span.t--widget-name",
|
2022-06-29 11:54:50 +00:00
|
|
|
"optionchangetextDropdown": " .t--property-control-onoptionchange .CodeMirror textarea",
|
2020-11-11 11:29:45 +00:00
|
|
|
"optionchangetextDatePicker": " .t--property-control-ondateselected .CodeMirror-code",
|
2020-07-11 06:42:53 +00:00
|
|
|
"optionchangetextCheckbox": ".t--property-control-oncheckchange .CodeMirror-code",
|
2021-07-07 03:46:16 +00:00
|
|
|
"optionchangetextSwitch": ".t--property-control-onchange .CodeMirror textarea",
|
2020-07-11 06:42:53 +00:00
|
|
|
"optionchangetextInput": ".t--property-control-ontextchanged .CodeMirror-code",
|
2021-07-07 03:46:16 +00:00
|
|
|
"optionchangeRadioselect": ".t--property-control-onselectionchange .CodeMirror textarea",
|
2023-05-19 18:37:06 +00:00
|
|
|
"optionalignment": ".t--property-control-alignment input",
|
|
|
|
|
"optionposition": ".t--property-control-position span:contains('Right')",
|
|
|
|
|
"optionpositionL": ".t--property-control-position span:contains('Left')",
|
2020-07-11 06:42:53 +00:00
|
|
|
"onMarkerclick": ".t--property-control-onmarkerclick .CodeMirror-code",
|
|
|
|
|
"success": "div[type='success'] span",
|
|
|
|
|
"mapOptionChange": ".t--property-control-onmarkerclick .CodeMirror-code",
|
|
|
|
|
"dropdownbuttonclick": ".bp3-button",
|
|
|
|
|
"menuSelection": ".bp3-button > .bp3-button-text",
|
|
|
|
|
"scrollView": ".t--property-control-scrollcontents input",
|
|
|
|
|
"InputforText": ".t--property-control-text .CodeMirror-code",
|
|
|
|
|
"TextInside": ".bp3-ui-text span",
|
2020-08-07 06:56:47 +00:00
|
|
|
"homeIcon": ".t--appsmith-logo",
|
2020-07-11 06:42:53 +00:00
|
|
|
"typeWidgetName": ".bp3-editable-text-editing>input",
|
|
|
|
|
"requiredCheckbox": ".t--property-control-required input[type='checkbox']",
|
|
|
|
|
"visibleCheckbox": ".t--property-control-visible input[type='checkbox']",
|
2021-12-06 05:56:44 +00:00
|
|
|
"allowSelectAllCheckbox": ".t--property-control-allowselectall input[type='checkbox']",
|
2023-05-11 05:26:03 +00:00
|
|
|
"selectAllOptions": ".t--property-control-selectalloptions input[type='checkbox']",
|
2020-07-11 06:42:53 +00:00
|
|
|
"disableCheckbox": ".t--property-control-disabled input[type='checkbox']",
|
2023-05-19 18:37:06 +00:00
|
|
|
"hideToolbarCheckbox": ".t--property-control-hidetoolbar input[type='checkbox']",
|
2020-07-11 06:42:53 +00:00
|
|
|
"labelTextStyle": ".bp3-ui-text span",
|
2021-04-01 08:30:33 +00:00
|
|
|
"bodyTextStyle": ".bp3-ui-text span",
|
|
|
|
|
"headingTextStyle": ".bp3-ui-text span",
|
2023-03-23 05:43:07 +00:00
|
|
|
"propertyPaneTitle": ".t--property-pane-title",
|
2023-05-19 18:37:06 +00:00
|
|
|
"dropDownIcon": ".t--property-control-fontsize input",
|
2020-07-11 06:42:53 +00:00
|
|
|
"onDateSelectedField": ".t--property-control-ondateselected",
|
|
|
|
|
"TableRow": ".t--draggable-tablewidget .tbody",
|
2022-07-14 07:02:35 +00:00
|
|
|
"TableV2Row": ".t--draggable-tablewidgetv2 .tbody",
|
2022-09-01 06:10:19 +00:00
|
|
|
"TableV2Head": ".t--draggable-tablewidgetv2 .thead",
|
2020-07-11 06:42:53 +00:00
|
|
|
"Disablejs": ".t--property-control-disabled",
|
2021-11-12 07:34:10 +00:00
|
|
|
"spellCheck": ".t--property-control-spellcheck",
|
2020-07-11 06:42:53 +00:00
|
|
|
"requiredjs": ".t--property-control-required",
|
2021-10-25 11:39:39 +00:00
|
|
|
"allowScroll": ".t--property-control-allowscroll input",
|
2020-07-11 06:42:53 +00:00
|
|
|
"tableInner": ".t--draggable-tablewidget span.t--widget-name",
|
2022-07-14 07:02:35 +00:00
|
|
|
"tableV2Inner": ".t--draggable-tablewidgetv2 span.t--widget-name",
|
2022-02-25 06:13:16 +00:00
|
|
|
"buttonInner": ".t--draggable-buttonwidget span.t--widget-name",
|
|
|
|
|
"inputWidgetInner": ".t--draggable-inputwidgetv2 span.t--widget-name",
|
2020-07-11 06:42:53 +00:00
|
|
|
"pdfSupport": ".t--property-control-pdfexport input",
|
|
|
|
|
"ExcelSupport": ".t--property-control-excelexport input",
|
2023-05-19 18:37:06 +00:00
|
|
|
"dropDownBtn": "input",
|
2020-07-11 06:42:53 +00:00
|
|
|
"disabledField": " .bp3-disabled",
|
|
|
|
|
"disabledBtn": " button[disabled='disabled']",
|
2021-10-13 12:40:52 +00:00
|
|
|
"rteToolbar": " .tox-toolbar__primary",
|
2020-07-11 06:42:53 +00:00
|
|
|
"inputField": " .bp3-input",
|
|
|
|
|
"csvSupport": ".t--property-control-csvexport input",
|
|
|
|
|
"backToEditor": ".t--back-to-editor",
|
|
|
|
|
"enableSearchLocCheckbox": ".t--property-control-enablesearchlocation input",
|
|
|
|
|
"enablePickLocCheckbox": ".t--property-control-enablepicklocation input",
|
|
|
|
|
"enableCreateMarkerCheckbox": ".t--property-control-createnewmarker input",
|
|
|
|
|
"widgetNameTag": "span.t--widget-name",
|
|
|
|
|
"serverSidePaginationCheckbox": ".t--property-control-serversidepagination input",
|
|
|
|
|
"rightArrowBtn": "span[icon='chevron-right']",
|
2023-05-19 18:37:06 +00:00
|
|
|
"toastMsg": "div.Toastify__toast",
|
2020-07-11 06:42:53 +00:00
|
|
|
"callApi": ".t--property-control-onpagechange .t--open-dropdown-Select-Action",
|
2022-03-22 16:52:26 +00:00
|
|
|
"singleSelectMenuItem": ".bp3-menu-item.single-select div",
|
2022-04-03 16:43:20 +00:00
|
|
|
"singleSelectWidgetMenuItem": ".menu-item-link",
|
fix: isRequired validation property for table select column (#36375)
## Description
**Problem**
The select column of the table widget does not have a validation
property within its property pane to allow users add an isRequired
validation to the table select column.
**Solution**
Added a Validation section to the table select column's property pane,
which includes an isRequired toggle. When enabled, this feature will
trigger a visual indication (error border colour) around the select
widget if a required field is left unselected during "Add new row" or
inline editing.
Fixes #30091
## Automation
/ok-to-test tags="@tag.Widget, @tag.Table, @tag.Binding, @tag.Sanity,
@tag.Select"
### :mag: Cypress test results
<!-- This is an auto-generated comment: Cypress test results -->
> [!TIP]
> 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉
> Workflow run:
<https://github.com/appsmithorg/appsmith/actions/runs/10957896180>
> Commit: d2597e6a26938f2b99f2f997fca7bc110e5c2091
> <a
href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=10957896180&attempt=1"
target="_blank">Cypress dashboard</a>.
> Tags: `@tag.Widget, @tag.Table, @tag.Binding, @tag.Sanity,
@tag.Select`
> Spec:
> <hr>Fri, 20 Sep 2024 12:23:29 UTC
<!-- end of auto-generated comment: Cypress test results -->
## Communication
Should the DevRel and Marketing teams inform users about this change?
- [ ] Yes
- [x] No
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
- **New Features**
- Introduced end-to-end tests for Select column validation in Table
widgets.
- Enhanced validation logic to support Select column types in the Table
widget.
- Added visual feedback for required Select fields during row addition
and inline editing.
- Improved locator for single-select widget button control to enhance UI
interaction.
- **Bug Fixes**
- Improved error handling and visual representation for invalid editable
Select cells.
- **Documentation**
- Updated validation configuration to include Select column types for
better usability.
- **Refactor**
- Enhanced code clarity for styled components related to Select fields.
- Modified method to improve versatility in handling table interactions.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Sai Charan <saicharan.chetpelly@zemosolabs.com>
Co-authored-by: Pawan Kumar <pawankumar@Pawans-MacBook-Pro-2.local>
2024-09-23 07:44:46 +00:00
|
|
|
"singleSelectWidgetButtonControl": ".bp3-button.select-button",
|
2022-03-21 14:45:17 +00:00
|
|
|
"singleSelectActiveMenuItem": ".menu-item-active div",
|
2023-05-19 18:37:06 +00:00
|
|
|
"selectInputSearch": ".select-popover-wrapper .bp3-input",
|
2021-08-03 06:38:01 +00:00
|
|
|
"multiSelectMenuItem": "rc-select-item.rc-select-item-option div",
|
2020-07-11 06:42:53 +00:00
|
|
|
"selectMenuItem": ".bp3-menu li>a>div",
|
2021-07-26 05:50:46 +00:00
|
|
|
"evaluatedTypeTitle": ".t--CodeEditor-evaluatedValue > p:first-of-type",
|
|
|
|
|
"evaluatedType": ".t--CodeEditor-evaluatedValue > div:first-of-type pre",
|
2021-11-26 10:47:53 +00:00
|
|
|
"evaluatedCurrentValue": "div:last-of-type .t--CodeEditor-evaluatedValue > div:last-of-type pre",
|
Feature/entity browse (#220)
# New Feature: Entity Explorer
- Entities are actions (apis and queries), datasources, pages, and widgets
- With this new feature, all entities in the application will be available
to view in the new entity explorer sidebar
- All existing application features from the api sidebar, query sidebar, datasource sidebar and pages sidebar
now are avialable on the entity explorer sidebar
- Users are now able to quickly switch to any entity in the application from the entity explorer sidebar.
- Users can also search all entities in the application from the new sidebar. Use cmd + f or ctrl + f to focus on the search input
- Users can rename entities from the new sidebar
- Users can also perform contextual actions on these entities like set a page as home page, copy/move actions, delete entity, etc from the context menu available alongside the entities in the sidebar
- Users can view the properties of the entities in the sidebar, as well as copy bindings to use in the application.
2020-08-10 08:52:45 +00:00
|
|
|
"entityExplorersearch": "#entity-explorer-search",
|
2020-08-07 06:56:47 +00:00
|
|
|
"saveStatusContainer": ".t--save-status-container",
|
2023-05-11 05:26:03 +00:00
|
|
|
"statusSaving": ".t--save-status-is-saving",
|
2020-09-08 13:04:51 +00:00
|
|
|
"saveStatusError": ".t--save-status-error",
|
2022-03-21 14:45:17 +00:00
|
|
|
"selectWidgetVirtualList": ".menu-virtual-list div",
|
2020-09-08 13:04:51 +00:00
|
|
|
"tableNextPage": ".t--table-widget-next-page",
|
2020-09-21 05:57:54 +00:00
|
|
|
"tablePrevPage": ".t--table-widget-prev-page",
|
2020-10-09 14:34:14 +00:00
|
|
|
"toastmsg": ".Toastify__toast-body span",
|
2023-05-19 18:37:06 +00:00
|
|
|
"copyWidget": "[data-testid='t--copy-widget']",
|
|
|
|
|
"deleteWidget": "[data-testid='t--delete-widget']",
|
2021-12-29 05:41:30 +00:00
|
|
|
"dropTarget": ".t--drop-target",
|
2023-05-19 18:37:06 +00:00
|
|
|
"toastAction": "div.Toastify__toast",
|
2020-11-12 12:04:44 +00:00
|
|
|
"toastBody": ".Toastify__toast-body",
|
2020-10-09 15:06:28 +00:00
|
|
|
"videoInner": ".t--draggable-videowidget span.t--widget-name",
|
2021-09-24 16:05:53 +00:00
|
|
|
"audioInner": ".t--draggable-audiowidget span.t--widget-name",
|
2020-10-09 15:06:28 +00:00
|
|
|
"onPlay": ".t--property-control-onplay .t--open-dropdown-Select-Action",
|
|
|
|
|
"chooseAction": ".single-select",
|
2020-10-14 05:19:08 +00:00
|
|
|
"chooseMsgType": ".t--open-dropdown-Select-type",
|
2020-11-12 12:04:44 +00:00
|
|
|
"onPause": ".t--property-control-onpause .t--open-dropdown-Select-Action",
|
2023-05-23 05:47:47 +00:00
|
|
|
"chooseWidget": ".t--open-dropdown-Select-widget",
|
2022-12-07 15:10:28 +00:00
|
|
|
"onClick": ".t--property-control-onclick .t--open-dropdown-Select-Action",
|
2023-05-19 18:37:06 +00:00
|
|
|
"changeZoomlevel": ".t--property-control-maxzoomlevel input",
|
|
|
|
|
"selectedZoomlevel": ".t--property-control-maxzoomlevel .rc-select-selection-item span",
|
2020-11-26 09:45:03 +00:00
|
|
|
"imgWidget": "div[data-testid='styledImage']",
|
2022-05-25 10:05:53 +00:00
|
|
|
"editColTitle": ".t--property-pane-title",
|
|
|
|
|
"editColText": ".t--property-pane-title span",
|
2023-05-19 18:37:06 +00:00
|
|
|
"changeColType": ".t--property-control-columntype input",
|
feat: add sortBy property to table select cell type (#35187)
## Description
**Problem**
The table widget now supports the Select column type, which allows the
column to contain both a label and a value. This could be useful for
currency fields, foreign keys, or any other case where you want to
display a different version of the column value. However, there is a
problem with sorting. The table always sorts using the value, and does
not give the user an option to sort using the label, where it makes
sense in specific cases.
**Solution**
This PR adds a Sort By property to the table select cell, allowing the
users to choose which value is used for sorting without affecting any
functionality of the label or value of the select cell.
[Additional Technical
Documentation](https://www.notion.so/appsmith/Adding-sortBy-Property-to-Select-Columns-in-Table-Widget-V2-a5a41e6319a047378eb50a42be8c32ef?pvs=4)
**Tested Cases**
1. Sort select column by default value
Objective: Ensure that a newly added table with select column default
sorts by the value
**Steps:**
- Drop a new table widget.
- Add sample data to the table.
- Set a column (e.g., role) to select type.
- Add selectOptions property
- Verify that when sorted in ascending or descending order, the sorting
is correct
2. Sort select column by label
Objective: Ensure that a newly added table with select column and sortBy
property set to label sorts correctly
**Steps:**
- Drop a new table widget.
- Add sample data to the table.
- Set a column (e.g., role) to select type
- Add selectOptions property
- Set sortBy property to label
- Verify that when sorted in ascending or descending order, the sorting
is correct and based on the label value only
3. Verify that sorting of other table cells that are not select works as
expected
Objective: Ensure that every other cell type in the table sorts
correctly
**Steps:**
- Drop a new table widget.
- Add sample data to the table.
- Set a column (e.g., role) to select type
- Add selectOptions property
- Set sortBy property to label
- Verify that when columns other that role are sorted, they are sorted
correctly
4. Verify that sorting works as expected when table data is a binding
Objective: Ensure that the sorting works for all columns while using
data binding in table data
**Steps:**
- Drop a new table widget
- Link a query binding to the table data property
- Verify that all columns sort correctly
5. Verify that sorting works as expected when table data is a binding
and select column sorting is set to label
Objective: Ensure that the sorting works for all columns while using
data binding in table data with a select column set to sort by the label
**Steps:**
- Drop a new table widget
- Link a query binding to the table data property
- Set a column (e.g., role) to select type
- Add selectOptions property
- Set sortBy property to label
- Verify that all columns sort correctly
6. Verify that sortBy logic does not take effect or break user
experience until the user adds selectOptions in select cell
**Steps:**
- Drop a new table widget
- Link a query binding to the table data property or add raw data
- Set a column (e.g., role) to select type
- Do not add selectOptions
- Set sortBy property to label
- Verify that all other columns display and sort correctly
7. Verify that sorting by label and value works correctly in deployed
mode
**Steps:**
- Drop a new table widget
- Link a query binding to the table data property or add raw data
- Set a column (e.g., role) to select type
- Add selectOptions
- Set sortBy property to label
- Deploy application
- Confirm that sorting works correctly for all columns
Fixes #21993
## Automation
/ok-to-test tags="@tag.Table, @tag.Binding, @tag.Sanity"
### :mag: Cypress test results
<!-- This is an auto-generated comment: Cypress test results -->
> [!TIP]
> 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉
> Workflow run:
<https://github.com/appsmithorg/appsmith/actions/runs/10165119164>
> Commit: 8a4e8b238adc0d78726a811b54a209caa4990606
> <a
href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=10165119164&attempt=1"
target="_blank">Cypress dashboard</a>.
> Tags: `@tag.Table, @tag.Binding, @tag.Sanity`
> Spec:
> <hr>Tue, 30 Jul 2024 16:02:35 UTC
<!-- end of auto-generated comment: Cypress test results -->
## Communication
Should the DevRel and Marketing teams inform users about this change?
- [x] Yes
- [ ] No
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
- **New Features**
- Introduced a feature flag for dynamic table cell labeling.
- Added a sorting option for select cells, allowing sort by value or
label.
- Enhanced user interface with new configuration options for select
components.
- Improved sorting functionality for select columns to sort by labels.
- **Bug Fixes**
- Improved sorting functionality in the table widget to ensure accurate
data representation.
- **Tests**
- Expanded and clarified test cases for sorting functionality in the
Table Widget V2.
- Updated testing structure for better reliability and isolation of test
scenarios.
- Integrated dynamic testing capabilities based on feature flags.
- **Documentation**
- Added new locators for sorting controls to enhance UI interaction
capabilities.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2024-08-02 07:37:00 +00:00
|
|
|
"changeSortBy": ".t--property-control-sortby input",
|
2021-02-16 10:29:08 +00:00
|
|
|
"selectedColType": ".t--property-control-columntype button span",
|
2021-04-05 11:55:27 +00:00
|
|
|
"collapsesection": ".t--property-pane-section-collapse-general .bp3-icon",
|
2020-12-03 05:32:50 +00:00
|
|
|
"selectTab": ".t--tab-Tab",
|
2023-05-19 18:37:06 +00:00
|
|
|
"layoutControls": ".t--layout-control-wrapper > .ads-v2-segmented-control div",
|
2021-03-03 05:26:47 +00:00
|
|
|
"layoutPopover": ".bp3-popover.bp3-minimal.layout-control",
|
|
|
|
|
"canvas": ".t--canvas-artboard",
|
2020-12-10 05:22:19 +00:00
|
|
|
"deflautSelectedRow": ".t--property-control-defaultselectedrow textarea",
|
|
|
|
|
"defaultSearchText": ".t--property-control-defaultsearchtext textarea",
|
2021-12-03 06:24:08 +00:00
|
|
|
"entityItem": ".t--entity-item",
|
|
|
|
|
"entityCollapseToggle": ".t--entity-collapse-toggle",
|
2022-01-29 07:26:19 +00:00
|
|
|
"entityContextMenu": ".t--context-menu",
|
|
|
|
|
"entityContextMenuContent": ".t--entity-context-menu",
|
2020-12-03 05:32:50 +00:00
|
|
|
"filePickerButton": ".t--widget-filepickerwidget",
|
|
|
|
|
"filePickerInput": ".uppy-Dashboard-input",
|
|
|
|
|
"filePickerUploadButton": ".uppy-StatusBar-actionBtn--upload",
|
2023-06-20 14:37:30 +00:00
|
|
|
"filePickerRemoveButton": ".uppy-Dashboard-Item-action--remove",
|
2023-02-14 16:07:31 +00:00
|
|
|
"AddMoreFiles": ".uppy-DashboardContent-addMoreCaption",
|
2020-12-15 05:04:30 +00:00
|
|
|
"filePickerOnFilesSelected": ".t--property-control-onfilesselected",
|
2023-05-19 18:37:06 +00:00
|
|
|
"dataType": ".t--property-control-datatype input",
|
|
|
|
|
"recaptchaVersion": ".t--property-control-googlerecaptchaversion input",
|
|
|
|
|
"recaptchaVersionText": ".t--property-control-googlerecaptchaversion span.rc-select-selection-item span",
|
|
|
|
|
"filePickerDataFormat": ".t--property-control-dataformat .rc-select-selection-item",
|
2022-09-21 12:59:17 +00:00
|
|
|
"helperText": ".t--property-control-helperText",
|
2023-05-19 18:37:06 +00:00
|
|
|
"jsonFormFieldType": ".t--property-control-fieldtype input",
|
feat: JSON Form widget (#8472)
* initial layout
* updated parser to support nested array
* array field rendering
* changes
* ts fix
* minor revert FormWidget
* modified schema structure
* select and switch fields
* added checkbox field
* added RadioGroupField
* partial DateField and defaults, typing refactoring
* added label and field type change
* minor ts changes
* changes
* modified widget/utils for nested panelConfig, modified schema to object approach
* array/object label support
* hide field configuration when children not present
* added tooltip
* field visibility option
* disabled state
* upgraded tslib, form initial values
* custom field configuration - add/hide/edit
* field configuration - label change
* return input when field configuration reaches max depth
* minor changes
* form - scroll, fixedfooter, enitity defn and other minior changes
* form title
* unregister on unmount
* fixes
* zero state
* fix field padding
* patched updating form values, removed linting warnings
* configured action buttons
* minor fix
* minor change
* property pane - sort fields in field configuration
* refactor include all properties
* checkbox properties
* date properties
* refactor typings and radio group properties
* switch, multselect, select, array, object properties
* minor changes
* default value
* ts fixes
* checkbox field properties implementation
* date field prop implementation
* switch field
* select field and fix deep nested meta properties
* multiselect implementation
* minor change
* input field implementation
* fix position jump on field type change
* initial accordian
* field state property and auto-complete of JSONFormComputeControl
* merge fixes
* renamed FormBuilder to JSONForm
* source data validation minor change
* custom field default value fix
* Editable keys for custom field
* minor fixes
* replaced useFieldArray with custom logic, added widget icon
* array and object accordian with border/background styling
* minor change
* disabled states for array and objects
* default value minor fix
* form level styles
* modified logic for isDisabled for array and object, added disabledWhenInvalid, exposed isValid to fieldState for text input, removed useDisableChildren
* added isValid for all field types
* fixed reset to default values
* debounce form values update
* minor change
* minor change
* fix crash - source data change multi-select to array, fix crash - change of options
* fix positioning
* detect date type in source data
* fix crash - when object is passed to regex input field
* fixed default sourceData path for fields
* accodion keep children mounted on collapse
* jest test for schemaParser
* widget/helper and useRegisterFieldInvalid test
* tests for property config helper and generatePanelPropertyConfig
* fix input field validation not appearing
* fix date field type detection
* rename data -> formData
* handle null/undefined field value change in sourceData
* added null/undefined as valid values for defaultValue text field
* auto detect email field
* set formData default value on initial load
* switch field inline positioning
* field margin fix for row direction
* select full width
* fiex date field default value - out of range
* fix any field type to array
* array default value logic change
* base cypress test changes
* initial json form render cy test
* key sanitization
* fix fieldState update logic
* required design, object/array background color, accordion changes, fix - add new custom field
* minor change
* cypress tests
* fix date formatted value, field state cypress test
* cypress - field properties test and fixes
* rename test file
* fix accessort change to blank value, cypress tests
* fix array field default value for modified accessor
* minor fix
* added animate loading
* fix empty state, add new custom field
* test data fix
* fix warnings
* fix timePrecision visibility
* button styling
* ported input v2
* fix jest tests
* fix cypress tests
* perf changes
* perf improvement
* added comments
* multiselect changes
* input field perf refactor
* array field, object field refactor performance
* checkbox field refactor
* refectored date, radio, select and switch
* fixes
* test fixes
* fixes
* minor fix
* rename field renderer
* remove tracked fieldRenderer field
* cypress test fixes
* cypress changes
* array default value fixes
* arrayfield passedDefaultValue
* auto enabled JS mode for few properties, reverted swith and date property controls
* cypress changes
* added widget sniping mode and fixed object passedDefaultValue
* multiselect v2
* select v2
* fix jest tests
* test fixes
* field limit
* rename field type dropdown texts
* field type changes fixes
* jest fixes
* loading state submit button
* default source data for new widget
* modify limit message
* multiseelct default value changes and cypress fix
* select default value
* keep default value intact on field type change
* TextTable cypress text fix
* review changes
* fixed footer changes
* collapse styles section by default
* fixed footer changes
* form modes
* custom field key rentention
* fixed footer fix in view mode
* non ascii characters
* fix meta merge in dataTreeWidget
* minor fixes
* rename useRegisterFieldInvalid.ts -> useRegisterFieldValidity.ts
* modified dependency injection into evaluated values
* refactored fixedfooter logic
* minor change
* accessor update
* minor change
* fixes
* QA fixes date field, scroll content
* fix phone number field, removed visiblity option from array item
* fix sourceData autocomplete
* reset logic
* fix multiselect reset
* form values hydration on widget drag
* code review changes
* reverted order of merge dataTreeWidget
* fixes
* added button titles, fixed hydration issue
* default value fixes
* upgraded react hook form, modified array-level/field-level default value logic
* fixed select validation
* added icon entity explorer, modified icon align control
* modify accessor validation for mongo db _id
* update email field regex
* review changes
* explicitly handle empty source data validation
2022-03-24 07:13:25 +00:00
|
|
|
"jsonFormAddNewCustomFieldBtn": ".t--property-control-fieldconfiguration .t--add-column-btn",
|
2021-04-23 13:50:55 +00:00
|
|
|
"evaluateMsg": ".t--evaluatedPopup-error",
|
2023-05-19 18:37:06 +00:00
|
|
|
"globalSearchModal": "[data-testid='t--global-search-modal']",
|
2021-03-08 08:24:12 +00:00
|
|
|
"globalSearchInput": ".t--global-search-input",
|
|
|
|
|
"globalSearchTrigger": ".t--global-search-modal-trigger",
|
2021-03-25 16:08:16 +00:00
|
|
|
"globalSearchClearInput": ".t--global-clear-input",
|
2021-04-23 05:43:13 +00:00
|
|
|
"containerWidget": ".t--widget-containerwidget",
|
|
|
|
|
"paginationButton": ".rc-pagination-item",
|
2021-03-25 16:08:16 +00:00
|
|
|
"switchWidgetActive": ".t--switch-widget-active",
|
|
|
|
|
"switchWidgetInActive": ".t--switch-widget-inactive",
|
2021-07-15 12:50:01 +00:00
|
|
|
"switchWidgetLoading": ".t--switch-widget-loading",
|
2021-08-30 09:24:59 +00:00
|
|
|
"tablePageSizeChangeAction": ".t--property-control-onpagesizechange .t--open-dropdown-Select-Action",
|
2021-09-07 12:48:38 +00:00
|
|
|
"listWidgetNameTag": ".bp3-editable-text-content",
|
2023-05-19 18:37:06 +00:00
|
|
|
"currencyType": ".t--property-control-currency input",
|
|
|
|
|
"decimalType": ".t--property-control-decimals input",
|
2021-07-15 12:50:01 +00:00
|
|
|
"allowCurrencyChange": ".t--property-control-allowcurrencychange input[type='checkbox']",
|
2021-08-06 09:17:02 +00:00
|
|
|
"inputCurrencyChangeType": ".t--input-currency-change",
|
2021-08-26 10:52:45 +00:00
|
|
|
"inputCountryCodeChangeType": ".t--input-country-code-change",
|
2024-06-20 13:00:16 +00:00
|
|
|
"viewerPage": "[data-testid='t--app-viewer-page']",
|
2021-08-26 15:24:37 +00:00
|
|
|
"dropDownOptSelected": "//span[@type='p1']",
|
2022-09-05 04:52:39 +00:00
|
|
|
"generalChevran": ".t--property-pane-section-collapse-general .t--chevron-icon",
|
2021-12-29 05:41:30 +00:00
|
|
|
"generalSection": ".t--property-pane-section-general",
|
2021-11-16 10:42:20 +00:00
|
|
|
"selectedIcon": ".t--property-control-icon .icon-select-container .bp3-button .bp3-button-text",
|
2022-09-03 12:50:39 +00:00
|
|
|
"isSortable": ".t--property-control-columnsorting input[type='checkbox']",
|
|
|
|
|
"isSortable_tablev1": ".t--property-control-sortable input[type='checkbox']",
|
2021-10-27 07:24:02 +00:00
|
|
|
"labelSection": ".cm-keyword",
|
|
|
|
|
"lintWarning": ".CodeMirror-lint-mark-warning",
|
|
|
|
|
"lintErrorMsg": ".CodeMirror-lint-message-error",
|
|
|
|
|
"lintWarningMsg": ".CodeMirror-lint-message-warning",
|
|
|
|
|
"labelSectionTxt": ".CodeMirror-code .cm-variable",
|
|
|
|
|
"lintError": ".CodeMirror-lint-mark-error",
|
2023-05-19 18:37:06 +00:00
|
|
|
"debugger": ".t--debugger-count",
|
2024-10-08 10:42:27 +00:00
|
|
|
"errorTab": "[data-testid=t--tab-ERROR_TAB]",
|
2023-05-19 18:37:06 +00:00
|
|
|
"debugErrorMsg": "[data-testid=t--debugger-log-message]",
|
2023-06-21 07:20:11 +00:00
|
|
|
"tableButtonVariant": ".t--property-control-buttonvariant",
|
2021-12-02 05:20:44 +00:00
|
|
|
"debuggerLabel": "span.debugger-label",
|
2023-05-19 18:37:06 +00:00
|
|
|
"debuggerToggle": "[data-testid=t--debugger-toggle]",
|
|
|
|
|
"debuggerDownStreamErrMsg": "[data-testid=t--debugger-downStreamErrorMsg]",
|
|
|
|
|
"debuggerDownStreamErrCode": "[data-testid=t--debugger-downStreamErrorCode]",
|
|
|
|
|
"debuggerDescription": ".debugger-description",
|
2022-02-25 06:13:16 +00:00
|
|
|
"cyclicDependencyError": "//div[@class='Toastify']//span[contains(text(),'Cyclic dependency found while evaluating')]",
|
2023-05-19 18:37:06 +00:00
|
|
|
"openDocumentationfromErrorTab": "//span[text()='Open documentation']",
|
2022-02-02 14:15:07 +00:00
|
|
|
"selectInner": ".t--draggable-selectwidget span.t--widget-name, Select1",
|
2021-12-29 05:41:30 +00:00
|
|
|
"toastifyError": "//div[@class='Toastify']//span]",
|
2022-03-22 16:52:26 +00:00
|
|
|
"selectButton": ".select-button",
|
2022-02-02 14:15:07 +00:00
|
|
|
"selectwidget": ".t--draggable-selectwidget",
|
2022-01-06 06:01:53 +00:00
|
|
|
"textWidget": ".t--draggable-textwidget",
|
|
|
|
|
"filepickerv2": ".t--draggable-filepickerwidgetv2",
|
2022-01-07 09:57:45 +00:00
|
|
|
"dashboardItemName": ".uppy-Dashboard-Item-name",
|
2022-01-29 07:26:19 +00:00
|
|
|
"mapChartShowLabels": ".t--property-control-showlabels input",
|
2023-05-19 18:37:06 +00:00
|
|
|
"widgetSection": ".t--entity.widgets > .t--entity-item > span.t--entity-collapse-toggle",
|
2022-05-04 09:45:57 +00:00
|
|
|
"changeThemeBtn": ".t--change-theme-btn",
|
|
|
|
|
"editThemeBtn": ".t--edit-theme-btn",
|
|
|
|
|
"themeCard": ".t--theme-card",
|
|
|
|
|
"saveThemeBtn": ".t--save-theme-btn",
|
|
|
|
|
"selectThemeBackBtn": ".t--theme-select-back-btn",
|
2022-07-20 09:26:12 +00:00
|
|
|
"themeAppBorderRadiusBtn": ".t--theme-appBorderRadius",
|
2022-12-23 10:07:29 +00:00
|
|
|
"themeAppBoxShadowBtn": ".t--theme-appBoxShadow",
|
2023-05-11 05:26:03 +00:00
|
|
|
"lazyCodeEditorFallback": ".t--lazyCodeEditor-fallback",
|
|
|
|
|
"lazyCodeEditorRendered": ".t--lazyCodeEditor-editor",
|
2022-08-12 07:19:17 +00:00
|
|
|
"textWidgetContainer": ".t--text-widget-container",
|
2023-05-19 18:37:06 +00:00
|
|
|
"propertyStyle": "button[role='tab'] span:contains('Style')",
|
|
|
|
|
"propertyContent": "button[role='tab'] span:contains('Content')",
|
2022-11-04 06:15:45 +00:00
|
|
|
"cancelActionExecution": ".t--cancel-action-button",
|
2022-12-01 04:55:57 +00:00
|
|
|
"menuButtonMenuItemsSource": ".t--property-control-menuitemssource",
|
|
|
|
|
"menuButtonSourceData": ".t--property-control-sourcedata",
|
|
|
|
|
"menuButtonConfigureArrayItems": ".t--property-control-configuremenuitems button",
|
2022-11-04 06:15:45 +00:00
|
|
|
"codeScannerScannerLayout": ".t--property-control-scannerlayout",
|
|
|
|
|
"codeScannerVideo": ".code-scanner-camera-container video",
|
2022-11-23 09:48:23 +00:00
|
|
|
"codeScannerDisabledSVGIcon": ".code-scanner-camera-container div[disabled] svg",
|
|
|
|
|
"layoutHeightDropdown": ".t--property-control-height .remixicon-icon",
|
2023-05-19 18:37:06 +00:00
|
|
|
"fixed": "Fixed",
|
|
|
|
|
"autoHeight": "Auto Height",
|
|
|
|
|
"autoHeightWithLimits": "Auto Height with limits",
|
|
|
|
|
"heightDropdown": "[data-guided-tour-iid='dynamicHeight'] input",
|
2022-11-23 09:48:23 +00:00
|
|
|
"minHeight": "minheight\\(inrows\\)",
|
|
|
|
|
"maxHeight": "maxheight\\(inrows\\)",
|
2023-05-19 18:37:06 +00:00
|
|
|
"overlayMin": "[data-testid='t--auto-height-overlay-min']",
|
|
|
|
|
"overlayMax": "[data-testid='t--auto-height-overlay-max']",
|
2022-11-23 09:48:23 +00:00
|
|
|
"addOption": ".t--property-control-options-add",
|
2023-05-19 18:37:06 +00:00
|
|
|
"showTabsControl": ".t--property-control-showtabs input",
|
|
|
|
|
"checkboxIndicator": ".t--draggable-checkboxwidget input",
|
2023-02-14 16:07:31 +00:00
|
|
|
"generalSectionHeight": ".t--property-pane-section-general .t--property-control-label:contains('Height')",
|
2023-05-11 05:26:03 +00:00
|
|
|
"listPaginateNextButton": ".t--widget-listwidgetv2 .rc-pagination-next .rc-pagination-item-link",
|
|
|
|
|
"listPaginateActivePage": ".t--widget-listwidgetv2 .rc-pagination-item-active",
|
|
|
|
|
"listPaginatePrevButton": ".t--widget-listwidgetv2 .rc-pagination-prev .rc-pagination-item-link",
|
|
|
|
|
"listPaginateNextButtonDisabled": ".t--widget-listwidgetv2 .rc-pagination-disabled .rc-pagination-item-link",
|
2023-02-14 16:07:31 +00:00
|
|
|
"PropertyPaneSearchInput": ".t--property-pane-search-input-wrapper input",
|
2023-05-19 18:37:06 +00:00
|
|
|
"BorderRadius0px": ".t--property-control-borderradius .ads-v2-segmented-control-value-0px",
|
2023-04-14 11:33:50 +00:00
|
|
|
"EnableFormatting": ".t--property-control-enableformatting input[type='checkbox']",
|
|
|
|
|
"autoConvert": "#t--layout-conversion-cta",
|
2023-05-19 18:37:06 +00:00
|
|
|
"convert": "button:contains('Convert layout')",
|
|
|
|
|
"refreshApp": "button:contains('Refresh the app')",
|
|
|
|
|
"autoConversionDialog": "span:contains('Use snapshot')",
|
|
|
|
|
"useSnapshot": "button:contains('Use snapshot')",
|
2023-06-09 14:40:12 +00:00
|
|
|
"useSnapshotBanner": "span:contains('Use snapshot')",
|
2023-05-19 18:37:06 +00:00
|
|
|
"discardSnapshot": "span:contains('Discard snapshot')",
|
|
|
|
|
"desktopOption": "//span[@data-value = 'DESKTOP']",
|
|
|
|
|
"mobileOption": "//span[@data-value = 'MOBILE']",
|
|
|
|
|
"convertanyways": "button:contains('Convert anyways')",
|
|
|
|
|
"discard": "button:contains('Discard')",
|
|
|
|
|
"heightProperty": ".rc-select-single input",
|
2024-03-11 12:43:12 +00:00
|
|
|
"heightPropertyOption": ".rc-select-item-option-content span",
|
2024-06-06 09:55:08 +00:00
|
|
|
"filePickerMaxNoOfFiles": ".t--property-control-maxno\\.offiles .CodeMirror-code",
|
|
|
|
|
"allowclearingValueInput": ".t--property-control-allowclearingvalue input[type='checkbox']",
|
|
|
|
|
"allowcountrycodechangeInput": ".t--property-control-allowcountrycodechange input[type='checkbox']",
|
|
|
|
|
"allowsearchingInput": ".t--property-control-allowsearching input",
|
2024-06-10 14:25:17 +00:00
|
|
|
"allowsearchingInputTypeCheckbox": ".t--property-control-allowsearching input[type='checkbox']",
|
|
|
|
|
"clientSideSearch": ".t--property-control-clientsidesearch input[type='checkbox']",
|
|
|
|
|
"enableClientSideSearch": ".t--property-control-enableclientsidesearch input[type='checkbox']",
|
|
|
|
|
"fixedFooterInput": ".t--property-control-fixedfooter input"
|
feat: add sortBy property to table select cell type (#35187)
## Description
**Problem**
The table widget now supports the Select column type, which allows the
column to contain both a label and a value. This could be useful for
currency fields, foreign keys, or any other case where you want to
display a different version of the column value. However, there is a
problem with sorting. The table always sorts using the value, and does
not give the user an option to sort using the label, where it makes
sense in specific cases.
**Solution**
This PR adds a Sort By property to the table select cell, allowing the
users to choose which value is used for sorting without affecting any
functionality of the label or value of the select cell.
[Additional Technical
Documentation](https://www.notion.so/appsmith/Adding-sortBy-Property-to-Select-Columns-in-Table-Widget-V2-a5a41e6319a047378eb50a42be8c32ef?pvs=4)
**Tested Cases**
1. Sort select column by default value
Objective: Ensure that a newly added table with select column default
sorts by the value
**Steps:**
- Drop a new table widget.
- Add sample data to the table.
- Set a column (e.g., role) to select type.
- Add selectOptions property
- Verify that when sorted in ascending or descending order, the sorting
is correct
2. Sort select column by label
Objective: Ensure that a newly added table with select column and sortBy
property set to label sorts correctly
**Steps:**
- Drop a new table widget.
- Add sample data to the table.
- Set a column (e.g., role) to select type
- Add selectOptions property
- Set sortBy property to label
- Verify that when sorted in ascending or descending order, the sorting
is correct and based on the label value only
3. Verify that sorting of other table cells that are not select works as
expected
Objective: Ensure that every other cell type in the table sorts
correctly
**Steps:**
- Drop a new table widget.
- Add sample data to the table.
- Set a column (e.g., role) to select type
- Add selectOptions property
- Set sortBy property to label
- Verify that when columns other that role are sorted, they are sorted
correctly
4. Verify that sorting works as expected when table data is a binding
Objective: Ensure that the sorting works for all columns while using
data binding in table data
**Steps:**
- Drop a new table widget
- Link a query binding to the table data property
- Verify that all columns sort correctly
5. Verify that sorting works as expected when table data is a binding
and select column sorting is set to label
Objective: Ensure that the sorting works for all columns while using
data binding in table data with a select column set to sort by the label
**Steps:**
- Drop a new table widget
- Link a query binding to the table data property
- Set a column (e.g., role) to select type
- Add selectOptions property
- Set sortBy property to label
- Verify that all columns sort correctly
6. Verify that sortBy logic does not take effect or break user
experience until the user adds selectOptions in select cell
**Steps:**
- Drop a new table widget
- Link a query binding to the table data property or add raw data
- Set a column (e.g., role) to select type
- Do not add selectOptions
- Set sortBy property to label
- Verify that all other columns display and sort correctly
7. Verify that sorting by label and value works correctly in deployed
mode
**Steps:**
- Drop a new table widget
- Link a query binding to the table data property or add raw data
- Set a column (e.g., role) to select type
- Add selectOptions
- Set sortBy property to label
- Deploy application
- Confirm that sorting works correctly for all columns
Fixes #21993
## Automation
/ok-to-test tags="@tag.Table, @tag.Binding, @tag.Sanity"
### :mag: Cypress test results
<!-- This is an auto-generated comment: Cypress test results -->
> [!TIP]
> 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉
> Workflow run:
<https://github.com/appsmithorg/appsmith/actions/runs/10165119164>
> Commit: 8a4e8b238adc0d78726a811b54a209caa4990606
> <a
href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=10165119164&attempt=1"
target="_blank">Cypress dashboard</a>.
> Tags: `@tag.Table, @tag.Binding, @tag.Sanity`
> Spec:
> <hr>Tue, 30 Jul 2024 16:02:35 UTC
<!-- end of auto-generated comment: Cypress test results -->
## Communication
Should the DevRel and Marketing teams inform users about this change?
- [x] Yes
- [ ] No
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
- **New Features**
- Introduced a feature flag for dynamic table cell labeling.
- Added a sorting option for select cells, allowing sort by value or
label.
- Enhanced user interface with new configuration options for select
components.
- Improved sorting functionality for select columns to sort by labels.
- **Bug Fixes**
- Improved sorting functionality in the table widget to ensure accurate
data representation.
- **Tests**
- Expanded and clarified test cases for sorting functionality in the
Table Widget V2.
- Updated testing structure for better reliability and isolation of test
scenarios.
- Integrated dynamic testing capabilities based on feature flags.
- **Documentation**
- Added new locators for sorting controls to enhance UI interaction
capabilities.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2024-08-02 07:37:00 +00:00
|
|
|
}
|