From 311aae8aa5a8636e2c711902b6e55d3b486c2060 Mon Sep 17 00:00:00 2001 From: Pawan Kumar Date: Sat, 19 Oct 2024 11:22:39 +0530 Subject: [PATCH 1/6] fix exporting the wrong zone --- .../utils/layouts/update/sectionUtils.ts | 4 ++-- .../anvil/utils/layouts/update/zoneUtils.ts | 19 +++++++------------ app/client/src/sagas/WidgetBlueprintSagas.ts | 6 ++++-- 3 files changed, 13 insertions(+), 16 deletions(-) diff --git a/app/client/src/layoutSystems/anvil/utils/layouts/update/sectionUtils.ts b/app/client/src/layoutSystems/anvil/utils/layouts/update/sectionUtils.ts index 9a4f5df405eb..8cb4c9d4474e 100644 --- a/app/client/src/layoutSystems/anvil/utils/layouts/update/sectionUtils.ts +++ b/app/client/src/layoutSystems/anvil/utils/layouts/update/sectionUtils.ts @@ -19,7 +19,7 @@ import { addNewAnvilWidgetToDSL } from "layoutSystems/anvil/integrations/sagas/a export function* createSectionAndAddWidget( allWidgets: CanvasWidgetsReduxState, highlight: AnvilHighlightInfo, - widgets: WidgetLayoutProps[], + draggedWidgets: WidgetLayoutProps[], parentId: string, ) { /** @@ -48,7 +48,7 @@ export function* createSectionAndAddWidget( yield call( addWidgetsToSection, updatedWidgets, - widgets, + draggedWidgets, highlight, sectionProps, ); diff --git a/app/client/src/layoutSystems/anvil/utils/layouts/update/zoneUtils.ts b/app/client/src/layoutSystems/anvil/utils/layouts/update/zoneUtils.ts index acffc1094914..8bbda041bb5d 100644 --- a/app/client/src/layoutSystems/anvil/utils/layouts/update/zoneUtils.ts +++ b/app/client/src/layoutSystems/anvil/utils/layouts/update/zoneUtils.ts @@ -58,7 +58,7 @@ export function* createZoneAndAddWidgets( updatedWidgets, draggedWidgets, highlight, - zoneProps, + zoneProps.widgetId, ); return res; @@ -68,13 +68,11 @@ export function* addWidgetsToZone( allWidgets: CanvasWidgetsReduxState, draggedWidgets: WidgetLayoutProps[], highlight: AnvilHighlightInfo, - zone: WidgetProps, + zoneWidgetId: string, ) { let updatedWidgets: CanvasWidgetsReduxState = { ...allWidgets }; - const zoneProps = { ...zone }; - const preset: LayoutProps[] = zoneProps.layout; + const preset: LayoutProps[] = updatedWidgets[zoneWidgetId].layout; let zoneLayout: LayoutProps = preset[0]; - const { widgetId: zoneWidgetId } = zoneProps; /** * If dragged widget is a new widget, @@ -86,7 +84,7 @@ export function* addWidgetsToZone( zoneWidgetId, draggedWidgets, ); - zoneProps.children = updatedWidgets[zoneWidgetId].children; + updatedWidgets[zoneWidgetId].children = updatedWidgets[zoneWidgetId].children; /** * Split new widgets based on type. @@ -127,14 +125,11 @@ export function* addWidgetsToZone( /** * Update zone widget with the updated preset. */ - zoneProps.layout = [zoneLayout]; + updatedWidgets[zoneWidgetId].layout = [zoneLayout]; return { - canvasWidgets: { - ...updatedWidgets, - [zoneProps.widgetId]: zoneProps, - }, - zone: zoneProps, + canvasWidgets: updatedWidgets, + zone: updatedWidgets[zoneWidgetId], }; } diff --git a/app/client/src/sagas/WidgetBlueprintSagas.ts b/app/client/src/sagas/WidgetBlueprintSagas.ts index 10d36ba13746..cb6989ccc6ec 100644 --- a/app/client/src/sagas/WidgetBlueprintSagas.ts +++ b/app/client/src/sagas/WidgetBlueprintSagas.ts @@ -134,8 +134,10 @@ export function* executeWidgetBlueprintOperations( updatePropertyPayloads && updatePropertyPayloads.forEach((params: UpdatePropertyArgs) => { - widgets[params.widgetId][params.propertyName] = - params.propertyValue; + widgets[params.widgetId] = { + ...widgets[params.widgetId], + [params.propertyName]: params.propertyValue, + }; }); break; } From d7b7cf50ae19bee57d01f2b27f427900da80fe67 Mon Sep 17 00:00:00 2001 From: Pawan Kumar Date: Sat, 19 Oct 2024 13:33:50 +0530 Subject: [PATCH 2/6] fix function call --- .../src/layoutSystems/anvil/utils/layouts/update/zoneUtils.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/client/src/layoutSystems/anvil/utils/layouts/update/zoneUtils.ts b/app/client/src/layoutSystems/anvil/utils/layouts/update/zoneUtils.ts index 8bbda041bb5d..ebb445d35913 100644 --- a/app/client/src/layoutSystems/anvil/utils/layouts/update/zoneUtils.ts +++ b/app/client/src/layoutSystems/anvil/utils/layouts/update/zoneUtils.ts @@ -214,7 +214,7 @@ function* moveWidgetsToNewLayout( widgets, transformMovedWidgets(widgets, movedWidgets, highlight), highlight, - zone, + zone.widgetId, ); return canvasWidgets; From d36fa9749fc38e3aee15a08e0c260be2dd330698 Mon Sep 17 00:00:00 2001 From: Pawan Kumar Date: Sat, 19 Oct 2024 13:48:59 +0530 Subject: [PATCH 3/6] remove code that was removing capsizing compensators --- .../widgets/src/components/Markdown/src/styles.module.css | 6 ------ 1 file changed, 6 deletions(-) diff --git a/app/client/packages/design-system/widgets/src/components/Markdown/src/styles.module.css b/app/client/packages/design-system/widgets/src/components/Markdown/src/styles.module.css index 96036ed4d177..c0995e835b25 100644 --- a/app/client/packages/design-system/widgets/src/components/Markdown/src/styles.module.css +++ b/app/client/packages/design-system/widgets/src/components/Markdown/src/styles.module.css @@ -1,12 +1,6 @@ .markdown { color: var(--color-fg); - &::after, - &::before { - /* This is required to remove the compensators of capsizing that comes up due to use of `wds-body-text` class */ - content: none !important; - } - table { border: var(--border-width-1) solid var(--color-bd); border-collapse: separate; From 76a6df8360d6b82cf870e0af3e93ae1143d719b2 Mon Sep 17 00:00:00 2001 From: Pawan Kumar Date: Mon, 21 Oct 2024 10:18:34 +0530 Subject: [PATCH 4/6] remove unecessary code --- .../src/layoutSystems/anvil/utils/layouts/update/zoneUtils.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/app/client/src/layoutSystems/anvil/utils/layouts/update/zoneUtils.ts b/app/client/src/layoutSystems/anvil/utils/layouts/update/zoneUtils.ts index ebb445d35913..09cef911286e 100644 --- a/app/client/src/layoutSystems/anvil/utils/layouts/update/zoneUtils.ts +++ b/app/client/src/layoutSystems/anvil/utils/layouts/update/zoneUtils.ts @@ -84,7 +84,6 @@ export function* addWidgetsToZone( zoneWidgetId, draggedWidgets, ); - updatedWidgets[zoneWidgetId].children = updatedWidgets[zoneWidgetId].children; /** * Split new widgets based on type. From 26279c80afb8eff34d2cbf5e3882f8e6adec8af1 Mon Sep 17 00:00:00 2001 From: Pawan Kumar Date: Mon, 21 Oct 2024 16:11:22 +0530 Subject: [PATCH 5/6] try immer produce instead of spread --- app/client/src/sagas/WidgetBlueprintSagas.ts | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) diff --git a/app/client/src/sagas/WidgetBlueprintSagas.ts b/app/client/src/sagas/WidgetBlueprintSagas.ts index cb6989ccc6ec..9bb6d182e77e 100644 --- a/app/client/src/sagas/WidgetBlueprintSagas.ts +++ b/app/client/src/sagas/WidgetBlueprintSagas.ts @@ -13,6 +13,7 @@ import * as log from "loglevel"; import { toast } from "@appsmith/ads"; import type { LayoutSystemTypes } from "layoutSystems/types"; import { getLayoutSystemType } from "selectors/layoutSystemSelectors"; +import produce from "immer"; function buildView(view: WidgetBlueprint["view"], widgetId: string) { const children = []; @@ -134,10 +135,12 @@ export function* executeWidgetBlueprintOperations( updatePropertyPayloads && updatePropertyPayloads.forEach((params: UpdatePropertyArgs) => { - widgets[params.widgetId] = { - ...widgets[params.widgetId], - [params.propertyName]: params.propertyValue, - }; + widgets[params.widgetId] = produce( + widgets[params.widgetId], + (draft) => { + draft[params.propertyName] = params.propertyValue; + }, + ); }); break; } From 8a385eec313142b40f848eed20310d3774c0705c Mon Sep 17 00:00:00 2001 From: Pawan Kumar Date: Mon, 21 Oct 2024 19:40:42 +0530 Subject: [PATCH 6/6] try klona approach --- .../integrations/sagas/anvilWidgetAdditionSagas/index.ts | 4 +++- app/client/src/sagas/WidgetBlueprintSagas.ts | 9 ++------- 2 files changed, 5 insertions(+), 8 deletions(-) diff --git a/app/client/src/layoutSystems/anvil/integrations/sagas/anvilWidgetAdditionSagas/index.ts b/app/client/src/layoutSystems/anvil/integrations/sagas/anvilWidgetAdditionSagas/index.ts index c121a4583586..730772a90e03 100644 --- a/app/client/src/layoutSystems/anvil/integrations/sagas/anvilWidgetAdditionSagas/index.ts +++ b/app/client/src/layoutSystems/anvil/integrations/sagas/anvilWidgetAdditionSagas/index.ts @@ -27,6 +27,7 @@ import log from "loglevel"; import { generateDefaultLayoutPreset } from "layoutSystems/anvil/layoutComponents/presets/DefaultLayoutPreset"; import { addWidgetsToPreset } from "layoutSystems/anvil/utils/layouts/update/additionUtils"; import { addNewAnvilWidgetToDSL } from "./helpers"; +import { klona } from "klona"; // The suggested widget functionality allows users to bind data from the Query pane // to a new or existing widget on the Canvas. @@ -109,7 +110,8 @@ export function* getUpdatedListOfWidgetsAfterAddingNewWidget( isSection: boolean, // Indicates if the drop zone is a section ) { const { alignment, canvasId } = highlight; - const allWidgets: CanvasWidgetsReduxState = yield select(getWidgets); + const allWidgetsFromRedux: CanvasWidgetsReduxState = yield select(getWidgets); + const allWidgets = klona(allWidgetsFromRedux) as CanvasWidgetsReduxState; const parentWidgetWithLayout = allWidgets[canvasId]; diff --git a/app/client/src/sagas/WidgetBlueprintSagas.ts b/app/client/src/sagas/WidgetBlueprintSagas.ts index 9bb6d182e77e..10d36ba13746 100644 --- a/app/client/src/sagas/WidgetBlueprintSagas.ts +++ b/app/client/src/sagas/WidgetBlueprintSagas.ts @@ -13,7 +13,6 @@ import * as log from "loglevel"; import { toast } from "@appsmith/ads"; import type { LayoutSystemTypes } from "layoutSystems/types"; import { getLayoutSystemType } from "selectors/layoutSystemSelectors"; -import produce from "immer"; function buildView(view: WidgetBlueprint["view"], widgetId: string) { const children = []; @@ -135,12 +134,8 @@ export function* executeWidgetBlueprintOperations( updatePropertyPayloads && updatePropertyPayloads.forEach((params: UpdatePropertyArgs) => { - widgets[params.widgetId] = produce( - widgets[params.widgetId], - (draft) => { - draft[params.propertyName] = params.propertyValue; - }, - ); + widgets[params.widgetId][params.propertyName] = + params.propertyValue; }); break; }