import { useTranslation } from '@/components/locales';

type SvgLogoProps = {
  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
};

export function OfficerIconLogo({ size = 'xl' }: SvgLogoProps) {
  const { t } = useTranslation();
  const config = sizeConfig[size];

  return <img src="/officer-logo.svg" alt={t('logo.icon')} style={{ width: config.width, height: 'auto' }} />;
}

const sizeConfig = {
  xs: { width: '120px' },
  sm: { width: '200px' },
  md: { width: '400px' },
  lg: { width: '600px' },
  xl: { width: '800px' },
};