Skip to content
Snippets Groups Projects

feat: Sentry frontend error logging integration

Merged Vink, S.A. (Sjoerd) requested to merge feat(errorBoundary) into main
2 unresolved threads
2 files
+ 30
3
Compare changes
  • Side-by-side
  • Inline
Files
2
import React, { ReactNode } from 'react';
import { Button } from '../buttons';
import { useAuthorizationCache, useSessionCache } from '../../data-access';
// import * as Sentry from '@sentry/react';
interface ErrorBoundaryProps {
fallback: ReactNode;
children: ReactNode;
saveStateID?: string;
userID?: string;
sessionID?: string;
}
interface ErrorBoundaryState {
hasError: boolean;
}
class ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {
class ErrorBoundaryWrapper extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {
constructor(props: ErrorBoundaryProps) {
super(props);
this.state = { hasError: false };
@@ -21,8 +26,18 @@ class ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundarySta
}
componentDidCatch(error: Error, info: React.ErrorInfo): void {
console.log('An error happened in the application');
// send to error logging service in the future
console.log('An error happened in the application', import.meta.env);
if (import.meta.env.SENTRY_ENABLED) {
// send to error logging service in the future
// Sentry.captureException(error, {
// userID: this.props.userID,
// sessionID: this.props.sessionID,
// saveState: this.props.saveStateID,
// error,
// info,
// });
console.log('log to sentry');
}
}
resetErrorBoundary = () => {
@@ -46,4 +61,15 @@ class ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundarySta
}
}
const ErrorBoundary: React.FC<{ fallback: ReactNode; children: ReactNode }> = (props) => {
const session = useSessionCache();
const auth = useAuthorizationCache();
return (
<ErrorBoundaryWrapper {...props} userID={auth.userID} sessionID={auth.sessionID} saveStateID={session.currentSaveState}>
{props.children}
</ErrorBoundaryWrapper>
);
};
export { ErrorBoundary };
Loading