Works with permission error

theopensystemslab · Nov 25, 2024 · e660026 · e660026
1 parent aff54ca
commit e660026
Show file tree

Hide file tree

Showing 3 changed files with 44 additions and 36 deletions.
diff --git a/editor.planx.uk/src/pages/VerifyEmail/VerifyEmail.tsx b/editor.planx.uk/src/pages/VerifyEmail/VerifyEmail.tsx
@@ -5,6 +5,7 @@ import Typography from "@mui/material/Typography";
 import Card from "@planx/components/shared/Preview/Card";
 import { CardHeader } from "@planx/components/shared/Preview/CardHeader/CardHeader";
 import { useFormik } from "formik";
+import { publicClient } from "lib/graphql";
 import React, { useMemo } from "react";
 import InputLabel from "ui/public/InputLabel";
 import Input from "ui/shared/Input/Input";
@@ -24,25 +25,30 @@ interface VerifyEmailProps {
 export const VerifyEmail = ({ params }: VerifyEmailProps): JSX.Element => {
   const { sessionId, team } = params;
 
-  // const { data, loading, error } = useQuery(
-  const { data } = useQuery(
+  const { data, error, loading } = useQuery(
     gql`
       ${TEAM_EMAIL_SETTINGS_QUERY}
     `,
     {
       variables: { slug: team },
-    },
+      client: publicClient,
+      skip: !team,
+    }
   );
 
   const teamEmail = useMemo(
     () => data?.teamSettings.submissionEmail || null,
-    [data],
+    [data]
   );
 
   const handleSubmit = (email: string) => {
-    console.log("need to validate this email!", email);
-    const url = `${process.env.API_URL_EXT}/download-application-files/${sessionId}?email=${teamEmail}&localAuthority=${team}`;
-    window.open(url, "_blank");
+    if (email === teamEmail) {
+      const url = `${process.env.API_URL_EXT}/download-application-files/${sessionId}?email=${teamEmail}&localAuthority=${team}`;
+      window.open(url, "_blank");
+    } else {
+      // handle error
+      console.error("wrong email!");
+    }
   };
 
   const formik = useFormik({
@@ -60,33 +66,36 @@ export const VerifyEmail = ({ params }: VerifyEmailProps): JSX.Element => {
       <Typography maxWidth="formWrap" variant="h1" pt={5} gutterBottom>
         Download your application
       </Typography>
+      {loading && <Typography>Loading!</Typography>}
 
-      <Box width="100%">
-        <Card handleSubmit={formik.handleSubmit}>
-          <CardHeader
-            title="Verify your email address"
-            description="We will use this to verify that you can download your application. Entering the correct email address will start the file download automatically."
-          />
-          <InputRow>
-            <InputLabel label={"Email address"} htmlFor={"email"}>
-              <Input
-                bordered
-                errorMessage={
-                  formik.touched.email && formik.errors.email
-                    ? formik.errors.email
-                    : undefined
-                }
-                id="email"
-                name="email"
-                onBlur={formik.handleBlur}
-                onChange={formik.handleChange}
-                type="email"
-                value={formik.values.email}
-              />
-            </InputLabel>
-          </InputRow>
-        </Card>
-      </Box>
+      {!loading && (
+        <Box width="100%">
+          <Card handleSubmit={formik.handleSubmit}>
+            <CardHeader
+              title="Verify your email address"
+              description="We will use this to verify that you can download your application. Entering the correct email address will start the file download automatically."
+            />
+            <InputRow>
+              <InputLabel label={"Email address"} htmlFor={"email"}>
+                <Input
+                  bordered
+                  errorMessage={
+                    formik.touched.email && formik.errors.email
+                      ? formik.errors.email
+                      : undefined
+                  }
+                  id="email"
+                  name="email"
+                  onBlur={formik.handleBlur}
+                  onChange={formik.handleChange}
+                  type="email"
+                  value={formik.values.email}
+                />
+              </InputLabel>
+            </InputRow>
+          </Card>
+        </Box>
+      )}
     </Container>
   );
 };
diff --git a/editor.planx.uk/src/pages/VerifyEmail/queries/TEAM_EMAIL_SETTINGS_QUERY.ts b/editor.planx.uk/src/pages/VerifyEmail/queries/TEAM_EMAIL_SETTINGS_QUERY.ts
@@ -1,5 +1,4 @@
-// duplicated from api.planx.uk/modules/send/email/service.ts as it doesn't seem possible to import from there
-// it causes "Uncaught ReferenceError: global is not defined" errors
+// NOTE this is duplicated from api.planx.uk/modules/send/email/service.ts as it doesn't seem possible to import from there
 export const TEAM_EMAIL_SETTINGS_QUERY = `
       query GetTeamEmailSettings($slug: String) {
         teams(where: { slug: { _eq: $slug } }) {

diff --git a/editor.planx.uk/src/routes/index.tsx b/editor.planx.uk/src/routes/index.tsx
@@ -31,7 +31,7 @@ const editorRoutes = mount({
         }),
   ),
 
-  ":team/:flow/:sessionId/verify-email": map((req) => {
+  "/:team/:flow/:sessionId/verify-email": map((req) => {
     return route({
       title: makeTitle("Verify your email"),
       view: <VerifyEmail params={req.params} />,