From 71c02a62f667c4498b23acb7e25e8ec1e0b6264d Mon Sep 17 00:00:00 2001 From: Yordan Date: Mon, 14 Jul 2025 15:09:02 +0200 Subject: [PATCH 01/11] feat(events-web): enhance load delay and repeat properties with parameter type support --- .../events-web/src/Events.editorConfig.ts | 17 ++++++++- .../events-web/src/Events.tsx | 31 +++++++++++++--- .../events-web/src/Events.xml | 37 ++++++++++++++++++- .../events-web/src/hooks/timer.ts | 9 ++++- .../events-web/typings/EventsProps.d.ts | 18 +++++++-- 5 files changed, 99 insertions(+), 13 deletions(-) diff --git a/packages/pluggableWidgets/events-web/src/Events.editorConfig.ts b/packages/pluggableWidgets/events-web/src/Events.editorConfig.ts index fb3ea918b4..97c13ef785 100644 --- a/packages/pluggableWidgets/events-web/src/Events.editorConfig.ts +++ b/packages/pluggableWidgets/events-web/src/Events.editorConfig.ts @@ -19,7 +19,22 @@ export function getProperties( defaultProperties: Properties /* , target: Platform*/ ): Properties { if (!values.componentLoadRepeat) { - hidePropertiesIn(defaultProperties, values, ["componentLoadRepeatInterval"]); + hidePropertiesIn(defaultProperties, values, [ + "componentLoadRepeatInterval", + "componentLoadRepeatExpression", + "componentLoadRepeatParameterType" + ]); + } else { + if (values.componentLoadRepeatParameterType === "expression") { + hidePropertiesIn(defaultProperties, values, ["componentLoadRepeatInterval"]); + } else { + hidePropertiesIn(defaultProperties, values, ["componentLoadRepeatExpression"]); + } + } + if (values.componentLoadDelayParameterType === "expression") { + hidePropertiesIn(defaultProperties, values, ["componentLoadDelayInteger"]); + } else { + hidePropertiesIn(defaultProperties, values, ["componentLoadDelayExpression"]); } return defaultProperties; } diff --git a/packages/pluggableWidgets/events-web/src/Events.tsx b/packages/pluggableWidgets/events-web/src/Events.tsx index 2820199bdf..dc7ff787cc 100644 --- a/packages/pluggableWidgets/events-web/src/Events.tsx +++ b/packages/pluggableWidgets/events-web/src/Events.tsx @@ -9,20 +9,41 @@ export default function Events(props: EventsContainerProps): ReactElement { const { class: className, onComponentLoad, - componentLoadDelay, + componentLoadDelayExpression, + componentLoadDelayInteger, componentLoadRepeat, - componentLoadRepeatInterval, onEventChangeAttribute, onEventChange, + componentLoadRepeatInterval, + componentLoadRepeatParameterType, + componentLoadRepeatExpression, + componentLoadDelayParameterType, onEventChangeDelay - // optionsSourceType } = props; const prevOnChangeAttributeValue = useRef | undefined>(); + let loadDelay; + let repeatInterval; + if (componentLoadDelayParameterType === "number") { + loadDelay = componentLoadDelayInteger; + } else { + loadDelay = + componentLoadDelayExpression.status === "available" + ? componentLoadDelayExpression.value.toNumber() + : undefined; + } + if (componentLoadRepeatParameterType === "number") { + repeatInterval = componentLoadRepeatInterval; + } else { + repeatInterval = + componentLoadRepeatExpression?.status === "available" + ? componentLoadRepeatExpression.value.toNumber() + : undefined; + } useActionTimer({ canExecute: onComponentLoad?.canExecute, execute: onComponentLoad?.execute, - delay: componentLoadDelay, - interval: componentLoadRepeatInterval, + delay: loadDelay, + interval: repeatInterval, repeat: componentLoadRepeat, attribute: undefined }); diff --git a/packages/pluggableWidgets/events-web/src/Events.xml b/packages/pluggableWidgets/events-web/src/Events.xml index 37b94ab93d..d34803d55a 100644 --- a/packages/pluggableWidgets/events-web/src/Events.xml +++ b/packages/pluggableWidgets/events-web/src/Events.xml @@ -11,17 +11,50 @@ Action - + + + Parameter type + + + Value + Expression + + + + + Delay + Timer delay to first action execution. Value is in milliseconds. If set to 0, action will be triggered immediately. + + + Delay Timer delay to first action execution. Value is in milliseconds. If set to 0, action will be triggered immediately. + + Repeat + + + Parameter type + + + Value + Expression + + + - Delay + Interval + Interval between repeat action execution. Value is in milliseconds. + + + + Interval Interval between repeat action execution. Value is in milliseconds. + diff --git a/packages/pluggableWidgets/events-web/src/hooks/timer.ts b/packages/pluggableWidgets/events-web/src/hooks/timer.ts index 33d7cef6c0..b1c32d9034 100644 --- a/packages/pluggableWidgets/events-web/src/hooks/timer.ts +++ b/packages/pluggableWidgets/events-web/src/hooks/timer.ts @@ -4,8 +4,8 @@ import { useEffect, useState } from "react"; interface ActionTimerProps { canExecute?: boolean; execute?: () => void; - delay: number; - interval: number; + delay: number | undefined; + interval: number | undefined; repeat: boolean; attribute?: EditableValue; } @@ -14,6 +14,11 @@ export function useActionTimer(props: ActionTimerProps): void { const { canExecute, execute, delay, interval, repeat, attribute } = props; const [toggleTimer, setToggleTimer] = useState(-1); useEffect(() => { + // If the delay is set to undefined, we should not start a timer. + if (delay === undefined || delay < 0 || (interval === undefined && repeat)) { + console.log("Events: Timer delay or interval is not set, skipping timer execution."); + return; + } let counter: NodeJS.Timeout; if (canExecute) { if (repeat) { diff --git a/packages/pluggableWidgets/events-web/typings/EventsProps.d.ts b/packages/pluggableWidgets/events-web/typings/EventsProps.d.ts index 6b0f9eac8e..72972f81e4 100644 --- a/packages/pluggableWidgets/events-web/typings/EventsProps.d.ts +++ b/packages/pluggableWidgets/events-web/typings/EventsProps.d.ts @@ -4,18 +4,26 @@ * @author Mendix Widgets Framework Team */ import { CSSProperties } from "react"; -import { ActionValue, EditableValue } from "mendix"; +import { ActionValue, DynamicValue, EditableValue } from "mendix"; import { Big } from "big.js"; +export type ComponentLoadDelayParameterTypeEnum = "number" | "expression"; + +export type ComponentLoadRepeatParameterTypeEnum = "number" | "expression"; + export interface EventsContainerProps { name: string; class: string; style?: CSSProperties; tabIndex?: number; onComponentLoad?: ActionValue; - componentLoadDelay: number; + componentLoadDelayParameterType: ComponentLoadDelayParameterTypeEnum; + componentLoadDelayInteger: number; + componentLoadDelayExpression: DynamicValue; componentLoadRepeat: boolean; + componentLoadRepeatParameterType: ComponentLoadRepeatParameterTypeEnum; componentLoadRepeatInterval: number; + componentLoadRepeatExpression?: DynamicValue; onEventChangeAttribute?: EditableValue; onEventChange?: ActionValue; onEventChangeDelay: number; @@ -33,9 +41,13 @@ export interface EventsPreviewProps { renderMode: "design" | "xray" | "structure"; translate: (text: string) => string; onComponentLoad: {} | null; - componentLoadDelay: number | null; + componentLoadDelayParameterType: ComponentLoadDelayParameterTypeEnum; + componentLoadDelayInteger: number | null; + componentLoadDelayExpression: string; componentLoadRepeat: boolean; + componentLoadRepeatParameterType: ComponentLoadRepeatParameterTypeEnum; componentLoadRepeatInterval: number | null; + componentLoadRepeatExpression: string; onEventChangeAttribute: string; onEventChange: {} | null; onEventChangeDelay: number | null; From 3f63d60e4eddaf7025132569eeefd74ef9ca2b75 Mon Sep 17 00:00:00 2001 From: Yordan Date: Mon, 14 Jul 2025 15:45:45 +0200 Subject: [PATCH 02/11] feat(events-web): enhance onChange delay properties with parameter type support --- .../events-web/src/Events.editorConfig.ts | 5 +++++ .../pluggableWidgets/events-web/src/Events.tsx | 14 ++++++++++++-- .../pluggableWidgets/events-web/src/Events.xml | 18 +++++++++++++++++- .../events-web/typings/EventsProps.d.ts | 10 ++++++++-- 4 files changed, 42 insertions(+), 5 deletions(-) diff --git a/packages/pluggableWidgets/events-web/src/Events.editorConfig.ts b/packages/pluggableWidgets/events-web/src/Events.editorConfig.ts index 97c13ef785..137e681db3 100644 --- a/packages/pluggableWidgets/events-web/src/Events.editorConfig.ts +++ b/packages/pluggableWidgets/events-web/src/Events.editorConfig.ts @@ -36,6 +36,11 @@ export function getProperties( } else { hidePropertiesIn(defaultProperties, values, ["componentLoadDelayExpression"]); } + if (values.onEventChangeDelayParameterType === "expression") { + hidePropertiesIn(defaultProperties, values, ["onEventChangeDelayInteger"]); + } else { + hidePropertiesIn(defaultProperties, values, ["onEventChangeDelayExpression"]); + } return defaultProperties; } diff --git a/packages/pluggableWidgets/events-web/src/Events.tsx b/packages/pluggableWidgets/events-web/src/Events.tsx index dc7ff787cc..8112ae1230 100644 --- a/packages/pluggableWidgets/events-web/src/Events.tsx +++ b/packages/pluggableWidgets/events-web/src/Events.tsx @@ -18,11 +18,14 @@ export default function Events(props: EventsContainerProps): ReactElement { componentLoadRepeatParameterType, componentLoadRepeatExpression, componentLoadDelayParameterType, - onEventChangeDelay + onEventChangeDelayInteger, + onEventChangeDelayParameterType, + onEventChangeDelayExpression } = props; const prevOnChangeAttributeValue = useRef | undefined>(); let loadDelay; let repeatInterval; + let onEventChangeDelay; if (componentLoadDelayParameterType === "number") { loadDelay = componentLoadDelayInteger; } else { @@ -39,6 +42,14 @@ export default function Events(props: EventsContainerProps): ReactElement { ? componentLoadRepeatExpression.value.toNumber() : undefined; } + if (onEventChangeDelayParameterType === "number") { + onEventChangeDelay = onEventChangeDelayInteger; + } else { + onEventChangeDelay = + onEventChangeDelayExpression?.status === "available" + ? onEventChangeDelayExpression.value.toNumber() + : undefined; + } useActionTimer({ canExecute: onComponentLoad?.canExecute, execute: onComponentLoad?.execute, @@ -54,7 +65,6 @@ export default function Events(props: EventsContainerProps): ReactElement { return; } if (prevOnChangeAttributeValue?.current?.value === undefined) { - // ignore initial load prevOnChangeAttributeValue.current = onEventChangeAttribute; } else { if (onEventChangeAttribute?.value !== prevOnChangeAttributeValue.current?.value) { diff --git a/packages/pluggableWidgets/events-web/src/Events.xml b/packages/pluggableWidgets/events-web/src/Events.xml index d34803d55a..17fa3db244 100644 --- a/packages/pluggableWidgets/events-web/src/Events.xml +++ b/packages/pluggableWidgets/events-web/src/Events.xml @@ -78,10 +78,26 @@ Action - + + + Parameter type + + + Value + Expression + + + + Delay Timer delay to first action execution. Value is in milliseconds. If set to 0, action will be triggered immediately. + + + Delay + Timer delay to first action execution. Value is in milliseconds. If set to 0, action will be triggered immediately. + + diff --git a/packages/pluggableWidgets/events-web/typings/EventsProps.d.ts b/packages/pluggableWidgets/events-web/typings/EventsProps.d.ts index 72972f81e4..06c39f60ec 100644 --- a/packages/pluggableWidgets/events-web/typings/EventsProps.d.ts +++ b/packages/pluggableWidgets/events-web/typings/EventsProps.d.ts @@ -11,6 +11,8 @@ export type ComponentLoadDelayParameterTypeEnum = "number" | "expression"; export type ComponentLoadRepeatParameterTypeEnum = "number" | "expression"; +export type OnEventChangeDelayParameterTypeEnum = "number" | "expression"; + export interface EventsContainerProps { name: string; class: string; @@ -26,7 +28,9 @@ export interface EventsContainerProps { componentLoadRepeatExpression?: DynamicValue; onEventChangeAttribute?: EditableValue; onEventChange?: ActionValue; - onEventChangeDelay: number; + onEventChangeDelayParameterType: OnEventChangeDelayParameterTypeEnum; + onEventChangeDelayInteger: number; + onEventChangeDelayExpression: DynamicValue; } export interface EventsPreviewProps { @@ -50,5 +54,7 @@ export interface EventsPreviewProps { componentLoadRepeatExpression: string; onEventChangeAttribute: string; onEventChange: {} | null; - onEventChangeDelay: number | null; + onEventChangeDelayParameterType: OnEventChangeDelayParameterTypeEnum; + onEventChangeDelayInteger: number | null; + onEventChangeDelayExpression: string; } From 0e1213a4c6397a9cdbc5fa0ee77cd22809978fe1 Mon Sep 17 00:00:00 2001 From: Yordan Date: Mon, 14 Jul 2025 16:14:16 +0200 Subject: [PATCH 03/11] chore(changelog): update changelog with added support for expressions in delay and repeat properties --- packages/pluggableWidgets/events-web/CHANGELOG.md | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/packages/pluggableWidgets/events-web/CHANGELOG.md b/packages/pluggableWidgets/events-web/CHANGELOG.md index 0c66851987..bd7e9ba814 100644 --- a/packages/pluggableWidgets/events-web/CHANGELOG.md +++ b/packages/pluggableWidgets/events-web/CHANGELOG.md @@ -6,6 +6,12 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), ## [Unreleased] +### Added + +- On component load: Added support for expressions when setting the delay value +- On component load: Added support for expressions when setting the repeat interval +- On attribute change: Added support for expressions when setting the delay value + ## [1.0.1] - 2024-04-25 ### Fixed From 59ddc24d01efec07b507ecb3df4e7b2b56a28f00 Mon Sep 17 00:00:00 2001 From: Yordan Date: Mon, 14 Jul 2025 16:15:23 +0200 Subject: [PATCH 04/11] chore(changelog): update version to 1.1.0 in changelog --- packages/pluggableWidgets/events-web/CHANGELOG.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/pluggableWidgets/events-web/CHANGELOG.md b/packages/pluggableWidgets/events-web/CHANGELOG.md index bd7e9ba814..4fd416f920 100644 --- a/packages/pluggableWidgets/events-web/CHANGELOG.md +++ b/packages/pluggableWidgets/events-web/CHANGELOG.md @@ -4,7 +4,7 @@ All notable changes to this widget will be documented in this file. The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). -## [Unreleased] +## [1.1.0] - 2025-07-14 ### Added From 6cc76fef1c666e58718ffee2a6e9dc8df70acb1d Mon Sep 17 00:00:00 2001 From: Yordan Date: Mon, 14 Jul 2025 16:48:56 +0200 Subject: [PATCH 05/11] chore(events-web): fix testing errors --- .../events-web/src/__tests__/AppEvents.spec.tsx | 15 ++++++++++++--- .../events-web/typings/EventsProps.d.ts | 2 +- 2 files changed, 13 insertions(+), 4 deletions(-) diff --git a/packages/pluggableWidgets/events-web/src/__tests__/AppEvents.spec.tsx b/packages/pluggableWidgets/events-web/src/__tests__/AppEvents.spec.tsx index 424d67174d..38cf68df72 100644 --- a/packages/pluggableWidgets/events-web/src/__tests__/AppEvents.spec.tsx +++ b/packages/pluggableWidgets/events-web/src/__tests__/AppEvents.spec.tsx @@ -2,6 +2,7 @@ import { actionValue } from "@mendix/widget-plugin-test-utils"; import "@testing-library/jest-dom"; import { render } from "@testing-library/react"; import { createElement } from "react"; +import { ValueStatus } from "mendix"; import { EventsContainerProps } from "../../typings/EventsProps"; import Events from "../Events"; @@ -12,10 +13,18 @@ describe("App events (load)", () => { name: "app events", class: "app-events", onComponentLoad: actionValue(), - componentLoadDelay: 0, - onEventChangeDelay: 0, + componentLoadDelayParameterType: "number", + componentLoadDelayInteger: 0, + componentLoadDelayExpression: { value: undefined, status: ValueStatus.Unavailable }, componentLoadRepeat: false, - componentLoadRepeatInterval: 0 + componentLoadRepeatParameterType: "number", + componentLoadRepeatInterval: 0, + componentLoadRepeatExpression: { value: undefined, status: ValueStatus.Unavailable }, + onEventChangeAttribute: undefined, + onEventChange: undefined, + onEventChangeDelayParameterType: "number", + onEventChangeDelayInteger: 0, + onEventChangeDelayExpression: { value: undefined, status: ValueStatus.Unavailable } }; }); it("render app events", async () => { diff --git a/packages/pluggableWidgets/events-web/typings/EventsProps.d.ts b/packages/pluggableWidgets/events-web/typings/EventsProps.d.ts index 06c39f60ec..64b3f26014 100644 --- a/packages/pluggableWidgets/events-web/typings/EventsProps.d.ts +++ b/packages/pluggableWidgets/events-web/typings/EventsProps.d.ts @@ -30,7 +30,7 @@ export interface EventsContainerProps { onEventChange?: ActionValue; onEventChangeDelayParameterType: OnEventChangeDelayParameterTypeEnum; onEventChangeDelayInteger: number; - onEventChangeDelayExpression: DynamicValue; + onEventChangeDelayExpression?: DynamicValue; } export interface EventsPreviewProps { From 9b5f7f34b35d68fe957bfdf2e35216a46e323829 Mon Sep 17 00:00:00 2001 From: Yordan Date: Tue, 15 Jul 2025 11:48:40 +0200 Subject: [PATCH 06/11] feat(events-web): implement useDelayAndInterval hook for managing delay and interval values --- .../pluggableWidgets/events-web/CHANGELOG.md | 2 +- .../events-web/src/Events.tsx | 47 ++++++----------- .../events-web/src/hooks/delayAndInterval.ts | 52 +++++++++++++++++++ 3 files changed, 70 insertions(+), 31 deletions(-) create mode 100644 packages/pluggableWidgets/events-web/src/hooks/delayAndInterval.ts diff --git a/packages/pluggableWidgets/events-web/CHANGELOG.md b/packages/pluggableWidgets/events-web/CHANGELOG.md index 4fd416f920..bd7e9ba814 100644 --- a/packages/pluggableWidgets/events-web/CHANGELOG.md +++ b/packages/pluggableWidgets/events-web/CHANGELOG.md @@ -4,7 +4,7 @@ All notable changes to this widget will be documented in this file. The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). -## [1.1.0] - 2025-07-14 +## [Unreleased] ### Added diff --git a/packages/pluggableWidgets/events-web/src/Events.tsx b/packages/pluggableWidgets/events-web/src/Events.tsx index 8112ae1230..12ec2a0010 100644 --- a/packages/pluggableWidgets/events-web/src/Events.tsx +++ b/packages/pluggableWidgets/events-web/src/Events.tsx @@ -3,6 +3,7 @@ import { EditableValue } from "mendix"; import { ReactElement, createElement, useRef } from "react"; import { EventsContainerProps } from "../typings/EventsProps"; import { useActionTimer } from "./hooks/timer"; +import { useDelayAndInterval } from "./hooks/delayAndInterval"; import "./ui/Events.scss"; export default function Events(props: EventsContainerProps): ReactElement { @@ -23,38 +24,24 @@ export default function Events(props: EventsContainerProps): ReactElement { onEventChangeDelayExpression } = props; const prevOnChangeAttributeValue = useRef | undefined>(); - let loadDelay; - let repeatInterval; - let onEventChangeDelay; - if (componentLoadDelayParameterType === "number") { - loadDelay = componentLoadDelayInteger; - } else { - loadDelay = - componentLoadDelayExpression.status === "available" - ? componentLoadDelayExpression.value.toNumber() - : undefined; - } - if (componentLoadRepeatParameterType === "number") { - repeatInterval = componentLoadRepeatInterval; - } else { - repeatInterval = - componentLoadRepeatExpression?.status === "available" - ? componentLoadRepeatExpression.value.toNumber() - : undefined; - } - if (onEventChangeDelayParameterType === "number") { - onEventChangeDelay = onEventChangeDelayInteger; - } else { - onEventChangeDelay = - onEventChangeDelayExpression?.status === "available" - ? onEventChangeDelayExpression.value.toNumber() - : undefined; - } + + const [delayValue, intervalValue] = useDelayAndInterval({ + componentLoadDelayParameterType, + componentLoadRepeatParameterType, + onEventChangeDelayParameterType, + componentLoadDelayInteger, + componentLoadRepeatInterval, + onEventChangeDelayInteger, + componentLoadRepeatExpression, + componentLoadDelayExpression, + onEventChangeDelayExpression + }); + useActionTimer({ canExecute: onComponentLoad?.canExecute, execute: onComponentLoad?.execute, - delay: loadDelay, - interval: repeatInterval, + delay: delayValue, + interval: intervalValue, repeat: componentLoadRepeat, attribute: undefined }); @@ -73,7 +60,7 @@ export default function Events(props: EventsContainerProps): ReactElement { } } }, - delay: onEventChangeDelay, + delay: delayValue, interval: 0, repeat: false, attribute: onEventChangeAttribute diff --git a/packages/pluggableWidgets/events-web/src/hooks/delayAndInterval.ts b/packages/pluggableWidgets/events-web/src/hooks/delayAndInterval.ts new file mode 100644 index 0000000000..beb7f97aad --- /dev/null +++ b/packages/pluggableWidgets/events-web/src/hooks/delayAndInterval.ts @@ -0,0 +1,52 @@ +interface ParameterTypeProps { + componentLoadDelayParameterType: string; + componentLoadRepeatParameterType: string; + onEventChangeDelayParameterType: string; + componentLoadDelayInteger?: number; + componentLoadRepeatInterval?: number; + onEventChangeDelayInteger?: number; + componentLoadRepeatExpression?: { status: string; value: { toNumber: () => number } | undefined }; + componentLoadDelayExpression?: { status: string; value: { toNumber: () => number } | undefined }; + onEventChangeDelayExpression?: { status: string; value: { toNumber: () => number } | undefined }; +} + +export function useDelayAndInterval(props: ParameterTypeProps): [number | undefined, number | undefined] { + let delayValue: number | undefined; + let intervalValue: number | undefined; + const { + componentLoadDelayParameterType, + componentLoadRepeatParameterType, + onEventChangeDelayParameterType, + componentLoadDelayInteger, + componentLoadRepeatInterval, + onEventChangeDelayInteger, + componentLoadRepeatExpression, + componentLoadDelayExpression, + onEventChangeDelayExpression + } = props; + if (componentLoadDelayParameterType === "number") { + delayValue = componentLoadDelayInteger; + } else { + delayValue = + componentLoadDelayExpression?.status === "available" && componentLoadDelayExpression.value !== undefined + ? componentLoadDelayExpression.value.toNumber() + : undefined; + } + if (componentLoadRepeatParameterType === "number") { + intervalValue = componentLoadRepeatInterval; + } else { + intervalValue = + componentLoadRepeatExpression?.status === "available" && componentLoadRepeatExpression.value !== undefined + ? componentLoadRepeatExpression.value.toNumber() + : undefined; + } + if (onEventChangeDelayParameterType === "number") { + delayValue = onEventChangeDelayInteger; + } else { + delayValue = + onEventChangeDelayExpression?.status === "available" && onEventChangeDelayExpression.value !== undefined + ? onEventChangeDelayExpression.value.toNumber() + : undefined; + } + return [delayValue, intervalValue]; +} From 9cda6dd2473014376ad24a4e2113cdcdb3f8b9d4 Mon Sep 17 00:00:00 2001 From: Yordan Date: Tue, 15 Jul 2025 14:24:30 +0200 Subject: [PATCH 07/11] refactor(events-web): rename properties for consistency --- .../events-web/src/Events.editorConfig.ts | 10 ++++----- .../events-web/src/Events.tsx | 12 +++++------ .../events-web/src/Events.xml | 8 +++---- .../src/__tests__/AppEvents.spec.tsx | 13 ++++++------ .../events-web/src/hooks/delayAndInterval.ts | 21 ++++++++++--------- .../events-web/src/hooks/timer.ts | 1 - .../events-web/typings/EventsProps.d.ts | 14 ++++++------- 7 files changed, 39 insertions(+), 40 deletions(-) diff --git a/packages/pluggableWidgets/events-web/src/Events.editorConfig.ts b/packages/pluggableWidgets/events-web/src/Events.editorConfig.ts index 137e681db3..8eebd3b2a6 100644 --- a/packages/pluggableWidgets/events-web/src/Events.editorConfig.ts +++ b/packages/pluggableWidgets/events-web/src/Events.editorConfig.ts @@ -21,18 +21,18 @@ export function getProperties( if (!values.componentLoadRepeat) { hidePropertiesIn(defaultProperties, values, [ "componentLoadRepeatInterval", - "componentLoadRepeatExpression", - "componentLoadRepeatParameterType" + "componentLoadRepeatIntervalExpression", + "componentLoadRepeatIntervalParameterType" ]); } else { - if (values.componentLoadRepeatParameterType === "expression") { + if (values.componentLoadRepeatIntervalParameterType === "expression") { hidePropertiesIn(defaultProperties, values, ["componentLoadRepeatInterval"]); } else { - hidePropertiesIn(defaultProperties, values, ["componentLoadRepeatExpression"]); + hidePropertiesIn(defaultProperties, values, ["componentLoadRepeatIntervalExpression"]); } } if (values.componentLoadDelayParameterType === "expression") { - hidePropertiesIn(defaultProperties, values, ["componentLoadDelayInteger"]); + hidePropertiesIn(defaultProperties, values, ["componentLoadDelay"]); } else { hidePropertiesIn(defaultProperties, values, ["componentLoadDelayExpression"]); } diff --git a/packages/pluggableWidgets/events-web/src/Events.tsx b/packages/pluggableWidgets/events-web/src/Events.tsx index 12ec2a0010..bd589f6631 100644 --- a/packages/pluggableWidgets/events-web/src/Events.tsx +++ b/packages/pluggableWidgets/events-web/src/Events.tsx @@ -11,13 +11,13 @@ export default function Events(props: EventsContainerProps): ReactElement { class: className, onComponentLoad, componentLoadDelayExpression, - componentLoadDelayInteger, + componentLoadDelay, componentLoadRepeat, onEventChangeAttribute, onEventChange, componentLoadRepeatInterval, - componentLoadRepeatParameterType, - componentLoadRepeatExpression, + componentLoadRepeatIntervalParameterType, + componentLoadRepeatIntervalExpression, componentLoadDelayParameterType, onEventChangeDelayInteger, onEventChangeDelayParameterType, @@ -27,12 +27,12 @@ export default function Events(props: EventsContainerProps): ReactElement { const [delayValue, intervalValue] = useDelayAndInterval({ componentLoadDelayParameterType, - componentLoadRepeatParameterType, + componentLoadRepeatIntervalParameterType, onEventChangeDelayParameterType, - componentLoadDelayInteger, + componentLoadDelay, componentLoadRepeatInterval, onEventChangeDelayInteger, - componentLoadRepeatExpression, + componentLoadRepeatIntervalExpression, componentLoadDelayExpression, onEventChangeDelayExpression }); diff --git a/packages/pluggableWidgets/events-web/src/Events.xml b/packages/pluggableWidgets/events-web/src/Events.xml index 17fa3db244..9010cda15e 100644 --- a/packages/pluggableWidgets/events-web/src/Events.xml +++ b/packages/pluggableWidgets/events-web/src/Events.xml @@ -21,7 +21,7 @@ - + Delay Timer delay to first action execution. Value is in milliseconds. If set to 0, action will be triggered immediately. @@ -37,7 +37,7 @@ - + Parameter type @@ -51,7 +51,7 @@ Interval between repeat action execution. Value is in milliseconds. - + Interval Interval between repeat action execution. Value is in milliseconds. @@ -88,7 +88,7 @@ - + Delay Timer delay to first action execution. Value is in milliseconds. If set to 0, action will be triggered immediately. diff --git a/packages/pluggableWidgets/events-web/src/__tests__/AppEvents.spec.tsx b/packages/pluggableWidgets/events-web/src/__tests__/AppEvents.spec.tsx index 38cf68df72..b3e58dd879 100644 --- a/packages/pluggableWidgets/events-web/src/__tests__/AppEvents.spec.tsx +++ b/packages/pluggableWidgets/events-web/src/__tests__/AppEvents.spec.tsx @@ -1,8 +1,7 @@ -import { actionValue } from "@mendix/widget-plugin-test-utils"; +import { actionValue, dynamicValue } from "@mendix/widget-plugin-test-utils"; import "@testing-library/jest-dom"; import { render } from "@testing-library/react"; import { createElement } from "react"; -import { ValueStatus } from "mendix"; import { EventsContainerProps } from "../../typings/EventsProps"; import Events from "../Events"; @@ -14,17 +13,17 @@ describe("App events (load)", () => { class: "app-events", onComponentLoad: actionValue(), componentLoadDelayParameterType: "number", - componentLoadDelayInteger: 0, - componentLoadDelayExpression: { value: undefined, status: ValueStatus.Unavailable }, + componentLoadDelay: 0, + componentLoadDelayExpression: dynamicValue(), componentLoadRepeat: false, - componentLoadRepeatParameterType: "number", + componentLoadRepeatIntervalParameterType: "number", componentLoadRepeatInterval: 0, - componentLoadRepeatExpression: { value: undefined, status: ValueStatus.Unavailable }, + componentLoadRepeatIntervalExpression: dynamicValue(), onEventChangeAttribute: undefined, onEventChange: undefined, onEventChangeDelayParameterType: "number", onEventChangeDelayInteger: 0, - onEventChangeDelayExpression: { value: undefined, status: ValueStatus.Unavailable } + onEventChangeDelayExpression: dynamicValue() }; }); it("render app events", async () => { diff --git a/packages/pluggableWidgets/events-web/src/hooks/delayAndInterval.ts b/packages/pluggableWidgets/events-web/src/hooks/delayAndInterval.ts index beb7f97aad..c3be54508b 100644 --- a/packages/pluggableWidgets/events-web/src/hooks/delayAndInterval.ts +++ b/packages/pluggableWidgets/events-web/src/hooks/delayAndInterval.ts @@ -1,11 +1,11 @@ interface ParameterTypeProps { componentLoadDelayParameterType: string; - componentLoadRepeatParameterType: string; + componentLoadRepeatIntervalParameterType: string; onEventChangeDelayParameterType: string; - componentLoadDelayInteger?: number; + componentLoadDelay?: number; componentLoadRepeatInterval?: number; onEventChangeDelayInteger?: number; - componentLoadRepeatExpression?: { status: string; value: { toNumber: () => number } | undefined }; + componentLoadRepeatIntervalExpression?: { status: string; value: { toNumber: () => number } | undefined }; componentLoadDelayExpression?: { status: string; value: { toNumber: () => number } | undefined }; onEventChangeDelayExpression?: { status: string; value: { toNumber: () => number } | undefined }; } @@ -15,29 +15,30 @@ export function useDelayAndInterval(props: ParameterTypeProps): [number | undefi let intervalValue: number | undefined; const { componentLoadDelayParameterType, - componentLoadRepeatParameterType, + componentLoadRepeatIntervalParameterType, onEventChangeDelayParameterType, - componentLoadDelayInteger, + componentLoadDelay, componentLoadRepeatInterval, onEventChangeDelayInteger, - componentLoadRepeatExpression, + componentLoadRepeatIntervalExpression, componentLoadDelayExpression, onEventChangeDelayExpression } = props; if (componentLoadDelayParameterType === "number") { - delayValue = componentLoadDelayInteger; + delayValue = componentLoadDelay; } else { delayValue = componentLoadDelayExpression?.status === "available" && componentLoadDelayExpression.value !== undefined ? componentLoadDelayExpression.value.toNumber() : undefined; } - if (componentLoadRepeatParameterType === "number") { + if (componentLoadRepeatIntervalParameterType === "number") { intervalValue = componentLoadRepeatInterval; } else { intervalValue = - componentLoadRepeatExpression?.status === "available" && componentLoadRepeatExpression.value !== undefined - ? componentLoadRepeatExpression.value.toNumber() + componentLoadRepeatIntervalExpression?.status === "available" && + componentLoadRepeatIntervalExpression.value !== undefined + ? componentLoadRepeatIntervalExpression.value.toNumber() : undefined; } if (onEventChangeDelayParameterType === "number") { diff --git a/packages/pluggableWidgets/events-web/src/hooks/timer.ts b/packages/pluggableWidgets/events-web/src/hooks/timer.ts index b1c32d9034..cd1fd53216 100644 --- a/packages/pluggableWidgets/events-web/src/hooks/timer.ts +++ b/packages/pluggableWidgets/events-web/src/hooks/timer.ts @@ -16,7 +16,6 @@ export function useActionTimer(props: ActionTimerProps): void { useEffect(() => { // If the delay is set to undefined, we should not start a timer. if (delay === undefined || delay < 0 || (interval === undefined && repeat)) { - console.log("Events: Timer delay or interval is not set, skipping timer execution."); return; } let counter: NodeJS.Timeout; diff --git a/packages/pluggableWidgets/events-web/typings/EventsProps.d.ts b/packages/pluggableWidgets/events-web/typings/EventsProps.d.ts index 64b3f26014..5bf16c08a8 100644 --- a/packages/pluggableWidgets/events-web/typings/EventsProps.d.ts +++ b/packages/pluggableWidgets/events-web/typings/EventsProps.d.ts @@ -9,7 +9,7 @@ import { Big } from "big.js"; export type ComponentLoadDelayParameterTypeEnum = "number" | "expression"; -export type ComponentLoadRepeatParameterTypeEnum = "number" | "expression"; +export type ComponentLoadRepeatIntervalParameterTypeEnum = "number" | "expression"; export type OnEventChangeDelayParameterTypeEnum = "number" | "expression"; @@ -20,12 +20,12 @@ export interface EventsContainerProps { tabIndex?: number; onComponentLoad?: ActionValue; componentLoadDelayParameterType: ComponentLoadDelayParameterTypeEnum; - componentLoadDelayInteger: number; + componentLoadDelay: number; componentLoadDelayExpression: DynamicValue; componentLoadRepeat: boolean; - componentLoadRepeatParameterType: ComponentLoadRepeatParameterTypeEnum; + componentLoadRepeatIntervalParameterType: ComponentLoadRepeatIntervalParameterTypeEnum; componentLoadRepeatInterval: number; - componentLoadRepeatExpression?: DynamicValue; + componentLoadRepeatIntervalExpression?: DynamicValue; onEventChangeAttribute?: EditableValue; onEventChange?: ActionValue; onEventChangeDelayParameterType: OnEventChangeDelayParameterTypeEnum; @@ -46,12 +46,12 @@ export interface EventsPreviewProps { translate: (text: string) => string; onComponentLoad: {} | null; componentLoadDelayParameterType: ComponentLoadDelayParameterTypeEnum; - componentLoadDelayInteger: number | null; + componentLoadDelay: number | null; componentLoadDelayExpression: string; componentLoadRepeat: boolean; - componentLoadRepeatParameterType: ComponentLoadRepeatParameterTypeEnum; + componentLoadRepeatIntervalParameterType: ComponentLoadRepeatIntervalParameterTypeEnum; componentLoadRepeatInterval: number | null; - componentLoadRepeatExpression: string; + componentLoadRepeatIntervalExpression: string; onEventChangeAttribute: string; onEventChange: {} | null; onEventChangeDelayParameterType: OnEventChangeDelayParameterTypeEnum; From 3db0a79f37c7c38cb72524465723b13aef3bc2c7 Mon Sep 17 00:00:00 2001 From: Yordan Date: Tue, 15 Jul 2025 14:27:49 +0200 Subject: [PATCH 08/11] chore(changelog): update changelog to provide clearer intruction --- packages/pluggableWidgets/events-web/CHANGELOG.md | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/packages/pluggableWidgets/events-web/CHANGELOG.md b/packages/pluggableWidgets/events-web/CHANGELOG.md index bd7e9ba814..b7fa304d8e 100644 --- a/packages/pluggableWidgets/events-web/CHANGELOG.md +++ b/packages/pluggableWidgets/events-web/CHANGELOG.md @@ -8,9 +8,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), ### Added -- On component load: Added support for expressions when setting the delay value -- On component load: Added support for expressions when setting the repeat interval -- On attribute change: Added support for expressions when setting the delay value +Added support for using expressions to configure both delay and repeat interval values during component load. Expression support was also extended to delay values when attributes change dynamically. ## [1.0.1] - 2024-04-25 From 4720e445d495aef8f4e25e64063cb114b53f6e81 Mon Sep 17 00:00:00 2001 From: Yordan Date: Tue, 15 Jul 2025 14:32:59 +0200 Subject: [PATCH 09/11] refactor(events-web): rename properties for consistency --- .../pluggableWidgets/events-web/src/Events.editorConfig.ts | 2 +- packages/pluggableWidgets/events-web/src/Events.tsx | 4 ++-- .../events-web/src/__tests__/AppEvents.spec.tsx | 2 +- .../events-web/src/hooks/delayAndInterval.ts | 6 +++--- .../pluggableWidgets/events-web/typings/EventsProps.d.ts | 6 +++--- 5 files changed, 10 insertions(+), 10 deletions(-) diff --git a/packages/pluggableWidgets/events-web/src/Events.editorConfig.ts b/packages/pluggableWidgets/events-web/src/Events.editorConfig.ts index 8eebd3b2a6..e380bae933 100644 --- a/packages/pluggableWidgets/events-web/src/Events.editorConfig.ts +++ b/packages/pluggableWidgets/events-web/src/Events.editorConfig.ts @@ -37,7 +37,7 @@ export function getProperties( hidePropertiesIn(defaultProperties, values, ["componentLoadDelayExpression"]); } if (values.onEventChangeDelayParameterType === "expression") { - hidePropertiesIn(defaultProperties, values, ["onEventChangeDelayInteger"]); + hidePropertiesIn(defaultProperties, values, ["onEventChangeDelay"]); } else { hidePropertiesIn(defaultProperties, values, ["onEventChangeDelayExpression"]); } diff --git a/packages/pluggableWidgets/events-web/src/Events.tsx b/packages/pluggableWidgets/events-web/src/Events.tsx index bd589f6631..0dc43cfc00 100644 --- a/packages/pluggableWidgets/events-web/src/Events.tsx +++ b/packages/pluggableWidgets/events-web/src/Events.tsx @@ -19,7 +19,7 @@ export default function Events(props: EventsContainerProps): ReactElement { componentLoadRepeatIntervalParameterType, componentLoadRepeatIntervalExpression, componentLoadDelayParameterType, - onEventChangeDelayInteger, + onEventChangeDelay, onEventChangeDelayParameterType, onEventChangeDelayExpression } = props; @@ -31,7 +31,7 @@ export default function Events(props: EventsContainerProps): ReactElement { onEventChangeDelayParameterType, componentLoadDelay, componentLoadRepeatInterval, - onEventChangeDelayInteger, + onEventChangeDelay, componentLoadRepeatIntervalExpression, componentLoadDelayExpression, onEventChangeDelayExpression diff --git a/packages/pluggableWidgets/events-web/src/__tests__/AppEvents.spec.tsx b/packages/pluggableWidgets/events-web/src/__tests__/AppEvents.spec.tsx index b3e58dd879..4cfc8e0a2c 100644 --- a/packages/pluggableWidgets/events-web/src/__tests__/AppEvents.spec.tsx +++ b/packages/pluggableWidgets/events-web/src/__tests__/AppEvents.spec.tsx @@ -22,7 +22,7 @@ describe("App events (load)", () => { onEventChangeAttribute: undefined, onEventChange: undefined, onEventChangeDelayParameterType: "number", - onEventChangeDelayInteger: 0, + onEventChangeDelay: 0, onEventChangeDelayExpression: dynamicValue() }; }); diff --git a/packages/pluggableWidgets/events-web/src/hooks/delayAndInterval.ts b/packages/pluggableWidgets/events-web/src/hooks/delayAndInterval.ts index c3be54508b..57de8083db 100644 --- a/packages/pluggableWidgets/events-web/src/hooks/delayAndInterval.ts +++ b/packages/pluggableWidgets/events-web/src/hooks/delayAndInterval.ts @@ -4,7 +4,7 @@ interface ParameterTypeProps { onEventChangeDelayParameterType: string; componentLoadDelay?: number; componentLoadRepeatInterval?: number; - onEventChangeDelayInteger?: number; + onEventChangeDelay?: number; componentLoadRepeatIntervalExpression?: { status: string; value: { toNumber: () => number } | undefined }; componentLoadDelayExpression?: { status: string; value: { toNumber: () => number } | undefined }; onEventChangeDelayExpression?: { status: string; value: { toNumber: () => number } | undefined }; @@ -19,7 +19,7 @@ export function useDelayAndInterval(props: ParameterTypeProps): [number | undefi onEventChangeDelayParameterType, componentLoadDelay, componentLoadRepeatInterval, - onEventChangeDelayInteger, + onEventChangeDelay, componentLoadRepeatIntervalExpression, componentLoadDelayExpression, onEventChangeDelayExpression @@ -42,7 +42,7 @@ export function useDelayAndInterval(props: ParameterTypeProps): [number | undefi : undefined; } if (onEventChangeDelayParameterType === "number") { - delayValue = onEventChangeDelayInteger; + delayValue = onEventChangeDelay; } else { delayValue = onEventChangeDelayExpression?.status === "available" && onEventChangeDelayExpression.value !== undefined diff --git a/packages/pluggableWidgets/events-web/typings/EventsProps.d.ts b/packages/pluggableWidgets/events-web/typings/EventsProps.d.ts index 5bf16c08a8..6f46be628c 100644 --- a/packages/pluggableWidgets/events-web/typings/EventsProps.d.ts +++ b/packages/pluggableWidgets/events-web/typings/EventsProps.d.ts @@ -29,8 +29,8 @@ export interface EventsContainerProps { onEventChangeAttribute?: EditableValue; onEventChange?: ActionValue; onEventChangeDelayParameterType: OnEventChangeDelayParameterTypeEnum; - onEventChangeDelayInteger: number; - onEventChangeDelayExpression?: DynamicValue; + onEventChangeDelay: number; + onEventChangeDelayExpression: DynamicValue; } export interface EventsPreviewProps { @@ -55,6 +55,6 @@ export interface EventsPreviewProps { onEventChangeAttribute: string; onEventChange: {} | null; onEventChangeDelayParameterType: OnEventChangeDelayParameterTypeEnum; - onEventChangeDelayInteger: number | null; + onEventChangeDelay: number | null; onEventChangeDelayExpression: string; } From 61b5e09aba396df98fc2a0ad4a4b64034c793073 Mon Sep 17 00:00:00 2001 From: Yordan Date: Tue, 15 Jul 2025 14:40:36 +0200 Subject: [PATCH 10/11] chore(changelog): fix formatting for Changelog --- packages/pluggableWidgets/events-web/CHANGELOG.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/pluggableWidgets/events-web/CHANGELOG.md b/packages/pluggableWidgets/events-web/CHANGELOG.md index b7fa304d8e..be454230d0 100644 --- a/packages/pluggableWidgets/events-web/CHANGELOG.md +++ b/packages/pluggableWidgets/events-web/CHANGELOG.md @@ -8,7 +8,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), ### Added -Added support for using expressions to configure both delay and repeat interval values during component load. Expression support was also extended to delay values when attributes change dynamically. +- Added support for using expressions to configure both delay and repeat interval values during component load. Expression support was also extended to delay values when attributes change dynamically. ## [1.0.1] - 2024-04-25 From 0f7af8863ff5ec061785997a803d36c722f6938a Mon Sep 17 00:00:00 2001 From: Yordan Date: Tue, 15 Jul 2025 16:25:09 +0200 Subject: [PATCH 11/11] refactor: delete old helper hook --- .../events-web/src/Events.tsx | 28 +++++----- .../events-web/src/hooks/delayAndInterval.ts | 53 ------------------- .../events-web/src/hooks/parameterValue.ts | 23 ++++++++ 3 files changed, 39 insertions(+), 65 deletions(-) delete mode 100644 packages/pluggableWidgets/events-web/src/hooks/delayAndInterval.ts create mode 100644 packages/pluggableWidgets/events-web/src/hooks/parameterValue.ts diff --git a/packages/pluggableWidgets/events-web/src/Events.tsx b/packages/pluggableWidgets/events-web/src/Events.tsx index 0dc43cfc00..dab7edcc84 100644 --- a/packages/pluggableWidgets/events-web/src/Events.tsx +++ b/packages/pluggableWidgets/events-web/src/Events.tsx @@ -3,7 +3,7 @@ import { EditableValue } from "mendix"; import { ReactElement, createElement, useRef } from "react"; import { EventsContainerProps } from "../typings/EventsProps"; import { useActionTimer } from "./hooks/timer"; -import { useDelayAndInterval } from "./hooks/delayAndInterval"; +import { useParameterValue } from "./hooks/parameterValue"; import "./ui/Events.scss"; export default function Events(props: EventsContainerProps): ReactElement { @@ -25,16 +25,20 @@ export default function Events(props: EventsContainerProps): ReactElement { } = props; const prevOnChangeAttributeValue = useRef | undefined>(); - const [delayValue, intervalValue] = useDelayAndInterval({ - componentLoadDelayParameterType, - componentLoadRepeatIntervalParameterType, - onEventChangeDelayParameterType, - componentLoadDelay, - componentLoadRepeatInterval, - onEventChangeDelay, - componentLoadRepeatIntervalExpression, - componentLoadDelayExpression, - onEventChangeDelayExpression + const delayValue = useParameterValue({ + parameterType: componentLoadDelayParameterType, + parameterValue: componentLoadDelay, + parameterExpression: componentLoadDelayExpression + }); + const intervalValue = useParameterValue({ + parameterType: componentLoadRepeatIntervalParameterType, + parameterValue: componentLoadRepeatInterval, + parameterExpression: componentLoadRepeatIntervalExpression + }); + const onEventChangeDelayValue = useParameterValue({ + parameterType: onEventChangeDelayParameterType, + parameterValue: onEventChangeDelay, + parameterExpression: onEventChangeDelayExpression }); useActionTimer({ @@ -60,7 +64,7 @@ export default function Events(props: EventsContainerProps): ReactElement { } } }, - delay: delayValue, + delay: onEventChangeDelayValue, interval: 0, repeat: false, attribute: onEventChangeAttribute diff --git a/packages/pluggableWidgets/events-web/src/hooks/delayAndInterval.ts b/packages/pluggableWidgets/events-web/src/hooks/delayAndInterval.ts deleted file mode 100644 index 57de8083db..0000000000 --- a/packages/pluggableWidgets/events-web/src/hooks/delayAndInterval.ts +++ /dev/null @@ -1,53 +0,0 @@ -interface ParameterTypeProps { - componentLoadDelayParameterType: string; - componentLoadRepeatIntervalParameterType: string; - onEventChangeDelayParameterType: string; - componentLoadDelay?: number; - componentLoadRepeatInterval?: number; - onEventChangeDelay?: number; - componentLoadRepeatIntervalExpression?: { status: string; value: { toNumber: () => number } | undefined }; - componentLoadDelayExpression?: { status: string; value: { toNumber: () => number } | undefined }; - onEventChangeDelayExpression?: { status: string; value: { toNumber: () => number } | undefined }; -} - -export function useDelayAndInterval(props: ParameterTypeProps): [number | undefined, number | undefined] { - let delayValue: number | undefined; - let intervalValue: number | undefined; - const { - componentLoadDelayParameterType, - componentLoadRepeatIntervalParameterType, - onEventChangeDelayParameterType, - componentLoadDelay, - componentLoadRepeatInterval, - onEventChangeDelay, - componentLoadRepeatIntervalExpression, - componentLoadDelayExpression, - onEventChangeDelayExpression - } = props; - if (componentLoadDelayParameterType === "number") { - delayValue = componentLoadDelay; - } else { - delayValue = - componentLoadDelayExpression?.status === "available" && componentLoadDelayExpression.value !== undefined - ? componentLoadDelayExpression.value.toNumber() - : undefined; - } - if (componentLoadRepeatIntervalParameterType === "number") { - intervalValue = componentLoadRepeatInterval; - } else { - intervalValue = - componentLoadRepeatIntervalExpression?.status === "available" && - componentLoadRepeatIntervalExpression.value !== undefined - ? componentLoadRepeatIntervalExpression.value.toNumber() - : undefined; - } - if (onEventChangeDelayParameterType === "number") { - delayValue = onEventChangeDelay; - } else { - delayValue = - onEventChangeDelayExpression?.status === "available" && onEventChangeDelayExpression.value !== undefined - ? onEventChangeDelayExpression.value.toNumber() - : undefined; - } - return [delayValue, intervalValue]; -} diff --git a/packages/pluggableWidgets/events-web/src/hooks/parameterValue.ts b/packages/pluggableWidgets/events-web/src/hooks/parameterValue.ts new file mode 100644 index 0000000000..13e134328d --- /dev/null +++ b/packages/pluggableWidgets/events-web/src/hooks/parameterValue.ts @@ -0,0 +1,23 @@ +import { useMemo } from "react"; + +interface parameterValueProps { + parameterType: "number" | "expression"; + parameterValue: number | undefined; + parameterExpression: { status: string; value: { toNumber: () => number } | undefined } | undefined; +} + +export function useParameterValue({ + parameterType, + parameterValue, + parameterExpression +}: parameterValueProps): number | undefined { + return useMemo(() => { + if (parameterType === "number") { + return parameterValue; + } + + return parameterExpression?.status === "available" && parameterExpression.value !== undefined + ? parameterExpression.value.toNumber() + : undefined; + }, [parameterType, parameterValue, parameterExpression]); +}