More PR feedback and code cleanup

Author: dannyroosevelt

packages/connect-react/src/components/ControlSelect.tsx

@@ -21,6 +21,7 @@ import {
   isOptionWithLabel,
   sanitizeOption,
 } from "../utils/type-guards";
+import { isLabelValueWrapped } from "../utils/label-value";
 import { LoadMoreButton } from "./LoadMoreButton";
 
 // XXX T and ConfigurableProp should be related
@@ -91,14 +92,10 @@ export function ControlSelect<T extends PropOptionValue>({
         return rawValue.map((o) =>
           selectOptions.find((item) => item.value === o) || sanitizeOption(o as T));
       }
-    } else if (rawValue && typeof rawValue === "object" && "__lv" in (rawValue as Record<string, unknown>)) {
+    } else if (isLabelValueWrapped(rawValue)) {
       // Extract the actual option from __lv wrapper and sanitize to LV
       // Handle both single objects and arrays wrapped in __lv
       const lvContent = (rawValue as Record<string, unknown>).__lv;
-      if (!lvContent) {
-        console.warn("Invalid __lv content:", rawValue);
-        return null;
-      }
       if (Array.isArray(lvContent)) {
         return lvContent.map((item) => sanitizeOption(item as T));
       }

packages/connect-react/src/hooks/form-context.tsx

@@ -36,6 +36,7 @@ import {
 } from "../types";
 import { resolveUserId } from "../utils/resolve-user-id";
 import { isConfigurablePropOfType } from "../utils/type-guards";
+import { hasLabelValueFormat } from "../utils/label-value";
 
 export type AnyFormFieldContext = Omit<FormFieldContext<ConfigurableProp>, "onChange"> & {
   onChange: (value: unknown) => void;
@@ -300,7 +301,6 @@ export const FormContextProvider = <T extends ConfigurableProps>({
     component.key,
     configurableProps,
     configuredProps,
-    enabledOptionalProps,
   ]);
 
   // these validations are necessary because they might override PropInput for number case for instance
@@ -450,11 +450,7 @@ export const FormContextProvider = <T extends ConfigurableProps>({
           // IMPORTANT: Integer props with remote options (like IDs) can be stored in __lv format
           // to preserve the display label. We only delete the value if it's NOT in __lv format
           // AND not a number, which indicates invalid/corrupted data.
-          const isLabelValue = value && typeof value === "object" && "__lv" in value;
-          const isArrayOfLabelValues = Array.isArray(value) && value.length > 0 &&
-            value.every((item) => item && typeof item === "object" && "__lv" in item);
-
-          if (!(isLabelValue || isArrayOfLabelValues)) {
+          if (!hasLabelValueFormat(value)) {
             delete newConfiguredProps[prop.name as keyof ConfiguredProps<T>];
           } else {
             newConfiguredProps[prop.name as keyof ConfiguredProps<T>] = value;

packages/connect-react/src/utils/label-value.ts

@@ -0,0 +1,57 @@
+/**
+ * Utilities for detecting and handling label-value (__lv) format
+ * used by Pipedream components to preserve display labels for option values
+ */
+
+/**
+ * Checks if a value is wrapped in the __lv format
+ * @param value - The value to check
+ * @returns true if value is an object with __lv property containing valid data
+ *
+ * @example
+ * isLabelValueWrapped({ __lv: { label: "Option 1", value: 123 } }) // true
+ * isLabelValueWrapped({ __lv: null }) // false
+ * isLabelValueWrapped({ value: 123 }) // false
+ */
+export function isLabelValueWrapped(value: unknown): boolean {
+  if (!value || typeof value !== "object") return false;
+  if (!("__lv" in value)) return false;
+
+  const lvContent = (value as Record<string, unknown>).__lv;
+  return lvContent != null;
+}
+
+/**
+ * Checks if a value is an array of __lv wrapped objects
+ * @param value - The value to check
+ * @returns true if value is an array of valid __lv wrapped objects
+ *
+ * @example
+ * isArrayOfLabelValueWrapped([{ __lv: { label: "A", value: 1 } }]) // true
+ * isArrayOfLabelValueWrapped([]) // false
+ * isArrayOfLabelValueWrapped([{ value: 1 }]) // false
+ */
+export function isArrayOfLabelValueWrapped(value: unknown): boolean {
+  if (!Array.isArray(value)) return false;
+  if (value.length === 0) return false;
+
+  return value.every((item) =>
+    item &&
+    typeof item === "object" &&
+    "__lv" in item &&
+    (item as Record<string, unknown>).__lv != null);
+}
+
+/**
+ * Checks if a value has the label-value format (either single or array)
+ * @param value - The value to check
+ * @returns true if value is in __lv format (single or array)
+ *
+ * @example
+ * hasLabelValueFormat({ __lv: { label: "A", value: 1 } }) // true
+ * hasLabelValueFormat([{ __lv: { label: "A", value: 1 } }]) // true
+ * hasLabelValueFormat({ value: 1 }) // false
+ */
+export function hasLabelValueFormat(value: unknown): boolean {
+  return isLabelValueWrapped(value) || isArrayOfLabelValueWrapped(value);
+}