numeric embedded fields

Author: benlife5

packages/visual-editor/src/editor/EmbeddedFieldStringInput.test.tsx

@@ -361,3 +361,125 @@ describe("EmbeddedFieldStringInput", () => {
     expect(toast.warning).not.toHaveBeenCalled();
   });
 });
+
+describe("numeric embedded entity fields", () => {
+  it("offers root and linked numeric fields and inserts a linked decimal path", () => {
+    render(
+      <TemplatePropsContext.Provider
+        value={{
+          document: {
+            yearEstablished: 2006,
+            rating: 4.5,
+            c_linkedProducts: [
+              {
+                price: {
+                  value: 19.95,
+                },
+              },
+            ],
+          },
+        }}
+      >
+        <TemplateMetadataContext.Provider value={generateTemplateMetadata()}>
+          <EntityFieldsContext.Provider
+            value={{
+              fields: [
+                {
+                  name: "yearEstablished",
+                  displayName: "Year Established",
+                  definition: {
+                    name: "yearEstablished",
+                    typeRegistryId: "type.integer",
+                    type: {
+                      numberType: "NUMBER_TYPE_INT",
+                    },
+                  },
+                },
+                {
+                  name: "rating",
+                  displayName: "Rating",
+                  definition: {
+                    name: "rating",
+                    typeRegistryId: "type.float",
+                    type: {
+                      numberType: "NUMBER_TYPE_FLOAT",
+                    },
+                  },
+                },
+                {
+                  name: "c_linkedProducts",
+                  displayName: "Linked Products",
+                  definition: {
+                    name: "c_linkedProducts",
+                    typeRegistryId: "type.entity_reference",
+                    type: {
+                      documentType: "DOCUMENT_TYPE_ENTITY",
+                    },
+                    isList: true,
+                  },
+                  children: {
+                    fields: [
+                      {
+                        name: "price",
+                        displayName: "Price",
+                        definition: {
+                          name: "price",
+                          typeRegistryId: "type.price",
+                          type: {
+                            objectType: "OBJECT_TYPE_DEFAULT",
+                          },
+                        },
+                        children: {
+                          fields: [
+                            {
+                              name: "value",
+                              displayName: "Value",
+                              definition: {
+                                name: "value",
+                                typeRegistryId: "type.decimal",
+                                type: {
+                                  stringType: "STRING_TYPE_DECIMAL",
+                                },
+                              },
+                            },
+                          ],
+                        },
+                      },
+                    ],
+                  },
+                },
+              ],
+              displayNames: {
+                yearEstablished: "Year Established",
+                rating: "Rating",
+                c_linkedProducts: "Linked Products",
+                "c_linkedProducts.price": "Linked Products > Price",
+                "c_linkedProducts.price.value":
+                  "Linked Products > Price > Value",
+              },
+            }}
+          >
+            <EmbeddedFieldStringInputFromEntity
+              filter={{ types: ["type.string"] }}
+              onChange={() => undefined}
+              showFieldSelector={true}
+              value=""
+            />
+          </EntityFieldsContext.Provider>
+        </TemplateMetadataContext.Provider>
+      </TemplatePropsContext.Provider>
+    );
+
+    fireEvent.click(screen.getByLabelText("Add entity field"));
+
+    expect(screen.getByText("Year Established")).toBeDefined();
+    expect(screen.getByText("Rating")).toBeDefined();
+    expect(screen.getByText("Linked Products > Price > Value")).toBeDefined();
+
+    fireEvent.click(screen.getByText("Linked Products > Price > Value"));
+
+    expect(
+      screen.getByDisplayValue("[[c_linkedProducts.price.value]]")
+    ).toBeDefined();
+  });
+});

packages/visual-editor/src/editor/EmbeddedFieldStringInput.tsx

@@ -1,5 +1,8 @@
 import React from "react";
