Revert "Selected Option is now available in dropdown widget."

This reverts commit c45198e9927dbb520ef1f3c26f9cfeddbd76995e.

app/client/src/components/editorComponents/DynamicAutocompleteInput.tsx

@@ -12,8 +12,8 @@ import {
   TextInputProps,
 } from "components/designSystems/appsmith/TextInputComponent";
 import {
+  getNameBindingsWithData,
   NameBindingsWithData,
-  getNameBindingsWithDerivedData,
 } from "selectors/nameBindingsWithDataSelector";
 import TreeMenu, {
   MatchSearchFunction,
@@ -218,7 +218,7 @@ class DynamicAutocompleteInput extends Component<Props, State> {
 }
 
 const mapStateToProps = (state: AppState): ReduxStateProps => ({
-  dynamicData: getNameBindingsWithDerivedData(state),
+  dynamicData: getNameBindingsWithData(state),
 });
 
 export default connect(mapStateToProps)(DynamicAutocompleteInput);

app/client/src/sagas/ActionSagas.ts

@@ -52,8 +52,8 @@ import { API_EDITOR_FORM_NAME } from "constants/forms";
 import { executeAction } from "actions/widgetActions";
 import JSExecutionManagerSingleton from "jsExecution/JSExecutionManagerSingleton";
 import {
+  getNameBindingsWithData,
   NameBindingsWithData,
-  getNameBindingsWithDerivedData,
 } from "selectors/nameBindingsWithDataSelector";
 
 export const getAction = (
@@ -81,7 +81,7 @@ const createActionErrorResponse = (
 });
 
 export function* evaluateDynamicBoundValueSaga(path: string): any {
-  const nameBindingsWithData = yield select(getNameBindingsWithDerivedData);
+  const nameBindingsWithData = yield select(getNameBindingsWithData);
   return evaluateDynamicBoundValue(nameBindingsWithData, path);
 }
 
@@ -103,7 +103,7 @@ export function* getActionParams(jsonPathKeys: string[] | undefined) {
 
 function* executeJSActionSaga(jsAction: ExecuteJSActionPayload) {
   const nameBindingsWithData: NameBindingsWithData = yield select(
-    getNameBindingsWithDerivedData,
+    getNameBindingsWithData,
   );
   const result = JSExecutionManagerSingleton.evaluateSync(
     jsAction.jsFunction,

app/client/src/selectors/editorSelectors.tsx

@@ -18,8 +18,8 @@ import { PageListReduxState } from "reducers/entityReducers/pageListReducer";
 import { OccupiedSpace } from "constants/editorConstants";
 import { WidgetTypes } from "constants/WidgetConstants";
 import {
+  getNameBindingsWithData,
   NameBindingsWithData,
-  getNameBindingsWithDerivedData,
 } from "./nameBindingsWithDataSelector";
 
 const getEditorState = (state: AppState) => state.ui.editor;
@@ -116,7 +116,7 @@ export const getWidgetCards = createSelector(
 
 export const getValidatedDynamicProps = createSelector(
   getDataTree,
-  getNameBindingsWithDerivedData,
+  getNameBindingsWithData,
   (entities: DataTree, nameBindingsWithData: NameBindingsWithData) => {
     const widgets = { ...entities.canvasWidgets };
     Object.keys(widgets).forEach(widgetKey => {

app/client/src/selectors/nameBindingsWithDataSelector.ts

@@ -2,23 +2,8 @@ import { DataTree } from "reducers";
 import { JSONPath } from "jsonpath-plus";
 import { createSelector } from "reselect";
 import { getDataTree } from "./entitiesSelector";
-import {
-  CanvasWidgetsReduxState,
-  FlattenedWidgetProps,
-} from "reducers/entityReducers/canvasWidgetsReducer";
-import * as _ from "lodash";
-import { DerivedPropFactory } from "utils/DerivedPropertiesFactory";
-import createCachedSelector from "re-reselect";
 
 export type NameBindingsWithData = Record<string, object>;
-
-export const getCanvasWidgets = createSelector(
-  getDataTree,
-  (dataTree: DataTree): CanvasWidgetsReduxState => {
-    return dataTree.canvasWidgets;
-  },
-);
-
 export const getNameBindingsWithData = createSelector(
   getDataTree,
   (dataTree: DataTree): NameBindingsWithData => {
@@ -33,52 +18,7 @@ export const getNameBindingsWithData = createSelector(
         nameBindingsWithData[key] = evaluatedValue;
       }
     });
+
     return nameBindingsWithData;
   },
 );
-
-const getCanvasWidgetData = (
-  canvasWidgets: CanvasWidgetsReduxState,
-  widgetId: string,
-) => {
-  return canvasWidgets[widgetId];
-};
-
-const getDerivedPropertiesForWidget = createCachedSelector(
-  getCanvasWidgetData,
-  (canvasWidgetData: FlattenedWidgetProps) => {
-    return DerivedPropFactory.getDerivedProperties(canvasWidgetData);
-  },
-)((canvasWidgets, widgetId) => {
-  return widgetId;
-});
-
-export const getDerivedProperties = createSelector(
-  getCanvasWidgets,
-  (canvasWidgets: CanvasWidgetsReduxState): NameBindingsWithData => {
-    const allDerivedProps: Record<string, object> = {};
-    Object.keys(canvasWidgets).forEach(widgetId => {
-      const widgetName = canvasWidgets[widgetId].widgetName;
-      const widgetDerivedProps = getDerivedPropertiesForWidget(
-        canvasWidgets,
-        widgetId,
-      );
-      if (widgetDerivedProps) {
-        allDerivedProps[widgetName] = widgetDerivedProps;
-      }
-    });
-
-    return allDerivedProps;
-  },
-);
-
-export const getNameBindingsWithDerivedData = createSelector(
-  getDerivedProperties,
-  getNameBindingsWithData,
-  (
-    derivedProps: NameBindingsWithData,
-    nameBindingsWithData: NameBindingsWithData,
-  ): NameBindingsWithData => {
-    return _.merge(derivedProps, nameBindingsWithData);
-  },
-);

app/client/src/selectors/propertyPaneSelectors.tsx

@@ -7,8 +7,8 @@ import { PropertySection } from "reducers/entityReducers/propertyPaneConfigReduc
 import { enhanceWithDynamicValuesAndValidations } from "utils/DynamicBindingUtils";
 import { WidgetProps } from "widgets/BaseWidget";
 import {
+  getNameBindingsWithData,
   NameBindingsWithData,
-  getNameBindingsWithDerivedData,
 } from "./nameBindingsWithDataSelector";
 
 const getPropertyPaneState = (state: AppState): PropertyPaneReduxState =>
@@ -38,7 +38,7 @@ export const getCurrentWidgetProperties = createSelector(
 
 export const getWidgetPropsWithValidations = createSelector(
   getCurrentWidgetProperties,
-  getNameBindingsWithDerivedData,
+  getNameBindingsWithData,
   (
     widget: WidgetProps | undefined,
     nameBindigsWithData: NameBindingsWithData,

app/client/src/utils/DerivedPropertiesFactory.ts

@@ -1,29 +0,0 @@
-import { FlattenedWidgetProps } from "reducers/entityReducers/canvasWidgetsReducer";
-import WidgetFactory from "./WidgetFactory";
-
-export class DerivedPropFactory {
-  static getDerivedProperties(
-    widgetDataWithValidations: FlattenedWidgetProps,
-  ): any {
-    const derivedPropertyMap = WidgetFactory.getWidgetDerivedPropertiesMap(
-      widgetDataWithValidations.type,
-    );
-
-    const derivedProps: any = {};
-    Object.keys(derivedPropertyMap).forEach(propertyName => {
-      const derivedPropertyGetter = derivedPropertyMap[propertyName];
-      let propertValue;
-      try {
-        propertValue = derivedPropertyGetter(widgetDataWithValidations);
-        if (propertValue) {
-          derivedProps[propertyName] = propertValue;
-        }
-      } catch (ex) {
-        console.error(
-          `Property evaluation failed for ${propertyName} for widget ${widgetDataWithValidations.widgetName}`,
-        );
-      }
-    });
-    return derivedProps;
-  }
-}

app/client/src/utils/WidgetFactory.tsx

@@ -5,11 +5,6 @@ import {
   WidgetDataProps,
 } from "widgets/BaseWidget";
 import { WidgetPropertyValidationType } from "./ValidationFactory";
-import { FlattenedWidgetProps } from "reducers/entityReducers/canvasWidgetsReducer";
-
-type WidgetDerivedPropertyType = any;
-type DerivedPropertyGetter = (widgetData: FlattenedWidgetProps) => {};
-export type DerivedPropertiesMap = Record<string, DerivedPropertyGetter>;
 
 class WidgetFactory {
   static widgetMap: Map<WidgetType, WidgetBuilder<WidgetProps>> = new Map();
@@ -17,24 +12,14 @@ class WidgetFactory {
     WidgetType,
     WidgetPropertyValidationType
   > = new Map();
-  static widgetDerivedPropertiesGetterMap: Map<
-    WidgetType,
-    WidgetDerivedPropertyType
-  > = new Map();
-  static derivedPropertiesMap: Map<
-    WidgetType,
-    DerivedPropertiesMap
-  > = new Map();
 
   static registerWidgetBuilder(
     widgetType: WidgetType,
     widgetBuilder: WidgetBuilder<WidgetProps>,
     widgetPropertyValidation: WidgetPropertyValidationType,
-    derivedPropertiesMap: DerivedPropertiesMap,
   ) {
     this.widgetMap.set(widgetType, widgetBuilder);
     this.widgetPropValidationMap.set(widgetType, widgetPropertyValidation);
-    this.derivedPropertiesMap.set(widgetType, derivedPropertiesMap);
   }
 
   static createWidget(
@@ -75,17 +60,6 @@ class WidgetFactory {
     }
     return map;
   }
-
-  static getWidgetDerivedPropertiesMap(
-    widgetType: WidgetType,
-  ): DerivedPropertiesMap {
-    const map = this.derivedPropertiesMap.get(widgetType);
-    if (!map) {
-      console.error("Widget type validation is not defined");
-      return {};
-    }
-    return map;
-  }
 }
 
 export interface WidgetCreationException {

app/client/src/utils/WidgetRegistry.tsx

@@ -31,7 +31,6 @@ class WidgetBuilderRegistry {
         },
       },
       ContainerWidget.getPropertyValidationMap(),
-      ContainerWidget.getDerivedPropertiesMap(),
     );
 
     WidgetFactory.registerWidgetBuilder(
@@ -42,7 +41,6 @@ class WidgetBuilderRegistry {
         },
       },
       TextWidget.getPropertyValidationMap(),
-      TextWidget.getDerivedPropertiesMap(),
     );
 
     WidgetFactory.registerWidgetBuilder(
@@ -53,7 +51,6 @@ class WidgetBuilderRegistry {
         },
       },
       ButtonWidget.getPropertyValidationMap(),
-      ButtonWidget.getDerivedPropertiesMap(),
     );
 
     WidgetFactory.registerWidgetBuilder(
@@ -64,7 +61,6 @@ class WidgetBuilderRegistry {
         },
       },
       SpinnerWidget.getPropertyValidationMap(),
-      SpinnerWidget.getDerivedPropertiesMap(),
     );
 
     WidgetFactory.registerWidgetBuilder(
@@ -75,7 +71,6 @@ class WidgetBuilderRegistry {
         },
       },
       InputWidget.getPropertyValidationMap(),
-      InputWidget.getDerivedPropertiesMap(),
     );
 
     WidgetFactory.registerWidgetBuilder(
@@ -86,7 +81,6 @@ class WidgetBuilderRegistry {
         },
       },
       CheckboxWidget.getPropertyValidationMap(),
-      CheckboxWidget.getDerivedPropertiesMap(),
     );
 
     WidgetFactory.registerWidgetBuilder(
@@ -97,7 +91,6 @@ class WidgetBuilderRegistry {
         },
       },
       DropdownWidget.getPropertyValidationMap(),
-      DropdownWidget.getDerivedPropertiesMap(),
     );
 
     WidgetFactory.registerWidgetBuilder(
@@ -108,7 +101,6 @@ class WidgetBuilderRegistry {
         },
       },
       RadioGroupWidget.getPropertyValidationMap(),
-      RadioGroupWidget.getDerivedPropertiesMap(),
     );
 
     WidgetFactory.registerWidgetBuilder(
@@ -119,7 +111,6 @@ class WidgetBuilderRegistry {
         },
       },
       ImageWidget.getPropertyValidationMap(),
-      ImageWidget.getDerivedPropertiesMap(),
     );
     WidgetFactory.registerWidgetBuilder(
       "TABLE_WIDGET",
@@ -129,7 +120,6 @@ class WidgetBuilderRegistry {
         },
       },
       TableWidget.getPropertyValidationMap(),
-      TableWidget.getDerivedPropertiesMap(),
     );
     WidgetFactory.registerWidgetBuilder(
       "FILE_PICKER_WIDGET",
@@ -139,7 +129,6 @@ class WidgetBuilderRegistry {
         },
       },
       FilePickerWidget.getPropertyValidationMap(),
-      FilePickerWidget.getDerivedPropertiesMap(),
     );
     WidgetFactory.registerWidgetBuilder(
       "DATE_PICKER_WIDGET",
@@ -149,7 +138,6 @@ class WidgetBuilderRegistry {
         },
       },
       DatePickerWidget.getPropertyValidationMap(),
