Do not add objects to the DataTree (#2275)

Co-authored-by: Hetu Nandu <hetunandu@gmail.com>

app/client/cypress/integration/Smoke_TestSuite/Binding/Bind_TableTextPagination_spec.js

@@ -23,7 +23,7 @@ describe("Test Create Api and Bind to Table widget", function() {
     /**Bind Table with Textwidget with selected row */
     cy.SearchEntityandOpen("Text1");
     cy.testJsontext("text", "{{Table1.selectedRow.url}}");
-    cy.get(commonlocators.editPropCrossButton).click();
+    cy.SearchEntityandOpen("Table1");
     cy.readTabledata("0", "0").then(tabData => {
       const tableData = tabData;
       localStorage.setItem("tableDataPage1", tableData);

app/client/src/reducers/evaluationReducers/treeReducer.ts

@@ -1,4 +1,4 @@
-import { createReducer } from "utils/AppsmithUtils";
+import { createImmerReducer } from "utils/AppsmithUtils";
 import { DataTree } from "entities/DataTree/dataTreeFactory";
 import { ReduxAction, ReduxActionTypes } from "constants/ReduxActionConstants";
 
@@ -6,7 +6,7 @@ export type EvaluatedTreeState = DataTree;
 
 const initialState: EvaluatedTreeState = {};
 
-const evaluatedTreeReducer = createReducer(initialState, {
+const evaluatedTreeReducer = createImmerReducer(initialState, {
   [ReduxActionTypes.SET_EVALUATED_TREE]: (
     state: EvaluatedTreeState,
     action: ReduxAction<DataTree>,

app/client/src/reducers/index.tsx

@@ -1,7 +1,7 @@
 import { combineReducers } from "redux";
 import entityReducer from "./entityReducers";
 import uiReducer from "./uiReducers";
-import evaluationsReducer from "./evalutationReducers";
+import evaluationsReducer from "./evaluationReducers";
 import { reducer as formReducer } from "redux-form";
 import { CanvasWidgetsReduxState } from "./entityReducers/canvasWidgetsReducer";
 import { EditorReduxState } from "./uiReducers/editorReducer";
@@ -35,8 +35,8 @@ import { PageCanvasStructureReduxState } from "./uiReducers/pageCanvasStructure"
 import { ConfirmRunActionReduxState } from "./uiReducers/confirmRunActionReducer";
 import { AppDataState } from "reducers/entityReducers/appReducer";
 import { DatasourceNameReduxState } from "./uiReducers/datasourceNameReducer";
-import { EvaluatedTreeState } from "./evalutationReducers/treeReducer";
-import { EvaluationDependencyState } from "./evalutationReducers/dependencyReducer";
+import { EvaluatedTreeState } from "./evaluationReducers/treeReducer";
+import { EvaluationDependencyState } from "./evaluationReducers/dependencyReducer";
 import { PageWidgetsReduxState } from "./uiReducers/pageWidgetsReducer";
 import { OnboardingState } from "./uiReducers/onBoardingReducer";
 

app/client/src/sagas/ActionExecutionSagas.ts

@@ -249,11 +249,42 @@ export function* evaluateDynamicBoundValueSaga(
 
 const EXECUTION_PARAM_REFERENCE_REGEX = /this.params/g;
 
+/**
+ * Api1
+ * URL: https://example.com/{{Text1.text}}
+ * Body: {
+ *     "name": "{{this.params.name}}",
+ *     "age": {{this.params.age}},
+ *     "gender": {{Dropdown1.selectedOptionValue}}
+ * }
+ *
+ * If you call
+ * Api1.run(undefined, undefined, { name: "Hetu", age: Input1.text });
+ *
+ * executionParams is { name: "Hetu", age: Input1.text }
+ * bindings is [
+ *   "Text1.text",
+ *   "Dropdown1.selectedOptionValue",
+ *   "this.params.name",
+ *   "this.params.age",
+ * ]
+ *
+ * Return will be [
+ *   { key: "Text1.text", value: "updateUser" },
+ *   { key: "Dropdown1.selectedOptionValue", value: "M" },
+ *   { key: "this.params.name", value: "Hetu" },
+ *   { key: "this.params.age", value: 26 },
+ * ]
+ * @param bindings
+ * @param executionParams
+ */
 export function* getActionParams(
   bindings: string[] | undefined,
   executionParams?: Record<string, any>,
 ) {
   if (_.isNil(bindings)) return [];
+  // This might look like a bug, but isn't.
+  // We send in stringified executionParams, but get back an object
   const evaluatedExecutionParams = yield evaluateDynamicBoundValueSaga(
     JSON.stringify(executionParams),
   );

app/client/src/sagas/evaluationsSaga.ts

@@ -117,10 +117,11 @@ export function* evaluateSingleValue(
 ) {
   if (evaluationWorker) {
     const dataTree = yield select(getDataTree);
-    dataTree[EXECUTION_PARAM_KEY] = executionParams;
     evaluationWorker.postMessage({
       action: EVAL_WORKER_ACTIONS.EVAL_SINGLE,
-      dataTree,
+      dataTree: Object.assign({}, dataTree, {
+        [EXECUTION_PARAM_KEY]: executionParams,
+      }),
       binding,
     });
     const workerResponse = yield take(workerChannel);

app/client/src/utils/autocomplete/dataTreeTypeDefCreator.ts

@@ -16,7 +16,7 @@ export const dataTreeTypeDefCreator = (dataTree: DataTree) => {
   };
   Object.keys(dataTree).forEach(entityName => {
     const entity = dataTree[entityName];
-    if ("ENTITY_TYPE" in entity) {
+    if (entity && "ENTITY_TYPE" in entity) {
       if (entity.ENTITY_TYPE === ENTITY_TYPE.WIDGET) {
         const widgetType = entity.type;
         if (widgetType in entityDefinitions) {