import React, {FC} from 'react';
import {IconProps} from '@tabler/icons-react-native';
import {Avatar, CardContainer, Title} from '@components/_HuGo';

import {styles} from './styles';

export interface EmptyListProps {
  title: string;
  Icon: FC<IconProps>;
  description?: string;
}

function EmptyList({description, title, Icon}: EmptyListProps) {
  return (
    <CardContainer style={styles.cardContainer}>
      <Avatar Icon={Icon} size="lg" />
      <Title
        center
        description={description}
        size="s"
        title={title}
        titleNumberOfLines={2}
      />
    </CardContainer>
  );
}

export default EmptyList;
