import { useMemo, useState } from 'react';
import { FallbackProps } from 'react-error-boundary';

import { Dialog, DialogProps } from '@/shared/ui/dialogs/dialog';

type CommonErrorProps = FallbackProps & {
  height?: number;
};
export const CommonError = ({ 
  error, 
  resetErrorBoundary 
}: CommonErrorProps) => {
  console.log('CommonError --> ', error);

  const [isOpen, setIsOpen] = useState(true);
  const msg = useMemo(() => {
    let message: Partial<DialogProps> = {
      title: '일시적인 오류가 발생하였습니다.',
      message: '잠시 후 다시 시도해주세요.'
    };
    if(error?.response?.data?.message){
      message = { message: error.response.data.message };
    }
    return message; 
  }, [error]);

  return (
    <Dialog
      afterLeave={ () => null }
      open={ isOpen }
      onClose={ () => setIsOpen(false) }
      onConfirmClick={ resetErrorBoundary }
      onCancelClick={() => {
        location.href = '/';
      }}
      message={ msg.message }
      buttonLabel={ ['취소', '재시도'] }
    />
  );
};
