ae396eb976
16 Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
|
|
92397c4559
|
feat: Anvil dnd enhancement of highlight info and highlight skipping. (#30927)
> Pull Request Template > > Use this template to quickly create a well written pull request. Delete all quotes before creating the pull request. > ## Description In this PR we are enhancing/changing a couple of things - change skipping highlight logic. - we skip showing vertical highlights when the only hug widget in a row is dragged, now we show vertical highlights. - instead of skipping the vertical highlight left to a widget which is being dragged, we skip the highlight right to the widget so that changing order of widgets is more intutive. - adding new prop to highlight info to mark highlights of the existing dragged widget so that such drops are not considered to update widgets/layouts. This will make sure undo / redo works as expected. #### PR fixes following issue(s) Fixes # (issue number) > if no issue exists, please create an issue and ask the maintainers about this first > > #### 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 - [ ] Manual - [ ] JUnit - [ ] Jest - [ ] 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 - [ ] My code follows the style guidelines of this project - [ ] I have performed a self-review of my own code - [ ] I have commented my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [ ] My changes generate no new warnings - [ ] I have added tests that prove my fix is effective or that my feature works - [ ] 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 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Enabled `ab_wds_enabled` and `release_anvil_enabled` feature flags for all users. - Enhanced the canvas interaction in the Anvil layout system by introducing logic to better handle horizontal and vertical highlights, improving the user experience during widget drag-and-drop operations. - Modified the logic for determining overlay widgets, streamlining the process for identifying modal and similar widgets. - **Refactor** - Updated feature flag selection logic to return default values more accurately. - Refined highlight generation logic in Anvil layout system to account for dragged widgets and discarded layouts, offering a more intuitive drag-and-drop experience. - Adjusted the `getLayoutSystemType` selector to consistently return `LayoutSystemTypes.ANVIL`, ensuring a unified layout system experience. - **Tests** - Enhanced test coverage for highlight selection algorithms in the Anvil layout system, ensuring accurate highlight behavior based on mouse position. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
6765888eb0
|
chore: Anvil cypress tests (#30580)
> Pull Request Template > > Use this template to quickly create a well written pull request. Delete all quotes before creating the pull request. > ## Description In this pr we are writing tests to validate a few preliminary cases of the Anvil Editor. the purpose of the task is to be able to run anvil tests along side the present suite of test cases. Things to note for Anvil based test cases - ANVIL_EDITOR_TEST tag is used for Anvil based tests to make sure relevant feature flags are set(using featureFlagIntercept) before creating pages so that Anvil pages are created. - each test case in a Anvil spec file also use featureFlagIntercept to set the relevant flags since pages are reloded before running tests. #### PR fixes following issue(s) Fixes # (issue number) > if no issue exists, please create an issue and ask the maintainers about this first > > #### 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 - [ ] Manual - [ ] JUnit - [ ] Jest - [ ] 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 - [ ] My code follows the style guidelines of this project - [ ] I have performed a self-review of my own code - [ ] I have commented my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [ ] My changes generate no new warnings - [ ] I have added tests that prove my fix is effective or that my feature works - [ ] 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 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Enhanced Anvil editor with the ability to test app navigation, drag and drop functionality, and suggested widgets feature. - Improved accessibility and interaction capabilities within the Anvil canvas. - **Tests** - Added comprehensive end-to-end tests for new Anvil editor features, including app navigation settings, widget drag and drop, and suggested widgets integration. - **Refactor** - Introduced new constants and locators for better test structure and readability. - **Style** - Updated components with new attributes for improved accessibility and testing. - **Chores** - Added new tags for organizing tests related to the Anvil editor. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
dcabb56503
|
fix: Anvil editor zone stretch fix in mobile mode (#30592)
> Pull Request Template > > Use this template to quickly create a well written pull request. Delete all quotes before creating the pull request. > ## Description In this PR, we are making sure zones don't stretch to fill sections in low resolution screens exclusively on the Appsmith Anvil Editor. #### PR fixes following issue(s) Fixes # (issue number) > if no issue exists, please create an issue and ask the maintainers about this first > > #### 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 - [ ] Manual - [ ] JUnit - [ ] Jest - [ ] 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 - [ ] My code follows the style guidelines of this project - [ ] I have performed a self-review of my own code - [ ] I have commented my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [ ] My changes generate no new warnings - [ ] I have added tests that prove my fix is effective or that my feature works - [ ] 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 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Enhanced the canvas interaction experience in the Anvil layout system for better usability. - **Bug Fixes** - Fixed an issue with incorrect `minWidth` settings for widgets, improving responsiveness and layout accuracy on mobile devices. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
e67f6a8f89
|
feat: WDS - Anvil compatible Modal Widget (#30351)
## Description This PR primarily adds the modal widget to WDS. The following changes were made: 1. WidgetNameCanvas now listens to modal body scrolls to position widget name components correctly 2. Modal Widget is rendered as a detached widget that is outside of the layout flow of the main canvas 3. Main container resizer now has a higher z-index to show even if the modal is open in the preview mode 4. Widget selection flow in Anvil layout system has been modified to be handled in a central location (`AnvilMainCanvas`) 5. Modal widget's type in modal sagas are selected via a selector that checks for the feature flag. 6. Modal widget has its own preset that (at present) is similar to the Main container's layout preset #### PR fixes following issue(s) Fixes #28588 Fixes #28328 Fixes #27459 #### Media https://github.com/appsmithorg/appsmith/assets/103687/bf350be4-2202-49f3-a860-3e38681ab32e #### Type of change - New feature (non-breaking change which adds functionality) - This change requires a documentation update ## Testing > #### How Has This Been Tested? - [x] Manual - [ ] JUnit - [ ] Jest - [ ] Cypress ## Checklist: #### Dev activity - [ ] My code follows the style guidelines of this project - [ ] I have performed a self-review of my own code - [ ] I have commented my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [ ] My changes generate no new warnings - [ ] I have added tests that prove my fix is effective or that my feature works - [ ] 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 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Enhanced Modal components with additional styling and customization options. - Introduced a new event type for modal submission actions. - Added a `--on-canvas-ui-z-index` CSS variable for improved layering control. - Implemented a new method for widget focus management in the editor. - **Improvements** - Modal components now use context hooks for close actions. - Improved the handling of detached widgets in various layout systems. - Simplified the drag-and-drop state management for widgets. - Upgraded the visual presentation of the widget drop area. - Enhanced widget selection with new custom event dispatching. - Updated the modal widget configuration with default settings and property pane structure. - **Bug Fixes** - Fixed an issue with modal scrolling to behave consistently with the main container. - Addressed a problem where the `id` was not found during layout element position updates. - **Style** - Adjusted modal overlay positioning and content width with new CSS standards. - Updated zIndex references to use CSS variables for consistent styling. - **Refactor** - Reorganized the `Widgets` array into categorized groups for better clarity. - Simplified the `modalPreset` function's parameters and layout declaration. - **Documentation** - Added default values for feature flags in the documentation. - **Chores** - Altered feature flags to enable new functionalities by default. - **Tests** - No visible changes to end-users in this category. - **Revert** - No visible changes to end-users in this category. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Preet Sidhu <preetsidhu.bits@gmail.com> Co-authored-by: Valera Melnikov <valera@appsmith.com> |
||
|
|
c396fc5499
|
feat: Add copy paste functionality for Anvil. (#30217)
## Description 1. Copy paste functionality for Anvil. 2. Handle automatic creation of sections and zones based on different scenarios. 3. Handle space distribution on paste. #### Type of change - New feature (non-breaking change which adds functionality) ## 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 - [ ] JUnit - [ ] Jest - [ ] Cypress ## 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 - [ ] My changes generate no new warnings - [ ] 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 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Introduced a new paste functionality for widgets within the Anvil layout system. - **Improvements** - Refined widget movement logic to accommodate different canvas types. - Expanded widget pasting capabilities with additional checks and operations. - **Bug Fixes** - Addressed potential issues with dragging blocks by ensuring existence checks before mapping. - **Refactor** - Streamlined sagas for widget operations to better align with the Anvil layout system. - Consolidated widget position utility functions for more efficient layout management. - **User Interface** - Implemented user-friendly error messaging for paste operations that fail. - **Documentation** - Updated messages and constants to support new paste functionality and error handling. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Ashok Kumar M <35134347+marks0351@users.noreply.github.com> |
||
|
|
10a98f9563
|
fix: use wds tokens in sections and zones (#30479)
## Description - Added tokens to the anvil config - Removed redundant functions for calculating widget sizes - I cleaned the widget configs - Added a zero-state to the input component - Optimised the responsiveness of the action group component https://github.com/appsmithorg/appsmith/assets/11555074/e9e0513a-cf3f-42ef-b960-820bb4980858 #### PR fixes following issue(s) Fixes #29507 #### 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) - Chore (housekeeping or task changes that don't impact user perception) ## 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 - [ ] Manual - [ ] JUnit - [ ] Jest - [ ] 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 - [x] I have made corresponding changes to the documentation - [x] My changes generate no new warnings - [ ] 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 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Enhanced `MenuItem` display with additional text attribute for better accessibility. - Improved user interaction with `TextArea` and `TextInput` components through more effective handling of default and read-only states. - Extended `Flex` component to include click event handling capabilities. - Refined `ActionGroup` styling and dynamic sizing for a more polished UI experience. - **Enhancements** - Updated `Button` styling to ensure consistency across different screen sizes. - Optimized layout and styling of `Menu` items for improved visual hierarchy and responsiveness. - **Refactor** - Simplified `WidgetProvider` and `AnvilEditorWidget` configurations for more streamlined layout management. - Refined `ZoneColumn` rendering for better alignment with layout system principles. - **Bug Fixes** - Fixed minimum width calculation in `useZoneMinWidth` hook to ensure correct layout behavior. - Corrected `AnvilDSLTransformer` padding value for consistent widget spacing. - **Documentation** - Removed redundant Storybook addon to streamline developer experience. - **Style** - Adjusted CSS for various components to align with updated design system standards. - **Tests** - Updated widget property pane configuration tests for better coverage and reliability. - **Chores** - Cleaned up unused imports and methods across multiple widget components for improved code maintenance. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
be057ff1d8
|
feat: Anvil DnD highlight activation upgrade (#29979)
> Pull Request Template > > Use this template to quickly create a well written pull request. Delete all quotes before creating the pull request. > ## Description In this PR, we are trying to help users figure out wrapped cells and also differentiate cell drops vs new cell drops. we are also enhancing the highlights selection algorithm. - highlights no longer have dropzones - closest vertical highlights(cell drops) are triggered whenever the mouse is deemed to be inside the cell withing a set threshold. Cell is also highlighted for such highlights - horizontal highlights(new cell drops) are triggered whenever the mouse is deemed to be not inside any cell based on set threshold. - post the above filter the closest highlight to the mouse position is selected to be shown on the canvas as a highlight. so except for places like Section padding and Zone padding where there is no Canvas, highlights will always show up. Issues observed while working on this PR: - In safari center highlight seems to not work. - highlights dont trigger in Section + Zone padding areas(will not be addressed in this PR) #### PR fixes following issue(s) Fixes # (issue number) > if no issue exists, please create an issue and ask the maintainers about this first > > #### 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 - [ ] Manual - [ ] JUnit - [ ] Jest - [ ] 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 - [ ] My code follows the style guidelines of this project - [ ] I have performed a self-review of my own code - [ ] I have commented my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [ ] My changes generate no new warnings - [ ] I have added tests that prove my fix is effective or that my feature works - [ ] 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 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Introduced a new highlight feature for the app's layout components. - Enhanced search functionality with immediate activation for specific feature flags. - **Improvements** - Improved the visual feedback during drag-and-drop operations with optimized highlight rendering. - Streamlined the logic for determining viable drop positions within the layout system. - Added conditional styling capabilities based on the application's state. - **Bug Fixes** - Corrected the feature flag behavior to ensure consistent feature access. - **Refactor** - Removed unused constants and properties related to drop zones to simplify layout calculations. - Enhanced type safety in selector functions for better maintainability. - **Style** - Added a new color constant for highlight effects, improving the visual experience. - **Tests** - Updated tests to reflect changes in layout highlight logic and removal of drop zones. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
830ccaa692
|
feat: Anvil section space redistribution (#29632)
## Description Anvil Section Space distribution In this pr, we are adding a feature to sections to redistribute a sections space within its zones. you can find details of it over [here](https://www.notion.so/Sections-and-Zones-design-WIP-cbcb8b0ab2514aaf90d04aa3309ad56c) As part of it we have three parts of changes - UI components - Middleware(Redux and Sagas) - Space redistribution algorithm UI/UX: https://github.com/appsmithorg/appsmith/assets/35134347/092ba31f-d2e5-400e-80d7-45878d75ff98 Middleware changes: - have added a new state in WidgetDragResizeState `anvil` and into it have added `isDistributingSpace` to capture when space distribution is active. - added `anvilSpaceDistributionSagas` to capture all sagas wrt space redistribution Space redistribution algorithm: - Have added algorithm for redistributing space, have noted down details about it [here](https://www.notion.so/appsmith/Space-distribution-and-responsiveness-questions-517d140e83864c2287765c99dcd7c8da?pvs=4#9b33c84bcea24cfca63d7caef036f896). > #### PR fixes following issue(s) Fixes # (issue number) > if no issue exists, please create an issue and ask the maintainers about this first > > #### 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 - [ ] Manual - [ ] JUnit - [ ] Jest - [ ] 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 - [ ] My code follows the style guidelines of this project - [ ] I have performed a self-review of my own code - [ ] I have commented my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [ ] My changes generate no new warnings - [ ] I have added tests that prove my fix is effective or that my feature works - [ ] 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 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Enhanced widget resizing capabilities with space distribution handles in Anvil layout system. - Introduced preview mode support for widget size configuration. - **Enhancements** - Improved Anvil layout system with dynamic space distribution during resizing. - Added flexibility to widget size configuration by considering preview mode. - **Bug Fixes** - Corrected widget border styles to reflect space distribution and resizing states. - **Refactor** - Streamlined space distribution logic in Anvil layout sagas and selectors. - Updated `AnvilFlexComponent` to conditionally assign `flexGrow` property. - **Documentation** - Updated comments to clarify new space distribution behavior in Anvil layout. - **Style** - Adjusted styles for space distribution handles in section layouts. - **Chores** - Added new action types for Anvil space distribution process. - Enhanced Redux state structure for drag and resize operations. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Preet <preetsidhu.bits@gmail.com> |
||
|
|
fa7bd6a543
|
feat: add layouts and widgets for sections and zones. (#29713)
## Description 1. Create Section Widget. 2. Create Zone Widget. 3. Create layouts and presets for Sections and zones. 4. Upate layout for Anvil Main Canvas. 5. Refactor BaseLayoutComponent. Separate renderer for edit and view modes. 6. Add childrenMap context to avoid prop drilling through all layouts. 7. Add Anvil Config for WDS widgets. #### Type of change - New feature (non-breaking change which adds functionality) ## Testing #### How Has This Been Tested? - [x] Manual - [ ] JUnit - [ ] Jest - [ ] Cypress #### Test Plan ## 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 - [ ] 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 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Introduced a new `Zone Stepper Control` component for UI interaction. - Added `AnvilCanvas` and `AnvilMainCanvas` components with improved performance and interaction features. - Implemented `LayoutProvider` and `useClickToClearSelections` for better layout management. - Launched `AnvilCanvasDraggingArena` and `AnvilHighlightingCanvas` components with enhanced drag-and-drop capabilities. - New `useZoneMinWidth` hook to calculate minimum zone width based on child widgets. - Added `SectionRow`, `Section`, `ZoneColumn`, and `Zone` components for advanced layout structuring. - New `WidgetRenderer` component for dynamic child widget rendering. - **Enhancements** - Improved canvas activation and deactivation logic with `useCanvasActivation` and `useCanvasActivationStates`. - Enhanced drag-and-drop experience with updated `useCanvasDragging` logic. - Streamlined `AnvilMainCanvas` integration with conditional rendering based on `renderMode`. - Optimized `FlexLayout` component to handle new `isContainer` and `layoutType` properties. - **Bug Fixes** - Fixed issues with widget positioning and event handling in `WidgetNamesCanvas` components. - Corrected `PageView` width property type for consistent page rendering. - **Refactor** - Consolidated Anvil layout update management with `anvilSagas` and `anvilChecksSagas`. - Refined `SectionWidget` and `ZoneWidget` configuration for improved stability and performance. - Streamlined `LayoutElementPositionsObserver` with `layoutType` enhancements. - **Documentation** - Updated comments and added clarifications for better developer understanding of canvas-related hooks and components. - **Style** - Modified `.anvil-canvas` class styles for full-width and height presentation. - **Chores** - Cleaned up import statements and removed unused code across various components and utilities. - **Tests** - Enhanced Cypress tests with additional selectors and interaction commands for `AutoDimension` feature verification. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Ashok Kumar M <35134347+marks0351@users.noreply.github.com> |
||
|
|
d727ecf7c5
|
chore: register offset values as per parent drop target in Anvil (#28757)
> Pull Request Template > > Use this template to quickly create a well written pull request. Delete all quotes before creating the pull request. > ## Description In this PR we are making changes to layout elements position observer to capture offset values of drag parents(layouts that can have widgets) relative to their own immediate dragparents. Why? once we have these offset values of each droptarget wrt to main canvas droptarget we can clearly detect offsetvalues of widgets, since each widget's positions that are captured already are wrt to main canvas, with the calculated offset from the above process we can calculated widget positions relative to their immediate parent as well. #### PR fixes following issue(s) Fixes #28561 Fixes #28585 > if no issue exists, please create an issue and ask the maintainers about this first > > #### 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 - [ ] Manual - [ ] JUnit - [ ] Jest - [ ] 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 - [ ] My code follows the style guidelines of this project - [ ] I have performed a self-review of my own code - [ ] I have commented my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [ ] My changes generate no new warnings - [ ] I have added tests that prove my fix is effective or that my feature works - [ ] 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 |
||
|
|
a6e0c54d72
|
fix: Anvil fixes and enhancements post R0 (#28711)
> Pull Request Template > > Use this template to quickly create a well written pull request. Delete all quotes before creating the pull request. > ## Description In this PR we are fixing - suggested widgets feature in Anvil - implementing isVisible prop based rendering in Anvil - remove main canvas resizer in edit mode of Anvil - cleaning up sniping mode based changes for anvil since its only used via sign posting flow which is a fixed layout only feature right now. - adding buffer for main canvas DnD - fixing glitches in first time DnD #### PR fixes following issue(s) Fixes #28577 > if no issue exists, please create an issue and ask the maintainers about this first > > #### 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 - [ ] Manual - [ ] JUnit - [ ] Jest - [ ] 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 - [ ] My code follows the style guidelines of this project - [ ] I have performed a self-review of my own code - [ ] I have commented my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [ ] My changes generate no new warnings - [ ] I have added tests that prove my fix is effective or that my feature works - [ ] 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 |
||
|
|
e9c3034c1c
|
chore: add mousemove listener to konva and bug fixes. (#28381)
## Description Add ``mousemove`` event listener to WidgetName canvas. This allows the canvas to toggle its own pointerEvents back to ``none`` when the mouse is not hovering over a widget name component. Additionally: 1. Removes highlights for empty ``AlignedWidgetRow``. 2. Fix layout preset for container widget. New layoutIDs are generated for every instance. 3. Add an action to remove unobserved elements from layout positions redux store. 4. Bottom padding of MainCanvas layout. #### PR fixes following issue(s) Fixes #28380 Fixes #28415 #### Type of change - Bug fix (non-breaking change which fixes an issue) ## 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. - [x] Manual - [ ] JUnit - [ ] Jest - [ ] Cypress ## 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 - [ ] I have added tests that prove my fix is effective or that my feature works - [ ] New and existing unit tests pass locally with my changes - [x] 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 |
||
|
|
b1933e347f
|
fix: Fixing Anvil DnD for nested containers (#28362)
> Pull Request Template > > Use this template to quickly create a well written pull request. Delete all quotes before creating the pull request. > ## Description In this pr, - we are making sure layouts inside dragged widgets are not activated - we are making sure layoutId is newly generated when a widget with a canvas is added instead of using the defaults layoutId coz its a frozen object which was using same set of layoutIds for every time we add widgets. This fix works only for one level on the canvas widgets, bringing this to your notice @prsidhu #### PR fixes following issue(s) Fixes #28337 > if no issue exists, please create an issue and ask the maintainers about this first > > #### 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 - [ ] Manual - [ ] JUnit - [ ] Jest - [ ] 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 - [ ] My code follows the style guidelines of this project - [ ] I have performed a self-review of my own code - [ ] I have commented my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [ ] My changes generate no new warnings - [ ] I have added tests that prove my fix is effective or that my feature works - [ ] 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 |
||
|
|
492eece3c9
|
fix: widget dimensions for anvil widgets (#28356)
> Pull Request Template > > Use this template to quickly create a well written pull request. Delete all quotes before creating the pull request. > ## Description In this PR we are supplying width and height by computing rows and columns defaults provided for fixed layout. This is temporary, The actual implementation would be that widgets would compute their own dimensions. #### PR fixes following issue(s) Fixes # (issue number) > if no issue exists, please create an issue and ask the maintainers about this first > > #### 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 - [ ] Manual - [ ] JUnit - [ ] Jest - [ ] 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 - [ ] My code follows the style guidelines of this project - [ ] I have performed a self-review of my own code - [ ] I have commented my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [ ] My changes generate no new warnings - [ ] I have added tests that prove my fix is effective or that my feature works - [ ] 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 |
||
|
|
41ee6473a8
|
chore: fix minor issues on anvil (#28240)
## Description 1. Supply additional classes / styles for MainCanvas through its parents. #### Type of change - New feature (non-breaking change which adds functionality) ## 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 - [ ] JUnit - [ ] Jest - [ ] Cypress ## 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 - [ ] 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 - [x] 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: Aswath K <aswath.sana@gmail.com> Co-authored-by: Ashok Kumar M <35134347+marks0351@users.noreply.github.com> Co-authored-by: rahulramesha <rahul@appsmith.com> Co-authored-by: rahulramesha <71900764+rahulramesha@users.noreply.github.com> |
||
|
|
69f4a412bf
|
chore: add highlight calculation logic for layouts. (#27980)
## Description 1. Add LayoutComponent functionality. 2. Create Basic LayoutComponents. 3. Create LayoutPresets needed for Container-like widgets. 4. Add highlight calculation logic for all basic Layout Components. 5. Create dragging sagas for Anvil. 6. Create DraggingArena associated functionality to handle DnD in Anvil. #### PR fixes following issue(s) Fixes #27004 #### Type of change > Please delete options that are not relevant. - New feature (non-breaking change which adds functionality) ## Testing #### How Has This Been Tested? - [ ] Manual - [ ] JUnit - [x] Jest - [ ] Cypress ## 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 - [x] 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: Ashok Kumar M <35134347+marks0351@users.noreply.github.com> Co-authored-by: Aswath K <aswath.sana@gmail.com> Co-authored-by: rahulramesha <rahul@appsmith.com> Co-authored-by: rahulramesha <71900764+rahulramesha@users.noreply.github.com> |