@shopify/flash-list 2.0.4-alpha.1 → 2.2.0

package/src/__tests__/helpers/createLayoutManager.ts

@@ -1,141 +0,0 @@
-/* eslint-disable @shopify/typescript/prefer-pascal-case-enums */
-import {
-  LayoutParams,
-  RVDimension,
-  RVLayout,
-  RVLayoutInfo,
-  RVLayoutManager,
-} from "../../recyclerview/layout-managers/LayoutManager";
-import { RVLinearLayoutManagerImpl } from "../../recyclerview/layout-managers/LinearLayoutManager";
-import { RVGridLayoutManagerImpl } from "../../recyclerview/layout-managers/GridLayoutManager";
-import { RVMasonryLayoutManagerImpl } from "../../recyclerview/layout-managers/MasonryLayoutManager";
-
-/**
- * Layout manager types available in the app
- */
-export enum LayoutManagerType {
-  LINEAR = "linear",
-  GRID = "grid",
-  MASONRY = "masonry",
-}
-
-/**
- * Default window size for layout managers
- */
-const DEFAULT_WINDOW_SIZE: RVDimension = {
-  width: 400,
-  height: 900,
-};
-
-/**
- * Create layout parameters with sensible defaults
- */
-export function createLayoutParams(
-  params: Partial<LayoutParams> = {}
-): LayoutParams {
-  return {
-    windowSize: params.windowSize || DEFAULT_WINDOW_SIZE,
-    horizontal: params.horizontal ?? false,
-    maxColumns: params.maxColumns ?? 1,
-    optimizeItemArrangement: params.optimizeItemArrangement ?? true,
-    overrideItemLayout: params.overrideItemLayout ?? (() => {}),
-    getItemType: params.getItemType ?? (() => "default"),
-  };
-}
-
-/**
- * Create a layout manager of the specified type
- */
-export function createLayoutManager(
-  type: LayoutManagerType,
-  params: Partial<LayoutParams> = {},
-  previousLayoutManager?: RVLayoutManager
-): RVLayoutManager {
-  const layoutParams = createLayoutParams(params);
-
-  switch (type) {
-    case LayoutManagerType.LINEAR:
-      return new RVLinearLayoutManagerImpl(layoutParams, previousLayoutManager);
-    case LayoutManagerType.GRID:
-      return new RVGridLayoutManagerImpl(layoutParams, previousLayoutManager);
-    case LayoutManagerType.MASONRY:
-      return new RVMasonryLayoutManagerImpl(
-        layoutParams,
-        previousLayoutManager
-      );
-    default:
-      throw new Error(`Unknown layout manager type: ${type}`);
-  }
-}
-
-/**
- * Generate mock layout info for testing
- */
-export function createMockLayoutInfo(
-  index: number,
-  width: number,
-  height: number
-): RVLayoutInfo {
-  return {
-    index,
-    dimensions: {
-      width,
-      height,
-    },
-  };
-}
-
-/**
- * Populate layout data in a layout manager
- */
-export function populateLayouts(
-  layoutManager: RVLayoutManager,
-  itemCount: number,
-  itemWidth = 100,
-  itemHeight = 100,
-  variableSize = false
-): void {
-  const layoutInfos: RVLayoutInfo[] = [];
-
-  for (let i = 0; i < itemCount; i++) {
-    // If variableSize is true, add some randomness to the item dimensions
-    const width = variableSize ? itemWidth + (i % 3) * 20 : itemWidth;
-    const height = variableSize ? itemHeight + (i % 5) * 25 : itemHeight;
-
-    layoutInfos.push(createMockLayoutInfo(i, width, height));
-  }
-
-  layoutManager.modifyLayout(layoutInfos, itemCount);
-}
-
-/**
- * Create and populate a layout manager in one step
- */
-export function createPopulatedLayoutManager(
-  type: LayoutManagerType,
-  itemCount: number,
-  params: Partial<LayoutParams> = {},
-  itemWidth = 100,
-  itemHeight = 100,
-  variableSize = false
-): RVLayoutManager {
-  const layoutManager = createLayoutManager(type, params);
-  populateLayouts(
-    layoutManager,
-    itemCount,
-    itemWidth,
-    itemHeight,
-    variableSize
-  );
-  return layoutManager;
-}
-
-/**
- * Get all layouts from a layout manager
- */
-export function getAllLayouts(layoutManager: RVLayoutManager): RVLayout[] {
-  // Access the internal layouts array
-  return Array.from({ length: layoutManager.getLayoutCount() }, (_, index) =>
-    layoutManager.getLayout(index)
-  );
-}

