v0.3 (#1)

* Add Prisma build hooks

* Add prisma migrations folder

* Add seed file

* Change toast to modal

* Add revalidation to static prop generator

* Fix issue where QR code disappears after scanning

* Fix footer hyperlink to not show underline

components/Checkin.tsx

@@ -13,43 +13,39 @@ const Checkin: React.FC = () => {
   const [error, setError] = useState(false);
   const [suggestions, setSuggestions] = useState(null);
 
-  useEffect(() => {
-    function onScanSuccess(decodedResult) {
-      let code;
-      try {
-        const url = new URL(decodedResult);
-        code = url.pathname.replace("/rsvp/", "");
-        setError(false);
-        setInviteCode(code);
-      } catch (e) {
-        setError(true);
-      }
+  function onScanSuccess(decodedResult) {
+    let code;
+    try {
+      const url = new URL(decodedResult);
+      code = url.pathname.replace("/rsvp/", "");
+      setError(false);
+      setInviteCode(code);
+    } catch (e) {
+      setError(true);
     }
+  }
 
-    function onScanFailure(error) {}
+  function onScanFailure(error) {}
 
-    let html5QrcodeScanner = new Html5QrcodeScanner(
-      "qrscanner",
-      {
-        fps: 10,
-        supportedScanTypes: [Html5QrcodeScanType.SCAN_TYPE_CAMERA],
-      },
-      false
-    );
-
-    html5QrcodeScanner.render(onScanSuccess, onScanFailure);
-    return () => {
-      setInviteCode("");
-      setError(false);
-      html5QrcodeScanner.clear();
-    };
-  }, []);
+  useEffect(() => {
+    if (!checkinCard) {
+      let html5QrcodeScanner = new Html5QrcodeScanner(
+        "qrscanner",
+        {
+          fps: 10,
+          supportedScanTypes: [Html5QrcodeScanType.SCAN_TYPE_CAMERA],
+        },
+        false
+      );
+      html5QrcodeScanner.render(onScanSuccess, onScanFailure);
+    }
+  }, [checkinCard]);
 
   const back = (e: React.SyntheticEvent) => {
     e.preventDefault();
     setCheckinCard(null);
     setInviteCode("");
-    router.push("/checkin", undefined, { shallow: true });
+    setError(false);
   };
 
   const checkin = async (e: React.SyntheticEvent) => {

components/InviteCard.tsx

@@ -197,19 +197,26 @@ const InviteCard: React.FC<{
           <p>{responseModalText}</p>
         </Modal.Body>
         <Modal.Footer>
-          <Button variant="secondary" onClick={handleCloseModal}>Edit response</Button>
-          { hasError ? <></> :
+          <Button variant="secondary" onClick={handleCloseModal}>
+            Edit response
+          </Button>
+          {hasError ? (
+            <></>
+          ) : (
             <Button
-            variant="primary"
-            onClick={() => {
-              // showBack flag is set to False for /rsvp component
-              if (showBack) {
-                router.reload();
-              } else {
-                router.push("/");
-              }
-            }}>Go to homepage</Button>
-          }
+              variant="primary"
+              onClick={() => {
+                // showBack flag is set to False for /rsvp component
+                if (showBack) {
+                  router.reload();
+                } else {
+                  router.push("/");
+                }
+              }}
+            >
+              Go to homepage
+            </Button>
+          )}
         </Modal.Footer>
       </Modal>
       <Card>

pages/_document.js

@@ -12,7 +12,7 @@ export default function Document() {
         />
         <link
           rel="stylesheet"
-          href="https://fonts.googleapis.com/css?family=Licorice&display=optional"
+          href="https://fonts.googleapis.com/css?family=Licorice"
         />
         <link rel="shortcut icon" href="/favicon.ico" />
       </Head>

pages/god/guests/index.tsx

@@ -2,7 +2,7 @@ import { Guest, Invite, Table as GuestTable, Feature } from ".prisma/client";
 import { withPageAuthRequired } from "@auth0/nextjs-auth0";
 import { GetServerSideProps } from "next";
 import React from "react";
-import { Button, Row, Table } from "react-bootstrap";
+import { Row, Table } from "react-bootstrap";
 import Main from "../../../components/Main";
 import {
   QuickAddGuest,
@@ -75,7 +75,10 @@ const GodGuests: React.FC = (props: any) => {
       <Main>
         <Row className="m-3">
           <h3>Guest Management</h3>
-          <p>Count: {guests.length}</p>
+          <p>
+            Attending/Count: {guests.filter((g) => g.isAttending).length}/
+            {guests.length}
+          </p>
           <QuickAddGuest />
           <QuickAssignTableInvite quickAdd={quickAddProps} />
           <QuickGenerateInvite quickAdd={quickAddProps} />
@@ -95,6 +98,12 @@ const GodGuests: React.FC = (props: any) => {
                 {sortedTables.map((t) => {
                   return (
                     <td key={t.id}>
+                      {
+                        guests.filter((g) => {
+                          return g.tableId === t.id && g.isAttending;
+                        }).length
+                      }
+                      /
                       {
                         guests.filter((g) => {
                           return g.tableId === t.id;
@@ -167,7 +176,7 @@ const GodGuests: React.FC = (props: any) => {
                     <td>{invite?.type}</td>
                     <td>
                       {g.isAttending == null
-                        ? "?"
+                        ? "Wait"
                         : g.isAttending === true
                         ? "Yes"
                         : "No"}

pages/god/invites/[inviteId].tsx

@@ -133,8 +133,7 @@ const InviteRsvpPage: React.FC = (props: any) => {
               <a href={`https://wedo.sg/rsvp/${invite.inviteCode}`}>
                 https://wedo.sg/rsvp/{invite.inviteCode}
               </a>{" "}
-              by {moment(invite.respondBy).format("MMM Do YYYY")}, or reply to
-              this message with your response.
+              by {moment(invite.respondBy).format("MMM Do YYYY")}.
             </p>
             <p>Thank you and we hope to see you there!</p>
             <p>Regards, Justin Ng &amp; Alethea Sim</p>

pages/index.tsx

@@ -69,6 +69,7 @@ export const getStaticProps: GetStaticProps = async () => {
       enableRsvpForm: enableRsvpForm,
       splashPhotos: splashPhotos,
     },
+    revalidate: 3600,
   };
 };
 

styles/globals.css

@@ -48,6 +48,7 @@ a {
   justify-content: center;
   align-items: center;
   flex-grow: 1;
+  text-decoration: none;
 }
 
 .title a {