@terreno/ui 0.10.0 → 0.11.1

package/src/Utilities.test.tsx

@@ -1,8 +1,10 @@
 import {describe, expect, it} from "bun:test";
 
 import {
+  bind,
   concat,
   findAddressComponent,
+  formattedCountyCode,
   fromClassName,
   fromInlineStyle,
   iconNumberToSize,
@@ -11,10 +13,16 @@ import {
   isNative,
   isTestUser,
   isValidGoogleApiKey,
+  mapClassName,
+  mapping,
   mergeInlineStyles,
   printAPIError,
   processAddressComponents,
+  range,
+  rangeWithoutZero,
+  toggle,
   toProps,
+  union,
 } from "./Utilities";
 
 describe("Utilities", () => {
@@ -30,6 +38,11 @@ describe("Utilities", () => {
       const result = mergeInlineStyles(undefined, {color: "red"});
       expect(result.__style).toEqual({color: "red"});
     });
+
+    it("handles undefined new style", () => {
+      const result = mergeInlineStyles({__style: {color: "red"}}, undefined);
+      expect(result.__style).toEqual({color: "red"});
+    });
   });
 
   describe("isTestUser", () => {
@@ -48,6 +61,10 @@ describe("Utilities", () => {
     it("returns falsy for undefined profile", () => {
       expect(isTestUser(undefined)).toBeFalsy();
     });
+
+    it("returns falsy for profile without email", () => {
+      expect(isTestUser({} as any)).toBeFalsy();
+    });
   });
 
   describe("iconNumberToSize", () => {
@@ -74,6 +91,10 @@ describe("Utilities", () => {
     it("returns lg for default size (16)", () => {
       expect(iconNumberToSize()).toBe("lg");
     });
+
+    it("returns xs for zero", () => {
+      expect(iconNumberToSize(0)).toBe("xs");
+    });
   });
 
   describe("Style utilities", () => {
@@ -91,6 +112,11 @@ describe("Utilities", () => {
         expect(result.className.has("class1")).toBe(true);
         expect(result.className.has("class2")).toBe(true);
       });
+
+      it("supports empty className list", () => {
+        const result = fromClassName();
+        expect(result.className.size).toBe(0);
+      });
     });
 
     describe("fromInlineStyle", () => {
@@ -110,6 +136,29 @@ describe("Utilities", () => {
         expect(result.className.has("class2")).toBe(true);
         expect(result.inlineStyle.color).toBe("red");
       });
+
+      it("concatenates with identity element", () => {
+        const style = fromClassName("a");
+        const result = concat([identity(), style]);
+        expect(result.className.has("a")).toBe(true);
+      });
+    });
+
+    describe("mapClassName", () => {
+      it("maps class names through a function", () => {
+        const prefix = mapClassName((name: string) => `prefix-${name}`);
+        const style = fromClassName("foo", "bar");
+        const result = prefix(style);
+        expect(result.className.has("prefix-foo")).toBe(true);
+        expect(result.className.has("prefix-bar")).toBe(true);
+      });
+
+      it("preserves inline styles", () => {
+        const prefix = mapClassName((name: string) => `prefix-${name}`);
+        const style = fromInlineStyle({color: "red"});
+        const result = prefix(style);
+        expect(result.inlineStyle.color).toBe("red");
+      });
     });
 
     describe("toProps", () => {
@@ -132,6 +181,88 @@ describe("Utilities", () => {
         expect(props.style).toBeUndefined();
       });
     });
+
+    describe("toggle", () => {
+      it("returns style with classnames when val is true", () => {
+        const toggleFn = toggle("active", "enabled");
+        const result = toggleFn(true);
+        expect(result.className.has("active")).toBe(true);
+        expect(result.className.has("enabled")).toBe(true);
+      });
+
+      it("returns identity when val is false", () => {
+        const toggleFn = toggle("active");
+        const result = toggleFn(false);
+        expect(result.className.size).toBe(0);
+      });
+
+      it("returns identity when val is undefined", () => {
+        const toggleFn = toggle("active");
+        const result = toggleFn();
+        expect(result.className.size).toBe(0);
+      });
+    });
+
+    describe("mapping", () => {
+      it("maps string to classname", () => {
+        const map = mapping({large: "size-large", small: "size-small"});
+        const result = map("small");
+        expect(result.className.has("size-small")).toBe(true);
+      });
+
+      it("returns identity for unknown key", () => {
+        const map = mapping({small: "size-small"});
+        const result = map("unknown");
+        expect(result.className.size).toBe(0);
+      });
+    });
+
+    describe("range", () => {
+      it("creates classname from positive number", () => {
+        const result = range("padding")(3);
+        expect(result.className.has("padding3")).toBe(true);
+      });
+
+      it("creates classname from negative number with N prefix", () => {
+        const result = range("margin")(-2);
+        expect(result.className.has("marginN2")).toBe(true);
+      });
+
+      it("creates classname from zero", () => {
+        const result = range("padding")(0);
+        expect(result.className.has("padding0")).toBe(true);
+      });
+    });
+
+    describe("rangeWithoutZero", () => {
+      it("creates classname for non-zero", () => {
+        const result = rangeWithoutZero("padding")(2);
+        expect(result.className.has("padding2")).toBe(true);
+      });
+
+      it("returns identity for zero", () => {
+        const result = rangeWithoutZero("padding")(0);
+        expect(result.className.size).toBe(0);
+      });
+    });
+
+    describe("bind", () => {
+      it("binds a functor to a scope", () => {
+        const scope: {[key: string]: string} = {padding2: "scoped-padding"};
+        const bound = bind(range("padding"), scope);
+        const result = bound(2);
+        expect(result.className.has("scoped-padding")).toBe(true);
+      });
+    });
+
+    describe("union", () => {
+      it("combines multiple functors", () => {
+        const combined = union(toggle("a"), toggle("b"));
+        const result = combined(true);
+        expect(result.className.has("a")).toBe(true);
+        expect(result.className.has("b")).toBe(true);
+      });
+    });
   });
 
   describe("isNative", () => {
@@ -155,6 +286,10 @@ describe("Utilities", () => {
     it("returns empty string for missing type", () => {
       expect(findAddressComponent(components, "country")).toBe("");
     });
+
+    it("returns empty string when components is empty", () => {
+      expect(findAddressComponent([], "locality")).toBe("");
+    });
   });
 
   describe("processAddressComponents", () => {
@@ -163,6 +298,7 @@ describe("Utilities", () => {
       {long_name: "Main Street", short_name: "Main St", types: ["route"]},
       {long_name: "Boston", short_name: "Boston", types: ["locality"]},
       {long_name: "Massachusetts", short_name: "MA", types: ["administrative_area_level_1"]},
+      {long_name: "Suffolk County", short_name: "Suffolk", types: ["administrative_area_level_2"]},
       {long_name: "02101", short_name: "02101", types: ["postal_code"]},
     ];
 
@@ -183,11 +319,32 @@ describe("Utilities", () => {
       const result = processAddressComponents(undefined);
       expect(result.address1).toBe("");
     });
+
+    it("handles empty components with includeCounty", () => {
+      const result = processAddressComponents([], {includeCounty: true}) as any;
+      expect(result.countyName).toBe("");
+      expect(result.countyCode).toBe("");
+    });
+
+    it("handles components with includeCounty when county is present", () => {
+      const result = processAddressComponents(components, {includeCounty: true}) as any;
+      expect(result.countyName).toBe("Suffolk County");
+    });
+
+    it("handles components with includeCounty when county is missing", () => {
+      const componentsWithoutCounty = components.filter(
+        (c) => !c.types.includes("administrative_area_level_2")
+      );
+      const result = processAddressComponents(componentsWithoutCounty, {
+        includeCounty: true,
+      }) as any;
+      expect(result.countyName).toBe("");
+    });
   });
 
   describe("isValidGoogleApiKey", () => {
     it("returns true for valid-looking API key", () => {
-      expect(isValidGoogleApiKey("AIzaSyD-9tSrke72PouQMnMX-a7eZSW0jkFMBWY")).toBe(true);
+      expect(isValidGoogleApiKey("test-dummy-key-not-real-0123456789")).toBe(true);
     });
 
     it("returns false for empty string", () => {
@@ -198,8 +355,30 @@ describe("Utilities", () => {
       expect(isValidGoogleApiKey("short")).toBe(false);
     });
 
+    it("returns false for too long key", () => {
+      expect(isValidGoogleApiKey("a".repeat(51))).toBe(false);
+    });
+
     it("returns false for key with invalid characters", () => {
-      expect(isValidGoogleApiKey("invalid key with spaces!!!")).toBe(false);
+      expect(isValidGoogleApiKey("invalid key with spaces and special!!!!")).toBe(false);
+    });
+
+    it("returns false when passed a non-string value", () => {
+      expect(isValidGoogleApiKey(123 as any)).toBe(false);
+    });
+
+    it("returns false for whitespace-only key", () => {
+      expect(isValidGoogleApiKey("                                  ")).toBe(false);
+    });
+  });
+
+  describe("formattedCountyCode", () => {
+    it("returns empty string for unknown state/county", () => {
+      expect(formattedCountyCode("Nowhere", "Nothing")).toBe("");
+    });
+
+    it("handles missing county data gracefully", () => {
+      expect(formattedCountyCode("Massachusetts", "Fake County")).toBe("");
     });
   });
 
@@ -216,6 +395,10 @@ describe("Utilities", () => {
     it("returns falsy for null", () => {
       expect(isAPIError(null)).toBeFalsy();
     });
+
+    it("returns falsy for undefined", () => {
+      expect(isAPIError(undefined)).toBeFalsy();
+    });
   });
 
   describe("printAPIError", () => {
@@ -233,5 +416,10 @@ describe("Utilities", () => {
       const error = {data: {detail: "Resource does not exist", title: "Not Found"}};
       expect(printAPIError(error as any, false)).toBe("Not Found");
     });
+
+    it("prints title when detail is missing", () => {
+      const error = {data: {title: "Not Found"}};
+      expect(printAPIError(error as any, true)).toBe("Not Found");
+    });
   });
 });

package/src/WebAddressAutocomplete.test.tsx

@@ -1,4 +1,7 @@
-import {describe, expect, it} from "bun:test";
+import {afterEach, beforeEach, describe, expect, it, mock} from "bun:test";
+import {act, fireEvent} from "@testing-library/react-native";
+
+import type {AddressInterface} from "./Common";
 import {renderWithTheme} from "./test-utils";
 import {WebAddressAutocomplete} from "./WebAddressAutocomplete";
 
@@ -30,4 +33,148 @@ describe("WebAddressAutocomplete", () => {
     const {toJSON} = renderWithTheme(<WebAddressAutocomplete {...defaultProps} disabled />);
     expect(toJSON()).toMatchSnapshot();
   });
+
+  it("renders without calling handleAutoCompleteChange until a place is selected", () => {
+    const handleAutoCompleteChange = mock((_arg: AddressInterface) => {});
+    renderWithTheme(
+      <WebAddressAutocomplete
+        {...defaultProps}
+        handleAutoCompleteChange={handleAutoCompleteChange}
+      />
+    );
+    expect(handleAutoCompleteChange).not.toHaveBeenCalled();
+  });
+
+  it("renders with includeCounty flag", () => {
+    const {toJSON} = renderWithTheme(<WebAddressAutocomplete {...defaultProps} includeCounty />);
+    expect(toJSON()).toMatchSnapshot();
+  });
+
+  describe("with Google Maps available", () => {
+    interface PlaceResult {
+      address_components: {
+        long_name: string;
+        short_name: string;
+        types: string[];
+      }[];
+    }
+
+    interface GoogleMapsWindow {
+      google?: {
+        maps?: {
+          places?: {
+            Autocomplete?: unknown;
+          };
+        };
+      };
+      [key: string]: unknown;
+    }
+
+    interface MinimalDocument {
+      createElement: (tag: string) => HTMLScriptElement;
+      head: {appendChild: (node: unknown) => void};
+    }
+
+    interface TestGlobals {
+      window?: GoogleMapsWindow;
+      document?: MinimalDocument;
+    }
+
+    const testGlobal = globalThis as TestGlobals;
+    const originalWindow = testGlobal.window;
+    const originalDocument = testGlobal.document;
+
+    let listeners: Record<string, () => void>;
+    let placeResult: PlaceResult | null;
+    let autocompleteConstructor: ReturnType<typeof mock>;
+
+    beforeEach(() => {
+      listeners = {};
+      placeResult = null;
+
+      autocompleteConstructor = mock((_input: unknown, _opts: unknown) => ({
+        addListener: (event: string, cb: () => void) => {
+          listeners[event] = cb;
+        },
+        getPlace: () => placeResult,
+      }));
+
+      testGlobal.window = {
+        google: {
+          maps: {
+            places: {
+              Autocomplete: autocompleteConstructor,
+            },
+          },
+        },
+      };
+      testGlobal.document =
+        originalDocument ??
+        ({
+          createElement: () => ({}) as HTMLScriptElement,
+          head: {appendChild: () => {}},
+        } satisfies MinimalDocument);
+    });
+
+    afterEach(() => {
+      // Leave a minimal window so React's effect cleanup (which assigns
+      // `window[callbackName] = null`) does not blow up after teardown.
+      testGlobal.window = originalWindow ?? {};
+      testGlobal.document = originalDocument;
+    });
+
+    it("initializes the Autocomplete and wires up the place_changed listener", async () => {
+      const handleAutoCompleteChange = mock((_arg: AddressInterface) => {});
+      renderWithTheme(
+        <WebAddressAutocomplete
+          googleMapsApiKey="test-key"
+          handleAddressChange={() => {}}
+          handleAutoCompleteChange={handleAutoCompleteChange}
+          inputValue=""
+        />
+      );
+
+      await act(async () => {
+        await new Promise((resolve) => setTimeout(resolve, 0));
+      });
+
+      expect(autocompleteConstructor).toHaveBeenCalled();
+      expect(typeof listeners.place_changed).toBe("function");
+
+      // Simulate a selected place.
+      placeResult = {
+        address_components: [
+          {long_name: "5", short_name: "5", types: ["street_number"]},
+          {long_name: "Elm", short_name: "Elm", types: ["route"]},
+          {long_name: "Oakland", short_name: "OAK", types: ["locality"]},
+          {long_name: "California", short_name: "CA", types: ["administrative_area_level_1"]},
+          {long_name: "94601", short_name: "94601", types: ["postal_code"]},
+        ],
+      };
+      listeners.place_changed();
+      expect(handleAutoCompleteChange).toHaveBeenCalled();
+    });
+
+    it("invokes handleAddressChange from the fallback TextField's onChange", async () => {
+      const handleAddressChange = mock(() => {});
+      const {UNSAFE_getAllByType} = renderWithTheme(
+        <WebAddressAutocomplete
+          googleMapsApiKey="test-key"
+          handleAddressChange={handleAddressChange}
+          handleAutoCompleteChange={() => {}}
+          inputValue=""
+        />
+      );
+
+      await act(async () => {
+        await new Promise((resolve) => setTimeout(resolve, 0));
+      });
+
+      const {TextInput} = require("react-native");
+      const inputs = UNSAFE_getAllByType(TextInput);
+      expect(inputs.length).toBeGreaterThan(0);
+      fireEvent.changeText(inputs[0], "321 Pine");
+      expect(handleAddressChange).toHaveBeenCalledWith("321 Pine");
+    });
+  });
 });