PromucFlow_constructor/app/client/src/components/propertyControls/BaseControl.tsx
Aswath K 3824435f7d
chore: Adds analytics for Property Pane keyboard navigation (#13703)
* Adds analytics for DropdownControl

* Add isUpdatedViaKeyboard to WIDGET_PROPERTY_UPDATE

* fix: jest test for iconselectorcontrol

* refactor: Interaction analytics event dispatching moved to a hook

* refactor: event collection logic to HOC

* Analytics for SwitchControl

* Analytics for CodeEditor

* Analytics for InputTextControl

* Analytics for ColorPicker

* fix issue with ColorPicker

* refactor to re-use ref

* rename the hook to ts

* Analytics for StepControl

* Analytics for ButtonTabComponent

* Analytics for NumericInputControl

* Analytics for IconSelector

* fix: failed test

* Analytics for ActionSelector

* fix: failed jest test

* fix: jest test for StepControl

* Analytics for Option Control

* Analytics for LocationSearchControl

* Adds Analytics for Tab key

* analytics for Property pane connections

* Add analytics for widget name

* Adds analytics for copy & delete button

* fix issue with widget name analytics

* add useCallback for tab keydown handler for button

* Create separate Event handling for design system

* removes unused imports

* changes ADS_EVENT to DS_EVENT

* Changes AdsEventTypes to DSEventTypes

* Changes AdsEventDetail to DSEventDetail

* changes occurences of Ads to DS

* avoids creation of intermediate function

* removes trace of 'analytics' from DS components

* rename dispatchDSEvent to emitDSEvent

* fix: Cypress selector
2022-07-14 10:30:30 +05:30

86 lines
2.7 KiB
TypeScript

/***
* Controls are rendered in the property panel from the property config
* Controls are higher order components that update a widgets property
*/
import { Component } from "react";
import _ from "lodash";
import { EditorTheme } from "components/editorComponents/CodeEditor/EditorConfig";
import { PropertyPaneControlConfig } from "constants/PropertyControlConstants";
import { CodeEditorExpected } from "components/editorComponents/CodeEditor";
// eslint-disable-next-line @typescript-eslint/ban-types
class BaseControl<P extends ControlProps, S = {}> extends Component<P, S> {
updateProperty(
propertyName: string,
propertyValue: any,
isUpdatedViaKeyboard?: boolean,
) {
if (!_.isNil(this.props.onPropertyChange))
this.props.onPropertyChange(
propertyName,
propertyValue,
isUpdatedViaKeyboard,
);
}
deleteProperties(propertyPaths: string[]) {
if (this.props.deleteProperties) {
this.props.deleteProperties(propertyPaths);
}
}
batchUpdateProperties = (updates: Record<string, unknown>) => {
if (this.props.onBatchUpdateProperties) {
this.props.onBatchUpdateProperties(updates);
}
};
static getControlType() {
return "BASE_CONTROL";
}
// Checks whether a particular value can be displayed UI from JS edit mode
// eslint-disable-next-line @typescript-eslint/no-unused-vars
static canDisplayValueInUI(config: ControlData, value: any): boolean {
return false;
}
// Only applicable for JSONFormComputeControl & ComputeTablePropertyControl
// eslint-disable-next-line @typescript-eslint/no-unused-vars
static getInputComputedValue(value: string, widgetName: string): string {
return "";
}
}
export interface ControlBuilder<T extends ControlProps> {
buildPropertyControl(controlProps: T): JSX.Element;
}
export interface ControlProps extends ControlData, ControlFunctions {
key?: string;
additionalAutoComplete?: Record<string, Record<string, unknown>>;
}
export interface ControlData
extends Omit<PropertyPaneControlConfig, "additionalAutoComplete"> {
propertyValue?: any;
errorMessage?: string;
expected?: CodeEditorExpected;
evaluatedValue: any;
widgetProperties: any;
useValidationMessage?: boolean;
parentPropertyName: string;
parentPropertyValue: unknown;
additionalDynamicData: Record<string, Record<string, unknown>>;
}
export interface ControlFunctions {
onPropertyChange?: (
propertyName: string,
propertyValue: string,
isUpdatedViaKeyboard?: boolean,
) => void;
onBatchUpdateProperties?: (updates: Record<string, unknown>) => void;
openNextPanel: (props: any) => void;
deleteProperties: (propertyPaths: string[]) => void;
theme: EditorTheme;
hideEvaluatedValue?: boolean;
}
export default BaseControl;