Replace send a new code link when the code expires

src/apis/eduidSignup.ts

@@ -28,6 +28,10 @@ export interface SignupState {
     initiated_signup: boolean;
     is_logged_in: boolean;
   };
+  name: {
+    given_name?: string;
+    surname?: string;
+  };
   tou: { completed: boolean; version?: string };
   captcha: { completed: boolean };
   credentials: {

src/components/Signup/SignupEnterCode.tsx

@@ -1,4 +1,4 @@
-import { verifyEmailRequest } from "apis/eduidSignup";
+import { registerEmailRequest, verifyEmailRequest } from "apis/eduidSignup";
 import EduIDButton from "components/Common/EduIDButton";
 import { ResponseCodeButtons } from "components/Common/ResponseCodeAbortButton";
 import { TimeRemainingWrapper } from "components/Common/TimeRemaining";
@@ -35,6 +35,22 @@ export function SignupEnterCode(): JSX.Element {
     setIsExpired(true);
   }
 
+  async function registerEmail() {
+    if (signupState?.email.address && signupState?.name?.given_name && signupState?.name?.surname) {
+      const res = await dispatch(
+        registerEmailRequest({
+          email: signupState?.email.address,
+          given_name: signupState?.name?.given_name,
+          surname: signupState?.name?.surname,
+        })
+      );
+
+      if (registerEmailRequest.fulfilled.match(res)) {
+        setIsExpired(false);
+      }
+    }
+  }
+
   function handleAbortButtonOnClick(event: React.MouseEvent<HTMLButtonElement>) {
     event.preventDefault();
     signupContext.signupService.send({ type: "ABORT" });
@@ -81,18 +97,13 @@ export function SignupEnterCode(): JSX.Element {
         </div>
         <p>
           <FormattedMessage
-            defaultMessage="To receive a new code, click the link below. You will be redirected to the register page."
+            defaultMessage="Click the link below to receive a new code. You will be redirected to a page where you can enter the new code."
             description="Signup, code expired"
           />
         </p>
 
-        <EduIDButton
-          buttonstyle="link"
-          className="lowercase"
-          onClick={handleAbortButtonOnClick}
-          id="return-to-register-button"
-        >
-          <FormattedMessage defaultMessage="Return to Register" description="Return to register" />
+        <EduIDButton buttonstyle="link" className="lowercase" onClick={registerEmail} id="send-new-code">
+          <FormattedMessage defaultMessage="Send a new code" description="send a new code" />
         </EduIDButton>
       </div>
     );

src/tests/signup/SignupMain-test.tsx

@@ -35,6 +35,10 @@ const emptyState: SignupState = {
     completed: false,
     version: "1999-v1",
   },
+  name: {
+    given_name: "",
+    surname: "",
+  },
   user_created: false,
 };
 const testFirstName = "test";