From 2652bbdad738a3b17faa5b8a29eb6a38f8ca7913 Mon Sep 17 00:00:00 2001
From: Jacob Edley <edleyjacob@gmail.com>
Date: Wed, 29 Jan 2025 21:12:56 -0600
Subject: [PATCH] add mobile view skeletons (#279)

---
 app/page.tsx                                  | 29 +++++++---
 .../Profile/RSVP/ModalViews/Accepted.tsx      | 54 +++++++++++++++++++
 .../Profile/RSVP/ModalViews/ConfirmReject.tsx | 32 +++++++++++
 .../Profile/RSVP/ModalViews/Rejected.tsx      | 24 +++++++++
 .../RSVP/ModalViews/styles.module.scss        |  0
 util/api.ts                                   | 14 +++++
 6 files changed, 146 insertions(+), 7 deletions(-)
 create mode 100644 components/Profile/RSVP/ModalViews/Accepted.tsx
 create mode 100644 components/Profile/RSVP/ModalViews/ConfirmReject.tsx
 create mode 100644 components/Profile/RSVP/ModalViews/Rejected.tsx
 create mode 100644 components/Profile/RSVP/ModalViews/styles.module.scss

diff --git a/app/page.tsx b/app/page.tsx
index 8b7b5837..7b745378 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -1,19 +1,34 @@
 import React from "react";
 import styles from "./page.module.scss";
-import Olympian from "@/components/Home/Olympian/Olympian";
-import Footer from "@/components/Home/Footer/Footer";
-import FAQJoinUs from "@/components/Home/FAQJoinUs/FAQJoinUs";
-import Sponsors from "@/components/Home/Sponsors/Sponsors";
-import FAQSection from "@/components/Home/FAQ/FAQ";
+// import Olympian from "@/components/Home/Olympian/Olympian";
+// import Footer from "@/components/Home/Footer/Footer";
+// import FAQJoinUs from "@/components/Home/FAQJoinUs/FAQJoinUs";
+// import Sponsors from "@/components/Home/Sponsors/Sponsors";
+// import FAQSection from "@/components/Home/FAQ/FAQ";
+import Accepted from "@/components/Profile/RSVP/ModalViews/Accepted";
+import Rejected from "@/components/Profile/RSVP/ModalViews/Rejected";
+import ConfirmReject from "@/components/Profile/RSVP/ModalViews/ConfirmReject";
 
 const Home: React.FC = () => {
     return (
         <main className={styles.main}>
-            <Olympian />
+            <ConfirmReject
+                handleAPIDecline={() => {}}
+                handleGoBack={() => {}}
+            />
+            <Accepted
+                reimburse={120.23}
+                handleConfirm={() => {}}
+                handleDecline={() => {}}
+            >
+                <b>Congrats, stuff is happening</b>
+            </Accepted>
+            <Rejected handleCancel={() => {}} />
+            {/* <Olympian />
             <FAQJoinUs />
             <FAQSection />
             <Sponsors />
-            <Footer />
+            <Footer /> */}
         </main>
     );
 };
diff --git a/components/Profile/RSVP/ModalViews/Accepted.tsx b/components/Profile/RSVP/ModalViews/Accepted.tsx
new file mode 100644
index 00000000..21b60113
--- /dev/null
+++ b/components/Profile/RSVP/ModalViews/Accepted.tsx
@@ -0,0 +1,54 @@
+import React from "react";
+import styles from "./styles.module.scss";
+
+type Accepted = {
+    children: React.ReactNode;
+    reimburse: number;
+    handleConfirm: () => void;
+    handleDecline: () => void;
+};
+
+export default function Accepted({ children, reimburse }: Accepted) {
+    return (
+        <div className={styles.container}>
+            <div className={styles.textBlock}>
+                {children}
+                <p>
+                    If you would like to attend HackIllinois 2024, click Confirm
+                    to finish the RSVP process. If you won&apos;t be attending
+                    please click Decline. This cannot be reversed.
+                </p>
+                {reimburse > 0 && (
+                    <p>
+                        Additionally, you have been approved for a travel
+                        reimbursement of ${reimburse.toFixed(2)}. Receiving this
+                        reimbursement is contingent on you coming to
+                        HackIllinois in-person and submitting a project.
+                    </p>
+                )}
+            </div>
+            <div className={styles.buttonGroup}>
+                {/* <ConfirmButton onClick={handleConfirm} />
+                <DeclineButton onClick={handleDecline} /> */}
+            </div>
+            {/* <div className={styles.mobileButtonGroup}>
+                <button onClick={handleConfirm}>
+                    <Image
+                        alt="confirm button"
+                        src={MobileConfirmButton}
+                        width={309}
+                        height={54}
+                    />
+                </button>
+                <button onClick={handleDecline}>
+                    <Image
+                        alt="decline button"
+                        src={MobileDeclineButton}
+                        width={309}
+                        height={54}
+                    />
+                </button>
+            </div> */}
+        </div>
+    );
+}
diff --git a/components/Profile/RSVP/ModalViews/ConfirmReject.tsx b/components/Profile/RSVP/ModalViews/ConfirmReject.tsx
new file mode 100644
index 00000000..baea6e1b
--- /dev/null
+++ b/components/Profile/RSVP/ModalViews/ConfirmReject.tsx
@@ -0,0 +1,32 @@
+import styles from "./styles.module.scss";
+
+type ConfirmRejectProps = {
+    handleGoBack: () => void;
+    handleAPIDecline: () => void;
+};
+
+export default function ConfirmReject({ handleGoBack }: ConfirmRejectProps) {
+    return (
+        <div className={styles.container}>
+            <b>Are you sure you want to decline?</b>
+            <div className={styles.buttonGroup}>
+                <button
+                    onClick={handleGoBack}
+                    className={styles.unhoveredButton}
+                >
+                    GO BACK
+                </button>
+                {/* <DeclineButton onClick={handleDecline} /> */}
+            </div>
+            <div className={styles.mobileButtonGroup}>
+                <button
+                    onClick={handleGoBack}
+                    className={styles.unhoveredButton}
+                >
+                    GO BACK
+                </button>
+                {/* <DeclineButton onClick={handleDecline} /> */}
+            </div>
+        </div>
+    );
+}
diff --git a/components/Profile/RSVP/ModalViews/Rejected.tsx b/components/Profile/RSVP/ModalViews/Rejected.tsx
new file mode 100644
index 00000000..2d4062a2
--- /dev/null
+++ b/components/Profile/RSVP/ModalViews/Rejected.tsx
@@ -0,0 +1,24 @@
+import styles from "./styles.module.scss";
+
+type RejectedProps = {
+    handleCancel: () => void;
+};
+
+export default function Rejected({}: RejectedProps) {
+    return (
+        <div className={styles.container}>
+            <b>
+                Unfortunately, we were unable to offer you a spot at
+                HackIllinois
+            </b>
+            <b>
+                Email us at{" "}
+                <a href="mailto:contact@hackillinois.org">
+                    contact@hackillinois.org
+                </a>{" "}
+                if you have any questions!
+            </b>
+            {/* <OkButton onClick={handleCancel} /> */}
+        </div>
+    );
+}
diff --git a/components/Profile/RSVP/ModalViews/styles.module.scss b/components/Profile/RSVP/ModalViews/styles.module.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/util/api.ts b/util/api.ts
index b2f29033..d83e6fd8 100644
--- a/util/api.ts
+++ b/util/api.ts
@@ -134,6 +134,20 @@ export async function getRSVP(): Promise<RSVPType> {
     return res;
 }
 
+export async function RSVPDecideAccept() {
+    const res = await requestv2("PUT", "/admission/rsvp/accept").catch(body =>
+        handleError(body)
+    );
+    return res;
+}
+
+export async function RSVPDecideDecline() {
+    const res = await requestv2("PUT", "/admission/rsvp/decline").catch(body =>
+        handleError(body)
+    );
+    return res;
+}
+
 export async function uploadFile(file: File): Promise<unknown> {
     const { url, fields } = await requestv2("GET", "/s3/upload");
     const data = new FormData();