import type { ComponentProps, FC } from 'react';
import React from 'react';
import * as Sentry from '@sentry/browser';
import { ErrorBoundary } from '@theorchard/suite-components';

type SentryErrorBoundaryProps = ComponentProps<typeof ErrorBoundary>;

export const SentryErrorBoundary: FC<SentryErrorBoundaryProps> = (props) => {
    const handleError = (error: Error, info: React.ErrorInfo) => {
        Sentry.withScope((scope) => {
            scope.setExtras({ ...info });
            Sentry.captureException(error);
        });

        props.onError?.(error, info);
    };

    return <ErrorBoundary {...props} onError={handleError} />;
};