Move application summary and capitalise team name

theopensystemslab · Dec 10, 2024 · 2b8c421 · 2b8c421
1 parent 868c820
commit 2b8c421
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 20 deletions.
diff --git a/editor.planx.uk/src/pages/SubmissionDownload/VerifySubmissionEmail.stories.tsx b/editor.planx.uk/src/pages/SubmissionDownload/VerifySubmissionEmail.stories.tsx
@@ -13,7 +13,8 @@ export default meta;
 type Story = StoryObj<typeof meta>;
 
 export const Basic = {
-  render: () => (
-    <VerifySubmissionEmail params={{ sessionId: "1", team: "PlanX" }} />
-  ),
-};
+  args: {
+    params: { sessionId: "1", team: "barking and dagenham" },
+  },
+  render: (args) => <VerifySubmissionEmail {...args} />,
+} satisfies Story;
diff --git a/editor.planx.uk/src/pages/SubmissionDownload/VerifySubmissionEmail.tsx b/editor.planx.uk/src/pages/SubmissionDownload/VerifySubmissionEmail.tsx
@@ -7,6 +7,7 @@ import { SummaryListTable } from "@planx/components/shared/Preview/SummaryList";
 import axios, { isAxiosError } from "axios";
 import DelayedLoadingIndicator from "components/DelayedLoadingIndicator/DelayedLoadingIndicator";
 import { useFormik } from "formik";
+import startCase from "lodash/startCase.js";
 import React, { useState } from "react";
 import InputLabel from "ui/public/InputLabel";
 import ErrorWrapper from "ui/shared/ErrorWrapper";
@@ -73,14 +74,27 @@ export const VerifySubmissionEmail = ({
       ) : (
         <Box width="100%">
           <Card handleSubmit={formik.handleSubmit}>
+            <Typography maxWidth="formWrap" variant="h2" gutterBottom>
+              Application details
+            </Typography>
+            <SummaryListTable>
+              <Box component="dt">Session ID</Box>
+              <Box component="dd">{sessionId}</Box>
+              <Box component="dt">Local Authority</Box>
+              <Box component="dd">{startCase(team)}</Box>
+            </SummaryListTable>
             <ErrorWrapper error={downloadApplicationError}>
               <>
                 <CardHeader
                   title="Verify your submission email address"
                   description="We will use this to confirm that you have access to the submission email inbox that is set up for your team. Entering the correct email address will start the file download automatically."
                 />
+
                 <InputRow>
-                  <InputLabel label={"Email address"} htmlFor={"email"}>
+                  <InputLabel
+                    label={"Submission email address"}
+                    htmlFor={"email"}
+                  >
                     <Input
                       bordered
                       errorMessage={
@@ -97,20 +111,6 @@ export const VerifySubmissionEmail = ({
                     />
                   </InputLabel>
                 </InputRow>
-                <Typography
-                  maxWidth="formWrap"
-                  variant="h2"
-                  pt={5}
-                  gutterBottom
-                >
-                  Application details
-                </Typography>
-                <SummaryListTable>
-                  <Box component="dt">Session ID</Box>
-                  <Box component="dd">{sessionId}</Box>
-                  <Box component="dt">Local Authority</Box>
-                  <Box component="dd">{team}</Box>
-                </SummaryListTable>
               </>
             </ErrorWrapper>
           </Card>

diff --git a/editor.planx.uk/src/pages/SubmissionDownload/tests/VerifySubmissionEmail.test.tsx b/editor.planx.uk/src/pages/SubmissionDownload/tests/VerifySubmissionEmail.test.tsx
@@ -11,7 +11,9 @@ describe("when the VerifySubmissionEmail component renders", () => {
     expect(
       screen.queryByText("Verify your submission email address"),
     ).toBeInTheDocument();
-    expect(screen.queryByLabelText("Email address")).toBeInTheDocument();
+    expect(
+      screen.queryByLabelText("Submission email address"),
+    ).toBeInTheDocument();
   });
   it.todo("should not display an error message");
   it.todo(