-      DatePickerWidget.getDerivedPropertiesMap(),
     );
   }
 }

app/client/src/widgets/BaseWidget.tsx

@@ -23,8 +23,6 @@ import { PositionTypes } from "constants/WidgetConstants";
 
 import ErrorBoundary from "components/editorComponents/ErrorBoundry";
 import { WidgetPropertyValidationType } from "utils/ValidationFactory";
-import { FlattenedWidgetProps } from "reducers/entityReducers/canvasWidgetsReducer";
-import { DerivedPropertiesMap } from "utils/WidgetFactory";
 /***
  * BaseWidget
  *
@@ -60,10 +58,6 @@ abstract class BaseWidget<
     return {};
   }
 
-  static getDerivedPropertiesMap(): DerivedPropertiesMap {
-    return {};
-  }
-
   /**
    *  Widget abstraction to register the widget type
    *  ```javascript

app/client/src/widgets/DropdownWidget.tsx

@@ -6,12 +6,7 @@ import DropDownComponent from "components/designSystems/blueprint/DropdownCompon
 import _ from "lodash";
 import { WidgetPropertyValidationType } from "utils/ValidationFactory";
 import { VALIDATION_TYPES } from "constants/WidgetValidation";
-import { FlattenedWidgetProps } from "reducers/entityReducers/canvasWidgetsReducer";
 
-export interface DropDownDerivedProps {
-  selectedOption?: DropdownOption;
-  selectedOptionArr?: DropdownOption[];
-}
 class DropdownWidget extends BaseWidget<DropdownWidgetProps, WidgetState> {
   static getPropertyValidationMap(): WidgetPropertyValidationType {
     return {
@@ -23,23 +18,6 @@ class DropdownWidget extends BaseWidget<DropdownWidgetProps, WidgetState> {
       selectedIndexArr: VALIDATION_TYPES.ARRAY,
     };
   }
-  static getDerivedPropertiesMap() {
-    return {
-      selectedOption: (widgetData: FlattenedWidgetProps) => {
-        return widgetData.selectionType === "SINGLE_SELECT"
-          ? widgetData.options[widgetData.selectedIndex]
-          : undefined;
-      },
-      selectedOptionArr: (widgetData: FlattenedWidgetProps) => {
-        const options = widgetData.options || [];
-        return widgetData.selectionType === "MULTI_SELECT"
-          ? options.filter((opt: DropdownOption, index: number) =>
-              _.includes(widgetData.selectedIndexArr, index),
-            )
-          : undefined;
-      },
-    };
-  }
   getPageView() {
     return (
       <DropDownComponent

app/client/src/widgets/RadioGroupWidget.tsx

@@ -5,7 +5,6 @@ import RadioGroupComponent from "components/designSystems/blueprint/RadioGroupCo
 import { ActionPayload } from "constants/ActionConstants";
 import { WidgetPropertyValidationType } from "utils/ValidationFactory";
 import { VALIDATION_TYPES } from "constants/WidgetValidation";
-import { FlattenedWidgetProps } from "reducers/entityReducers/canvasWidgetsReducer";
 
 class RadioGroupWidget extends BaseWidget<RadioGroupWidgetProps, WidgetState> {
   static getPropertyValidationMap(): WidgetPropertyValidationType {
@@ -15,23 +14,6 @@ class RadioGroupWidget extends BaseWidget<RadioGroupWidgetProps, WidgetState> {
       selectedOptionValue: VALIDATION_TYPES.TEXT,
     };
   }
-  static getDerivedProperties(widgetData: FlattenedWidgetProps) {
-    return {
-      selectedOption: widgetData.options.find(
-        (opt: RadioOption) =>
-          opt.value.toString() === widgetData.selectedOptionValue.toString(),
-      ),
-    };
-  }
-  static getDerivedPropertiesMap() {
-    return {
-      selectedOption: (widgetData: FlattenedWidgetProps) =>
-        widgetData.options.find(
-          (opt: RadioOption) =>
-            opt.value.toString() === widgetData.selectedOptionValue.toString(),
-        ),
-    };
-  }
   getPageView() {
     return (
       <RadioGroupComponent

app/client/src/widgets/TableWidget.tsx

@@ -11,7 +11,6 @@ import SelectableTable, {
 } from "components/designSystems/appsmith/TableComponent";
 import { VALIDATION_TYPES } from "constants/WidgetValidation";
 import { WidgetPropertyValidationType } from "utils/ValidationFactory";
-import { FlattenedWidgetProps } from "reducers/entityReducers/canvasWidgetsReducer";
 
 function constructColumns(data: object[]): Column[] {
   const cols: Column[] = [];
@@ -37,15 +36,7 @@ class TableWidget extends BaseWidget<TableWidgetProps, WidgetState> {
       nextPageKey: VALIDATION_TYPES.TEXT,
       prevPageKey: VALIDATION_TYPES.TEXT,
       label: VALIDATION_TYPES.TEXT,
-      selectedRowIndex: VALIDATION_TYPES.NUMBER,
+      selectedRow: VALIDATION_TYPES.OBJECT,
-    };
-  }
-
-  static getDerivedPropertiesMap() {
-    return {
-      selectedRow: (widgetData: FlattenedWidgetProps) => {
-        return widgetData.tableData[widgetData.selectedRowIndex];
-      },
     };
   }
 
@@ -62,10 +53,12 @@ class TableWidget extends BaseWidget<TableWidgetProps, WidgetState> {
             data={tableData}
             maxHeight={height}
             isLoading={this.props.isLoading}
-            selectedRowIndex={this.props.selectedRowIndex}
+            selectedRowIndex={
+              this.props.selectedRow && this.props.selectedRow.rowIndex
+            }
             onRowClick={(rowData: object, index: number) => {
               const { onRowSelected } = this.props;
-              this.updateSelectedRowProperty(index);
+              this.updateSelectedRowProperty(rowData, index);
               super.executeAction(onRowSelected);
             }}
           />
@@ -73,10 +66,25 @@ class TableWidget extends BaseWidget<TableWidgetProps, WidgetState> {
       </AutoResizer>
     );
   }
+  componentDidUpdate(prevProps: TableWidgetProps) {
+    super.componentDidUpdate(prevProps);
+    if (
+      !_.isEqual(prevProps.tableData, this.props.tableData) &&
+      prevProps.selectedRow
+    ) {
+      this.updateSelectedRowProperty(
+        this.props.tableData[prevProps.selectedRow.rowIndex],
+        prevProps.selectedRow.rowIndex,
+      );
+    }
+  }
 
-  updateSelectedRowProperty(index: number) {
+  updateSelectedRowProperty(rowData: object, index: number) {
     const { widgetId } = this.props;
-    this.updateWidgetProperty(widgetId, "selectedRowIndex", index);
+    this.updateWidgetProperty(widgetId, "selectedRow", {
+      ...rowData,
+      rowIndex: index,
+    });
   }
 
   getWidgetType(): WidgetType {
@@ -99,7 +107,7 @@ export interface TableWidgetProps extends WidgetProps {
   recordActions?: TableAction[];
   onPageChange?: ActionPayload[];
   onRowSelected?: ActionPayload[];
-  selectedRowIndex?: number;
+  selectedRow?: SelectedRow;
 }
 
 export default TableWidget;