@oneuptime/common 7.0.5085 → 7.0.5093

package/Models/DatabaseModels/OnCallDutyPolicyEscalationRule.ts

@@ -46,7 +46,7 @@ import { Column, Entity, Index, JoinColumn, ManyToOne } from "typeorm";
     Permission.EditProjectOnCallDutyPolicyEscalationRule,
   ],
 })
-@CrudApiEndpoint(new Route("/on-call-duty-policy-esclation-rule"))
+@CrudApiEndpoint(new Route("/on-call-duty-policy-escalation-rule"))
 @Entity({
   name: "OnCallDutyPolicyEscalationRule",
 })

package/Models/DatabaseModels/OnCallDutyPolicyEscalationRuleSchedule.ts

@@ -47,7 +47,7 @@ import { Column, Entity, Index, JoinColumn, ManyToOne } from "typeorm";
     Permission.EditProjectOnCallDutyPolicyEscalationRuleSchedule,
   ],
 })
-@CrudApiEndpoint(new Route("/on-call-duty-policy-esclation-rule-schedule"))
+@CrudApiEndpoint(new Route("/on-call-duty-policy-escalation-rule-schedule"))
 @Entity({
   name: "OnCallDutyPolicyEscalationRuleSchedule",
 })

package/Models/DatabaseModels/OnCallDutyPolicyEscalationRuleTeam.ts

@@ -47,7 +47,7 @@ import { Column, Entity, Index, JoinColumn, ManyToOne } from "typeorm";
     Permission.EditProjectOnCallDutyPolicyEscalationRuleTeam,
   ],
 })
-@CrudApiEndpoint(new Route("/on-call-duty-policy-esclation-rule-team"))
+@CrudApiEndpoint(new Route("/on-call-duty-policy-escalation-rule-team"))
 @Entity({
   name: "OnCallDutyPolicyEscalationRuleTeam",
 })

package/Models/DatabaseModels/OnCallDutyPolicyEscalationRuleUser.ts

@@ -46,7 +46,7 @@ import { Column, Entity, Index, JoinColumn, ManyToOne } from "typeorm";
     Permission.EditProjectOnCallDutyPolicyEscalationRuleUser,
   ],
 })
-@CrudApiEndpoint(new Route("/on-call-duty-policy-esclation-rule-user"))
+@CrudApiEndpoint(new Route("/on-call-duty-policy-escalation-rule-user"))
 @Entity({
   name: "OnCallDutyPolicyEscalationRuleUser",
 })

package/Models/DatabaseModels/Project.ts

@@ -1291,4 +1291,37 @@ export default class Project extends TenantModel {
     type: ColumnType.Boolean,
   })
   public letCustomerSupportAccessProject?: boolean = undefined;
+
+  @ColumnAccessControl({
+    create: [],
+    read: [
+      Permission.ProjectOwner,
+      Permission.ProjectAdmin,
+      Permission.ProjectMember,
+      Permission.ReadProject,
+      Permission.UnAuthorizedSsoUser,
+      Permission.ProjectUser,
+    ],
+    update: [
+      Permission.ProjectOwner,
+      Permission.ProjectAdmin,
+      Permission.EditProject,
+    ],
+  })
+  @TableColumn({
+    required: false,
+    type: TableColumnType.Boolean,
+    isDefaultValueColumn: false,
+    title: "Do NOT auto-add Global Probes to new monitors",
+    description:
+      "If enabled, global probes will NOT be automatically added to new monitors. Enable this only if you are using ONLY custom probes to monitor your resources.",
+    defaultValue: false,
+  })
+  @Column({
+    type: ColumnType.Boolean,
+    nullable: false,
+    unique: false,
+    default: false,
+  })
+  public doNotAddGlobalProbesByDefaultOnNewMonitors?: boolean = undefined;
 }

package/Server/Infrastructure/Postgres/SchemaMigrations/1756821449686-MigrationName.ts

