Implement continue on verify magic link

Signed-off-by: Émile Ré <emile@getprobo.com>

apps/trust/src/pages/auth/ConnectPage.tsx

@@ -8,13 +8,14 @@ import {
   useMutation,
   usePreloadedQuery,
 } from "react-relay";
+import { useSearchParams } from "react-router";
 import { graphql } from "relay-runtime";
 import { z } from "zod";
 
 import { useFormWithSchema } from "#/hooks/useFormWithSchema";
 import { getPathPrefix } from "#/utils/pathPrefix";
 
-import type { ConnectPageMutation } from "./__generated__/ConnectPageMutation.graphql";
+import type { ConnectPageMutation, SendMagicLinkInput } from "./__generated__/ConnectPageMutation.graphql";
 import type { ConnectPageQuery } from "./__generated__/ConnectPageQuery.graphql";
 
 export const connectPageQuery = graphql`
@@ -53,11 +54,22 @@ export function ConnectPage(props: {
   const [magicLinkSent, setMagicLinkSent] = useState<boolean>(false);
   const interval = useRef<NodeJS.Timeout>(undefined);
   const [timer, setTimer] = useState<number>(timerDurationSeconds);
+  const [searchParams] = useSearchParams();
 
   const {
     currentTrustCenter: { organization },
   } = usePreloadedQuery<ConnectPageQuery>(connectPageQuery, queryRef);
 
+  const continueUrlParam = searchParams.get("continue");
+  let safeContinueUrl: string;
+  if (continueUrlParam) {
+    const continueUrl = new URL(continueUrlParam);
+    safeContinueUrl = window.location.origin + continueUrl.pathname + continueUrl.search;
+  } else {
+    const pathPrefix = getPathPrefix();
+    safeContinueUrl = window.location.origin + pathPrefix ? getPathPrefix() : "/";
+  }
+
   useEffect(() => {
     if (!magicLinkSent && interval.current) {
       clearInterval(interval.current);
@@ -92,14 +104,18 @@ export function ConnectPage(props: {
   );
 
   const handleSubmit = handleSubmitWrapper(({ email }: FormData) => {
+    const input: SendMagicLinkInput = { email };
+    if (safeContinueUrl) {
+      input.continue = safeContinueUrl;
+    }
     sendMagicLink({
       variables: {
         input: {
           email,
+          continue: safeContinueUrl,
         },
       },
-      onCompleted: (data, errors: GraphQLError[] | null) => {
-        console.log(data, errors);
+      onCompleted: (_, errors: GraphQLError[] | null) => {
         if (errors) {
           for (const err of errors) {
             if (err.extensions?.code === "ALREADY_AUTHENTICATED") {

apps/trust/src/pages/auth/VerifyMagicLinkPage.tsx

@@ -14,7 +14,7 @@ import type { VerifyMagicLinkPageMutation } from "./__generated__/VerifyMagicLin
 const verifyMagicLinkMutation = graphql`
   mutation VerifyMagicLinkPageMutation($input: VerifyMagicLinkInput!) {
     verifyMagicLink(input: $input) {
-      success
+      continue
     }
   }
 `;
@@ -38,7 +38,7 @@ export default function VerifyMagicLinkPagePageMutation() {
       variables: {
         input: { token },
       },
-      onCompleted: (_, errors: GraphQLError[] | null) => {
+      onCompleted: (response, errors: GraphQLError[] | null) => {
         if (errors) {
           for (const err of errors) {
             if (err.extensions?.code === "ALREADY_AUTHENTICATED") {
@@ -55,13 +55,21 @@ export default function VerifyMagicLinkPagePageMutation() {
           return;
         }
 
+        const { verifyMagicLink } = response;
+
         toast({
           title: __("Success"),
           description: __("Your have successfully signed in"),
           variant: "success",
         });
-        const pathPrefix = getPathPrefix();
-        window.location.href = pathPrefix ? getPathPrefix() : "/";
+
+        if (verifyMagicLink?.continue) {
+          const continueUrl = new URL(verifyMagicLink.continue);
+          window.location.href = window.location.origin + continueUrl.pathname + continueUrl.search;
+        } else {
+          const pathPrefix = getPathPrefix();
+          window.location.href = pathPrefix ? getPathPrefix() : "/";
+        }
       },
       onError: (err) => {
         toast({

apps/trust/src/pages/auth/__generated__/ConnectPageMutation.graphql.ts

@@ -1,5 +1,5 @@
 /**
- * @generated SignedSource<<bcbab3713eaca3141e6dfb8f54a54e7d>>
+ * @generated SignedSource<<711ecaa392c23004a3bd1dfb24a5751f>>
  * @lightSyntaxTransform
  * @nogrep
  */
@@ -10,6 +10,7 @@
 
 import { ConcreteRequest } from 'relay-runtime';
 export type SendMagicLinkInput = {
+  continue?: string | null | undefined;
   email: any;
 };
 export type ConnectPageMutation$variables = {

apps/trust/src/pages/auth/__generated__/VerifyMagicLinkPageMutation.graphql.ts

@@ -1,5 +1,5 @@
 /**
- * @generated SignedSource<<5037d9722f3c6cc15c2a323ef954e3d6>>
+ * @generated SignedSource<<5570f368d6cc3c3be80a32390e12c8f9>>
  * @lightSyntaxTransform
  * @nogrep
  */
@@ -17,7 +17,7 @@ export type VerifyMagicLinkPageMutation$variables = {
 };
 export type VerifyMagicLinkPageMutation$data = {
   readonly verifyMagicLink: {
-    readonly success: boolean;
+    readonly continue: string | null | undefined;
   } | null | undefined;
 };
 export type VerifyMagicLinkPageMutation = {
@@ -52,7 +52,7 @@ v1 = [
         "alias": null,
         "args": null,
         "kind": "ScalarField",
-        "name": "success",
+        "name": "continue",
         "storageKey": null
       }
     ],
@@ -77,16 +77,16 @@ return {
     "selections": (v1/*: any*/)
   },
   "params": {
-    "cacheID": "07cf89de3f37725d847cda46557467f5",
+    "cacheID": "05d0e504b6f11ad7dd11ed84059a96ac",
     "id": null,
     "metadata": {},
     "name": "VerifyMagicLinkPageMutation",
     "operationKind": "mutation",
-    "text": "mutation VerifyMagicLinkPageMutation(\n  $input: VerifyMagicLinkInput!\n) {\n  verifyMagicLink(input: $input) {\n    success\n  }\n}\n"
+    "text": "mutation VerifyMagicLinkPageMutation(\n  $input: VerifyMagicLinkInput!\n) {\n  verifyMagicLink(input: $input) {\n    continue\n  }\n}\n"
   }
 };
 })();
 
-(node as any).hash = "074415601c4d50f50d177c06dfab64ef";
+(node as any).hash = "cc9e7f7886d9d61b95f13c5ba66c41ec";
 
 export default node;