import { memo } from 'react';

import Button from '@material-hu/components/design-system/Buttons/Button';

import { type ReviewDetailFormQuestions } from 'src/pages/dashboard/performance/types';

import { useCurrentStepValidation } from '../hooks/useCurrentStepValidation';

type Props = {
  currentStepQuestions: ReviewDetailFormQuestions[];
  onClick: () => void;
  label: string;
};

const ReviewNextStepButton = ({
  currentStepQuestions,
  onClick,
  label,
}: Props) => {
  const isValid = useCurrentStepValidation(currentStepQuestions);
  return (
    <Button
      onClick={onClick}
      disabled={!isValid}
      variant="contained"
      color="primary"
      size="large"
    >
      {label}
    </Button>
  );
};

export default memo(ReviewNextStepButton);
