From 26d72484163a3635b6108a16ae153a556ea8a34c Mon Sep 17 00:00:00 2001
From: andrewzpu <66804382+andrewzpu@users.noreply.github.com>
Date: Wed, 8 May 2024 11:50:13 -0700
Subject: [PATCH] Added program edit popup and "no programs" message (#97)

* Added program edit popup and "no programs" message

* Fixed add button display

* Reorganized ProgramFormButton to take take any component

* Removed start and end date from card
---
 frontend/public/programs/EditIcon.png         | Bin 0 -> 938 bytes
 frontend/public/programs/Empty.png            | Bin 0 -> 15312 bytes
 frontend/src/components/ProgramCard.tsx       | 162 +++++++++++++-----
 frontend/src/components/ProgramFormButton.tsx |  47 +----
 frontend/src/pages/programs.tsx               |  60 +++++--
 5 files changed, 177 insertions(+), 92 deletions(-)
 create mode 100644 frontend/public/programs/EditIcon.png
 create mode 100644 frontend/public/programs/Empty.png

diff --git a/frontend/public/programs/EditIcon.png b/frontend/public/programs/EditIcon.png
new file mode 100644
index 0000000000000000000000000000000000000000..4b349aecf7ddb32632a2eafffbbde5fa293c8f65
GIT binary patch
literal 938
zcmV;b16BNqP)<h;3K|Lk000e1NJLTq002P%002V>1^@s6!#`+F00009a7bBm001mY
z001mY0i`{bsQ>@~0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH13yVbK~#7F?VCMv
z+CUhFUkMkGigYQ-3Ctv<$0rCk2%ZF6uFMULyL7=Fn8He#Dw8TDE>pk^IYBrAE@C^4
zHv27ue<iV!7HL=Lnb8bLi(ntW+CNJ`K>=YQ4|F<pl<Z^vs>!z+uhk45TvRGw(eE$T
zecXHrM@JvPJU8IzoL6xVgTXxP6gEu8aZW-65H)~}dAV9h8H1A`D#rdumY#<t!rUa3
z%XF>JB}?;mf_)D<Xs!g&;PJn%tO$lW4nDU04w>C1h<Ha3Veh>6-3?Q4J~hSml&B(n
zFhc_M0w|5ec6jjR*>QOhSAIM7mmmbN-ral4>cTm^cvenIgw^-ktG9%w0`6%?7r{=0
zx=4M;3Bdv$;$kq|_xWs143flPi68;zy`Ynnpd)euh&mdL8Ya^pkM>R`3pC!*J_{cE
zhT-|=u#@PQ1bG1u@lS*#dL<#A0Kz{JlISBLzJL|6Md;BxBp0xvjTmGvL7f1IULXe9
zHjJtTgmi;pWG6ur0Yo+uG!j6hFF`W_M7k0*6hNdWK~n)lIubM%Kx|&Za?0C=64VPI
zHY>pZ0mSAc7$Sh!j0A%O5b7luCV)^Y!9W4T4pgC3fVIz8id>|Gnj|O}FmRC~$t4&r
zKzu8bkOKikyf&fRt>WgI1hk-p>;#B!M^s3_znii6SGSs<kf{Li3nG=yp#UP<LTe5M
z5b_e7PFslp#uhpWAmkfH%Rc53l0gDIwujMR291zQg5xw3r{GS&NGkz^<mJFlkOYkd
z5bGsS3YNFa#zS)fghUb&q`&|HM7V?`DKJC;u_g&IQ(%w)B6!3Y?cU*g3==?vB*E(;
z3d=#zDJm~sn<RknPePOwP~|QA4CQiP<^c;G2^cX_3f9c6R+X<*jII0%e+ibg8#qMH
zQRP?oOJMM;++1Aq!}JzF(<0z<;IllsBb2c!zbbz7_S4mA)>lwaP_Rjsg8^DVy}hQD
zqb~0rtH?X_1TFK<Fc`V?c6o1eefK9n(&hrn*bZLt`nK@q?G>ieUzS)vg?)i-rCfQ*
zCs4McC3Hi%{oCRaSpM69Fg$Bvi_zdVW7{*E4~H-L%S&t}%O~Xi1N@tXf6_3Pk^lez
M07*qoM6N<$f*hQQfdBvi

literal 0
HcmV?d00001

diff --git a/frontend/public/programs/Empty.png b/frontend/public/programs/Empty.png
new file mode 100644
index 0000000000000000000000000000000000000000..7424257d630de6eb2107caf35cd9252b0203f231
GIT binary patch
literal 15312
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
Rjs3q1igGHlRc}qd{4c<sUMBzm

literal 0
HcmV?d00001

diff --git a/frontend/src/components/ProgramCard.tsx b/frontend/src/components/ProgramCard.tsx
index 6e44f8d2..e406d9c2 100644
--- a/frontend/src/components/ProgramCard.tsx
+++ b/frontend/src/components/ProgramCard.tsx
@@ -18,21 +18,55 @@ export type CardProps = {
   setPrograms: React.Dispatch<React.SetStateAction<ProgramMap>>;
 };
 
-function processDate(startString: Date): string {
-  const startDate = new Date(startString);
+// function checkOffscreen(id: string) {
+//   const elem = document.getElementById("edit" + id);
+//   if (elem === null) {
+//     return;
+//   }
 
-  const options = {
-    year: "numeric",
-    month: "short",
-    day: "numeric",
-  } as const;
+//   const bounding = elem.getBoundingClientRect();
 
-  return "Started " + startDate.toLocaleDateString("en-US", options);
+//   console.log(bounding.right);
+//   console.log(window.innerWidth);
+//   console.log(document.documentElement.clientWidth);
+
+//   return bounding.right + 26 - (window.innerWidth || document.documentElement.clientWidth);
+// }
+
+function toggleEdit(id: string) {
+  const editId = "edit" + id;
+  console.log(editId);
+  const editButton = document.getElementById(editId);
+  if (editButton === null) {
+    console.log("error");
+    return;
+  }
+
+  if (editButton.style.display !== "block") {
+    editButton.style.display = "block";
+  } else {
+    editButton.style.display = "none";
+  }
+
+  //   if (checkOffscreen(id) > 0) {
+  //     editButton.style.right = "0px";
+  //   }
 }
 
 export function ProgramCard({ program, isAdmin, className, setPrograms }: CardProps) {
   const { isTablet } = useWindowSize();
 
+  const editId = "edit" + program._id;
+  const optionsId = "option" + program._id;
+
+  const optionsButton = document.getElementById(optionsId);
+  if (optionsButton !== null) {
+    optionsButton.onclick = function () {
+      toggleEdit(program._id);
+    };
+  }
+
+  let editClass = "absolute right-2 hidden";
   let outerDivClass = "text-white grow overflow-hidden tracking-wide leading-6";
   let topDivClass = "flex flex-row";
   let botDivClass = "text-black bg-white";
@@ -40,11 +74,13 @@ export function ProgramCard({ program, isAdmin, className, setPrograms }: CardPr
   let titleClass;
   let optionsDiv = "grow";
   const optionsClass = "relative float-right hover:cursor-pointer";
-  let dateClass;
   let numClass;
   let numTextClass;
   let iconClass = "relative";
 
+  let optionsHeight = 18;
+  let optionsWidth = 16;
+
   const programFields: Program = {
     _id: program._id,
     name: program.name,
@@ -61,25 +97,27 @@ export function ProgramCard({ program, isAdmin, className, setPrograms }: CardPr
   };
 
   if (isTablet) {
+    editClass += " top-7 w-12 h-5 text-[10px]";
     outerDivClass += " rounded-lg h-36";
     topDivClass += " h-20";
     botDivClass += " h-16";
     typeClass = cn("uppercase relative text-[10px] top-2 left-3", poppins.className);
     titleClass = cn("capitalize relative text-sm top-2 left-3 font-bold", poppins.className);
     optionsDiv += " pr-[8px] pt-[12px]";
-    dateClass = cn("relative text-[10px] top-2 left-3", poppins.className);
+    optionsHeight /= 2;
+    optionsWidth /= 2;
     numClass = "h-5 gap-x-1.5 flex flex-row relative top-2 left-3";
     numTextClass = cn("text-[10px]", poppins.className);
     iconClass = "h-2 w-3 mt-[7px]";
   } else {
+    editClass += " top-12 w-24 h-8";
     outerDivClass += " rounded-2xl h-68";
     topDivClass += " h-36";
     botDivClass += " h-32";
     typeClass = cn("uppercase relative text-sm top-5 left-7", poppins.className);
     titleClass = cn("capitalize relative text-3xl top-8 left-7 font-bold", poppins.className);
     optionsDiv += " pr-[16px] pt-[24px]";
-    dateClass = cn("relative text-base top-5 left-7", poppins.className);
-    numClass = "h-8 gap-x-1.5 flex flex-row relative top-14 left-7";
+    numClass = "h-8 gap-x-1.5 flex flex-row relative top-5 left-7";
     numTextClass = cn("text-base", poppins.className);
     iconClass = "h-3 w-[18px] mt-[5px]";
   }
@@ -88,37 +126,83 @@ export function ProgramCard({ program, isAdmin, className, setPrograms }: CardPr
     outerDivClass = cn(outerDivClass, className);
   }
 
+  let buttonClass = "relative flex h-full w-full flex-row rounded bg-white";
+  let iconHeight = 16;
+  let iconWidth = 16;
+  let imageClass = "absolute";
+  let editTextClass = "absolute text-pia_dark_green";
+
+  if (isTablet) {
+    iconHeight = 10;
+    iconWidth = 10;
+    buttonClass += " py-[3px]";
+    imageClass += " left-[7px] top-[5px]";
+    editTextClass += " right-[7px]";
+  } else {
+    buttonClass += " py-1";
+    imageClass += " left-2.5 top-2";
+    editTextClass += " left-0 w-full";
+  }
+
+  const editButton: React.JSX.Element = (
+    <button className={buttonClass} value="Edit">
+      <Image
+        className={imageClass}
+        id="editIcon"
+        alt="edit"
+        src="/programs/EditIcon.png"
+        height={iconHeight}
+        width={iconWidth}
+      />
+      <p className={editTextClass}>Edit</p>
+    </button>
+  );
+
   return (
-    <div className={outerDivClass}>
-      <div className={topDivClass} style={{ backgroundColor: program.color }}>
-        <div>
-          <p className={typeClass}>{program.type} Program</p>
-          <p className={titleClass}>{program.name}</p>
-        </div>
-        {isAdmin && (
-          <div className={optionsDiv}>
-            <div className={optionsClass}>
-              <ProgramFormButton type="edit" data={programFields} setPrograms={setPrograms} />
-            </div>
-          </div>
-        )}
+    <div className="relative">
+      <div id={editId} className={editClass}>
+        <ProgramFormButton
+          type="edit"
+          component={editButton}
+          data={programFields}
+          setPrograms={setPrograms}
+        />
       </div>
-      <div className={botDivClass}>
-        <p className={dateClass}>{processDate(program.startDate)}</p>
-        <div className={numClass}>
-          <Image
-            alt="students"
-            src="/programs/Students.png"
-            height={12}
-            width={18}
-            className={iconClass}
-          />
-          {program.students.length === 0 && <p className={numTextClass}>No Students</p>}
-          {program.students.length === 1 && <p className={numTextClass}>1 Student</p>}
-          {program.students.length > 1 && (
-            <p className={numTextClass}>{program.students.length} Students</p>
+      <div className={outerDivClass}>
+        <div className={topDivClass} style={{ backgroundColor: program.color }}>
+          <div>
+            <p className={typeClass}>{program.type} Program</p>
+            <p className={titleClass}>{program.name}</p>
+          </div>
+          {isAdmin && (
+            <div className={optionsDiv}>
+              <Image
+                id={optionsId}
+                alt="options"
+                src="/programs/Options.png"
+                height={optionsHeight}
+                width={optionsWidth}
+                className={optionsClass}
+              />
+            </div>
           )}
         </div>
+        <div className={botDivClass}>
+          <div className={numClass}>
+            <Image
+              alt="students"
+              src="/programs/Students.png"
+              height={12}
+              width={18}
+              className={iconClass}
+            />
+            {program.students.length === 0 && <p className={numTextClass}>No Students</p>}
+            {program.students.length === 1 && <p className={numTextClass}>1 Student</p>}
+            {program.students.length > 1 && (
+              <p className={numTextClass}>{program.students.length} Students</p>
+            )}
+          </div>
+        </div>
       </div>
     </div>
   );
diff --git a/frontend/src/components/ProgramFormButton.tsx b/frontend/src/components/ProgramFormButton.tsx
index 6be94b75..d6ab5fe8 100644
--- a/frontend/src/components/ProgramFormButton.tsx
+++ b/frontend/src/components/ProgramFormButton.tsx
@@ -1,4 +1,3 @@
-import Image from "next/image";
 import { useMemo, useState } from "react";
 import { SubmitHandler, useForm } from "react-hook-form";
 
@@ -17,6 +16,7 @@ import { Dialog, DialogClose, DialogContent, DialogContentSlide, DialogTrigger }
 
 type BaseProperties = {
   classname?: string;
+  component: React.JSX.Element;
   setPrograms: React.Dispatch<React.SetStateAction<ProgramMap>>;
 };
 
@@ -34,6 +34,7 @@ type ProgramFormProperties = EditProperties | AddProperties;
 
 export default function ProgramFormButton({
   type = "edit",
+  component = <p>Please add a component</p>,
   data = null,
   setPrograms,
   classname,
@@ -117,27 +118,7 @@ export default function ProgramFormButton({
   return !isMobile ? (
     <>
       <Dialog open={openForm} onOpenChange={setOpenForm}>
-        {type === "add" && (
-          <DialogTrigger asChild>
-            <Button
-              label="Add Program"
-              onClick={() => {
-                setOpenForm(true);
-              }}
-            />
-          </DialogTrigger>
-        )}
-        {type === "edit" && (
-          <DialogTrigger asChild>
-            <Image
-              alt="options"
-              src="/programs/Options.png"
-              height={18}
-              width={16}
-              className={"relative float-right hover:cursor-pointer"}
-            />
-          </DialogTrigger>
-        )}
+        <DialogTrigger asChild>{component}</DialogTrigger>
         <DialogContentSlide className="w-full bg-white object-right p-6 sm:w-[50%]">
           <form onSubmit={handleSubmit(onSubmit)} className={cn(classname)}>
             {type === "edit" && (
@@ -231,27 +212,7 @@ export default function ProgramFormButton({
   ) : (
     <>
       <Dialog open={openForm} onOpenChange={setOpenForm}>
-        {type === "add" && (
-          <DialogTrigger asChild>
-            <Button
-              label="Add Program"
-              onClick={() => {
-                setOpenForm(true);
-              }}
-            />
-          </DialogTrigger>
-        )}
-        {type === "edit" && (
-          <DialogTrigger asChild>
-            <Image
-              alt="options"
-              src="/programs/Options.png"
-              height={9}
-              width={8}
-              className={"relative float-right hover:cursor-pointer"}
-            />
-          </DialogTrigger>
-        )}
+        <DialogTrigger asChild>{component}</DialogTrigger>
         <DialogContent className="bg-white p-3">
           <ProgramCancel
             isMobile={isMobile}
diff --git a/frontend/src/pages/programs.tsx b/frontend/src/pages/programs.tsx
index d66c887c..c319552d 100644
--- a/frontend/src/pages/programs.tsx
+++ b/frontend/src/pages/programs.tsx
@@ -1,3 +1,4 @@
+import Image from "next/image";
 import React, { useContext, useEffect, useMemo, useState } from "react";
 
 import { Program, getAllPrograms } from "../api/programs";
@@ -19,8 +20,7 @@ export default function Programs() {
 
   const [programs, setPrograms] = useState<ProgramMap>({});
 
-  const { isAdmin, loadingUser } = useContext(UserContext);
-  const _loadingUser = loadingUser;
+  const { isAdmin } = useContext(UserContext);
 
   useEffect(() => {
     getAllPrograms().then(
@@ -42,15 +42,22 @@ export default function Programs() {
     );
   });
 
-  let mainClass = "h-full overflow-y-scroll no-scrollbar";
+  let mainClass = "h-full overflow-y-scroll no-scrollbar flex flex-col";
   let titleClass = "font-[alternate-gothic]";
   let headerClass = "flex flex-row";
   let cardsGridClass = "grid";
   let cardClass = "";
 
+  let emptyClass = "w-fill grow content-center justify-center";
+  let emptyHeight;
+  let emptyWidth;
+
   if (isTablet) {
     titleClass += " text-2xl leading-none h-6";
     mainClass += " p-0";
+    emptyClass += " pb-24";
+    emptyHeight = 46;
+    emptyWidth = 86;
 
     if (isMobile) {
       headerClass += " pt-2 pb-3";
@@ -65,6 +72,9 @@ export default function Programs() {
     titleClass += " text-[40px] leading-none h-10";
     headerClass += " p-5 pt-10 pb-5";
     cardClass += " p-5";
+    emptyClass += " pb-40";
+    emptyHeight = 99;
+    emptyWidth = 156;
 
     if (extraLarge) {
       cardsGridClass += " grid-cols-3 max-w-[1740px]";
@@ -75,21 +85,51 @@ export default function Programs() {
     }
   }
 
+  let addButtonClass = "m-0 rounded-3xl bg-pia_dark_green text-white";
+  if (isTablet) {
+    addButtonClass += " text-[10px] h-6 px-[10px]";
+  } else {
+    addButtonClass += " text-base h-12 px-6";
+  }
+
+  const addButton: React.JSX.Element = (
+    <button type="submit" className={addButtonClass}>
+      + Create Program
+    </button>
+  );
+
   return (
     <main className={mainClass}>
       <div className={headerClass}>
         <h1 className={titleClass}>Programs</h1>
         <div className="grow"></div>
-        {isAdmin && <ProgramFormButton type="add" setPrograms={setPrograms} />}
+        {isAdmin && (
+          <ProgramFormButton type="add" component={addButton} setPrograms={setPrograms} />
+        )}
         {/* Should be replaced with Add Button when created */}
       </div>
-      <div className={cardsGridClass}>
-        {Object.values(programs).map((program) => (
-          <div className={cardClass} key={program._id}>
-            <ProgramCard program={program} isAdmin={isAdmin} setPrograms={setPrograms} />
+      {Object.keys(programs).length === 0 && (
+        <div className={emptyClass}>
+          <div className={"flex flex-row justify-center"}>
+            <Image
+              id="emptyId"
+              alt="empty"
+              src="/programs/Empty.png"
+              height={emptyHeight}
+              width={emptyWidth}
+            />
           </div>
-        ))}
-      </div>
+        </div>
+      )}
+      {Object.keys(programs).length > 0 && (
+        <div className={cardsGridClass}>
+          {Object.values(programs).map((program) => (
+            <div className={cardClass} key={program._id}>
+              <ProgramCard program={program} isAdmin={isAdmin} setPrograms={setPrograms} />
+            </div>
+          ))}
+        </div>
+      )}
     </main>
   );
 }