add ability to save resume visibility

LaurierHawkHacks · May 16, 2024 · c081f21 · c081f21
1 parent 3330617
commit c081f21
Show file tree

Hide file tree

Showing 3 changed files with 90 additions and 4 deletions.
diff --git a/functions/src/index.ts b/functions/src/index.ts
@@ -273,6 +273,7 @@ export const updateSocials = functions.https.onCall(async (data, context) => {
             github: data.github,
             discord: data.discord,
             resumeRef: data.resumeRef,
+            resumeVisibility: data.resumeVisibility,
         });
         functions.logger.info("Socials updated:", data);
         return response(HttpStatus.OK, { message: "ok" });

diff --git a/src/pages/Networking/Networking.page.tsx b/src/pages/Networking/Networking.page.tsx
@@ -15,8 +15,8 @@ import {
     uploadMentorResume,
 } from "@/services/utils";
 import { useNotification } from "@/providers/notification.provider";
-import type { Socials } from "@/services/utils/types";
-import { Modal } from "@/components";
+import type { ResumeVisibility, Socials } from "@/services/utils/types";
+import { Modal, Select } from "@/components";
 import { Cog6ToothIcon } from "@heroicons/react/24/outline";
 
 const allowedFileTypes = [
@@ -38,6 +38,18 @@ const mediaTypes: { name: string; key: keyof Socials }[] = [
     { name: "Discord", key: "discord" },
 ];
 
+const visibilityOptions: ResumeVisibility[] = [
+    "Public",
+    "Sponsors Only",
+    "Private",
+];
+
+const visibilityDescription = {
+    Public: "Your resume will be visible to anyone who scans your ticket QR code.",
+    Private: "Your resume will only be visible to you.",
+    "Sponsors Only": "Your resume will only be visible to our sponsors.",
+};
+
 export const NetworkingPage = () => {
     const { currentUser, userApp } = useAuthProvider();
     const [isLoading, setIsLoading] = useState(true);
@@ -47,6 +59,9 @@ export const NetworkingPage = () => {
     const { showNotification } = useNotification();
     const [socials, setSocials] = useState<Socials | null>(null);
     const [isResumeSettingsOpened, setIsResumeSettingsOpened] = useState(false);
+    const [newVisibility, setNewVisibility] = useState<ResumeVisibility>(
+        socials?.resumeVisibility ?? "Public"
+    );
 
     const [file, setFile] = useState<File | null>(null);
 
@@ -212,6 +227,37 @@ export const NetworkingPage = () => {
         setIsResumeSettingsOpened(false);
     };
 
+    const saveResumeSettings = async () => {
+        try {
+            await updateSocials({
+                ...mediaValues,
+                resumeVisibility: newVisibility,
+            });
+            setSocials(
+                socials
+                    ? {
+                          ...socials,
+                          resumeVisibility: newVisibility,
+                      }
+                    : null
+            );
+            setMediaValues({
+                ...mediaValues,
+                resumeVisibility: newVisibility,
+            });
+            showNotification({
+                title: "Resume Settings Saved",
+                message: "",
+            });
+            setIsResumeSettingsOpened(false);
+        } catch (error) {
+            showNotification({
+                title: "Error",
+                message: "Failed to save resume settings. Please try again.",
+            });
+        }
+    };
+
     if (isLoading) return <LoadingAnimation />;
 
     return (
@@ -399,7 +445,44 @@ export const NetworkingPage = () => {
                 open={isResumeSettingsOpened}
                 onClose={closeResumeSettings}
             >
-                <div>
+                <div className="space-y-4">
+                    <div>
+                        <Select
+                            label="Resume Visibility"
+                            initialValue={socials?.resumeVisibility ?? "Public"}
+                            options={visibilityOptions}
+                            onChange={(value) => {
+                                if (value !== newVisibility)
+                                    setEditMode("resume-visibility");
+                                setNewVisibility(value as ResumeVisibility);
+                            }}
+                        />
+                        <p>{visibilityDescription[newVisibility]}</p>
+                        {editMode === "resume-visibility" && (
+                            <div className="mt-4 flex gap-2">
+                                <button
+                                    type="button"
+                                    className="bg-gray-300/30 rounded-lg px-4 py-1"
+                                    onClick={() => {
+                                        setNewVisibility(
+                                            socials?.resumeVisibility ??
+                                                "Public"
+                                        );
+                                        setEditMode("");
+                                    }}
+                                >
+                                    Cancel
+                                </button>
+                                <button
+                                    type="button"
+                                    className="bg-peachWhite text-black rounded-lg px-4 py-1"
+                                    onClick={saveResumeSettings}
+                                >
+                                    Save
+                                </button>
+                            </div>
+                        )}
+                    </div>
                     <div>
                         <button
                             className="border-2 rounded-lg border-red-400 w-full flex px-2 py-4 gap-4 transition hover:bg-red-600/5 text-red-500 font-medium"

diff --git a/src/services/utils/types.ts b/src/services/utils/types.ts
@@ -32,6 +32,8 @@ export interface Invitation {
     teamName: string;
 }
 
+export type ResumeVisibility = "Public" | "Private" | "Sponsors Only";
+
 export interface Socials {
     instagram: string;
     github: string;
@@ -40,6 +42,7 @@ export interface Socials {
     resumeRef: string;
     docId: string;
     uid: string;
+    resumeVisibility?: ResumeVisibility;
 }
 
 export interface TicketData {
@@ -59,7 +62,6 @@ export interface ExtendedTicketData extends TicketData {
     allergies: string[]; // list of allergies
 }
 
-
 export interface EventItem {
     id: string;
     title: string;