## Description
1. Add new ```appPositioningType``` : ANVIL.
2. Create new code path and folder structure for Anvil layout system.
3. Move common pieces of functionalities between autoLayout and anvil to
anvil folder structure (e.g. ```CanvasResizer```).
4. Create ```AnvilFlexComponent```.
5. Use WDS Flex component in AnvilFlexComponent.
6. Pass min max size props in a data structure that is supported by
container queries in the Flex component.
e.g. min-width: { base: "120px", "480px": "200px" }
7. Supply the following flex properties (flex-grow flex-shrink
flex-basis) to widgets depending on their ```responsiveBehvaiour```:
a) Fill: ```flex: 1 1 0%;```
b) Hug: ```flex: 0 0 auto;```
#### PR fixes following issue(s)
Fixes # (issue number)
1. [#26987](https://github.com/appsmithorg/appsmith/issues/26987)
2. [#26609](https://github.com/appsmithorg/appsmith/issues/26609)
3. [#26611](https://github.com/appsmithorg/appsmith/issues/26611)
#### 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
- [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
- [ ] My changes generate no new warnings
- [x] 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
---------
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>
`wrappedChildren` is used to add a `div` around widget which sets 100%
height and width. This happens only on deploy mode. This was added to
make sure some widgets are getting properly displayed in deploy mode.
In this PR, we are removing it and make the necessary changes in the
widget's code itself.
## Description
Create a Basewidget wrapper that supplies Widget Onion as per the layout
system.
involves extracting widget layers presently in the BaseWidget into HOCs
and hooks and make sure layout systems can be scaled.
Make sure Modal widget is handled as a overlay widget whose wrappers are
supplied by basewidget instead of modal widget implementing its own
editing blocks.
This PR also separates the drag n drop logic for both auto layout and
fixed layout. They are moved into respective Layout system folders to
have clear sepsration of concern
#### PR fixes following issue(s)
Fixes#26674Fixes#26675Fixes#26676Fixes#26570Fixes#26590Fixes#26591Fixes#26592
<img width="931" alt="BaseWidgetHOC"
src="https://github.com/appsmithorg/appsmith/assets/35134347/22f4cf1e-e4c5-4475-83a8-6818e7cebe70">
[Miro Link to view the new
system](https://miro.com/app/board/uXjVM6vRgf8=/?moveToWidget=3458764560239189204&cot=14)
> 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.
- 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)
>
>
>
## 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
>
>
#### 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: rahulramesha <rahul@appsmith.com>
Co-authored-by: rahulramesha <71900764+rahulramesha@users.noreply.github.com>
Co-authored-by: Preet Sidhu <preetsidhu.bits@gmail.com>
Co-authored-by: Aswath K <aswath.sana@gmail.com>
## Description
- Remove the config objects from widget and config maps from the widget
factory.
- Introduce methods in widget development API to dynamically fetch this
items.
- freeze the widget configuration.
#### PR fixes following issue(s)
Fixes https://github.com/appsmithorg/appsmith/issues/26008
> 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
- [x] Manual
- [ ] 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
- [x] 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
- [x] 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
Fixes#21718
This is a PR for review of approach that I have come up with refactor
for issue : #21718.
We can discuss the approach in the comments.
This PR moves autocomplete suggestions from a static utility file,
entityDefinitions, to widget/index.ts file of each widget.
This refactor will help in the long term project of moving widgets into
its own module as well as support for custom widgets.
## Description
Replaces the old boring action selector dropdown with a much more
sophisticated UI that is capable of going above and beyond. Users with
an aversion to code can now build their more complex workflows with a
click of a few buttons.
Consider this code snippet
```javascript
Api1.run(() => {
showAlert("Hello");
navigateTo('Page1', {}, 'SAME_WINDOW');
}, () => {
removeValue("test");
});
```
|**Old action selector** |**New action selector**|
|:-:|:-:|
|<img width="250" alt="Screenshot 2023-03-29 at 16 54 14"
src="https://user-images.githubusercontent.com/32433245/228520661-a639b580-8986-4aec-a0f5-e2786d1a0f56.png">|
<img width="250" alt="Screenshot 2023-03-29 at 16 55 15"
src="https://user-images.githubusercontent.com/32433245/228521043-5025aa42-af95-4574-b586-bc4c721240bc.png">|
**Click on an action block to edit its parameters.**
<img width="500" alt="Screenshot 2023-03-29 at 17 01 18"
src="https://user-images.githubusercontent.com/32433245/228522479-493769d0-9d2c-4b67-b493-a79e3bb9c947.png">
**Switch to JS mode to get the raw code**
<img width="273" alt="Screenshot 2023-03-29 at 17 05 51"
src="https://user-images.githubusercontent.com/32433245/228523458-13bc0302-4c94-4176-b5aa-3ec208122f57.png">
### Code changes
**New UI components**
- ActionCreator component splits the code into block statements.
- Each block statement is represented by ActionTree.tsx UI component.
- ActionTree.tsx represents an action and its chains.
- ActionCard.tsx is the block that represents the individual action on
the UI.
- ActionSelector.tsx component is popover that contains the form for
editing individual action.
- TabView, TextView, SelectorView, ActionSelectorView and KeyValueView
are components that represent configurable fields in ActionSelector
form.
**AST methods**
- Added methods to get/set function names, expressions, arguments.
- Added methods to get/set then/catch blocks to allow chaining of
actions.
- Added methods to check if code is convertible to UI.
Fixes#10160Fixes#21588Fixes#21392Fixes#21393Fixes#7903Fixes#15895Fixes#17765Fixes#14562
Depends on https://github.com/appsmithorg/design-system/pull/306
## Type of change
- New feature (non-breaking change which adds functionality)
## How Has This Been Tested?
- Manual
- Jest
- Cypress
### Test Plan
https://github.com/appsmithorg/TestSmith/issues/2296
### Issues raised during DP testing
> Link issues raised during DP testing for better visiblity and tracking
(copy link from comments dropped on this PR)
## Checklist:
### Dev activity
- [x] My code follows the style guidelines of this project
- [ ] I have performed a self-review of my own code
- [x] I have commented my code, particularly in hard-to-understand areas
- [ ] I have made corresponding changes to the documentation
- [x] My changes generate no new warnings
- [x] I have added tests that prove my fix is effective or that my
feature works
- [x] New and existing unit tests pass locally with my changes
- [ ] PR is being merged under a feature flag
### QA activity:
- [x] Test plan has been approved by relevant developers
- [x] Test plan has been peer reviewed by QA
- [x] Cypress test cases have been added and approved by either SDET or
manual QA
- [x] Organized project review call with relevant stakeholders after
Round 1/2 of QA
- [x] Added Test Plan Approved label after reveiwing all Cypress test
---------
Co-authored-by: Rimil Dey <rimil@appsmith.com>
Co-authored-by: arunvjn <arun@appsmith.com>
Co-authored-by: Aishwarya UR <aishwarya@appsmith.com>
Co-authored-by: Parthvi Goswami <parthvigoswami@Parthvis-MacBook-Pro.local>
## Description
This PR upgrades Prettier to v2 + enforces TypeScript’s [`import
type`](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-8.html#type-only-imports-and-export)
syntax where applicable. It’s submitted as a separate PR so we can merge
it easily.
As a part of this PR, we reformat the codebase heavily:
- add `import type` everywhere where it’s required, and
- re-format the code to account for Prettier 2’s breaking changes:
https://prettier.io/blog/2020/03/21/2.0.0.html#breaking-changes
This PR is submitted against `release` to make sure all new code by team
members will adhere to new formatting standards, and we’ll have fewer
conflicts when merging `bundle-optimizations` into `release`. (I’ll
merge `release` back into `bundle-optimizations` once this PR is
merged.)
### Why is this needed?
This PR is needed because, for the Lodash optimization from
7cbb12af88,
we need to use `import type`. Otherwise, `babel-plugin-lodash` complains
that `LoDashStatic` is not a lodash function.
However, just using `import type` in the current codebase will give you
this:
<img width="962" alt="Screenshot 2023-03-08 at 17 45 59"
src="https://user-images.githubusercontent.com/2953267/223775744-407afa0c-e8b9-44a1-90f9-b879348da57f.png">
That’s because Prettier 1 can’t parse `import type` at all. To parse it,
we need to upgrade to Prettier 2.
### Why enforce `import type`?
Apart from just enabling `import type` support, this PR enforces
specifying `import type` everywhere it’s needed. (Developers will get
immediate TypeScript and ESLint errors when they forget to do so.)
I’m doing this because I believe `import type` improves DX and makes
refactorings easier.
Let’s say you had a few imports like below. Can you tell which of these
imports will increase the bundle size? (Tip: it’s not all of them!)
```ts
// app/client/src/workers/Linting/utils.ts
import { Position } from "codemirror";
import { LintError as JSHintError, LintOptions } from "jshint";
import { get, isEmpty, isNumber, keys, last, set } from "lodash";
```
It’s pretty hard, right?
What about now?
```ts
// app/client/src/workers/Linting/utils.ts
import type { Position } from "codemirror";
import type { LintError as JSHintError, LintOptions } from "jshint";
import { get, isEmpty, isNumber, keys, last, set } from "lodash";
```
Now, it’s clear that only `lodash` will be bundled.
This helps developers to see which imports are problematic, but it
_also_ helps with refactorings. Now, if you want to see where
`codemirror` is bundled, you can just grep for `import \{.*\} from
"codemirror"` – and you won’t get any type-only imports.
This also helps (some) bundlers. Upon transpiling, TypeScript erases
type-only imports completely. In some environment (not ours), this makes
the bundle smaller, as the bundler doesn’t need to bundle type-only
imports anymore.
## Type of change
- Chore (housekeeping or task changes that don't impact user perception)
## How Has This Been Tested?
This was tested to not break the build.
### 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
- [ ] 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
- [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
- [ ] PR is being merged under a feature flag
### QA activity:
- [ ] Test plan has been approved by relevant developers
- [ ] Test plan has been peer reviewed by QA
- [ ] Cypress test cases have been added and approved by either SDET or
manual QA
- [ ] Organized project review call with relevant stakeholders after
Round 1/2 of QA
- [ ] Added Test Plan Approved label after reveiwing all Cypress test
---------
Co-authored-by: Satish Gandham <hello@satishgandham.com>
Co-authored-by: Satish Gandham <satish.iitg@gmail.com>
## Description
Core features of Auto Layout and mobile responsiveness, hidden under a feature flag.
> Add a TL;DR when description is extra long (helps content team)
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.
- New feature (non-breaking change which adds functionality)
## How Has This Been Tested?
> Manual regression and sanity tests for all fixed canvas functionality.
- Manual
- 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
- [ ] 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
---------
Co-authored-by: Ashok Kumar M <35134347+marks0351@users.noreply.github.com>
Co-authored-by: Arsalan <arsalanyaldram0211@outlook.com>
Co-authored-by: Aswath K <aswath.sana@gmail.com>
Co-authored-by: Aishwarya UR <aishwarya@appsmith.com>
Part of #11855.
Instead of getting the Google Maps API Key from runtime env variables,
we get it from the server, as part of the response of
`/api/v1/tenant/current`. This doesn't add a database call, just include
the env variable name in the response, so shouldn't have any performance
impact on the API.
On the client though, the Maps API key won't be available, until at
least the first call to `/tenant/current` is finished.
Also, first big PR in client code. 🙂
Edit: not `/me` anymore, but from `/tenant/current`.
---------
Co-authored-by: Pawan Kumar <pawan.stardust@gmail.com>
Co-authored-by: Aishwarya UR <aishwarya@appsmith.com>
## Description
When we worked on replacing the underlying library of google map
component, we accidently replaced the custom icon with the one provided
by google due to which color functionality got lost. This PR fixes this
and also tracks for changes in position or color in the marker values.
Fixes#20271
## Type of change
- Bug fix
## How Has This Been Tested?
- Manual
### Test Plan
> https://github.com/appsmithorg/TestSmith/issues/2180
### 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:
- [x] Test plan has been approved by relevant developers
- [x] Test plan has been peer reviewed by QA
- [ ] Cypress test cases have been added and approved by either SDET or
manual QA
- [ ] Organized project review call with relevant stakeholders after
Round 1/2 of QA
- [ ] Added Test Plan Approved label after reveiwing all Cypress test
This PR:
- updates the react 16 to react 17
- replaces the underlying library for the map widget
- adds clustering of markers
- refactor code for map widget's component
## Description
Fixes#16946
## Type of change
- Breaking change
## How Has This Been Tested?
- Manually
### Test Plan
https://github.com/appsmithorg/TestSmith/issues/2149
### Issues raised during DP testing
1.
https://github.com/appsmithorg/appsmith/pull/19315#issuecomment-1378495845
## 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:
- [ ] Test plan has been approved by relevant developers
- [x] Test plan has been peer reviewed by QA
- [ ] Cypress test cases have been added and approved by either SDET or
manual QA
- [ ] Organized project review call with relevant stakeholders after
Round 1/2 of QA
- [ ] Added Test Plan Approved label after reveiwing all Cypress test
Co-authored-by: Ashok Kumar M <35134347+marks0351@users.noreply.github.com>
Co-authored-by: Arsalan <arsalanyaldram0211@outlook.com>
Co-authored-by: rahulramesha <rahul@appsmith.com>
* POC: Grouping for ButtonWidget
* Adds featureflag
* improve feature flag experience for unfinished widgets
* Styling of tabs
* Adds activation group for ButtonWidget
* Makes contentConfig & styleCOnfig optional to avoid typescript errors from tests
* Adds UI for search
* Fixes title, search & tabs UI to the top
* fix: style issue
* fix styles
* refactor ProeprtyPaneTab
* updates Button based on Figma design changes
* POC for AudioWidget
* chore: JSON Form Grouping & Reorganisation (#15033)
* POC: JSON Form grouping
* fix: Empty sections
* Moves icon into a separate sub section
* fix some sections based on updated Designs
* fix styling issues
* fix: double border
* udpdates based on Figma updates
* Updates order as per Figma
* refactor and better naming of function
* address review comments for JSON form configs
* fix UI issues
* reorder JSON form's array data section
* Adds Button Form settings
* Address QA comments
* update JSON form with new design changes
* Adds FilePickerWidget
* Adds MapChartWidget
* Adds ContainerWidget
* Adds MapWidget
* Adds ImageWidget
* Adds AudioRecorderWidget
* Adds CameraWidget
* Adds ChartWidget
* fix: issues found in design review
* Open array & object style by default
* trigger ci
* chore: Grouping & reorganisation of Video widget (#15297)
* POC: JSON Form grouping
* fix: Empty sections
* Moves icon into a separate sub section
* fix some sections based on updated Designs
* fix styling issues
* fix: double border
* udpdates based on Figma updates
* Updates order as per Figma
* Content & Style Config for Video Widget
* refactor and better naming of function
* address review comments for JSON form configs
* fix UI issues
* ??
* chore: Grouping & reorganisation of Document Viewer widget (#15514)
* Grouping & re-org for Document Viewer
* fix: scroll issue
* Adds FormWidget
* fix: mapchart style section heading
* refactor: cleanup
* incoorporate latest change for Camera widget
* fix: Map pin does not center when location is changed and centering option is turned on
-- Update center meta property when defaultMarkers or mapCenter properties were changed
* fix: Map pin does not center when location is changed and centering option is turned on
-- Force the last marker to be centered
* added config to support code split
* splitting config
* moved the window declaration in EE file as its dependency will be updated in EE
* CE: Splitting ApiConstants and SocialLogin constants
* CE: split login page
* CE: moved getSocialLoginButtonProps func to EE file as it's dependencies will be updated in EE
* added key icon
* CE: created a factory class to share social auths list
* Minor style fix for social btns
* Updated the third party auth styles
* updated jest config
* updated third party login registry class
* feat: Change Map Pin Color on Map Widget
-- Add a color property for a marker
* feat: Change Map Pin Color on Map Widget
-- Set #E0DEDE as default color
* feat: Change Map Pin Color on Map Widget
-- Revert to the original logic
* feat: Change Map Pin Color on Map Widget
-- Add a new base icon for a marker
* feat: Change Map Pin Color on Map Widget
-- Add anchor property for custom marker icon
Co-authored-by: Arpit Mohan <arpit@appsmith.com>
-- Change the label for the property, isClickedMarkerCentered
-- Set isClickedMarkerCentered to true by default
-- Create the corresponding migration for it
* reverted previous revert
* standardised widget sizes
* Text changes
* changed default input label style to match default text style
* more messaging tweaks
* minor fix
* Removed dot from the text
* minor fix for form widget
* fixed tests
* minor fixes