Protei/PromucFlow_constructor
2
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity
17,037 Commits 1 Branch 0 Tags 507 MiB
79fbdc2b1a
Commit Graph

12 Commits

Author SHA1 Message Date
Ashok Kumar M
79fbdc2b1a
chore: RMVF based changes for DnD, Modals, and Space distribution. (#31980) 
## Description
> [!TIP]  
> _Add a TL;DR when the description is longer than 500 words or
extremely technical (helps the content team)._
>
> _Please also include relevant motivation and context. List any
dependencies that are required for this change. Add links to Notion,
Figma or any other documents that might be relevant to the PR._

Fixes #31935
Fixes #32059

_or_  
Fixes `Issue URL`
> [!WARNING]  
> _If no issue exists, please create an issue first, and check with the
maintainers if the issue is valid._

## Automation

/ok-to-test tags="@tag.Anvil"

### 🔍 Cypress test results
<!-- This is an auto-generated comment: Cypress test results  -->
> [!IMPORTANT]  
> Workflow run:
<https://github.com/appsmithorg/appsmith/actions/runs/8565307211>
> Commit: `5d5f682bcabd1b64d69d8743cc0ffbfcad372f92`
> Cypress dashboard url: <a
href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=8565307211&attempt=1"
target="_blank">Click here!</a>
> All cypress tests have passed 🎉🎉🎉

<!-- end of auto-generated comment: Cypress test results  -->








<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

## Summary by CodeRabbit

- **New Features**
- Enabled new feature flags for advanced widget and release management.
- Introduced a new component for modal layout and enhanced styling for
the Anvil Editor.
- Added messages for guiding users on where to drop widgets and modals.
  - Implemented a new route for widget editor enhancements.

- **Enhancements**
- Improved Anvil Editor's canvas functionality with better activation,
selection, and drag-and-drop features.
- Enhanced the visual styling and interaction of widgets and modals in
the Anvil Editor.

- **Bug Fixes**
- Corrected import paths and updated selectors for consistent
functionality across the Anvil platform.

- **Refactor**
- Streamlined Anvil Editor components and hooks for better
maintainability and readability.
- Adjusted import paths and reorganized components to align with the new
project structure.

- **Style**
- Added and updated CSS styles for better UI experience in the Anvil
Editor and modal interactions.

- **Tests**
- Updated Cypress E2E tests to reflect changes in the Anvil Editor's
functionality and UI elements.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2024-04-05 11:16:07 +05:30
Abhinav Jha
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>
 2024-01-26 09:30:57 +05:30
Ashok Kumar M
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 -->
 2024-01-11 21:31:38 +05:30
Preet Sidhu
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 -->
 2023-12-29 08:11:49 +05:30
Ashok Kumar M
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>
 2023-12-27 16:05:41 +05:30
Preet Sidhu
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>
 2023-12-26 09:16:58 -05:00
Ashok Kumar M
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
 2023-11-15 18:01:54 +05:30
Preet Sidhu
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
 2023-10-27 11:54:26 +05:30
Preet Sidhu
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>
 2023-10-19 16:27:40 -04:00
Abhinav Jha
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)
 2023-10-18 19:09:07 +05:30
Valera Melnikov
9eac55a380
chore: add consistent-type-definitions rule (#27907) 
## Description
Add consistent-type-definitions rule
 2023-10-11 10:35:24 +03:00
rahulramesha
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>
 2023-10-06 15:37:43 +05:30