import { FormGrid, SelectField } from '../../forms';
import type { DownloadFormat, DownloadOption, DownloadQualityPreset } from './types';

export type ExportFormatFieldsProps = {
  format: DownloadFormat;
  formatOptions: DownloadOption[];
  showRasterOptions: boolean;
  dpiPreset: DownloadQualityPreset;
  canUseHdExport: boolean;
  labels: {
    format: string;
    exportQuality: string;
    standardQuality: string;
    printReady: string;
  };
  onFormatChange: (value: DownloadFormat) => void;
  onDpiPresetChange: (value: DownloadQualityPreset) => void;
};

export function ExportFormatFields({
  format,
  formatOptions,
  showRasterOptions,
  dpiPreset,
  canUseHdExport,
  labels,
  onFormatChange,
  onDpiPresetChange,
}: ExportFormatFieldsProps) {
  return (
    <FormGrid columns={2}>
      <SelectField
        label={labels.format}
        required
        value={format}
        options={formatOptions as any}
        onValueChange={(value) => onFormatChange(value as DownloadFormat)}
      />

      {showRasterOptions ? (
        <SelectField
          label={labels.exportQuality}
          required
          value={dpiPreset}
          options={[
            { value: 'screen', label: labels.standardQuality },
            ...(canUseHdExport ? [{ value: 'print', label: labels.printReady }] : []),
          ]}
          onValueChange={(value) => onDpiPresetChange(value as DownloadQualityPreset)}
        />
      ) : null}
    </FormGrid>
  );
}
