dbda916f09
9 Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
|
|
dbda916f09
|
fix: undo action and highlight positions on right and bottom edges (#29909)
## Description 1. Make store updates atomic to ensure that undo operation works as expected. 2. Add another guard to ensure that entire highlight is always visible, esp along bottom and right edges of a layout. #### Type of change - Bug fix (non-breaking change which fixes an issue) ## Testing #### How Has This Been Tested? - [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 - [ ] 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 - **Refactor** - Improved the layout saving process within the Anvil layout system. - Enhanced the calculation of highlight positions in the layout editor. - **Chores** - Removed unused `SAVE_ANVIL_LAYOUT` action type and related sagas. - **Bug Fixes** - Fixed positioning calculations for layout highlights to ensure accurate alignment and distribution. <!-- 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> |
||
|
|
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 |
||
|
|
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> |
||
|
|
fce5524aa8
|
chore: Add observer to LayoutElements (#27993)
## Description - Create a hook based on the `LayoutElementPositionsObserver` and use it in `AnvilFlexComponent` such that all widgets in Anvil have their positions registered in the `LayoutElementPositionsReducer` - Do the same for `layouts` in Anvil. Added in the `FlexLayout` component. #### PR fixes following issue(s) Fixes #26947 Fixes #27287 #### Type of change - New feature (non-breaking change which adds functionality) |
||
|
|
9eac55a380
|
chore: add consistent-type-definitions rule (#27907)
## Description Add consistent-type-definitions rule |
||
|
|
8a35e05923
|
chore: code changes for widget position observer and widget name on canvas (#27367)
## Description The PR contains non integrated code changes for below new features, The changes are not integrated to work but only contains the ground work code changes that can be added to css based layout/ Anvil once that is available in Release. - **Widget Position observer-** Since we are moving to css based layout, the positions of widgets will be unknown. To solve the issue we have introduced the above feature that stores/updates position of widgets on Redux state whenever a widget position updates. without manually triggering any action - **Widget Name on Canvas-** For the New Layout the existing widget name is inconsistent as it would cut off or visually not visible. to solve that the widget name will now be drawn on html canvas than it being a dom node component #### PR fixes following issue(s) Fixes #26945 Fixes #26948 #### Type of change - Chore (housekeeping or task changes that don't impact user perception) ## Testing #### How Has This Been Tested? - [ ] Manual - [ ] JUnit - [ ] Jest #### 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 --------- Co-authored-by: Ashok Kumar M <35134347+marks0351@users.noreply.github.com> Co-authored-by: Abhinav Jha <abhinav@appsmith.com> |