import type { ForwardedRef, ReactElement } from 'react';
import { forwardRef } from 'react';
import {
  FlashList,
  type FlashListProps,
  type FlashListRef,
  type ListRenderItem,
  type ListRenderItemInfo,
  type RenderTarget,
  type RenderTargetOptions,
  type ViewToken,
} from '@shopify/flash-list';

export type VirtualizedListRef = FlashListRef<unknown>;
export type VirtualizedListProps<T = unknown> = FlashListProps<T>;
export type { ListRenderItem, ListRenderItemInfo, RenderTarget, RenderTargetOptions, ViewToken };

function VirtualizedListInner<T>(
  props: VirtualizedListProps<T>,
  ref: ForwardedRef<FlashListRef<T>>,
) {
  return <FlashList ref={ref} role="list" {...props} />;
}

export const VirtualizedList = forwardRef(VirtualizedListInner) as <T>(
  props: VirtualizedListProps<T> & { ref?: ForwardedRef<FlashListRef<T>> },
) => ReactElement | null;

(VirtualizedList as { displayName?: string }).displayName = 'VirtualizedList';