@terreno/ui 0.0.1

package/src/test-utils.tsx

@@ -0,0 +1,27 @@
+import {mock} from "bun:test";
+import {render} from "@testing-library/react-native";
+import type React from "react";
+
+import {ThemeProvider} from "./Theme";
+
+export const renderWithTheme = (ui: React.ReactElement) => {
+  return render(<ThemeProvider>{ui}</ThemeProvider>);
+};
+
+export const createCommonMocks = () => ({
+  onBlur: mock(() => {}),
+  onChange: mock(() => {}),
+  onEnter: mock(() => {}),
+  onFocus: mock(() => {}),
+  onIconClick: mock(() => {}),
+  onSubmitEditing: mock(() => {}),
+});
+
+export const setupComponentTest = () => {
+  return createCommonMocks();
+};
+
+export const teardownComponentTest = () => {
+  // In Bun, mocks are automatically cleaned up
+  // No-op for compatibility
+};

package/src/types/react-native-swiper-flatlist.d.ts

@@ -0,0 +1,56 @@
+declare module "react-native-swiper-flatlist" {
+  import type {ReactNode} from "react";
+  import type {FlatListProps, StyleProp, ViewStyle} from "react-native";
+
+  export interface SwiperFlatListProps<T> extends Omit<FlatListProps<T>, "renderItem"> {
+    autoplay?: boolean;
+    autoplayDelay?: number;
+    autoplayLoop?: boolean;
+    autoplayLoopKeepAnimation?: boolean;
+    children?: ReactNode;
+    data?: T[];
+    disableGesture?: boolean;
+    index?: number;
+    onChangeIndex?: (params: {index: number; prevIndex: number}) => void;
+    onMomentumScrollEnd?: (params: {index: number}) => void;
+    onViewableItemsChanged?: (info: {
+      viewableItems: Array<{index: number | null}>;
+      changed: Array<{index: number | null}>;
+    }) => void;
+    paginationActiveColor?: string;
+    paginationDefaultColor?: string;
+    paginationStyle?: StyleProp<ViewStyle>;
+    paginationStyleItem?: StyleProp<ViewStyle>;
+    paginationStyleItemActive?: StyleProp<ViewStyle>;
+    paginationStyleItemInactive?: StyleProp<ViewStyle>;
+    renderAll?: boolean;
+    renderItem?: FlatListProps<T>["renderItem"];
+    showPagination?: boolean;
+    useReactNativeGestureHandler?: boolean;
+    vertical?: boolean;
+    viewabilityConfig?: FlatListProps<T>["viewabilityConfig"];
+    e2eID?: string;
+  }
+
+  export interface SwiperFlatListRefProps {
+    getCurrentIndex: () => number;
+    getPrevIndex: () => number;
+    goToFirstIndex: () => void;
+    goToLastIndex: () => void;
+    scrollToIndex: (params: {index: number; animated?: boolean}) => void;
+  }
+
+  export const SwiperFlatList: React.ForwardRefExoticComponent<
+    SwiperFlatListProps<any> & React.RefAttributes<SwiperFlatListRefProps>
+  >;
+
+  export const Pagination: React.FC<{
+    paginationActiveColor?: string;
+    paginationDefaultColor?: string;
+    paginationStyle?: StyleProp<ViewStyle>;
+    paginationStyleItem?: StyleProp<ViewStyle>;
+    paginationStyleItemActive?: StyleProp<ViewStyle>;
+    paginationStyleItemInactive?: StyleProp<ViewStyle>;
+    size?: number;
+  }>;
+}

package/src/useStoredState.test.tsx

