PromucFlow_constructor/app/client/src/components/propertyControls/utils.ts

38 lines
1001 B
TypeScript
Raw Normal View History

feat: select and multiselect label value (#24964) ## Description - Select and multi-select widgets now have two new properties under the data section label and value. - The existing options have been renamed to Source data. - Users can set the label and value of the options through these new properties. - We have written migrations to make this work for existing select widgets. #### PR fixes following issue(s) Fixes https://github.com/appsmithorg/appsmith/issues/24022 > #### Media > A video or a GIF is preferred. when using Loom, don’t embed because it looks like it’s a GIF. instead, just link to the video > > #### Type of change > Please delete options that are not relevant. - Bug fix (non-breaking change which fixes an issue) - New feature (non-breaking change which adds functionality) - Breaking change (fix or feature that would cause existing functionality to not work as expected) - Chore (housekeeping or task changes that don't impact user perception) - This change requires a documentation update > > > ## Testing > #### How Has This Been Tested? > Please describe the tests that you ran to verify your changes. Also list any relevant details for your test configuration. > Delete anything that is not relevant - [x] Manual - [x] Jest - [x] Cypress > > #### Test Plan > Add Testsmith test cases links that relate to this PR > > #### Issues raised during DP testing > Link issues raised during DP testing for better visiblity and tracking (copy link from comments dropped on this PR) > > > ## Checklist: #### Dev activity - [x] My code follows the style guidelines of this project - [x] I have performed a self-review of my own code - [x] I have commented my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [x] My changes generate no new warnings - [x] I have added tests that prove my fix is effective or that my feature works - [x] New and existing unit tests pass locally with my changes - [ ] PR is being merged under a feature flag #### QA activity: - [ ] [Speedbreak features](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#speedbreakers-) have been covered - [ ] Test plan covers all impacted features and [areas of interest](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#areas-of-interest-) - [ ] Test plan has been peer reviewed by project stakeholders and other QA members - [ ] Manually tested functionality on DP - [ ] We had an implementation alignment call with stakeholders post QA Round 2 - [ ] Cypress test cases have been added and approved by SDET/manual QA - [ ] Added `Test Plan Approved` label after Cypress tests were reviewed - [ ] Added `Test Plan Approved` label after JUnit tests were reviewed --------- Co-authored-by: Rishabh Rathod <rishabh.rathod@appsmith.com>
2023-07-25 04:56:33 +00:00
import type { WidgetProps } from "widgets/BaseWidget";
import { get } from "lodash";
import {
EVAL_ERROR_PATH,
getDynamicBindings,
} from "../../utils/DynamicBindingUtils";
feat: Action selector (#21582) ## Description Replaces the old boring action selector dropdown with a much more sophisticated UI that is capable of going above and beyond. Users with an aversion to code can now build their more complex workflows with a click of a few buttons. Consider this code snippet ```javascript Api1.run(() => { showAlert("Hello"); navigateTo('Page1', {}, 'SAME_WINDOW'); }, () => { removeValue("test"); }); ``` |**Old action selector** |**New action selector**| |:-:|:-:| |<img width="250" alt="Screenshot 2023-03-29 at 16 54 14" src="https://user-images.githubusercontent.com/32433245/228520661-a639b580-8986-4aec-a0f5-e2786d1a0f56.png">| <img width="250" alt="Screenshot 2023-03-29 at 16 55 15" src="https://user-images.githubusercontent.com/32433245/228521043-5025aa42-af95-4574-b586-bc4c721240bc.png">| **Click on an action block to edit its parameters.** <img width="500" alt="Screenshot 2023-03-29 at 17 01 18" src="https://user-images.githubusercontent.com/32433245/228522479-493769d0-9d2c-4b67-b493-a79e3bb9c947.png"> **Switch to JS mode to get the raw code** <img width="273" alt="Screenshot 2023-03-29 at 17 05 51" src="https://user-images.githubusercontent.com/32433245/228523458-13bc0302-4c94-4176-b5aa-3ec208122f57.png"> ### Code changes **New UI components** - ActionCreator component splits the code into block statements. - Each block statement is represented by ActionTree.tsx UI component. - ActionTree.tsx represents an action and its chains. - ActionCard.tsx is the block that represents the individual action on the UI. - ActionSelector.tsx component is popover that contains the form for editing individual action. - TabView, TextView, SelectorView, ActionSelectorView and KeyValueView are components that represent configurable fields in ActionSelector form. **AST methods** - Added methods to get/set function names, expressions, arguments. - Added methods to get/set then/catch blocks to allow chaining of actions. - Added methods to check if code is convertible to UI. Fixes #10160 Fixes #21588 Fixes #21392 Fixes #21393 Fixes #7903 Fixes #15895 Fixes #17765 Fixes #14562 Depends on https://github.com/appsmithorg/design-system/pull/306 ## Type of change - New feature (non-breaking change which adds functionality) ## How Has This Been Tested? - Manual - Jest - Cypress ### Test Plan https://github.com/appsmithorg/TestSmith/issues/2296 ### Issues raised during DP testing > Link issues raised during DP testing for better visiblity and tracking (copy link from comments dropped on this PR) ## Checklist: ### Dev activity - [x] My code follows the style guidelines of this project - [ ] I have performed a self-review of my own code - [x] I have commented my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [x] My changes generate no new warnings - [x] I have added tests that prove my fix is effective or that my feature works - [x] New and existing unit tests pass locally with my changes - [ ] PR is being merged under a feature flag ### QA activity: - [x] Test plan has been approved by relevant developers - [x] Test plan has been peer reviewed by QA - [x] Cypress test cases have been added and approved by either SDET or manual QA - [x] Organized project review call with relevant stakeholders after Round 1/2 of QA - [x] Added Test Plan Approved label after reveiwing all Cypress test --------- Co-authored-by: Rimil Dey <rimil@appsmith.com> Co-authored-by: arunvjn <arun@appsmith.com> Co-authored-by: Aishwarya UR <aishwarya@appsmith.com> Co-authored-by: Parthvi Goswami <parthvigoswami@Parthvis-MacBook-Pro.local>
2023-04-06 16:49:12 +00:00
export const stringToJS = (string: string): string => {
const { jsSnippets, stringSegments } = getDynamicBindings(string);
return stringSegments
.map((segment, index) => {
if (jsSnippets[index] && jsSnippets[index].length > 0) {
return jsSnippets[index];
} else {
return `'${segment}'`;
}
})
.join(" + ");
};
export const JSToString = (js: string): string => {
const segments = js.split(" + ");
return segments
.map((segment) => {
if (segment.charAt(0) === "'") {
return segment.substring(1, segment.length - 1);
} else return "{{" + segment + "}}";
})
.join("");
};
feat: select and multiselect label value (#24964) ## Description - Select and multi-select widgets now have two new properties under the data section label and value. - The existing options have been renamed to Source data. - Users can set the label and value of the options through these new properties. - We have written migrations to make this work for existing select widgets. #### PR fixes following issue(s) Fixes https://github.com/appsmithorg/appsmith/issues/24022 > #### Media > A video or a GIF is preferred. when using Loom, don’t embed because it looks like it’s a GIF. instead, just link to the video > > #### Type of change > Please delete options that are not relevant. - Bug fix (non-breaking change which fixes an issue) - New feature (non-breaking change which adds functionality) - Breaking change (fix or feature that would cause existing functionality to not work as expected) - Chore (housekeeping or task changes that don't impact user perception) - This change requires a documentation update > > > ## Testing > #### How Has This Been Tested? > Please describe the tests that you ran to verify your changes. Also list any relevant details for your test configuration. > Delete anything that is not relevant - [x] Manual - [x] Jest - [x] Cypress > > #### Test Plan > Add Testsmith test cases links that relate to this PR > > #### Issues raised during DP testing > Link issues raised during DP testing for better visiblity and tracking (copy link from comments dropped on this PR) > > > ## Checklist: #### Dev activity - [x] My code follows the style guidelines of this project - [x] I have performed a self-review of my own code - [x] I have commented my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [x] My changes generate no new warnings - [x] I have added tests that prove my fix is effective or that my feature works - [x] New and existing unit tests pass locally with my changes - [ ] PR is being merged under a feature flag #### QA activity: - [ ] [Speedbreak features](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#speedbreakers-) have been covered - [ ] Test plan covers all impacted features and [areas of interest](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#areas-of-interest-) - [ ] Test plan has been peer reviewed by project stakeholders and other QA members - [ ] Manually tested functionality on DP - [ ] We had an implementation alignment call with stakeholders post QA Round 2 - [ ] Cypress test cases have been added and approved by SDET/manual QA - [ ] Added `Test Plan Approved` label after Cypress tests were reviewed - [ ] Added `Test Plan Approved` label after JUnit tests were reviewed --------- Co-authored-by: Rishabh Rathod <rishabh.rathod@appsmith.com>
2023-07-25 04:56:33 +00:00
export const getValidationErrorForProperty = (
widget: WidgetProps,
propertyPath: string,
) => {
return get(widget, `${EVAL_ERROR_PATH}.${propertyPath}`, []);
};