package/src/__tests__/useUnmountAwareCallbacks.test.tsx

@@ -1,285 +0,0 @@
-import React from "react";
-import { render } from "@quilted/react-testing";
-
-import { useUnmountAwareTimeout } from "../recyclerview/hooks/useUnmountAwareCallbacks";
-
-const TestComponent = ({
-  onRender,
-}: {
-  onRender: (api: ReturnType<typeof useUnmountAwareTimeout>) => void;
-}) => {
-  const api = useUnmountAwareTimeout();
-  onRender(api);
-  return null;
-};
-
-describe("useUnmountAwareCallbacks", () => {
-  beforeEach(() => {
-    jest.useFakeTimers();
-  });
-
-  afterEach(() => {
-    jest.clearAllTimers();
-    jest.clearAllMocks();
-  });
-
-  it("returns a setTimeout function", () => {
-    let api: ReturnType<typeof useUnmountAwareTimeout> | undefined;
-    render(
-      <TestComponent
-        onRender={(hookApi) => {
-          api = hookApi;
-        }}
-      />
-    );
-
-    expect(api).toBeDefined();
-    expect(api?.setTimeout).toBeDefined();
-    expect(typeof api?.setTimeout).toBe("function");
-  });
-
-  it("executes the callback after the specified delay", () => {
-    const callback = jest.fn();
-    let api: ReturnType<typeof useUnmountAwareTimeout> | undefined;
-
-    render(
-      <TestComponent
-        onRender={(hookApi) => {
-          api = hookApi;
-        }}
-      />
-    );
-
-    api?.setTimeout(callback, 1000);
-
-    expect(callback).not.toHaveBeenCalled();
-
-    // Fast-forward time
-    jest.advanceTimersByTime(1000);
-
-    expect(callback).toHaveBeenCalledTimes(1);
-  });
-
-  it("executes multiple callbacks after their respective delays", () => {
-    const callback1 = jest.fn();
-    const callback2 = jest.fn();
-    let api: ReturnType<typeof useUnmountAwareTimeout> | undefined;
-
-    render(
-      <TestComponent
-        onRender={(hookApi) => {
-          api = hookApi;
-        }}
-      />
-    );
-
-    api?.setTimeout(callback1, 1000);
-    api?.setTimeout(callback2, 2000);
-
-    expect(callback1).not.toHaveBeenCalled();
-    expect(callback2).not.toHaveBeenCalled();
-
-    // Fast-forward time by 1000ms
-    jest.advanceTimersByTime(1000);
-
-    expect(callback1).toHaveBeenCalledTimes(1);
-    expect(callback2).not.toHaveBeenCalled();
-
-    // Fast-forward time by another 1000ms
-    jest.advanceTimersByTime(1000);
-
-    expect(callback1).toHaveBeenCalledTimes(1);
-    expect(callback2).toHaveBeenCalledTimes(1);
-  });
-
-  it("clears all timeouts when the component unmounts", () => {
-    const callback = jest.fn();
-    let api: ReturnType<typeof useUnmountAwareTimeout> | undefined;
-
-    const component = render(
-      <TestComponent
-        onRender={(hookApi) => {
-          api = hookApi;
-        }}
-      />
-    );
-
-    api?.setTimeout(callback, 1000);
-    api?.setTimeout(callback, 2000);
-
-    // Spy on clearTimeout to verify it's called during unmount
-    const clearTimeoutSpy = jest.spyOn(global, "clearTimeout");
-
-    // Unmount the component
-    component.unmount();
-
-    // Fast-forward time
-    jest.advanceTimersByTime(2000);
-
-    // Expect callbacks not to be called because timeouts were cleared
-    expect(callback).not.toHaveBeenCalled();
-    expect(clearTimeoutSpy).toHaveBeenCalled();
-  });
-
-  it("removes timeout from tracking set once it executes", () => {
-    const callback = jest.fn();
-    let api: ReturnType<typeof useUnmountAwareTimeout> | undefined;
-
-    const component = render(
-      <TestComponent
-        onRender={(hookApi) => {
-          api = hookApi;
-        }}
-      />
-    );
-
-    api?.setTimeout(callback, 1000);
-
-    // Fast-forward time
-    jest.advanceTimersByTime(1000);
-
-    // Verify callback was called
-    expect(callback).toHaveBeenCalledTimes(1);
-
-    // We can't directly check the timeoutIds Set, so we'll verify indirectly
-    // by making sure no clearTimeout calls happen on unmount (since the timeout was already cleared)
-    const clearTimeoutSpy = jest.spyOn(global, "clearTimeout");
-    clearTimeoutSpy.mockClear(); // Reset the mock calls before unmount
-
-    // Unmount the component
-    component.unmount();
-
-    // If the timeout was properly removed from the set, clearTimeout won't be called on unmount
-    expect(clearTimeoutSpy).not.toHaveBeenCalled();
-  });
-
-  it("handles multiple timeouts correctly", () => {
-    const callback1 = jest.fn();
-    const callback2 = jest.fn();
-    const callback3 = jest.fn();
-    let api: ReturnType<typeof useUnmountAwareTimeout> | undefined;
-
-    const component = render(
-      <TestComponent
-        onRender={(hookApi) => {
-          api = hookApi;
-        }}
-      />
-    );
-
-    // Set up three timeouts with different delays
-    api?.setTimeout(callback1, 1000);
-    api?.setTimeout(callback2, 2000);
-    api?.setTimeout(callback3, 3000);
-
-    // Fast-forward time by 1500ms (should trigger only the first callback)
-    jest.advanceTimersByTime(1500);
-
-    expect(callback1).toHaveBeenCalledTimes(1);
-    expect(callback2).not.toHaveBeenCalled();
-    expect(callback3).not.toHaveBeenCalled();
-
-    // Unmount the component (should clear remaining timeouts)
-    component.unmount();
-
-    // Fast-forward time to when all callbacks would have been called
-    jest.advanceTimersByTime(2000);
-
-    // Only the first callback should have been called
-    expect(callback1).toHaveBeenCalledTimes(1);
-    expect(callback2).not.toHaveBeenCalled();
-    expect(callback3).not.toHaveBeenCalled();
-  });
-
-  it("handles callbacks that trigger new timeouts", () => {
-    const finalCallback = jest.fn();
-    let api: ReturnType<typeof useUnmountAwareTimeout> | undefined;
-
-    render(
-      <TestComponent
-        onRender={(hookApi) => {
-          api = hookApi;
-        }}
-      />
-    );
-
-    const firstCallback = () => {
-      api?.setTimeout(finalCallback, 1000);
-    };
-
-    api?.setTimeout(firstCallback, 1000);
-
-    // Fast-forward time to trigger first callback
-    jest.advanceTimersByTime(1000);
-
-    expect(finalCallback).not.toHaveBeenCalled();
-
-    // Fast-forward time to trigger second callback
-    jest.advanceTimersByTime(1000);
-
-    expect(finalCallback).toHaveBeenCalledTimes(1);
-  });
-
-  it("handles zero delay timeouts", () => {
-    const callback = jest.fn();
-    let api: ReturnType<typeof useUnmountAwareTimeout> | undefined;
-
-    render(
-      <TestComponent
-        onRender={(hookApi) => {
-          api = hookApi;
-        }}
-      />
-    );
-
-    api?.setTimeout(callback, 0);
-
-    expect(callback).not.toHaveBeenCalled();
-
-    // Even with zero delay, we need to advance the timer to execute
-    jest.advanceTimersByTime(0);
-
-    expect(callback).toHaveBeenCalledTimes(1);
-  });
-
-  it("handles errors in callbacks without affecting other timeouts", () => {
-    const errorCallback = jest.fn(() => {
-      throw new Error("Test error");
-    });
-    const successCallback = jest.fn();
-    let api: ReturnType<typeof useUnmountAwareTimeout> | undefined;
-
-    // Suppress error log during test
-    const originalConsoleError = console.error;
-    console.error = jest.fn();
-
-    render(
-      <TestComponent
-        onRender={(hookApi) => {
-          api = hookApi;
-        }}
-      />
-    );
-
-    api?.setTimeout(errorCallback, 1000);
-    api?.setTimeout(successCallback, 2000);
-
-    // Fast-forward time to trigger error callback
-    try {
-      jest.advanceTimersByTime(1000);
-    } catch (error) {
-      // Expected error
-    }
-
-    expect(errorCallback).toHaveBeenCalledTimes(1);
-    expect(successCallback).not.toHaveBeenCalled();
-
-    // Fast-forward time to trigger success callback
-    jest.advanceTimersByTime(1000);
-
-    expect(successCallback).toHaveBeenCalledTimes(1);
-
-    // Restore console.error
-    console.error = originalConsoleError;
-  });
-});