import { PATHS } from '@/shared/constants/paths';
import { useNavigate } from '@/shared/lib/hooks/use-navigate';
import { HeaderType } from '@/entities/common/model/types';
import { 
  useSetHeaderType,
  useSetFooterMode,
} from '@/widgets/sub-layout/use-sub-layout';
export const KeyInPaymentRequestSuccessPage = () => {
  const { navigate } = useNavigate();

  useSetHeaderType(HeaderType.NoHeader);
  useSetFooterMode(false);

  const onClickToNavigate = () => {
    navigate(PATHS.additionalService.keyInPayment.list);
  };

  return (
    <>
      <div className="success-page" >
        <div className="success-body">
          <div 
            className="success-icon"
            aria-hidden="true"
          ></div>
          <h1 className="success-title">
            <span>KEY-IN 결제</span><br/>
            <span>결제 신청이 완료되었습니다.</span>
          </h1>
          <div className="success-result">
            <p className="result-text">결과 : [0000] ARS 요청 처리 완료</p>
          </div>
        </div>
        <div className="apply-row">
          <button 
            className="btn-50 btn-blue flex-1"
            onClick={ () => onClickToNavigate() }
          >확인</button>
        </div>
      </div>
    </>
  );
};