Added length of appointment to config + fixed appointments not showing in scheduling modal + added appointment confirmation template. BOD-141 BOD-149 BOD-148

client/src/pages/csi/csi.container.page.jsx

@@ -28,9 +28,10 @@ export default function CsiContainerPage() {
     return (
       <div>
         <Result
-          status='error'
+          status="error"
           title={t("csi.errors.notfoundtitle")}
-          subTitle={t("csi.errors.notfoundsubtitle")}>
+          subTitle={t("csi.errors.notfoundsubtitle")}
+        >
           {error ? (
             <div>ERROR: {error.graphQLErrors.map((e) => e.message)}</div>
           ) : null}
@@ -70,18 +71,20 @@ export default function CsiContainerPage() {
 
   return (
     <Layout
-      style={{ height: "100vh", display: "flex", flexDirection: "column" }}>
+      style={{ height: "100vh", display: "flex", flexDirection: "column" }}
+    >
       <div
         style={{
           display: "flex",
           flexDirection: "column",
           alignItems: "center",
-        }}>
+        }}
+      >
         <div style={{ display: "flex", alignItems: "center", margin: "2em" }}>
           {bodyshop.logo_img_path ? (
-            <img src={bodyshop.logo_img_path} alt='Logo' />
+            <img src={bodyshop.logo_img_path} alt="Logo" />
           ) : null}
-          <div>
+          <div style={{ margin: "2em" }}>
             <strong>{bodyshop.shopname || ""}</strong>
             <div>{`${bodyshop.address1 || ""}`}</div>
             <div>{`${bodyshop.address2 || ""}`}</div>
@@ -93,13 +96,15 @@ export default function CsiContainerPage() {
         <Typography.Title>{t("csi.labels.title")}</Typography.Title>
         <strong>{`Hi ${job.ownr_fn || ""}!`}</strong>
         <Typography.Paragraph>
-          At {bodyshop.shopname || ""}, we value your feedback. We would love to
-          hear what you have to say. Please fill out the form below.
+          {`At ${
+            bodyshop.shopname || ""
+          }, we value your feedback. We would love to
+          hear what you have to say. Please fill out the form below.`}
         </Typography.Paragraph>
       </div>
 
       {submitting.error ? (
-        <AlertComponent message={submitting.error} type='error' />
+        <AlertComponent message={submitting.error} type="error" />
       ) : null}
 
       {submitting.submitted ? (
@@ -109,9 +114,10 @@ export default function CsiContainerPage() {
             margin: "2em 4em",
             padding: "2em",
             overflowY: "auto",
-          }}>
+          }}
+        >
           <Result
-            status='success'
+            status="success"
             title={t("csi.successes.submitted")}
             subTitle={t("csi.successes.submittedsub")}
           />
@@ -123,13 +129,15 @@ export default function CsiContainerPage() {
             margin: "2em 4em",
             padding: "2em",
             overflowY: "auto",
-          }}>
+          }}
+        >
           <Form form={form} onFinish={handleFinish}>
             <ConfigFormComponents componentList={csiquestions} />
             <Button
               loading={submitting.loading}
-              type='primary'
-              htmlType='submit'>
+              type="primary"
+              htmlType="submit"
+            >
               {t("general.actions.submit")}
             </Button>
           </Form>
@@ -137,7 +145,7 @@ export default function CsiContainerPage() {
       )}
 
       <Layout.Footer>
-        Copyright ImEX.Online. Survey ID: {surveyId}
+        {`Copyright ImEX.Online. Survey ID: ${surveyId}`}
       </Layout.Footer>
     </Layout>
   );