import React from 'react';
import {StyleProp, ViewStyle} from 'react-native';
import {IconZoomExclamation} from '@tabler/icons-react-native';
import {Avatar, CardContainer, Title} from '@components';

import {styles} from './styles';

interface Props {
  emptyTitle: string;
  emptyDescription?: string;
  style?: StyleProp<ViewStyle>;
}

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

export default EmptyList;