import { useTranslation } from 'react-i18next';
import { HelpText } from './HelpText';
import { EnvOverrideWarning, FieldLabel, FieldInput } from './formUtils';
import type { SectionFormProps } from './types';

export function WorkspaceForm({ config, onChange, overriddenByEnv }: SectionFormProps) {
  const { t } = useTranslation('settings');
  return (
    <div className="space-y-5">
      <h2 className="text-base font-semibold text-slate-800">Workspace</h2>

      <div>
        <FieldLabel>Worktree Directory</FieldLabel>
        <FieldInput
          value={config.worktreeDir ?? ''}
          onChange={v => onChange('worktreeDir', v)}
          disabled={!!overriddenByEnv['worktreeDir']}
          disabledReason={t('pathsStorage.worktreeOverride')}
        />
        {overriddenByEnv['worktreeDir'] && <EnvOverrideWarning />}
        <HelpText>{t('pathsStorage.worktreeHelp')}</HelpText>
      </div>

      <div>
        <FieldLabel>Custom Pieces Directory</FieldLabel>
        <FieldInput value={config.customPiecesDir ?? ''} onChange={v => onChange('customPiecesDir', v || undefined)}
          placeholder="/path/to/your/custom-pieces" />
        <HelpText>{t('pathsStorage.customPiecesHelp')}</HelpText>
      </div>

      <div>
        <FieldLabel>Concurrency</FieldLabel>
        <FieldInput
          type="number"
          value={config.concurrency ?? ''}
          onChange={v => onChange('concurrency', v ? Number(v) : undefined)}
          disabled={!!overriddenByEnv['concurrency']}
          disabledReason={t('execution.concurrencyOverride')}
        />
        {overriddenByEnv['concurrency'] && <EnvOverrideWarning />}
        <HelpText>{t('execution.concurrencyHelp')}</HelpText>
      </div>

      <div>
        <FieldLabel>Max Movements</FieldLabel>
        <FieldInput type="number" value={config.maxMovements ?? ''} onChange={v => onChange('maxMovements', v ? Number(v) : undefined)} />
        <HelpText>{t('execution.maxMovementsHelp')}</HelpText>
      </div>

      <h3 className="text-sm font-medium text-slate-600 mt-4 pt-3 border-t border-slate-200">Retry</h3>

      <div>
        <FieldLabel>Max Attempts</FieldLabel>
        <FieldInput type="number" value={config.retry?.maxAttempts ?? 3}
          onChange={v => onChange('retry.maxAttempts', Number(v))} />
        <HelpText>{t('execution.maxAttemptsHelp')}</HelpText>
      </div>

      <div>
        <FieldLabel>Backoff Seconds</FieldLabel>
        <FieldInput value={(config.retry?.backoffSeconds ?? [60, 300, 900]).join(', ')}
          onChange={v => onChange('retry.backoffSeconds', v.split(',').map((s: string) => Number(s.trim())).filter((n: number) => !isNaN(n)))} />
        <HelpText>{t('execution.backoffHelp')}</HelpText>
      </div>
    </div>
  );
}
