import PropTypes from 'prop-types';
import BackLink from './buttons/back';

function Error({ content = DEFAULT_ERROR_CONTENT, errorCode, errorData }) {
  function getErrorContent() {
    if (errorData.detail) return errorData.detail;
    return JSON.stringify(errorData);
  }

  return (
    <div className='flex flex-col items-center justify-center gap-4'>
      <p>{content}</p>
      {errorCode && (
        <>
          <p>
            <span className='font-medium'>کد خطا: </span>
            <span>{errorCode}</span>
          </p>
          {errorCode !== 500 && errorData && <p>{getErrorContent()}</p>}
        </>
      )}
      <BackLink />
    </div>
  );
}

const DEFAULT_ERROR_CONTENT = 'خطایی رخ داده است.';

Error.propTypes = {
  content: PropTypes.string,
  errorCode: PropTypes.number,
  errorData: PropTypes.object
};

export default Error;