-import { RenderEntityFieldFilter } from "../internal/utils/getFilteredEntityFields.ts";
+import {
+  type EntityFieldTypes,
+  type RenderEntityFieldFilter,
+} from "../internal/utils/getFilteredEntityFields.ts";
 import {
   getEntityFieldScopeDisplayName,
   getScopedEntityFieldDisplayName,
@@ -40,6 +43,31 @@ export type EmbeddedStringOption = {
   value: string;
 };
 
+const NUMERIC_EMBEDDED_FIELD_TYPES: EntityFieldTypes[] = [
+  "type.decimal",
+  "type.float",
+  "type.integer",
+];
+
+/**
+ * Numeric fields are valid in embedded text because their values are converted
+ * to strings. Avoid passings numbers directly to components expecting strings.
+ */
+const getEmbeddedStringFilter = <T extends Record<string, any>>(
+  filter: RenderEntityFieldFilter<T>
+): RenderEntityFieldFilter<T> => {
+  if (!filter.types?.includes("type.string")) {
+    return filter;
+  }
+
+  return {
+    ...filter,
+    types: Array.from(
+      new Set([...filter.types, ...NUMERIC_EMBEDDED_FIELD_TYPES])
+    ),
+  };
+};
+
 /**
  * Resolves the object scope that embedded linked-field previews should read
  * from.
@@ -115,7 +143,7 @@ export const EmbeddedFieldStringInputFromEntity = <
   const entityFieldOptions = React.useMemo(() => {
     const filteredEntityFields = getFieldsForSelector(
       entityFields,
-      filter,
+      getEmbeddedStringFilter(filter),
       streamDocument,
       sourceField || undefined
     );

packages/visual-editor/src/internal/utils/getFilteredEntityFields.test.ts

@@ -1679,3 +1679,70 @@ const mockEntityFields: YextSchemaField[] = [
 const mockStreamFields: StreamFields = {
   fields: mockEntityFields,
 };
+
+const numericStreamFields: StreamFields = {
+  fields: [
+    {
+      name: "name",
+      definition: {
+        name: "name",
+        typeRegistryId: "type.string",
+        type: {
+          stringType: "STRING_TYPE_DEFAULT",
+        },
+      },
+    },
+    {
+      name: "price",
+      definition: {
+        name: "price",
+        typeRegistryId: "type.decimal",
+        type: {
+          stringType: "STRING_TYPE_DECIMAL",
+        },
+      },
+    },
+    {
+      name: "rating",
+      definition: {
+        name: "rating",
+        typeRegistryId: "type.float",
+        type: {
+          numberType: "NUMBER_TYPE_FLOAT",
+        },
+      },
+    },
+    {
+      name: "yearEstablished",
+      definition: {
+        name: "yearEstablished",
+        typeRegistryId: "type.integer",
+        type: {
+          numberType: "NUMBER_TYPE_INT",
+        },
+      },
+    },
+  ],
+};
+
+describe("numeric entity field filtering", () => {
+  test("recognizes decimal, float, and integer schema types", () => {
+    const fields = getFilteredEntityFields(numericStreamFields, {
+      types: ["type.decimal", "type.float", "type.integer"],
+    });
+
+    expect(fields.map((field) => field.name)).toEqual([
+      "price",
+      "rating",
+      "yearEstablished",
+    ]);
+  });
+
+  test("keeps generic string filters string-only", () => {
+    const fields = getFilteredEntityFields(numericStreamFields, {
+      types: ["type.string"],
+    });
+
+    expect(fields.map((field) => field.name)).toEqual(["name"]);
+  });
+});

packages/visual-editor/src/internal/utils/getFilteredEntityFields.ts

@@ -38,6 +38,9 @@ export type RenderEntityFieldFilter<T extends Record<string, any>> =
 
 export type EntityFieldTypes =
   | "type.string"
+  | "type.decimal"
+  | "type.float"
+  | "type.integer"
   | "type.image"
   | "type.hours"
   | "type.address"

packages/visual-editor/src/utils/resolveYextEntityField.test.ts

@@ -1,5 +1,6 @@
 import { assert, describe, it } from "vitest";
 import {
+  resolveEmbeddedFieldsInString,
   resolveField,
   resolveYextEntityField,
 } from "./resolveYextEntityField.ts";
@@ -349,3 +350,41 @@ describe("resolveYextEntityField with embedded fields", () => {
     );
   });
 });
+
+describe("numeric embedded field resolution", () => {
+  it("resolves root numeric primitives as unformatted text", () => {
+    const resolved = resolveEmbeddedFieldsInString(
+      "[[zero]] [[negative]] [[integer]] [[decimal]]",
+      {
+        zero: 0,
+        negative: -12,
+        integer: 42,
+        decimal: 19.95,
+      }
+    );
+
+    assert.equal(resolved, "0 -12 42 19.95");
+  });
+
+  it("resolves a decimal through the first linked entity", () => {
+    const resolved = resolveEmbeddedFieldsInString(
+      "[[c_linkedProducts.price.value]]",
+      {
+        c_linkedProducts: [
+          {
+            price: {
+              value: 19.95,
+            },
+          },
+          {
+            price: {
+              value: 29.95,
+            },
+          },
+        ],
+      }
+    );
+
+    assert.equal(resolved, "19.95");
+  });
+});

packages/visual-editor/src/utils/resolveYextEntityField.ts

@@ -86,6 +86,10 @@ export const resolveEmbeddedFieldsInString = (
       return "";
     }
 
+    if (typeof resolvedValue === "number") {
+      return resolvedValue.toString();
+    }
+
     // If the resolved value is an object, stringify it.
     if (typeof resolvedValue === "object") {
       return JSON.stringify(resolvedValue);