import {
  Loader2,
  UploadIcon,
} from 'lucide-react';

import { Button } from '@/components/ui/button';
import { ButtonGroup } from '@/components/ui/button-group';
import { Lang } from '@/lang/Lang';

type FileDataVideoEmptyUploadProps = {
  uploading: boolean;
  buttonTitle: string;
  isMobile: boolean;
  col: number;
  onUpload: () => void;
};

export const FileDataVideoEmptyUpload = ({
  uploading,
  buttonTitle,
  isMobile,
  col,
  onUpload,
}: FileDataVideoEmptyUploadProps) => (
  <ButtonGroup>
    <Button
      variant='outline'
      tooltip={Lang.key('upload_new')}
      aria-label={Lang.key('upload_new')}
      onClick={onUpload}
    >
      {uploading ? (
        <>
          <Loader2 className='size-4 animate-spin' />
          {Lang.key('uploading_file_wait')}
        </>
      ) : (
        <>
          <UploadIcon />

        </>
      )}
    </Button>
  </ButtonGroup>
);
