import { Country } from "@services/accounting-api";
import { lazy, Suspense } from 'react';

export default function Flag({ country, ...props }: { country: Country | "EU" }) {
  const FlagIcon = lazy(() => import(`country-flag-icons/react/3x2`).then(module => ({ default: module[country] })));

  return (
    <Suspense fallback={<div {...props}>...</div>}>
      <FlagIcon {...props}/>
    </Suspense>
  );
}