import React from 'react';
import CircleLoaderIcon from '../../icons/CircleLoaderIcon';
import Typography from '../Typography';
import { CircleLoaderWrapper, LoaderTextContainer } from './styles';

type CircleLoaderProps = {
  label?: string;
  size: number;
};

const CircleLoader: React.FC<CircleLoaderProps> = ({ label, size }) => {
  return (
    <LoaderTextContainer>
      <CircleLoaderWrapper size={size}>
        <CircleLoaderIcon height={size} width={size} />
      </CircleLoaderWrapper>
      {label && <Typography>{label}</Typography>}
    </LoaderTextContainer>
  );
};

export default CircleLoader;