import { history, FormattedMessage } from '@umijs/max';
import { Button, Result } from 'antd';
import React from 'react';
import type { ErrorInfo } from 'react';

export default class CustomBoundary extends React.Component<
  Record<string, any>,
  { hasError: boolean; errorInfo: string }
> {
  state = { hasError: false, errorInfo: '' };

  static getDerivedStateFromError(error: Error) {
    return { hasError: true, errorInfo: error.message };
  }

  componentDidCatch(error: any, errorInfo: ErrorInfo) {
    // You can also log the error to an error reporting service
    console.log(error, errorInfo);
  }
  
  

  render() {
    if (this.state.hasError) {
      return (
        <Result
          status="500"
          title="500"
          subTitle={<FormattedMessage id="info.subTitle.500" />}
          extra={
            <Button type="primary" onClick={() => history.push('/')}>
              <FormattedMessage id="info.button.backHome" />
            </Button>
          }
        />
      );
    }
    return this.props.children;
  }
}
