diff --git a/src/core/index.tsx b/src/core/index.tsx
index 6c20982f..2617ef2c 100644
--- a/src/core/index.tsx
+++ b/src/core/index.tsx
@@ -1,5 +1,5 @@
import Head from 'next/head';
-import { FC } from 'react';
+import React, { FC } from 'react';
import Footer from './components/Footer/index';
import Header from './components/Header/index';
diff --git a/src/events/components/Attendance/AttendButton.tsx b/src/events/components/Attendance/AttendButton.tsx
index cbfbf9a6..25d9b268 100644
--- a/src/events/components/Attendance/AttendButton.tsx
+++ b/src/events/components/Attendance/AttendButton.tsx
@@ -14,6 +14,22 @@ interface IAttendButtonProps {
cannotUnattend?: boolean;
}
+const FAILED_CAPTCHA_ERROR_TEXT = (
+ <>
+ Kunne ikke verifisere at du ikke er en bot.
+
+
+ Dette kan du prøve:
+
+ - Last inn siden på nytt og prøv igjen.
+ - Prøv en annen nettleser. Vi vet at det har vært problemer med Firefox.
+ -
+ Hvis du fortsatt får feil, så send en e-post til dotkom@online.ntnu.no så vi melder deg på manuelt. Vi setter pris på om du
+ kan oppgi eventuell feilmelding og hvilken nettleser og operativsystem du bruker for å kunne skjønne bedre hva som går galt.
+
+
+ >
+);
const AttendButton: FC = (props: IAttendButtonProps) => {
const dispatch = useDispatch();
const { eventId, isEventFull } = props;
@@ -33,7 +49,14 @@ const AttendButton: FC = (props: IAttendButtonProps) => {
}
};
const toggleModal = () => setShowModal(!showModal);
- const modal = ;
+ const modal = (
+
+ );
const onConfirmModalClose = (retValue: boolean) => {
setShowConfirmModal(false);
diff --git a/src/events/components/Attendance/CaptchaModal.tsx b/src/events/components/Attendance/CaptchaModal.tsx
index 57dcab38..daa7ef1f 100644
--- a/src/events/components/Attendance/CaptchaModal.tsx
+++ b/src/events/components/Attendance/CaptchaModal.tsx
@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { FC, useState } from 'react';
import { Modal } from '@dotkomonline/design-system';
import { OW4_TURNSTILE_PUBLIC_KEY } from 'common/constants/turnstile';
import Turnstile from 'react-turnstile';
@@ -9,10 +9,13 @@ interface ICaptchaModalProps {
text?: string;
toggleModal: () => void;
setCaptcha: (token: string | null) => void;
+ errorText?: React.ReactNode | string;
}
const CaptchaModal: FC = (props: ICaptchaModalProps) => {
- const { showModal, toggleModal, setCaptcha, header, text } = props;
+ const { showModal, toggleModal, setCaptcha, header, text, errorText } = props;
+ const [showErrorText, setShowErrorText] = useState(true);
+ const [turnstileError, setTurnstileError] = useState(null);
const validCaptcha = (token: string | null) => {
if (token) {
@@ -22,13 +25,21 @@ const CaptchaModal: FC = (props: ICaptchaModalProps) => {
//TODO Do something with unvalid token?
};
+ const onError = (error: Error) => {
+ console.log('Error from captcha failure:', error);
+ setShowErrorText(true);
+ setTurnstileError(error.message || 'Ingen feilmelding');
+ };
+
if (!showModal) return null;
return (
{header}
{text}
-
+ {showErrorText && {errorText}
}
+ {turnstileError && Error message: {turnstileError}
}
+
);
};