import React from 'react';
import ReactQRCode from 'react-qr-code';
import { QRCodeOuterWrapper, QRCodeBorder } from './styles';

type QRCodeProps = {
  url: string;
  size: number;
  withWrapper: boolean;
};

export const QRCode: React.FC<QRCodeProps> = ({
  url,
  size = 188,
  withWrapper = false,
}) => {
  return withWrapper ? (
    <QRCodeOuterWrapper heightAndWidth={size * 1.45}>
      <QRCodeBorder heightAndWidth={size * 1.175}>
        <ReactQRCode size={size} value={url} />
      </QRCodeBorder>
    </QRCodeOuterWrapper>
  ) : (
    <ReactQRCode value={url} />
  );
};