import React from 'react';
import { useTranslation } from 'react-i18next';
import { NumberInput, Stack } from '@mantine/core';
import { ScannerImageSplitParameters } from '../../../hooks/tools/scannerImageSplit/useScannerImageSplitParameters';

interface ScannerImageSplitSettingsProps {
  parameters: ScannerImageSplitParameters;
  onParameterChange: <K extends keyof ScannerImageSplitParameters>(key: K, value: ScannerImageSplitParameters[K]) => void;
  disabled?: boolean;
}

const ScannerImageSplitSettings: React.FC<ScannerImageSplitSettingsProps> = ({
  parameters,
  onParameterChange,
  disabled = false
}) => {
  const { t } = useTranslation();

  return (
    <Stack gap="md">
      <NumberInput
        label={t('ScannerImageSplit.selectText.1', 'Angle Threshold:')}
        description={t('ScannerImageSplit.selectText.2', 'Sets the minimum absolute angle required for the image to be rotated (default: 10).')}
        value={parameters.angle_threshold}
        onChange={(value) => onParameterChange('angle_threshold', Number(value) || 10)}
        min={0}
        step={1}
        disabled={disabled}
      />

      <NumberInput
        label={t('ScannerImageSplit.selectText.3', 'Tolerance:')}
        description={t('ScannerImageSplit.selectText.4', 'Determines the range of colour variation around the estimated background colour (default: 30).')}
        value={parameters.tolerance}
        onChange={(value) => onParameterChange('tolerance', Number(value) || 30)}
        min={0}
        step={1}
        disabled={disabled}
      />

      <NumberInput
        label={t('ScannerImageSplit.selectText.5', 'Minimum Area:')}
        description={t('ScannerImageSplit.selectText.6', 'Sets the minimum area threshold for a photo (default: 10000).')}
        value={parameters.min_area}
        onChange={(value) => onParameterChange('min_area', Number(value) || 10000)}
        min={0}
        step={100}
        disabled={disabled}
      />

      <NumberInput
        label={t('ScannerImageSplit.selectText.7', 'Minimum Contour Area:')}
        description={t('ScannerImageSplit.selectText.8', 'Sets the minimum contour area threshold for a photo.')}
        value={parameters.min_contour_area}
        onChange={(value) => onParameterChange('min_contour_area', Number(value) || 500)}
        min={0}
        step={10}
        disabled={disabled}
      />

      <NumberInput
        label={t('ScannerImageSplit.selectText.9', 'Border Size:')}
        description={t('ScannerImageSplit.selectText.10', 'Sets the size of the border added and removed to prevent white borders in the output (default: 1).')}
        value={parameters.border_size}
        onChange={(value) => onParameterChange('border_size', Number(value) || 1)}
        min={0}
        step={1}
        disabled={disabled}
      />
    </Stack>
  );
};

export default ScannerImageSplitSettings;