import { FormInput } from "@/components/auth/FormInput";
import { MessageDisplay } from "@/components/auth/MessageDisplay";
import { AuthButton } from "@/components/auth/AuthButton";

interface VerificationFormProps {
  code: string;
  setCode: (value: string) => void;
  errorMessage: string;
  isLoading: boolean;
  onVerifyPress: () => void;
}

export const VerificationForm = ({
  code,
  setCode,
  errorMessage,
  isLoading,
  onVerifyPress,
}: VerificationFormProps) => {
  return (
    <>
      <FormInput
        label="Verification Code"
        value={code}
        onChangeText={setCode}
        icon="key"
        keyboardType="number-pad"
        disabled={isLoading}
        style={{ marginBottom: 24 }}
      />

      {errorMessage ? (
        <MessageDisplay message={errorMessage} type="error" />
      ) : null}

      <AuthButton
        onPress={onVerifyPress}
        loading={isLoading}
        disabled={isLoading}
      >
        Verify Email
      </AuthButton>
    </>
  );
};