import { ComponentProps } from 'react';

import SparklesIcon from '@/icons/generated/SparklesIcon';

import CreateClipArrayDropzone from './CreateClipArrayDropzone';

export default function CreateInspirationDropzone(
  props: Pick<
    ComponentProps<typeof CreateClipArrayDropzone>,
    | 'accept'
    | 'onDrop'
    | 'onDragMove'
    | 'onDragLeave'
    | 'currentCount'
    | 'maxCount'
  >
) {
  return (
    <CreateClipArrayDropzone
      {...props}
      icon={
        <SparklesIcon
          style={{
            width: 24,
            height: 24,
            color: 'inherit',
          }}
        />
      }
      emptyMessage='Drop here to use as inspiration'
      addMessage={(remainingSlots, isMultiple) =>
        `Add ${isMultiple ? `1 of ${remainingSlots} more songs` : 'final song'} for inspiration`
      }
    />
  );
}