diff --git a/app/client/src/modules/ui-builder/ui/wds/WDSCurrencyInputWidget/widget/index.tsx b/app/client/src/modules/ui-builder/ui/wds/WDSCurrencyInputWidget/widget/index.tsx index f9087571fc14..40a16da89274 100644 --- a/app/client/src/modules/ui-builder/ui/wds/WDSCurrencyInputWidget/widget/index.tsx +++ b/app/client/src/modules/ui-builder/ui/wds/WDSCurrencyInputWidget/widget/index.tsx @@ -6,7 +6,7 @@ import type { WidgetState } from "widgets/BaseWidget"; import { EventType } from "constants/AppsmithActionConstants/ActionConstants"; import { CurrencyInputComponent } from "../component"; -import derivedProperties from "./parsedDerivedProperties"; + import { formatCurrencyNumber, limitDecimalValue, @@ -19,7 +19,9 @@ import { import { getLocaleDecimalSeperator, getLocaleThousandSeparator, + parseDerivedProperties, } from "widgets/WidgetUtils"; +import derivedPropertyFns from "./derived"; import type { SetterConfig, Stylesheet } from "entities/AppTheming"; import type { AnvilConfig, @@ -120,8 +122,10 @@ class WDSCurrencyInputWidget extends WDSBaseInputWidget< } static getDerivedPropertiesMap() { + const parsedDerivedProperties = parseDerivedProperties(derivedPropertyFns); + return { - isValid: `{{(() => {${derivedProperties.isValid}})()}}`, + isValid: `{{(() => {${parsedDerivedProperties.isValid}})()}}`, }; } diff --git a/app/client/src/modules/ui-builder/ui/wds/WDSCurrencyInputWidget/widget/parsedDerivedProperties.ts b/app/client/src/modules/ui-builder/ui/wds/WDSCurrencyInputWidget/widget/parsedDerivedProperties.ts deleted file mode 100644 index 96f4b7964ddf..000000000000 --- a/app/client/src/modules/ui-builder/ui/wds/WDSCurrencyInputWidget/widget/parsedDerivedProperties.ts +++ /dev/null @@ -1,40 +0,0 @@ -// @ts-expect-error: loader types not available -import widgetPropertyFns from "!!raw-loader!./derived.js"; - -// TODO(abhinav): -// Add unit test cases -// Handle edge cases -// Error out on wrong values -// TODO: Fix this the next time the file is edited -// eslint-disable-next-line @typescript-eslint/no-explicit-any -const derivedProperties: any = {}; -// const regex = /(\w+):\s?\(props\)\s?=>\s?{([\w\W]*?)},/gim; -const regex = - /(\w+):\s?\(props, moment, _\)\s?=>\s?{([\w\W\n]*?)},\n?\s+?\/\//gim; - -let m; - -while ((m = regex.exec(widgetPropertyFns)) !== null) { - // This is necessary to avoid infinite loops with zero-width matches - if (m.index === regex.lastIndex) { - regex.lastIndex++; - } - - let key = ""; - - // The result can be accessed through the `m`-variable. - m.forEach((match, groupIndex) => { - if (groupIndex === 1) { - key = match; - } - - if (groupIndex === 2) { - derivedProperties[key] = match - .trim() - .replace(/\n/g, "") - .replace(/props\./g, "this."); - } - }); -} - -export default derivedProperties; diff --git a/app/client/src/modules/ui-builder/ui/wds/WDSInputWidget/widget/index.tsx b/app/client/src/modules/ui-builder/ui/wds/WDSInputWidget/widget/index.tsx index 5eec9a47efe9..ac858aa5acff 100644 --- a/app/client/src/modules/ui-builder/ui/wds/WDSInputWidget/widget/index.tsx +++ b/app/client/src/modules/ui-builder/ui/wds/WDSInputWidget/widget/index.tsx @@ -7,7 +7,8 @@ import { mergeWidgetConfig } from "utils/helpers"; import { parseText, validateInput } from "./helper"; import type { WidgetState } from "widgets/BaseWidget"; import type { SetterConfig } from "entities/AppTheming"; -import derivedProperties from "./parsedDerivedProperties"; +import derivedPropertyFns from "./derived"; +import { parseDerivedProperties } from "widgets/WidgetUtils"; import { WDSBaseInputWidget } from "../../WDSBaseInputWidget"; import type { DerivedPropertiesMap } from "WidgetProvider/factory"; import { EventType } from "constants/AppsmithActionConstants/ActionConstants"; @@ -52,8 +53,10 @@ class WDSInputWidget extends WDSBaseInputWidget { } static getDerivedPropertiesMap(): DerivedPropertiesMap { + const parsedDerivedProperties = parseDerivedProperties(derivedPropertyFns); + return merge(super.getDerivedPropertiesMap(), { - isValid: `{{(() => {${derivedProperties.isValid}})()}}`, + isValid: `{{(() => {${parsedDerivedProperties.isValid}})()}}`, }); } diff --git a/app/client/src/modules/ui-builder/ui/wds/WDSInputWidget/widget/parsedDerivedProperties.ts b/app/client/src/modules/ui-builder/ui/wds/WDSInputWidget/widget/parsedDerivedProperties.ts deleted file mode 100644 index 96f4b7964ddf..000000000000 --- a/app/client/src/modules/ui-builder/ui/wds/WDSInputWidget/widget/parsedDerivedProperties.ts +++ /dev/null @@ -1,40 +0,0 @@ -// @ts-expect-error: loader types not available -import widgetPropertyFns from "!!raw-loader!./derived.js"; - -// TODO(abhinav): -// Add unit test cases -// Handle edge cases -// Error out on wrong values -// TODO: Fix this the next time the file is edited -// eslint-disable-next-line @typescript-eslint/no-explicit-any -const derivedProperties: any = {}; -// const regex = /(\w+):\s?\(props\)\s?=>\s?{([\w\W]*?)},/gim; -const regex = - /(\w+):\s?\(props, moment, _\)\s?=>\s?{([\w\W\n]*?)},\n?\s+?\/\//gim; - -let m; - -while ((m = regex.exec(widgetPropertyFns)) !== null) { - // This is necessary to avoid infinite loops with zero-width matches - if (m.index === regex.lastIndex) { - regex.lastIndex++; - } - - let key = ""; - - // The result can be accessed through the `m`-variable. - m.forEach((match, groupIndex) => { - if (groupIndex === 1) { - key = match; - } - - if (groupIndex === 2) { - derivedProperties[key] = match - .trim() - .replace(/\n/g, "") - .replace(/props\./g, "this."); - } - }); -} - -export default derivedProperties; diff --git a/app/client/src/modules/ui-builder/ui/wds/WDSPhoneInputWidget/widget/index.tsx b/app/client/src/modules/ui-builder/ui/wds/WDSPhoneInputWidget/widget/index.tsx index dc39829aee09..e85dd36e354e 100644 --- a/app/client/src/modules/ui-builder/ui/wds/WDSPhoneInputWidget/widget/index.tsx +++ b/app/client/src/modules/ui-builder/ui/wds/WDSPhoneInputWidget/widget/index.tsx @@ -15,7 +15,8 @@ import { WDSBaseInputWidget } from "modules/ui-builder/ui/wds/WDSBaseInputWidget import { AsYouType, parseIncompletePhoneNumber } from "libphonenumber-js"; import { EventType } from "constants/AppsmithActionConstants/ActionConstants"; import type { KeyDownEvent } from "modules/ui-builder/ui/wds/WDSBaseInputWidget/component/types"; -import derivedProperties from "modules/ui-builder/ui/wds/WDSCurrencyInputWidget/widget/parsedDerivedProperties"; +import derivedPropertyFns from "modules/ui-builder/ui/wds/WDSCurrencyInputWidget/widget/derived"; +import { parseDerivedProperties } from "widgets/WidgetUtils"; import * as config from "../config"; import { PhoneInputComponent } from "../component"; @@ -107,8 +108,10 @@ class WDSPhoneInputWidget extends WDSBaseInputWidget< } static getDerivedPropertiesMap(): DerivedPropertiesMap { + const parsedDerivedProperties = parseDerivedProperties(derivedPropertyFns); + return { - isValid: `{{(() => {${derivedProperties.isValid}})()}}`, + isValid: `{{(() => {${parsedDerivedProperties.isValid}})()}}`, }; } diff --git a/app/client/src/modules/ui-builder/ui/wds/WDSTableWidget/widget/index.tsx b/app/client/src/modules/ui-builder/ui/wds/WDSTableWidget/widget/index.tsx index c8b309b2e5fe..000e435642ce 100644 --- a/app/client/src/modules/ui-builder/ui/wds/WDSTableWidget/widget/index.tsx +++ b/app/client/src/modules/ui-builder/ui/wds/WDSTableWidget/widget/index.tsx @@ -43,7 +43,6 @@ import { PaginationDirection, TABLE_COLUMN_ORDER_KEY, } from "../constants"; -import derivedProperties from "./parseDerivedProperties"; import { deleteLocalTableColumnOrderByWidgetId, generateLocalNewColumnOrderFromStickyValue, @@ -61,7 +60,7 @@ import { } from "./utilities"; import type { BatchPropertyUpdatePayload } from "actions/controlActions"; import equal from "fast-deep-equal/es6"; -import { sanitizeKey } from "widgets/WidgetUtils"; +import { parseDerivedProperties, sanitizeKey } from "widgets/WidgetUtils"; import { PlainTextCell, URLCell, @@ -82,6 +81,7 @@ import * as config from "../config"; import { getAnvilWidgetDOMId } from "layoutSystems/common/utils/LayoutElementPositionsObserver/utils"; import type { CanvasWidgetsReduxState } from "reducers/entityReducers/canvasWidgetsReducer"; import { klonaRegularWithTelemetry } from "utils/helpers"; +import derivedPropertyFns from "./derived"; const ReactTableComponent = lazy(async () => retryPromise(async () => import("../component")), @@ -194,20 +194,22 @@ export class WDSTableWidget extends BaseWidget { } static getDerivedPropertiesMap() { + const parsedDerivedProperties = parseDerivedProperties(derivedPropertyFns); + return { - selectedRow: `{{(()=>{${derivedProperties.getSelectedRow}})()}}`, - triggeredRow: `{{(()=>{${derivedProperties.getTriggeredRow}})()}}`, - selectedRows: `{{(()=>{${derivedProperties.getSelectedRows}})()}}`, + selectedRow: `{{(()=>{${parsedDerivedProperties.getSelectedRow}})()}}`, + triggeredRow: `{{(()=>{${parsedDerivedProperties.getTriggeredRow}})()}}`, + selectedRows: `{{(()=>{${parsedDerivedProperties.getSelectedRows}})()}}`, triggerRowSelection: "{{!!this.onRowSelected}}", - processedTableData: `{{(()=>{${derivedProperties.getProcessedTableData}})()}}`, - orderedTableColumns: `{{(()=>{${derivedProperties.getOrderedTableColumns}})()}}`, - filteredTableData: `{{(()=>{ ${derivedProperties.getFilteredTableData}})()}}`, - updatedRows: `{{(()=>{ ${derivedProperties.getUpdatedRows}})()}}`, - updatedRowIndices: `{{(()=>{ ${derivedProperties.getUpdatedRowIndices}})()}}`, - updatedRow: `{{(()=>{ ${derivedProperties.getUpdatedRow}})()}}`, - pageOffset: `{{(()=>{${derivedProperties.getPageOffset}})()}}`, - isEditableCellsValid: `{{(()=>{ ${derivedProperties.getEditableCellValidity}})()}}`, - tableHeaders: `{{(()=>{${derivedProperties.getTableHeaders}})()}}`, + processedTableData: `{{(()=>{${parsedDerivedProperties.getProcessedTableData}})()}}`, + orderedTableColumns: `{{(()=>{${parsedDerivedProperties.getOrderedTableColumns}})()}}`, + filteredTableData: `{{(()=>{ ${parsedDerivedProperties.getFilteredTableData}})()}}`, + updatedRows: `{{(()=>{ ${parsedDerivedProperties.getUpdatedRows}})()}}`, + updatedRowIndices: `{{(()=>{ ${parsedDerivedProperties.getUpdatedRowIndices}})()}}`, + updatedRow: `{{(()=>{ ${parsedDerivedProperties.getUpdatedRow}})()}}`, + pageOffset: `{{(()=>{${parsedDerivedProperties.getPageOffset}})()}}`, + isEditableCellsValid: `{{(()=>{ ${parsedDerivedProperties.getEditableCellValidity}})()}}`, + tableHeaders: `{{(()=>{${parsedDerivedProperties.getTableHeaders}})()}}`, }; } diff --git a/app/client/src/modules/ui-builder/ui/wds/WDSTableWidget/widget/parseDerivedProperties.ts b/app/client/src/modules/ui-builder/ui/wds/WDSTableWidget/widget/parseDerivedProperties.ts deleted file mode 100644 index 485a392d6da7..000000000000 --- a/app/client/src/modules/ui-builder/ui/wds/WDSTableWidget/widget/parseDerivedProperties.ts +++ /dev/null @@ -1,41 +0,0 @@ -// eslint-disable-next-line @typescript-eslint/ban-ts-comment -//@ts-ignore -import widgetPropertyFns from "!!raw-loader!./derived.js"; - -// TODO(abhinav): -// Add unit test cases -// Handle edge cases -// Error out on wrong values -// TODO: Fix this the next time the file is edited -// eslint-disable-next-line @typescript-eslint/no-explicit-any -const derivedProperties: any = {}; -// const regex = /(\w+):\s?\(props\)\s?=>\s?{([\w\W]*?)},/gim; -const regex = - /(\w+):\s?\(props, moment, _\)\s?=>\s?{([\w\W\n]*?)},\n?\s+?\/\//gim; - -let m; - -while ((m = regex.exec(widgetPropertyFns as unknown as string)) !== null) { - // This is necessary to avoid infinite loops with zero-width matches - if (m.index === regex.lastIndex) { - regex.lastIndex++; - } - - let key = ""; - - // The result can be accessed through the `m`-variable. - m.forEach((match, groupIndex) => { - if (groupIndex === 1) { - key = match; - } - - if (groupIndex === 2) { - derivedProperties[key] = match - .trim() - .replace(/\n/g, "") - .replace(/props\./g, "this."); - } - }); -} - -export default derivedProperties; diff --git a/app/client/src/widgets/CurrencyInputWidget/widget/index.tsx b/app/client/src/widgets/CurrencyInputWidget/widget/index.tsx index 874ef8180897..30f77b8ac84b 100644 --- a/app/client/src/widgets/CurrencyInputWidget/widget/index.tsx +++ b/app/client/src/widgets/CurrencyInputWidget/widget/index.tsx @@ -13,7 +13,8 @@ import { } from "../component/CurrencyCodeDropdown"; import { AutocompleteDataType } from "utils/autocomplete/AutocompleteDataType"; import _ from "lodash"; -import derivedProperties from "./parsedDerivedProperties"; +import derivedPropertyFns from "./derived"; +import { parseDerivedProperties } from "widgets/WidgetUtils"; import BaseInputWidget from "widgets/BaseInputWidget"; import type { BaseInputWidgetProps } from "widgets/BaseInputWidget/widget"; import * as Sentry from "@sentry/react"; @@ -422,9 +423,11 @@ class CurrencyInputWidget extends BaseInputWidget< } static getDerivedPropertiesMap(): DerivedPropertiesMap { + const parsedDerivedProperties = parseDerivedProperties(derivedPropertyFns); + return { - isValid: `{{(()=>{${derivedProperties.isValid}})()}}`, - value: `{{(()=>{${derivedProperties.value}})()}}`, + isValid: `{{(()=>{${parsedDerivedProperties.isValid}})()}}`, + value: `{{(()=>{${parsedDerivedProperties.value}})()}}`, }; } diff --git a/app/client/src/widgets/CurrencyInputWidget/widget/parsedDerivedProperties.ts b/app/client/src/widgets/CurrencyInputWidget/widget/parsedDerivedProperties.ts deleted file mode 100644 index 68719310cee8..000000000000 --- a/app/client/src/widgets/CurrencyInputWidget/widget/parsedDerivedProperties.ts +++ /dev/null @@ -1,40 +0,0 @@ -// @ts-expect-error: Types are not available -import widgetPropertyFns from "!!raw-loader!./derived.js"; - -// TODO(abhinav): -// Add unit test cases -// Handle edge cases -// Error out on wrong values -// TODO: Fix this the next time the file is edited -// eslint-disable-next-line @typescript-eslint/no-explicit-any -const derivedProperties: any = {}; -// const regex = /(\w+):\s?\(props\)\s?=>\s?{([\w\W]*?)},/gim; -const regex = - /(\w+):\s?\(props, moment, _\)\s?=>\s?{([\w\W\n]*?)},\n?\s+?\/\//gim; - -let m; - -while ((m = regex.exec(widgetPropertyFns)) !== null) { - // This is necessary to avoid infinite loops with zero-width matches - if (m.index === regex.lastIndex) { - regex.lastIndex++; - } - - let key = ""; - - // The result can be accessed through the `m`-variable. - m.forEach((match, groupIndex) => { - if (groupIndex === 1) { - key = match; - } - - if (groupIndex === 2) { - derivedProperties[key] = match - .trim() - .replace(/\n/g, "") - .replace(/props\./g, "this."); - } - }); -} - -export default derivedProperties; diff --git a/app/client/src/widgets/DatePickerWidget2/widget/index.tsx b/app/client/src/widgets/DatePickerWidget2/widget/index.tsx index 322f01bc2fb8..fe54702d67f3 100644 --- a/app/client/src/widgets/DatePickerWidget2/widget/index.tsx +++ b/app/client/src/widgets/DatePickerWidget2/widget/index.tsx @@ -20,7 +20,8 @@ import { import type { DatePickerType } from "../constants"; import { TimePrecision } from "../constants"; import { DateFormatOptions } from "./constants"; -import derivedProperties from "./parseDerivedProperties"; +import derivedPropertyFns from "./derived"; +import { parseDerivedProperties } from "widgets/WidgetUtils"; import { isAutoLayout } from "layoutSystems/autolayout/utils/flexWidgetUtils"; import type { AnvilConfig, @@ -632,8 +633,10 @@ class DatePickerWidget extends BaseWidget { } static getDerivedPropertiesMap(): DerivedPropertiesMap { + const parsedDerivedProperties = parseDerivedProperties(derivedPropertyFns); + return { - isValid: `{{(()=>{${derivedProperties.isValidDate}})()}}`, + isValid: `{{(()=>{${parsedDerivedProperties.isValidDate}})()}}`, selectedDate: `{{ this.value ? moment(this.value).toISOString() : "" }}`, formattedDate: `{{ this.value ? moment(this.value).format(this.dateFormat) : "" }}`, }; diff --git a/app/client/src/widgets/DatePickerWidget2/widget/parseDerivedProperties.ts b/app/client/src/widgets/DatePickerWidget2/widget/parseDerivedProperties.ts deleted file mode 100644 index 96f4b7964ddf..000000000000 --- a/app/client/src/widgets/DatePickerWidget2/widget/parseDerivedProperties.ts +++ /dev/null @@ -1,40 +0,0 @@ -// @ts-expect-error: loader types not available -import widgetPropertyFns from "!!raw-loader!./derived.js"; - -// TODO(abhinav): -// Add unit test cases -// Handle edge cases -// Error out on wrong values -// TODO: Fix this the next time the file is edited -// eslint-disable-next-line @typescript-eslint/no-explicit-any -const derivedProperties: any = {}; -// const regex = /(\w+):\s?\(props\)\s?=>\s?{([\w\W]*?)},/gim; -const regex = - /(\w+):\s?\(props, moment, _\)\s?=>\s?{([\w\W\n]*?)},\n?\s+?\/\//gim; - -let m; - -while ((m = regex.exec(widgetPropertyFns)) !== null) { - // This is necessary to avoid infinite loops with zero-width matches - if (m.index === regex.lastIndex) { - regex.lastIndex++; - } - - let key = ""; - - // The result can be accessed through the `m`-variable. - m.forEach((match, groupIndex) => { - if (groupIndex === 1) { - key = match; - } - - if (groupIndex === 2) { - derivedProperties[key] = match - .trim() - .replace(/\n/g, "") - .replace(/props\./g, "this."); - } - }); -} - -export default derivedProperties; diff --git a/app/client/src/widgets/InputWidgetV2/widget/index.tsx b/app/client/src/widgets/InputWidgetV2/widget/index.tsx index 0a041ec8d388..a7871957a6d1 100644 --- a/app/client/src/widgets/InputWidgetV2/widget/index.tsx +++ b/app/client/src/widgets/InputWidgetV2/widget/index.tsx @@ -39,7 +39,8 @@ import { import type { InputComponentProps } from "../component"; import InputComponent from "../component"; import { getParsedText, isInputTypeEmailOrPassword } from "./Utilities"; -import derivedProperties from "./parsedDerivedProperties"; +import derivedPropertyFns from "./derived"; +import { parseDerivedProperties } from "widgets/WidgetUtils"; import IconSVG from "../icon.svg"; import ThumbnailSVG from "../thumbnail.svg"; @@ -640,8 +641,10 @@ class InputWidget extends BaseInputWidget { } static getDerivedPropertiesMap(): DerivedPropertiesMap { + const parsedDerivedProperties = parseDerivedProperties(derivedPropertyFns); + return merge(super.getDerivedPropertiesMap(), { - isValid: `{{(() => {${derivedProperties.isValid}})()}}`, + isValid: `{{(() => {${parsedDerivedProperties.isValid}})()}}`, }); } diff --git a/app/client/src/widgets/InputWidgetV2/widget/parsedDerivedProperties.ts b/app/client/src/widgets/InputWidgetV2/widget/parsedDerivedProperties.ts deleted file mode 100644 index 96f4b7964ddf..000000000000 --- a/app/client/src/widgets/InputWidgetV2/widget/parsedDerivedProperties.ts +++ /dev/null @@ -1,40 +0,0 @@ -// @ts-expect-error: loader types not available -import widgetPropertyFns from "!!raw-loader!./derived.js"; - -// TODO(abhinav): -// Add unit test cases -// Handle edge cases -// Error out on wrong values -// TODO: Fix this the next time the file is edited -// eslint-disable-next-line @typescript-eslint/no-explicit-any -const derivedProperties: any = {}; -// const regex = /(\w+):\s?\(props\)\s?=>\s?{([\w\W]*?)},/gim; -const regex = - /(\w+):\s?\(props, moment, _\)\s?=>\s?{([\w\W\n]*?)},\n?\s+?\/\//gim; - -let m; - -while ((m = regex.exec(widgetPropertyFns)) !== null) { - // This is necessary to avoid infinite loops with zero-width matches - if (m.index === regex.lastIndex) { - regex.lastIndex++; - } - - let key = ""; - - // The result can be accessed through the `m`-variable. - m.forEach((match, groupIndex) => { - if (groupIndex === 1) { - key = match; - } - - if (groupIndex === 2) { - derivedProperties[key] = match - .trim() - .replace(/\n/g, "") - .replace(/props\./g, "this."); - } - }); -} - -export default derivedProperties; diff --git a/app/client/src/widgets/ListWidget/widget/index.tsx b/app/client/src/widgets/ListWidget/widget/index.tsx index 9a45240a3b86..cf0845c94f04 100644 --- a/app/client/src/widgets/ListWidget/widget/index.tsx +++ b/app/client/src/widgets/ListWidget/widget/index.tsx @@ -67,7 +67,8 @@ import ListPagination, { ServerSideListPagination, } from "../component/ListPagination"; import IconSVG from "../icon.svg"; -import derivedProperties from "./parseDerivedProperties"; +import derivedPropertyFns from "./derived"; +import { parseDerivedProperties } from "widgets/WidgetUtils"; import { PropertyPaneContentConfig, PropertyPaneStyleConfig, @@ -606,11 +607,13 @@ class ListWidget extends BaseWidget, WidgetState> { } static getDerivedPropertiesMap() { + const parsedDerivedProperties = parseDerivedProperties(derivedPropertyFns); + return { - pageSize: `{{(()=>{${derivedProperties.getPageSize}})()}}`, - selectedItem: `{{(()=>{${derivedProperties.getSelectedItem}})()}}`, - items: `{{(() => {${derivedProperties.getItems}})()}}`, - childAutoComplete: `{{(() => {${derivedProperties.getChildAutoComplete}})()}}`, + pageSize: `{{(()=>{${parsedDerivedProperties.getPageSize}})()}}`, + selectedItem: `{{(()=>{${parsedDerivedProperties.getSelectedItem}})()}}`, + items: `{{(() => {${parsedDerivedProperties.getItems}})()}}`, + childAutoComplete: `{{(() => {${parsedDerivedProperties.getChildAutoComplete}})()}}`, }; } diff --git a/app/client/src/widgets/ListWidget/widget/parseDerivedProperties.ts b/app/client/src/widgets/ListWidget/widget/parseDerivedProperties.ts deleted file mode 100644 index 96f4b7964ddf..000000000000 --- a/app/client/src/widgets/ListWidget/widget/parseDerivedProperties.ts +++ /dev/null @@ -1,40 +0,0 @@ -// @ts-expect-error: loader types not available -import widgetPropertyFns from "!!raw-loader!./derived.js"; - -// TODO(abhinav): -// Add unit test cases -// Handle edge cases -// Error out on wrong values -// TODO: Fix this the next time the file is edited -// eslint-disable-next-line @typescript-eslint/no-explicit-any -const derivedProperties: any = {}; -// const regex = /(\w+):\s?\(props\)\s?=>\s?{([\w\W]*?)},/gim; -const regex = - /(\w+):\s?\(props, moment, _\)\s?=>\s?{([\w\W\n]*?)},\n?\s+?\/\//gim; - -let m; - -while ((m = regex.exec(widgetPropertyFns)) !== null) { - // This is necessary to avoid infinite loops with zero-width matches - if (m.index === regex.lastIndex) { - regex.lastIndex++; - } - - let key = ""; - - // The result can be accessed through the `m`-variable. - m.forEach((match, groupIndex) => { - if (groupIndex === 1) { - key = match; - } - - if (groupIndex === 2) { - derivedProperties[key] = match - .trim() - .replace(/\n/g, "") - .replace(/props\./g, "this."); - } - }); -} - -export default derivedProperties; diff --git a/app/client/src/widgets/ListWidgetV2/widget/index.tsx b/app/client/src/widgets/ListWidgetV2/widget/index.tsx index 6f16437d3489..bc83cadc307f 100644 --- a/app/client/src/widgets/ListWidgetV2/widget/index.tsx +++ b/app/client/src/widgets/ListWidgetV2/widget/index.tsx @@ -7,7 +7,8 @@ import { floor, isEmpty, isNil, isString } from "lodash"; import hash from "object-hash"; import type { WidgetOperation, WidgetProps } from "widgets/BaseWidget"; import BaseWidget from "widgets/BaseWidget"; -import derivedProperties from "./parseDerivedProperties"; +import derivedPropertyFns from "./derived"; +import { parseDerivedProperties } from "widgets/WidgetUtils"; import ListComponent, { ListComponentEmpty } from "../component"; import ListPagination, { ServerSideListPagination, @@ -283,8 +284,10 @@ class ListWidget extends BaseWidget< } static getDerivedPropertiesMap() { + const parsedDerivedProperties = parseDerivedProperties(derivedPropertyFns); + return { - childAutoComplete: `{{(() => {${derivedProperties.getChildAutoComplete}})()}}`, + childAutoComplete: `{{(() => {${parsedDerivedProperties.getChildAutoComplete}})()}}`, }; } diff --git a/app/client/src/widgets/ListWidgetV2/widget/parseDerivedProperties.ts b/app/client/src/widgets/ListWidgetV2/widget/parseDerivedProperties.ts deleted file mode 100644 index 96f4b7964ddf..000000000000 --- a/app/client/src/widgets/ListWidgetV2/widget/parseDerivedProperties.ts +++ /dev/null @@ -1,40 +0,0 @@ -// @ts-expect-error: loader types not available -import widgetPropertyFns from "!!raw-loader!./derived.js"; - -// TODO(abhinav): -// Add unit test cases -// Handle edge cases -// Error out on wrong values -// TODO: Fix this the next time the file is edited -// eslint-disable-next-line @typescript-eslint/no-explicit-any -const derivedProperties: any = {}; -// const regex = /(\w+):\s?\(props\)\s?=>\s?{([\w\W]*?)},/gim; -const regex = - /(\w+):\s?\(props, moment, _\)\s?=>\s?{([\w\W\n]*?)},\n?\s+?\/\//gim; - -let m; - -while ((m = regex.exec(widgetPropertyFns)) !== null) { - // This is necessary to avoid infinite loops with zero-width matches - if (m.index === regex.lastIndex) { - regex.lastIndex++; - } - - let key = ""; - - // The result can be accessed through the `m`-variable. - m.forEach((match, groupIndex) => { - if (groupIndex === 1) { - key = match; - } - - if (groupIndex === 2) { - derivedProperties[key] = match - .trim() - .replace(/\n/g, "") - .replace(/props\./g, "this."); - } - }); -} - -export default derivedProperties; diff --git a/app/client/src/widgets/MultiSelectTreeWidget/widget/index.tsx b/app/client/src/widgets/MultiSelectTreeWidget/widget/index.tsx index d8f9bc639292..143b5f5d4bbe 100644 --- a/app/client/src/widgets/MultiSelectTreeWidget/widget/index.tsx +++ b/app/client/src/widgets/MultiSelectTreeWidget/widget/index.tsx @@ -23,7 +23,8 @@ import { isCompactMode, } from "widgets/WidgetUtils"; import MultiTreeSelectComponent from "../component"; -import derivedProperties from "./parseDerivedProperties"; +import derivedPropertyFns from "./derived"; +import { parseDerivedProperties } from "widgets/WidgetUtils"; import type { AnvilConfig, AutocompletionDefinitions, @@ -641,12 +642,14 @@ class MultiSelectTreeWidget extends BaseWidget< } static getDerivedPropertiesMap() { + const parsedDerivedProperties = parseDerivedProperties(derivedPropertyFns); + return { value: `{{this.selectedOptionValues}}`, - isValid: `{{(()=>{${derivedProperties.getIsValid}})()}}`, - flattenedOptions: `{{(()=>{${derivedProperties.getFlattenedOptions}})()}}`, - selectedOptionValues: `{{(()=>{${derivedProperties.getSelectedOptionValues}})()}}`, - selectedOptionLabels: `{{(()=>{${derivedProperties.getSelectedOptionLabels}})()}}`, + isValid: `{{(()=>{${parsedDerivedProperties.getIsValid}})()}}`, + flattenedOptions: `{{(()=>{${parsedDerivedProperties.getFlattenedOptions}})()}}`, + selectedOptionValues: `{{(()=>{${parsedDerivedProperties.getSelectedOptionValues}})()}}`, + selectedOptionLabels: `{{(()=>{${parsedDerivedProperties.getSelectedOptionLabels}})()}}`, }; } diff --git a/app/client/src/widgets/MultiSelectTreeWidget/widget/parseDerivedProperties.ts b/app/client/src/widgets/MultiSelectTreeWidget/widget/parseDerivedProperties.ts deleted file mode 100644 index 485a392d6da7..000000000000 --- a/app/client/src/widgets/MultiSelectTreeWidget/widget/parseDerivedProperties.ts +++ /dev/null @@ -1,41 +0,0 @@ -// eslint-disable-next-line @typescript-eslint/ban-ts-comment -//@ts-ignore -import widgetPropertyFns from "!!raw-loader!./derived.js"; - -// TODO(abhinav): -// Add unit test cases -// Handle edge cases -// Error out on wrong values -// TODO: Fix this the next time the file is edited -// eslint-disable-next-line @typescript-eslint/no-explicit-any -const derivedProperties: any = {}; -// const regex = /(\w+):\s?\(props\)\s?=>\s?{([\w\W]*?)},/gim; -const regex = - /(\w+):\s?\(props, moment, _\)\s?=>\s?{([\w\W\n]*?)},\n?\s+?\/\//gim; - -let m; - -while ((m = regex.exec(widgetPropertyFns as unknown as string)) !== null) { - // This is necessary to avoid infinite loops with zero-width matches - if (m.index === regex.lastIndex) { - regex.lastIndex++; - } - - let key = ""; - - // The result can be accessed through the `m`-variable. - m.forEach((match, groupIndex) => { - if (groupIndex === 1) { - key = match; - } - - if (groupIndex === 2) { - derivedProperties[key] = match - .trim() - .replace(/\n/g, "") - .replace(/props\./g, "this."); - } - }); -} - -export default derivedProperties; diff --git a/app/client/src/widgets/MultiSelectWidgetV2/widget/index.tsx b/app/client/src/widgets/MultiSelectWidgetV2/widget/index.tsx index e604d111beaf..454904d2261e 100644 --- a/app/client/src/widgets/MultiSelectWidgetV2/widget/index.tsx +++ b/app/client/src/widgets/MultiSelectWidgetV2/widget/index.tsx @@ -20,7 +20,8 @@ import { isCompactMode, } from "widgets/WidgetUtils"; import MultiSelectComponent from "../component"; -import derivedProperties from "./parseDerivedProperties"; +import derivedPropertyFns from "./derived"; +import { parseDerivedProperties } from "widgets/WidgetUtils"; import type { AnvilConfig, AutocompletionDefinitions, @@ -754,12 +755,14 @@ class MultiSelectWidget extends BaseWidget< } static getDerivedPropertiesMap() { + const parsedDerivedProperties = parseDerivedProperties(derivedPropertyFns); + return { - options: `{{(()=>{${derivedProperties.getOptions}})()}}`, + options: `{{(()=>{${parsedDerivedProperties.getOptions}})()}}`, value: `{{this.selectedOptionValues}}`, - isValid: `{{(()=>{${derivedProperties.getIsValid}})()}}`, - selectedOptionValues: `{{(()=>{${derivedProperties.getSelectedOptionValues}})()}}`, - selectedOptionLabels: `{{(()=>{${derivedProperties.getSelectedOptionLabels}})()}}`, + isValid: `{{(()=>{${parsedDerivedProperties.getIsValid}})()}}`, + selectedOptionValues: `{{(()=>{${parsedDerivedProperties.getSelectedOptionValues}})()}}`, + selectedOptionLabels: `{{(()=>{${parsedDerivedProperties.getSelectedOptionLabels}})()}}`, }; } diff --git a/app/client/src/widgets/MultiSelectWidgetV2/widget/parseDerivedProperties.ts b/app/client/src/widgets/MultiSelectWidgetV2/widget/parseDerivedProperties.ts deleted file mode 100644 index 485a392d6da7..000000000000 --- a/app/client/src/widgets/MultiSelectWidgetV2/widget/parseDerivedProperties.ts +++ /dev/null @@ -1,41 +0,0 @@ -// eslint-disable-next-line @typescript-eslint/ban-ts-comment -//@ts-ignore -import widgetPropertyFns from "!!raw-loader!./derived.js"; - -// TODO(abhinav): -// Add unit test cases -// Handle edge cases -// Error out on wrong values -// TODO: Fix this the next time the file is edited -// eslint-disable-next-line @typescript-eslint/no-explicit-any -const derivedProperties: any = {}; -// const regex = /(\w+):\s?\(props\)\s?=>\s?{([\w\W]*?)},/gim; -const regex = - /(\w+):\s?\(props, moment, _\)\s?=>\s?{([\w\W\n]*?)},\n?\s+?\/\//gim; - -let m; - -while ((m = regex.exec(widgetPropertyFns as unknown as string)) !== null) { - // This is necessary to avoid infinite loops with zero-width matches - if (m.index === regex.lastIndex) { - regex.lastIndex++; - } - - let key = ""; - - // The result can be accessed through the `m`-variable. - m.forEach((match, groupIndex) => { - if (groupIndex === 1) { - key = match; - } - - if (groupIndex === 2) { - derivedProperties[key] = match - .trim() - .replace(/\n/g, "") - .replace(/props\./g, "this."); - } - }); -} - -export default derivedProperties; diff --git a/app/client/src/widgets/PhoneInputWidget/widget/index.tsx b/app/client/src/widgets/PhoneInputWidget/widget/index.tsx index eb98d80917ad..f31b61c5cd37 100644 --- a/app/client/src/widgets/PhoneInputWidget/widget/index.tsx +++ b/app/client/src/widgets/PhoneInputWidget/widget/index.tsx @@ -14,7 +14,8 @@ import { import { AutocompleteDataType } from "utils/autocomplete/AutocompleteDataType"; import _ from "lodash"; import BaseInputWidget from "widgets/BaseInputWidget"; -import derivedProperties from "./parsedDerivedProperties"; +import derivedPropertyFns from "./derived"; +import { parseDerivedProperties } from "widgets/WidgetUtils"; import type { BaseInputWidgetProps } from "widgets/BaseInputWidget/widget"; import { mergeWidgetConfig } from "utils/helpers"; import type { CountryCode } from "libphonenumber-js"; @@ -295,8 +296,10 @@ class PhoneInputWidget extends BaseInputWidget< } static getDerivedPropertiesMap(): DerivedPropertiesMap { + const parsedDerivedProperties = parseDerivedProperties(derivedPropertyFns); + return { - isValid: `{{(() => {${derivedProperties.isValid}})()}}`, + isValid: `{{(() => {${parsedDerivedProperties.isValid}})()}}`, }; } diff --git a/app/client/src/widgets/PhoneInputWidget/widget/parsedDerivedProperties.ts b/app/client/src/widgets/PhoneInputWidget/widget/parsedDerivedProperties.ts deleted file mode 100644 index 96f4b7964ddf..000000000000 --- a/app/client/src/widgets/PhoneInputWidget/widget/parsedDerivedProperties.ts +++ /dev/null @@ -1,40 +0,0 @@ -// @ts-expect-error: loader types not available -import widgetPropertyFns from "!!raw-loader!./derived.js"; - -// TODO(abhinav): -// Add unit test cases -// Handle edge cases -// Error out on wrong values -// TODO: Fix this the next time the file is edited -// eslint-disable-next-line @typescript-eslint/no-explicit-any -const derivedProperties: any = {}; -// const regex = /(\w+):\s?\(props\)\s?=>\s?{([\w\W]*?)},/gim; -const regex = - /(\w+):\s?\(props, moment, _\)\s?=>\s?{([\w\W\n]*?)},\n?\s+?\/\//gim; - -let m; - -while ((m = regex.exec(widgetPropertyFns)) !== null) { - // This is necessary to avoid infinite loops with zero-width matches - if (m.index === regex.lastIndex) { - regex.lastIndex++; - } - - let key = ""; - - // The result can be accessed through the `m`-variable. - m.forEach((match, groupIndex) => { - if (groupIndex === 1) { - key = match; - } - - if (groupIndex === 2) { - derivedProperties[key] = match - .trim() - .replace(/\n/g, "") - .replace(/props\./g, "this."); - } - }); -} - -export default derivedProperties; diff --git a/app/client/src/widgets/SelectWidget/widget/index.tsx b/app/client/src/widgets/SelectWidget/widget/index.tsx index 8bf1cf42ef96..2e18e4c9fad6 100644 --- a/app/client/src/widgets/SelectWidget/widget/index.tsx +++ b/app/client/src/widgets/SelectWidget/widget/index.tsx @@ -27,7 +27,8 @@ import { defaultValueExpressionPrefix, getDefaultValueExpressionSuffix, } from "../constants"; -import derivedProperties from "./parseDerivedProperties"; +import derivedPropertyFns from "./derived"; +import { parseDerivedProperties } from "widgets/WidgetUtils"; import type { AnvilConfig, AutocompletionDefinitions, @@ -772,12 +773,14 @@ class SelectWidget extends BaseWidget { // https://github.com/appsmithorg/appsmith/issues/13664#issuecomment-1120814337 static getDerivedPropertiesMap() { + const parsedDerivedProperties = parseDerivedProperties(derivedPropertyFns); + return { - options: `{{(()=>{${derivedProperties.getOptions}})()}}`, - isValid: `{{(()=>{${derivedProperties.getIsValid}})()}}`, - selectedOptionValue: `{{(()=>{${derivedProperties.getSelectedOptionValue}})()}}`, + options: `{{(()=>{${parsedDerivedProperties.getOptions}})()}}`, + isValid: `{{(()=>{${parsedDerivedProperties.getIsValid}})()}}`, + selectedOptionValue: `{{(()=>{${parsedDerivedProperties.getSelectedOptionValue}})()}}`, - selectedOptionLabel: `{{(()=>{${derivedProperties.getSelectedOptionLabel}})()}}`, + selectedOptionLabel: `{{(()=>{${parsedDerivedProperties.getSelectedOptionLabel}})()}}`, }; } diff --git a/app/client/src/widgets/SelectWidget/widget/parseDerivedProperties.ts b/app/client/src/widgets/SelectWidget/widget/parseDerivedProperties.ts deleted file mode 100644 index 3cab7d1ffc5f..000000000000 --- a/app/client/src/widgets/SelectWidget/widget/parseDerivedProperties.ts +++ /dev/null @@ -1,40 +0,0 @@ -// @ts-expect-error: loader types not available -import widgetPropertyFns from "!!raw-loader!./derived.js"; - -// TODO(abhinav): -// Add unit test cases -// Handle edge cases -// Error out on wrong values -// TODO: Fix this the next time the file is edited -// eslint-disable-next-line @typescript-eslint/no-explicit-any -const derivedProperties: any = {}; -// const regex = /(\w+):\s?\(props\)\s?=>\s?{([\w\W]*?)},/gim; -const regex = - /(\w+):\s?\(props, moment, _\)\s?=>\s?{([\w\W\n]*?)},\n?\s+?\/\//gim; - -let m; - -while ((m = regex.exec(widgetPropertyFns as unknown as string)) !== null) { - // This is necessary to avoid infinite loops with zero-width matches - if (m.index === regex.lastIndex) { - regex.lastIndex++; - } - - let key = ""; - - // The result can be accessed through the `m`-variable. - m.forEach((match, groupIndex) => { - if (groupIndex === 1) { - key = match; - } - - if (groupIndex === 2) { - derivedProperties[key] = match - .trim() - .replace(/\n/g, "") - .replace(/props\./g, "this."); - } - }); -} - -export default derivedProperties; diff --git a/app/client/src/widgets/SingleSelectTreeWidget/widget/index.tsx b/app/client/src/widgets/SingleSelectTreeWidget/widget/index.tsx index 01dbea386435..b16bb3f3a7c9 100644 --- a/app/client/src/widgets/SingleSelectTreeWidget/widget/index.tsx +++ b/app/client/src/widgets/SingleSelectTreeWidget/widget/index.tsx @@ -22,7 +22,8 @@ import { isCompactMode, } from "widgets/WidgetUtils"; import SingleSelectTreeComponent from "../component"; -import derivedProperties from "./parseDerivedProperties"; +import derivedPropertyFns from "./derived"; +import { parseDerivedProperties } from "widgets/WidgetUtils"; import type { AnvilConfig, AutocompletionDefinitions, @@ -629,12 +630,14 @@ class SingleSelectTreeWidget extends BaseWidget< } static getDerivedPropertiesMap() { + const parsedDerivedProperties = parseDerivedProperties(derivedPropertyFns); + return { value: `{{this.selectedOptionValue}}`, - flattenedOptions: `{{(()=>{${derivedProperties.getFlattenedOptions}})()}}`, - isValid: `{{(()=>{${derivedProperties.getIsValid}})()}}`, - selectedOptionValue: `{{(()=>{${derivedProperties.getSelectedOptionValue}})()}}`, - selectedOptionLabel: `{{(()=>{${derivedProperties.getSelectedOptionLabel}})()}}`, + flattenedOptions: `{{(()=>{${parsedDerivedProperties.getFlattenedOptions}})()}}`, + isValid: `{{(()=>{${parsedDerivedProperties.getIsValid}})()}}`, + selectedOptionValue: `{{(()=>{${parsedDerivedProperties.getSelectedOptionValue}})()}}`, + selectedOptionLabel: `{{(()=>{${parsedDerivedProperties.getSelectedOptionLabel}})()}}`, }; } diff --git a/app/client/src/widgets/SingleSelectTreeWidget/widget/parseDerivedProperties.ts b/app/client/src/widgets/SingleSelectTreeWidget/widget/parseDerivedProperties.ts deleted file mode 100644 index 3cab7d1ffc5f..000000000000 --- a/app/client/src/widgets/SingleSelectTreeWidget/widget/parseDerivedProperties.ts +++ /dev/null @@ -1,40 +0,0 @@ -// @ts-expect-error: loader types not available -import widgetPropertyFns from "!!raw-loader!./derived.js"; - -// TODO(abhinav): -// Add unit test cases -// Handle edge cases -// Error out on wrong values -// TODO: Fix this the next time the file is edited -// eslint-disable-next-line @typescript-eslint/no-explicit-any -const derivedProperties: any = {}; -// const regex = /(\w+):\s?\(props\)\s?=>\s?{([\w\W]*?)},/gim; -const regex = - /(\w+):\s?\(props, moment, _\)\s?=>\s?{([\w\W\n]*?)},\n?\s+?\/\//gim; - -let m; - -while ((m = regex.exec(widgetPropertyFns as unknown as string)) !== null) { - // This is necessary to avoid infinite loops with zero-width matches - if (m.index === regex.lastIndex) { - regex.lastIndex++; - } - - let key = ""; - - // The result can be accessed through the `m`-variable. - m.forEach((match, groupIndex) => { - if (groupIndex === 1) { - key = match; - } - - if (groupIndex === 2) { - derivedProperties[key] = match - .trim() - .replace(/\n/g, "") - .replace(/props\./g, "this."); - } - }); -} - -export default derivedProperties; diff --git a/app/client/src/widgets/TableWidget/widget/index.tsx b/app/client/src/widgets/TableWidget/widget/index.tsx index bf037ef7481d..f2545cd4a392 100644 --- a/app/client/src/widgets/TableWidget/widget/index.tsx +++ b/app/client/src/widgets/TableWidget/widget/index.tsx @@ -39,7 +39,8 @@ import { getDynamicBindings } from "utils/DynamicBindingUtils"; import type { ReactTableFilter } from "../component/Constants"; import { OperatorTypes } from "../component/Constants"; import type { TableWidgetProps } from "../constants"; -import derivedProperties from "./parseDerivedProperties"; +import derivedPropertyFns from "./derived"; +import { parseDerivedProperties } from "widgets/WidgetUtils"; import { selectRowIndex, selectRowIndices } from "./utilities"; import type { ExtraDef } from "utils/autocomplete/defCreatorUtils"; import { generateTypeDef } from "utils/autocomplete/defCreatorUtils"; @@ -425,15 +426,17 @@ class TableWidget extends BaseWidget { } static getDerivedPropertiesMap() { + const parsedDerivedProperties = parseDerivedProperties(derivedPropertyFns); + return { - selectedRow: `{{(()=>{${derivedProperties.getSelectedRow}})()}}`, - triggeredRow: `{{(()=>{${derivedProperties.getTriggeredRow}})()}}`, - selectedRows: `{{(()=>{${derivedProperties.getSelectedRows}})()}}`, - pageSize: `{{(()=>{${derivedProperties.getPageSize}})()}}`, + selectedRow: `{{(()=>{${parsedDerivedProperties.getSelectedRow}})()}}`, + triggeredRow: `{{(()=>{${parsedDerivedProperties.getTriggeredRow}})()}}`, + selectedRows: `{{(()=>{${parsedDerivedProperties.getSelectedRows}})()}}`, + pageSize: `{{(()=>{${parsedDerivedProperties.getPageSize}})()}}`, triggerRowSelection: "{{!!this.onRowSelected}}", - sanitizedTableData: `{{(()=>{${derivedProperties.getSanitizedTableData}})()}}`, - tableColumns: `{{(()=>{${derivedProperties.getTableColumns}})()}}`, - filteredTableData: `{{(()=>{ ${derivedProperties.getFilteredTableData}})()}}`, + sanitizedTableData: `{{(()=>{${parsedDerivedProperties.getSanitizedTableData}})()}}`, + tableColumns: `{{(()=>{${parsedDerivedProperties.getTableColumns}})()}}`, + filteredTableData: `{{(()=>{ ${parsedDerivedProperties.getFilteredTableData}})()}}`, }; } diff --git a/app/client/src/widgets/TableWidget/widget/parseDerivedProperties.ts b/app/client/src/widgets/TableWidget/widget/parseDerivedProperties.ts deleted file mode 100644 index 3cab7d1ffc5f..000000000000 --- a/app/client/src/widgets/TableWidget/widget/parseDerivedProperties.ts +++ /dev/null @@ -1,40 +0,0 @@ -// @ts-expect-error: loader types not available -import widgetPropertyFns from "!!raw-loader!./derived.js"; - -// TODO(abhinav): -// Add unit test cases -// Handle edge cases -// Error out on wrong values -// TODO: Fix this the next time the file is edited -// eslint-disable-next-line @typescript-eslint/no-explicit-any -const derivedProperties: any = {}; -// const regex = /(\w+):\s?\(props\)\s?=>\s?{([\w\W]*?)},/gim; -const regex = - /(\w+):\s?\(props, moment, _\)\s?=>\s?{([\w\W\n]*?)},\n?\s+?\/\//gim; - -let m; - -while ((m = regex.exec(widgetPropertyFns as unknown as string)) !== null) { - // This is necessary to avoid infinite loops with zero-width matches - if (m.index === regex.lastIndex) { - regex.lastIndex++; - } - - let key = ""; - - // The result can be accessed through the `m`-variable. - m.forEach((match, groupIndex) => { - if (groupIndex === 1) { - key = match; - } - - if (groupIndex === 2) { - derivedProperties[key] = match - .trim() - .replace(/\n/g, "") - .replace(/props\./g, "this."); - } - }); -} - -export default derivedProperties; diff --git a/app/client/src/widgets/TableWidgetV2/widget/index.tsx b/app/client/src/widgets/TableWidgetV2/widget/index.tsx index 4d8e31b3e57b..ca8686f4f114 100644 --- a/app/client/src/widgets/TableWidgetV2/widget/index.tsx +++ b/app/client/src/widgets/TableWidgetV2/widget/index.tsx @@ -63,7 +63,8 @@ import { PaginationDirection, TABLE_COLUMN_ORDER_KEY, } from "../constants"; -import derivedProperties from "./parseDerivedProperties"; +import derivedPropertyFns from "./derived"; +import { parseDerivedProperties } from "widgets/WidgetUtils"; import { createEditActionColumn, deleteLocalTableColumnOrderByWidgetId, @@ -482,21 +483,23 @@ class TableWidgetV2 extends BaseWidget { } static getDerivedPropertiesMap() { + const parsedDerivedProperties = parseDerivedProperties(derivedPropertyFns); + return { - selectedRow: `{{(()=>{${derivedProperties.getSelectedRow}})()}}`, - triggeredRow: `{{(()=>{${derivedProperties.getTriggeredRow}})()}}`, - selectedRows: `{{(()=>{${derivedProperties.getSelectedRows}})()}}`, - pageSize: `{{(()=>{${derivedProperties.getPageSize}})()}}`, + selectedRow: `{{(()=>{${parsedDerivedProperties.getSelectedRow}})()}}`, + triggeredRow: `{{(()=>{${parsedDerivedProperties.getTriggeredRow}})()}}`, + selectedRows: `{{(()=>{${parsedDerivedProperties.getSelectedRows}})()}}`, + pageSize: `{{(()=>{${parsedDerivedProperties.getPageSize}})()}}`, triggerRowSelection: "{{!!this.onRowSelected}}", - processedTableData: `{{(()=>{${derivedProperties.getProcessedTableData}})()}}`, - orderedTableColumns: `{{(()=>{${derivedProperties.getOrderedTableColumns}})()}}`, - filteredTableData: `{{(()=>{ ${derivedProperties.getFilteredTableData}})()}}`, - updatedRows: `{{(()=>{ ${derivedProperties.getUpdatedRows}})()}}`, - updatedRowIndices: `{{(()=>{ ${derivedProperties.getUpdatedRowIndices}})()}}`, - updatedRow: `{{(()=>{ ${derivedProperties.getUpdatedRow}})()}}`, - pageOffset: `{{(()=>{${derivedProperties.getPageOffset}})()}}`, - isEditableCellsValid: `{{(()=>{ ${derivedProperties.getEditableCellValidity}})()}}`, - tableHeaders: `{{(()=>{${derivedProperties.getTableHeaders}})()}}`, + processedTableData: `{{(()=>{${parsedDerivedProperties.getProcessedTableData}})()}}`, + orderedTableColumns: `{{(()=>{${parsedDerivedProperties.getOrderedTableColumns}})()}}`, + filteredTableData: `{{(()=>{ ${parsedDerivedProperties.getFilteredTableData}})()}}`, + updatedRows: `{{(()=>{ ${parsedDerivedProperties.getUpdatedRows}})()}}`, + updatedRowIndices: `{{(()=>{ ${parsedDerivedProperties.getUpdatedRowIndices}})()}}`, + updatedRow: `{{(()=>{ ${parsedDerivedProperties.getUpdatedRow}})()}}`, + pageOffset: `{{(()=>{${parsedDerivedProperties.getPageOffset}})()}}`, + isEditableCellsValid: `{{(()=>{ ${parsedDerivedProperties.getEditableCellValidity}})()}}`, + tableHeaders: `{{(()=>{${parsedDerivedProperties.getTableHeaders}})()}}`, }; } diff --git a/app/client/src/widgets/TableWidgetV2/widget/parseDerivedProperties.ts b/app/client/src/widgets/TableWidgetV2/widget/parseDerivedProperties.ts deleted file mode 100644 index 485a392d6da7..000000000000 --- a/app/client/src/widgets/TableWidgetV2/widget/parseDerivedProperties.ts +++ /dev/null @@ -1,41 +0,0 @@ -// eslint-disable-next-line @typescript-eslint/ban-ts-comment -//@ts-ignore -import widgetPropertyFns from "!!raw-loader!./derived.js"; - -// TODO(abhinav): -// Add unit test cases -// Handle edge cases -// Error out on wrong values -// TODO: Fix this the next time the file is edited -// eslint-disable-next-line @typescript-eslint/no-explicit-any -const derivedProperties: any = {}; -// const regex = /(\w+):\s?\(props\)\s?=>\s?{([\w\W]*?)},/gim; -const regex = - /(\w+):\s?\(props, moment, _\)\s?=>\s?{([\w\W\n]*?)},\n?\s+?\/\//gim; - -let m; - -while ((m = regex.exec(widgetPropertyFns as unknown as string)) !== null) { - // This is necessary to avoid infinite loops with zero-width matches - if (m.index === regex.lastIndex) { - regex.lastIndex++; - } - - let key = ""; - - // The result can be accessed through the `m`-variable. - m.forEach((match, groupIndex) => { - if (groupIndex === 1) { - key = match; - } - - if (groupIndex === 2) { - derivedProperties[key] = match - .trim() - .replace(/\n/g, "") - .replace(/props\./g, "this."); - } - }); -} - -export default derivedProperties; diff --git a/app/client/src/widgets/TabsWidget/widget/index.tsx b/app/client/src/widgets/TabsWidget/widget/index.tsx index 4bada1dd7e8f..a305795847aa 100644 --- a/app/client/src/widgets/TabsWidget/widget/index.tsx +++ b/app/client/src/widgets/TabsWidget/widget/index.tsx @@ -17,7 +17,8 @@ import type { WidgetState } from "../../BaseWidget"; import BaseWidget from "../../BaseWidget"; import TabsComponent from "../component"; import type { TabContainerWidgetProps, TabsWidgetProps } from "../constants"; -import derivedProperties from "./parseDerivedProperties"; +import derivedPropertyFns from "./derived"; +import { parseDerivedProperties } from "widgets/WidgetUtils"; import type { SetterConfig, Stylesheet } from "entities/AppTheming"; import { isAutoHeightEnabledForWidget, @@ -537,8 +538,10 @@ class TabsWidget extends BaseWidget< } static getDerivedPropertiesMap() { + const parsedDerivedProperties = parseDerivedProperties(derivedPropertyFns); + return { - selectedTab: `{{(()=>{${derivedProperties.getSelectedTab}})()}}`, + selectedTab: `{{(()=>{${parsedDerivedProperties.getSelectedTab}})()}}`, }; } diff --git a/app/client/src/widgets/TabsWidget/widget/parseDerivedProperties.ts b/app/client/src/widgets/TabsWidget/widget/parseDerivedProperties.ts deleted file mode 100644 index 3cab7d1ffc5f..000000000000 --- a/app/client/src/widgets/TabsWidget/widget/parseDerivedProperties.ts +++ /dev/null @@ -1,40 +0,0 @@ -// @ts-expect-error: loader types not available -import widgetPropertyFns from "!!raw-loader!./derived.js"; - -// TODO(abhinav): -// Add unit test cases -// Handle edge cases -// Error out on wrong values -// TODO: Fix this the next time the file is edited -// eslint-disable-next-line @typescript-eslint/no-explicit-any -const derivedProperties: any = {}; -// const regex = /(\w+):\s?\(props\)\s?=>\s?{([\w\W]*?)},/gim; -const regex = - /(\w+):\s?\(props, moment, _\)\s?=>\s?{([\w\W\n]*?)},\n?\s+?\/\//gim; - -let m; - -while ((m = regex.exec(widgetPropertyFns as unknown as string)) !== null) { - // This is necessary to avoid infinite loops with zero-width matches - if (m.index === regex.lastIndex) { - regex.lastIndex++; - } - - let key = ""; - - // The result can be accessed through the `m`-variable. - m.forEach((match, groupIndex) => { - if (groupIndex === 1) { - key = match; - } - - if (groupIndex === 2) { - derivedProperties[key] = match - .trim() - .replace(/\n/g, "") - .replace(/props\./g, "this."); - } - }); -} - -export default derivedProperties; diff --git a/app/client/src/widgets/WidgetUtils.ts b/app/client/src/widgets/WidgetUtils.ts index 5184b0c73d2a..b4155c7e2f33 100644 --- a/app/client/src/widgets/WidgetUtils.ts +++ b/app/client/src/widgets/WidgetUtils.ts @@ -989,3 +989,52 @@ export const checkForOnClick = (e: React.MouseEvent) => { return false; }; + +/** + * Parses the derived properties from the given property functions. Used in getDerivedPropertiesMap + * + * For e.g + * If the input is + * ```js + * { + * isValidDate: (props, moment, _) => { + * return props.value === 1; + * } + * ``` + * + * It will return + * ```js + * { + * isValidDate: "{{ this.value === 1 }}" + * } + * ``` + * + * Main rule to remember is don't deconstruct the props like `const { value } = props;` in the derived property function. + * Directly access props like `props.value` + * + * @param propertyFns + * @returns + */ +export function parseDerivedProperties(propertyFns: Record) { + const derivedProperties: Record = {}; + + for (const [key, value] of Object.entries(propertyFns)) { + if (typeof value === "function") { + const functionString = value.toString(); + const functionBody = functionString.match(/(?<=\{)(.|\n)*(?=\})/)?.[0]; + + if (functionBody) { + const paramMatch = functionString.match(/\((.*?),/); + const propsParam = paramMatch ? paramMatch[1].trim() : "props"; + + const modifiedBody = functionBody + .trim() + .replace(new RegExp(`${propsParam}\\.`, "g"), "this."); + + derivedProperties[key] = modifiedBody; + } + } + } + + return derivedProperties; +}