diff --git a/src/events/components/Attendance/AttendButton.tsx b/src/events/components/Attendance/AttendButton.tsx index 25d9b268..4432d672 100644 --- a/src/events/components/Attendance/AttendButton.tsx +++ b/src/events/components/Attendance/AttendButton.tsx @@ -7,6 +7,8 @@ import { useToast } from 'core/utils/toast/useToast'; import { unwrapResult } from '@reduxjs/toolkit'; import style from './attendance.less'; import { ConfirmModal } from '../../../common/components/Modal'; +import * as Sentry from '@sentry/browser'; +import { getUser } from '../../../authentication/api'; interface IAttendButtonProps { eventId: number; @@ -23,10 +25,7 @@ const FAILED_CAPTCHA_ERROR_TEXT = ( ); @@ -44,7 +43,8 @@ const AttendButton: FC = (props: IAttendButtonProps) => { unwrapResult(action); addToast('Du har blitt meldt på arrangementet'); } catch (err) { - addToast(`Noe gikk galt under påmeldelse av arrangement, ERROR: ${err.message}`, { type: 'error' }); + const errorMessage = err instanceof Error ? err.message : 'Ukjent feil'; + addToast(`Noe gikk galt under påmeldelse av arrangement, ERROR: ${errorMessage}`, { type: 'error' }); } } }; @@ -55,6 +55,19 @@ const AttendButton: FC = (props: IAttendButtonProps) => { toggleModal={toggleModal} setCaptcha={signUp} errorText={FAILED_CAPTCHA_ERROR_TEXT} + onError={async (error) => { + const user = await getUser(); + Sentry.captureEvent({ + message: 'User failed turnstile challenge when signing up for event.', + level: Sentry.Severity.Warning, + extra: { + error: error, + }, + user: { + id: user?.profile.sub, + }, + }); + }} /> ); const onConfirmModalClose = (retValue: boolean) => { diff --git a/src/events/components/Attendance/CaptchaModal.tsx b/src/events/components/Attendance/CaptchaModal.tsx index daa7ef1f..f3bc13b4 100644 --- a/src/events/components/Attendance/CaptchaModal.tsx +++ b/src/events/components/Attendance/CaptchaModal.tsx @@ -10,10 +10,11 @@ interface ICaptchaModalProps { toggleModal: () => void; setCaptcha: (token: string | null) => void; errorText?: React.ReactNode | string; + onError: (error: Error) => void; } const CaptchaModal: FC = (props: ICaptchaModalProps) => { - const { showModal, toggleModal, setCaptcha, header, text, errorText } = props; + const { showModal, toggleModal, setCaptcha, header, text, errorText, onError } = props; const [showErrorText, setShowErrorText] = useState(true); const [turnstileError, setTurnstileError] = useState(null); @@ -25,8 +26,9 @@ const CaptchaModal: FC = (props: ICaptchaModalProps) => { //TODO Do something with unvalid token? }; - const onError = (error: Error) => { + const _onError = (error: Error) => { console.log('Error from captcha failure:', error); + onError(error); setShowErrorText(true); setTurnstileError(error.message || 'Ingen feilmelding'); }; @@ -39,7 +41,7 @@ const CaptchaModal: FC = (props: ICaptchaModalProps) => {

{text}

{showErrorText &&

{errorText}

} {turnstileError &&

Error message: {turnstileError}

} - + ); }; diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx index fe52354a..e1b7e00d 100644 --- a/src/pages/_app.tsx +++ b/src/pages/_app.tsx @@ -30,6 +30,7 @@ if (__CLIENT__ && __PROD__) { Sentry.init({ dsn: OWF_SENTRY_DSN, + environment: process.env.NODE_ENV, }); type Props = AppProps & ReduxWrapperAppProps;