import React, { useState } from 'react';
import { render, fireEvent, act } from '@testing-library/react-native';
import { UserAvatar } from '.';
import 'jest-styled-components';

it('snapshot - padrão', () => {
   const { toJSON } = render(
      <>
         <UserAvatar
            user={{
               name: 'veronica',
               image:
                  'https://user-images.githubusercontent.com/14295479/98430176-7f678b00-208a-11eb-9fd1-aefd8c3e9edf.png',
            }}
         />
      </>,
   );
   expect(toJSON).toMatchSnapshot();
});

it('snapshot - vários tamanhos sem imagem', () => {
   const { toJSON } = render(
      <>
         <UserAvatar user={{ name: 'Notorious Chase' }} size="xs" />
         <UserAvatar user={{ name: 'Made Heaven' }} size="s" />
         <UserAvatar user={{ name: 'Star Platinum' }} size="m" />
         <UserAvatar user={{ name: 'Crazy Diamond' }} size="l" />
         <UserAvatar user={{ name: 'King crimson' }} size="xl" />
      </>,
   );
   expect(toJSON).toMatchSnapshot();
});

it('snapshot - vários tamanhos com imagem', () => {
   const { toJSON } = render(
      <>
         <UserAvatar
            user={{
               name: 'Notorious Chase',
               image:
                  'https://user-images.githubusercontent.com/14295479/98430176-7f678b00-208a-11eb-9fd1-aefd8c3e9edf.png',
            }}
            size="xs"
         />
         <UserAvatar
            user={{
               name: 'Made Heaven',
               image:
                  'https://user-images.githubusercontent.com/14295479/98430176-7f678b00-208a-11eb-9fd1-aefd8c3e9edf.png',
            }}
            size="s"
         />
         <UserAvatar
            user={{
               name: 'Star Platinum',
               image:
                  'https://user-images.githubusercontent.com/14295479/98430176-7f678b00-208a-11eb-9fd1-aefd8c3e9edf.png',
            }}
            size="m"
         />
         <UserAvatar
            user={{
               name: 'Crazy Diamond',
               image:
                  'https://user-images.githubusercontent.com/14295479/98430176-7f678b00-208a-11eb-9fd1-aefd8c3e9edf.png',
            }}
            size="l"
         />
         <UserAvatar
            user={{
               name: 'King crimson',
               image:
                  'https://user-images.githubusercontent.com/14295479/98430176-7f678b00-208a-11eb-9fd1-aefd8c3e9edf.png',
            }}
            size="xl"
         />
      </>,
   );
   expect(toJSON).toMatchSnapshot();
});

it('snapshot - tamanho customizado sem imagem', () => {
   const { toJSON } = render(
      <>
         <UserAvatar
            user={{
               name: 'veronica',
            }}
            sizeCircle={52}
         />
      </>,
   );
   expect(toJSON).toMatchSnapshot();
});

it('snapshot - tamanho customizado com imagem', () => {
   const { toJSON } = render(
      <>
         <UserAvatar
            user={{
               name: 'veronica',
               image:
                  'https://user-images.githubusercontent.com/14295479/98430176-7f678b00-208a-11eb-9fd1-aefd8c3e9edf.png',
            }}
            sizeCircle={52}
         />
      </>,
   );
   expect(toJSON).toMatchSnapshot();
});