@@ -0,0 +1,17 @@
+import { MigrationInterface, QueryRunner } from "typeorm";
+
+export class MigrationName1756821449686 implements MigrationInterface {
+  public name = "MigrationName1756821449686";
+
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(
+      `ALTER TABLE "Project" ADD "doNotAddGlobalProbesByDefaultOnNewMonitors" boolean NOT NULL DEFAULT false`,
+    );
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(
+      `ALTER TABLE "Project" DROP COLUMN "doNotAddGlobalProbesByDefaultOnNewMonitors"`,
+    );
+  }
+}

package/Server/Infrastructure/Postgres/SchemaMigrations/Index.ts

@@ -164,6 +164,7 @@ import { MigrationName1755778934927 } from "./1755778934927-MigrationName";
 import { MigrationName1756293325324 } from "./1756293325324-MigrationName";
 import { MigrationName1756296282627 } from "./1756296282627-MigrationName";
 import { MigrationName1756300358095 } from "./1756300358095-MigrationName";
+import { MigrationName1756821449686 } from "./1756821449686-MigrationName";
 
 export default [
   InitialMigration,
@@ -332,4 +333,5 @@ export default [
   MigrationName1756293325324,
   MigrationName1756296282627,
   MigrationName1756300358095,
+  MigrationName1756821449686,
 ];

package/Server/Services/AlertService.ts

@@ -440,7 +440,7 @@ export class Service extends DatabaseService<Model> {
      
 ${createdItem.description || "No description provided."}
      
-     `;
+`;
 
       if (alert.currentAlertState?.name) {
         feedInfoInMarkdown += `🔴 **Alert State**: ${alert.currentAlertState.name} \n\n`;

package/Server/Services/MonitorService.ts

@@ -68,6 +68,7 @@ import { FindWhere } from "../../Types/BaseDatabase/Query";
 import logger from "../Utils/Logger";
 import PushNotificationUtil from "../Utils/PushNotificationUtil";
 import ExceptionMessages from "../../Types/Exception/ExceptionMessages";
+import Project from "../../Models/DatabaseModels/Project";
 
 export class Service extends DatabaseService<Model> {
   public constructor() {
@@ -791,21 +792,40 @@ ${createdItem.description?.trim() || "No description provided."}
     projectId: ObjectID,
     monitorId: ObjectID,
   ): Promise<void> {
-    const globalProbes: Array<Probe> = await ProbeService.findBy({
-      query: {
-        isGlobalProbe: true,
-        shouldAutoEnableProbeOnNewMonitors: true,
-      },
+    // Fetch project to see if global probes should be added automatically.
+    const project: Project | null = await ProjectService.findOneById({
+      id: projectId,
       select: {
         _id: true,
+        doNotAddGlobalProbesByDefaultOnNewMonitors: true,
       },
-      skip: 0,
-      limit: LIMIT_PER_PROJECT,
       props: {
         isRoot: true,
       },
     });
 
+    const shouldSkipGlobalProbes: boolean =
+      project?.doNotAddGlobalProbesByDefaultOnNewMonitors === true;
+
+    let globalProbes: Array<Probe> = [];
+
+    if (!shouldSkipGlobalProbes) {
+      globalProbes = await ProbeService.findBy({
+        query: {
+          isGlobalProbe: true,
+          shouldAutoEnableProbeOnNewMonitors: true,
+        },
+        select: {
+          _id: true,
+        },
+        skip: 0,
+        limit: LIMIT_PER_PROJECT,
+        props: {
+          isRoot: true,
+        },
+      });
+    }
+
     const projectProbes: Array<Probe> = await ProbeService.findBy({
       query: {
         isGlobalProbe: false,

package/Server/Utils/Monitor/MonitorAlert.ts

@@ -19,6 +19,8 @@ import AlertStateTimelineService from "../../Services/AlertStateTimelineService"
 import logger from "../Logger";
 import CaptureSpan from "../Telemetry/CaptureSpan";
 import DataToProcess from "./DataToProcess";
+import MonitorTemplateUtil from "./MonitorTemplateUtil";
+import { JSONObject } from "../../../Types/JSON";
 
 export default class MonitorAlert {
   @CaptureSpan()
@@ -130,9 +132,20 @@ export default class MonitorAlert {
         logger.debug(`${input.monitor.id?.toString()} - Create alert.`);
 
         const alert: Alert = new Alert();
-
-        alert.title = criteriaAlert.title;
-        alert.description = criteriaAlert.description;
+        const storageMap: JSONObject =
+          MonitorTemplateUtil.buildTemplateStorageMap({
+            monitorType: input.monitor.monitorType!,
+            dataToProcess: input.dataToProcess,
+          });
+
+        alert.title = MonitorTemplateUtil.processTemplateString({
+          value: criteriaAlert.title,
+          storageMap,
+        });
+        alert.description = MonitorTemplateUtil.processTemplateString({
+          value: criteriaAlert.description,
+          storageMap,
+        });
 
         if (!criteriaAlert.alertSeverityId) {
           // pick the critical criteria.
@@ -194,7 +207,10 @@ export default class MonitorAlert {
         }
 
         if (criteriaAlert.remediationNotes) {
-          alert.remediationNotes = criteriaAlert.remediationNotes;
+          alert.remediationNotes = MonitorTemplateUtil.processTemplateString({
+            value: criteriaAlert.remediationNotes,
+            storageMap,
+          });
         }
 
         if (DisableAutomaticAlertCreation) {

package/Server/Utils/Monitor/MonitorIncident.ts

@@ -19,6 +19,8 @@ import IncidentStateTimelineService from "../../Services/IncidentStateTimelineSe
 import logger from "../Logger";
 import CaptureSpan from "../Telemetry/CaptureSpan";
 import DataToProcess from "./DataToProcess";
+import MonitorTemplateUtil from "./MonitorTemplateUtil";
+import { JSONObject } from "../../../Types/JSON";
 
 export default class MonitorIncident {
   @CaptureSpan()
@@ -34,7 +36,7 @@ export default class MonitorIncident {
     // check active incidents and if there are open incidents, do not cretae anothr incident.
     const openIncidents: Array<Incident> = await IncidentService.findBy({
       query: {
-        monitors: [input.monitorId] as any,
+        monitors: [input.monitorId],
         currentIncidentState: {
           isResolvedState: false,
         },
@@ -136,9 +138,20 @@ export default class MonitorIncident {
         logger.debug(`${input.monitor.id?.toString()} - Create incident.`);
 
         const incident: Incident = new Incident();
-
-        incident.title = criteriaIncident.title;
-        incident.description = criteriaIncident.description;
+        const storageMap: JSONObject =
+          MonitorTemplateUtil.buildTemplateStorageMap({
+            monitorType: input.monitor.monitorType!,
+            dataToProcess: input.dataToProcess,
+          });
+
+        incident.title = MonitorTemplateUtil.processTemplateString({
+          value: criteriaIncident.title,
+          storageMap,
+        });
+        incident.description = MonitorTemplateUtil.processTemplateString({
+          value: criteriaIncident.description,
+          storageMap,
+        });
 
         if (!criteriaIncident.incidentSeverityId) {
           // pick the critical criteria.
@@ -204,7 +217,12 @@ export default class MonitorIncident {
         }
 
         if (criteriaIncident.remediationNotes) {
-          incident.remediationNotes = criteriaIncident.remediationNotes;
+          incident.remediationNotes = MonitorTemplateUtil.processTemplateString(
+            {
+              value: criteriaIncident.remediationNotes,
+              storageMap,
+            },
+          );
         }
 
         if (DisableAutomaticIncidentCreation) {

package/Server/Utils/Monitor/MonitorTemplateUtil.ts

@@ -0,0 +1,246 @@
+import MonitorType from "../../../Types/Monitor/MonitorType";
+import { JSONObject } from "../../../Types/JSON";
+import ProbeMonitorResponse from "../../../Types/Probe/ProbeMonitorResponse";
+import IncomingMonitorRequest from "../../../Types/Monitor/IncomingMonitor/IncomingMonitorRequest";
+import ServerMonitorResponse, {
+  ServerProcess,
+} from "../../../Types/Monitor/ServerMonitor/ServerMonitorResponse";
+import BasicInfrastructureMetrics, {
+  BasicDiskMetrics,
+} from "../../../Types/Infrastructure/BasicMetrics";
+import SslMonitorResponse from "../../../Types/Monitor/SSLMonitor/SslMonitorResponse";
+import CustomCodeMonitorResponse from "../../../Types/Monitor/CustomCodeMonitor/CustomCodeMonitorResponse";
+import SyntheticMonitorResponse from "../../../Types/Monitor/SyntheticMonitors/SyntheticMonitorResponse";
+import Typeof from "../../../Types/Typeof";
+import VMUtil from "../VM/VMAPI";
+import DataToProcess from "./DataToProcess";
+import logger from "../Logger";
+
+/**
+ * Utility for building template variable storage map and processing dynamic placeholders
+ * shared between Incident and Alert auto-creation.
+ */
+export default class MonitorTemplateUtil {
+  /**
+   * Build a storage map of variables available for templating based on monitor type.
+   */
+  public static buildTemplateStorageMap(data: {
+    monitorType: MonitorType;
+    dataToProcess: DataToProcess;
+  }): JSONObject {
+    let storageMap: JSONObject = {};
+
+    try {
+      if (
+        data.monitorType === MonitorType.API ||
+        data.monitorType === MonitorType.Website
+      ) {
+        let responseBody: JSONObject | null = null;
+        try {
+          responseBody = JSON.parse(
+            ((data.dataToProcess as ProbeMonitorResponse)
+              .responseBody as string) || "{}",
+          );
+        } catch (err) {
+          logger.error(err);
+          responseBody = (data.dataToProcess as ProbeMonitorResponse)
+            .responseBody as JSONObject;
+        }
+
+        if (
+          typeof responseBody === Typeof.String &&
+          responseBody?.toString() === ""
+        ) {
+          responseBody = {};
+        }
+
+        storageMap = {
+          responseBody: responseBody,
+          responseHeaders: (data.dataToProcess as ProbeMonitorResponse)
+            .responseHeaders,
+          responseStatusCode: (data.dataToProcess as ProbeMonitorResponse)
+            .responseCode,
+          responseTimeInMs: (data.dataToProcess as ProbeMonitorResponse)
+            .responseTimeInMs,
+          isOnline: (data.dataToProcess as ProbeMonitorResponse).isOnline,
+        } as JSONObject;
+      }
+
+      if (data.monitorType === MonitorType.IncomingRequest) {
+        storageMap = {
+          requestBody: (data.dataToProcess as IncomingMonitorRequest)
+            .requestBody,
+          requestHeaders: (data.dataToProcess as IncomingMonitorRequest)
+            .requestHeaders,
+          requestMethod: (data.dataToProcess as IncomingMonitorRequest)
+            .requestMethod,
+          incomingRequestReceivedAt: (
+            data.dataToProcess as IncomingMonitorRequest
+          ).incomingRequestReceivedAt,
+        } as JSONObject;
+      }
+
+      if (
+        data.monitorType === MonitorType.Ping ||
+        data.monitorType === MonitorType.IP ||
+        data.monitorType === MonitorType.Port
+      ) {
+        storageMap = {
+          isOnline: (data.dataToProcess as ProbeMonitorResponse).isOnline,
+          responseTimeInMs: (data.dataToProcess as ProbeMonitorResponse)
+            .responseTimeInMs,
+          failureCause: (data.dataToProcess as ProbeMonitorResponse)
+            .failureCause,
+          isTimeout: (data.dataToProcess as ProbeMonitorResponse).isTimeout,
+        } as JSONObject;
+      }
+
+      if (data.monitorType === MonitorType.SSLCertificate) {
+        const sslResponse: SslMonitorResponse | undefined = (
+          data.dataToProcess as ProbeMonitorResponse
+        ).sslResponse;
+        storageMap = {
+          isOnline: (data.dataToProcess as ProbeMonitorResponse).isOnline,
+          isSelfSigned: sslResponse?.isSelfSigned,
+          createdAt: sslResponse?.createdAt,
+          expiresAt: sslResponse?.expiresAt,
+          commonName: sslResponse?.commonName,
+          organizationalUnit: sslResponse?.organizationalUnit,
+          organization: sslResponse?.organization,
+          locality: sslResponse?.locality,
+          state: sslResponse?.state,
+          country: sslResponse?.country,
+          serialNumber: sslResponse?.serialNumber,
+          fingerprint: sslResponse?.fingerprint,
+          fingerprint256: sslResponse?.fingerprint256,
+          failureCause: (data.dataToProcess as ProbeMonitorResponse)
+            .failureCause,
+        } as JSONObject;
+      }
+
+      if (data.monitorType === MonitorType.Server) {
+        const serverResponse: ServerMonitorResponse =
+          data.dataToProcess as ServerMonitorResponse;
+        const infraMetrics: BasicInfrastructureMetrics | undefined =
+          serverResponse.basicInfrastructureMetrics;
+
+        storageMap = {
+          hostname: serverResponse.hostname,
+          requestReceivedAt: serverResponse.requestReceivedAt,
+          failureCause: serverResponse.failureCause,
+        } as JSONObject;
+
+        // Add CPU metrics if available
+        if (infraMetrics?.cpuMetrics) {
+          storageMap["cpuUsagePercent"] = infraMetrics.cpuMetrics.percentUsed;
+          storageMap["cpuCores"] = infraMetrics.cpuMetrics.cores;
+        }
+
+        // Add memory metrics if available
+        if (infraMetrics?.memoryMetrics) {
+          storageMap["memoryUsagePercent"] =
+            infraMetrics.memoryMetrics.percentUsed;
+          storageMap["memoryFreePercent"] =
+            infraMetrics.memoryMetrics.percentFree;
+          storageMap["memoryTotalBytes"] = infraMetrics.memoryMetrics.total;
+        }
+
+        // Add disk metrics if available
+        if (infraMetrics?.diskMetrics) {
+          storageMap["diskMetrics"] = infraMetrics.diskMetrics.map(
+            (disk: BasicDiskMetrics) => {
+              return {
+                diskPath: disk.diskPath,
+                usagePercent: disk.percentUsed,
+                freePercent: disk.percentFree,
+                totalBytes: disk.total,
+              };
+            },
+          );
+        }
+
+        // Add processes if available
+        if (serverResponse.processes) {
+          storageMap["processes"] = serverResponse.processes.map(
+            (process: ServerProcess) => {
+              return {
+                pid: process.pid,
+                name: process.name,
+                command: process.command,
+              };
+            },
+          );
+        }
+      }
+
+      if (
+        data.monitorType === MonitorType.SyntheticMonitor ||
+        data.monitorType === MonitorType.CustomJavaScriptCode
+      ) {
+        const customCodeResponse: CustomCodeMonitorResponse | undefined = (
+          data.dataToProcess as ProbeMonitorResponse
+        ).customCodeMonitorResponse;
+        const syntheticResponse: SyntheticMonitorResponse[] | undefined = (
+          data.dataToProcess as ProbeMonitorResponse
+        ).syntheticMonitorResponse;
+
+        storageMap = {
+          executionTimeInMs: customCodeResponse?.executionTimeInMS,
+          result: customCodeResponse?.result,
+          scriptError: customCodeResponse?.scriptError,
+          logMessages: customCodeResponse?.logMessages || [],
+          failureCause: (data.dataToProcess as ProbeMonitorResponse)
+            .failureCause,
+        } as JSONObject;
+
+        // Add synthetic monitor specific fields if available
+        if (syntheticResponse && syntheticResponse.length > 0) {
+          const firstResponse: SyntheticMonitorResponse = syntheticResponse[0]!;
+          if (firstResponse) {
+            storageMap["screenshots"] = firstResponse.screenshots;
+            storageMap["browserType"] = firstResponse.browserType;
+            storageMap["screenSizeType"] = firstResponse.screenSizeType;
+          }
+        }
+      }
+    } catch (err) {
+      logger.error(err);
+    }
+
+    logger.debug(`Storage Map: ${JSON.stringify(storageMap, null, 2)}`);
+
+    return storageMap;
+  }
+
+  /**
+   * Replace {{var}} placeholders in the given string with values from the storage map.
+   */
+  public static processTemplateString(data: {
+    value: string | undefined;
+    storageMap: JSONObject;
+  }): string {
+    try {
+      const { value, storageMap } = data;
+
+      if (!value) {
+        return "";
+      }
+
+      let replaced: string = VMUtil.replaceValueInPlace(
+        storageMap,
+        value,
+        false,
+      );
+      replaced =
+        replaced !== undefined && replaced !== null ? `${replaced}` : "";
+
+      logger.debug(`Original Value: ${data.value}`);
+      logger.debug(`Replaced Value: ${replaced}`);
+
+      return replaced;
+    } catch (err) {
+      logger.error(err);
+      return data.value || "";
+    }
+  }
+}

package/Server/Utils/VM/VMAPI.ts

@@ -82,10 +82,19 @@ export default class VMUtil {
       }
 
       for (const variable of variablesInArgument) {
-        const valueToReplaceInPlace: string = VMUtil.deepFind(
+        const foundValue: JSONValue = VMUtil.deepFind(
           storageMap as any,
           variable as any,
-        ) as string;
+        );
+
+        let valueToReplaceInPlace: string;
+
+        // Properly serialize objects to JSON strings
+        if (typeof foundValue === "object" && foundValue !== null) {
+          valueToReplaceInPlace = JSON.stringify(foundValue, null, 2);
+        } else {
+          valueToReplaceInPlace = foundValue as string;
+        }
 
         if (valueToReplaceInPlaceCopy.trim() === "{{" + variable + "}}") {
           valueToReplaceInPlaceCopy = valueToReplaceInPlace;

package/UI/Components/Graphs/ServiceDependencyGraph.tsx

@@ -14,9 +14,14 @@ import ReactFlow, {
   Position,
 } from "reactflow";
 import "reactflow/dist/style.css";
-import type { ElkExtendedEdge, ElkNode } from "elkjs";
+import type { ElkExtendedEdge, ElkNode, LayoutOptions } from "elkjs";
 import ELK from "elkjs/lib/elk.bundled.js";
 
+// Minimal interface for the ELK layout engine we rely on.
+interface ElkLayoutEngine {
+  layout: (graph: ElkNode) => Promise<ElkNode>;
+}
+
 export interface ServiceNodeData {
   id: string;
   name: string;
@@ -96,7 +101,7 @@ const ServiceDependencyGraph: FunctionComponent<ServiceDependencyGraphProps> = (
   const [rfEdges, setRfEdges] = useState<Edge[]>([]);
 
   useEffect((): void => {
-    const elk: any = new ELK();
+    const elk: ElkLayoutEngine = new ELK() as unknown as ElkLayoutEngine;
     // fixed node dimensions for layout (px)
     const NODE_WIDTH: number = 220;
     const NODE_HEIGHT: number = 56;
@@ -123,7 +128,7 @@ const ServiceDependencyGraph: FunctionComponent<ServiceDependencyGraphProps> = (
         "elk.layered.spacing.nodeNodeBetweenLayers": "120",
         "elk.spacing.nodeNode": "60",
         "elk.edgeRouting": "POLYLINE",
-      },
+      } as LayoutOptions,
       children: sortedServices.map((svc: ServiceNodeData): ElkNode => {
         return {
           id: svc.id,
@@ -142,9 +147,9 @@ const ServiceDependencyGraph: FunctionComponent<ServiceDependencyGraphProps> = (
 
     const layout: () => Promise<void> = async (): Promise<void> => {
       try {
-        const res: any = await elk.layout(elkGraph as any);
+        const res: ElkNode = (await elk.layout(elkGraph)) as ElkNode; // casting to bundled ElkNode shape
         const placedNodes: Node[] = (res.children || []).map(
-          (child: any): Node => {
+          (child: ElkNode): Node => {
             const svc: ServiceNodeData | undefined = sortedServices.find(
               (s: ServiceNodeData): boolean => {
                 return s.id === child.id;

package/UI/Components/Input/Input.tsx

@@ -64,7 +64,8 @@ const Input: FunctionComponent<ComponentProps> = (
 
   const [value, setValue] = useState<string | Date>("");
   const [displayValue, setDisplayValue] = useState<string>("");
-  const ref: any = useRef<any>(null);
+  const ref: React.MutableRefObject<HTMLInputElement | null> =
+    useRef<HTMLInputElement | null>(null);
 
   useEffect(() => {
     if (
@@ -120,9 +121,9 @@ const Input: FunctionComponent<ComponentProps> = (
   }, [value]);
 
   useEffect(() => {
-    const input: any = ref.current;
+    const input: HTMLInputElement | null = ref.current;
     if (input) {
-      (input as any).value = displayValue;
+      input.value = displayValue;
     }
   }, [ref, displayValue]);
 
@@ -195,7 +196,7 @@ const Input: FunctionComponent<ComponentProps> = (
           tabIndex={props.tabIndex}
           onKeyDown={
             props.onEnterPress
-              ? (event: any) => {
+              ? (event: React.KeyboardEvent<HTMLInputElement>) => {
                   if (event.key === "Enter") {
                     props.onEnterPress?.();
                   }

package/UI/Components/Workflow/ArgumentsForm.tsx

@@ -27,7 +27,9 @@ export interface ComponentProps {
 const ArgumentsForm: FunctionComponent<ComponentProps> = (
   props: ComponentProps,
 ): ReactElement => {
-  const formRef: any = useRef<FormProps<FormValues<JSONObject>>>(null);
+  const formRef: React.MutableRefObject<FormProps<
+    FormValues<JSONObject>
+  > | null> = useRef<FormProps<FormValues<JSONObject>> | null>(null);
   const [component, setComponent] = useState<NodeDataProp>(props.component);
   const [showVariableModal, setShowVariableModal] = useState<boolean>(false);
   const [showComponentPickerModal, setShowComponentPickerModal] =
@@ -143,7 +145,7 @@ const ArgumentsForm: FunctionComponent<ComponentProps> = (
           }}
           onSave={(variableId: string) => {
             setShowVariableModal(false);
-            formRef.current.setFieldValue(
+            formRef.current?.setFieldValue(
               selectedArgId,
               (component.arguments && component.arguments[selectedArgId]
                 ? component.arguments[selectedArgId]
@@ -161,7 +163,7 @@ const ArgumentsForm: FunctionComponent<ComponentProps> = (
           }}
           onSave={(returnValuePath: string) => {
             setShowComponentPickerModal(false);
-            formRef.current.setFieldValue(
+            formRef.current?.setFieldValue(
               selectedArgId,
               (component.arguments && component.arguments[selectedArgId]
                 ? component.arguments[selectedArgId]