@@ -0,0 +1,143 @@
+import {beforeEach, describe, expect, it, mock} from "bun:test";
+import {act, renderHook} from "@testing-library/react-native";
+
+import {Unifier} from "./Unifier";
+import {useStoredState} from "./useStoredState";
+
+// The Unifier module is mocked in bunSetup.ts with complete implementation
+
+describe("useStoredState", () => {
+  let getItemMock: ReturnType<typeof mock>;
+  let setItemMock: ReturnType<typeof mock>;
+
+  beforeEach(() => {
+    // Create fresh mocks for storage operations
+    getItemMock = mock(() => Promise.resolve(null));
+    setItemMock = mock(() => Promise.resolve());
+    Unifier.storage.getItem = getItemMock;
+    Unifier.storage.setItem = setItemMock;
+  });
+
+  it("should return initialValue and isLoading=true on initial render", async () => {
+    getItemMock = mock(
+      () => new Promise((resolve) => setTimeout(() => resolve("stored value"), 100))
+    );
+    Unifier.storage.getItem = getItemMock;
+
+    const {result} = renderHook(() => useStoredState("testKey", "initial value"));
+
+    expect(result.current[0]).toBe("initial value");
+    expect(result.current[2]).toBe(true);
+
+    await act(async () => {
+      await new Promise((resolve) => setTimeout(resolve, 200));
+    });
+
+    expect(result.current[0]).toBe("stored value");
+    expect(result.current[2]).toBe(false);
+  });
+
+  it("should update state and storage when setter is called", async () => {
+    getItemMock = mock(() => Promise.resolve("stored value"));
+    setItemMock = mock(() => Promise.resolve(undefined));
+    Unifier.storage.getItem = getItemMock;
+    Unifier.storage.setItem = setItemMock;
+
+    const {result} = renderHook(() => useStoredState("testKey", "initial value"));
+
+    await act(async () => {
+      await new Promise((resolve) => setTimeout(resolve, 10));
+    });
+
+    await act(async () => {
+      await result.current[1]("new value");
+    });
+
+    expect(result.current[0]).toBe("new value");
+
+    expect(setItemMock).toHaveBeenCalledWith("testKey", "new value");
+  });
+
+  it("should handle errors when reading from storage", async () => {
+    const originalConsoleError = console.error;
+    console.error = mock(() => {});
+
+    getItemMock = mock(() => Promise.reject(new Error("Storage error")));
+    Unifier.storage.getItem = getItemMock;
+
+    const {result} = renderHook(() => useStoredState("testKey", "initial value"));
+
+    await act(async () => {
+      await new Promise((resolve) => setTimeout(resolve, 10));
+    });
+
+    expect(result.current[0]).toBe("initial value");
+    expect(result.current[2]).toBe(false);
+    expect(console.error).toHaveBeenCalled();
+
+    console.error = originalConsoleError;
+  });
+
+  it("should handle errors when writing to storage", async () => {
+    const originalConsoleError = console.error;
+    console.error = mock(() => {});
+
+    getItemMock = mock(() => Promise.resolve("stored value"));
+    setItemMock = mock(() => Promise.reject(new Error("Storage error")));
+    Unifier.storage.getItem = getItemMock;
+    Unifier.storage.setItem = setItemMock;
+
+    const {result} = renderHook(() => useStoredState("testKey", "initial value"));
+
+    await act(async () => {
+      await new Promise((resolve) => setTimeout(resolve, 10));
+    });
+
+    await act(async () => {
+      await result.current[1]("new value");
+    });
+
+    expect(result.current[0]).toBe("stored value");
+    expect(console.error).toHaveBeenCalled();
+
+    console.error = originalConsoleError;
+  });
+
+  it("should handle undefined initialValue", async () => {
+    getItemMock = mock(() => Promise.resolve(null));
+    Unifier.storage.getItem = getItemMock;
+
+    const {result} = renderHook(() => useStoredState("testKey"));
+
+    expect(result.current[0]).toBeUndefined();
+    expect(result.current[2]).toBe(true);
+
+    await act(async () => {
+      await new Promise((resolve) => setTimeout(resolve, 10));
+    });
+
+    expect(result.current[0]).toBeNull();
+    expect(result.current[2]).toBe(false);
+  });
+
+  it("should not update state if component unmounts before storage resolves", async () => {
+    getItemMock = mock(
+      () => new Promise((resolve) => setTimeout(() => resolve("stored value"), 100))
+    );
+    Unifier.storage.getItem = getItemMock;
+
+    const {result, unmount} = renderHook(() => useStoredState("testKey", "initial value"));
+
+    expect(result.current[0]).toBe("initial value");
+    expect(result.current[2]).toBe(true);
+
+    unmount();
+
+    await act(async () => {
+      await new Promise((resolve) => setTimeout(resolve, 200));
+    });
+
+    expect(result.current[0]).toBe("initial value");
+    expect(result.current[2]).toBe(true);
+  });
+});

package/src/useStoredState.ts

@@ -0,0 +1,56 @@
+import {useCallback, useEffect, useRef, useState} from "react";
+
+import {Unifier} from "./Unifier";
+
+export const useStoredState = <T>(
+  key: string,
+  initialValue?: T
+): [T | undefined, (value: T | undefined) => Promise<void>, boolean] => {
+  const [state, setState] = useState<T | undefined>(initialValue);
+  const [isLoading, setIsLoading] = useState(true);
+  const isMounted = useRef(true);
+
+  // Function to fetch data from AsyncStorage
+  const fetchData = useCallback(async (): Promise<T | undefined> => {
+    try {
+      return await Unifier.storage.getItem(key);
+    } catch (error) {
+      console.error("Error reading data from AsyncStorage:", error);
+      return initialValue;
+    }
+  }, [initialValue, key]);
+
+  // Fetch data when the component mounts
+  useEffect(() => {
+    void fetchData()
+      .then((value) => {
+        if (isMounted.current) {
+          setState(value);
+          setIsLoading(false);
+        }
+      })
+      .catch((error) => {
+        console.error("Error fetching data:", error);
+        if (isMounted.current) {
+          setIsLoading(false);
+        }
+      });
+
+    return () => {
+      isMounted.current = false;
+    };
+  }, [fetchData]);
+
+  const setAsyncStorageState = async (newValue: T | undefined): Promise<void> => {
+    try {
+      await Unifier.storage.setItem(key, newValue);
+      if (isMounted.current) {
+        setState(newValue);
+      }
+    } catch (error) {
+      console.error("Error writing data to AsyncStorage:", error);
+    }
+  };
+
+  return [state, setAsyncStorageState, isLoading];
+};