import { Stack, Divider, Text } from "@mantine/core";
import { useTranslation } from "react-i18next";
import { ChangeMetadataParameters, createCustomMetadataFunctions } from "../../../hooks/tools/changeMetadata/useChangeMetadataParameters";
import { useMetadataExtraction } from "../../../hooks/tools/changeMetadata/useMetadataExtraction";
import DeleteAllStep from "./steps/DeleteAllStep";
import StandardMetadataStep from "./steps/StandardMetadataStep";
import DocumentDatesStep from "./steps/DocumentDatesStep";
import AdvancedOptionsStep from "./steps/AdvancedOptionsStep";

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

const ChangeMetadataSingleStep = ({
  parameters,
  onParameterChange,
  disabled = false
}: ChangeMetadataSingleStepProps) => {
  const { t } = useTranslation();

  // Get custom metadata functions using the utility
  const { addCustomMetadata, removeCustomMetadata, updateCustomMetadata } = createCustomMetadataFunctions(
    parameters,
    onParameterChange
  );

  // Extract metadata from uploaded files
  const { isExtractingMetadata } = useMetadataExtraction({
    updateParameter: onParameterChange,
  });

  const isDeleteAllEnabled = parameters.deleteAll;
  const fieldsDisabled = disabled || isDeleteAllEnabled || isExtractingMetadata;

  return (
    <Stack gap="md">
      {/* Delete All */}
      <Stack gap="md">
        <Text size="sm" fw={500}>
          {t('changeMetadata.deleteAll.label', 'Delete All Metadata')}
        </Text>
        <DeleteAllStep
          parameters={parameters}
          onParameterChange={onParameterChange}
          disabled={disabled}
        />
      </Stack>

      <Divider />

      {/* Standard Metadata Fields */}
      <Stack gap="md">
        <Text size="sm" fw={500}>
          {t('changeMetadata.standardFields.title', 'Standard Metadata')}
        </Text>
        <StandardMetadataStep
          parameters={parameters}
          onParameterChange={onParameterChange}
          disabled={fieldsDisabled}
        />
      </Stack>

      <Divider />

      {/* Document Dates */}
      <Stack gap="md">
        <Text size="sm" fw={500}>
          {t('changeMetadata.dates.title', 'Document Dates')}
        </Text>
        <DocumentDatesStep
          parameters={parameters}
          onParameterChange={onParameterChange}
          disabled={fieldsDisabled}
        />
      </Stack>

      <Divider />

      {/* Advanced Options */}
      <Stack gap="md">
        <Text size="sm" fw={500}>
          {t('changeMetadata.advanced.title', 'Advanced Options')}
        </Text>
        <AdvancedOptionsStep
          parameters={parameters}
          onParameterChange={onParameterChange}
          disabled={fieldsDisabled}
          addCustomMetadata={addCustomMetadata}
          removeCustomMetadata={removeCustomMetadata}
          updateCustomMetadata={updateCustomMetadata}
        />
      </Stack>
    </Stack>
  );
};

export default ChangeMetadataSingleStep;
