import * as States from "./states";

const STATES = {
  loading: States.Loading,
  empty: States.Empty,
  error: States.Error,
} as const;

const isDataList = (
  list: TableBuilderListData[] | TableBuilderListKeys,
): list is TableBuilderListData[] => {
  return Array.isArray(list);
};

export const Body = ({
  list,
  columns,
  filters,
  fetchData,
}: TableBuilderBodyProps) => {
  const { pageSize } = filters.pagination;
  const minHeight = pageSize * 50 + 2;
  const props = {
    className: "body min-w-max w-auto",
    style: { minHeight: minHeight },
  };

  if (!isDataList(list)) {
    const StateComponent = STATES[list];

    return (
      <div {...props}>
        <StateComponent {...({ fetchData } as any)} />
      </div>
    );
  }

  return (
    <div {...props}>
      <States.Data list={list} columns={columns} />
    </div>
  );
};