From 17d086aa6ae32593d8c649250031c2c1ccf5c115 Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Mon, 18 Nov 2024 16:45:21 -0500
Subject: [PATCH 01/44] Backend logic working, now just frontend edits
 remaining

---
 prisma/schema.prisma             |  1 +
 src/components/GroupPage.tsx     | 55 ++++++++++++++++++++++++++++----
 src/server/router/user/email.ts  | 10 +++---
 src/server/router/user/groups.ts | 19 ++++++++++-
 4 files changed, 72 insertions(+), 13 deletions(-)

diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index 6ed0c132..21bffa31 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -162,6 +162,7 @@ model User {
   Message            Message[]
   dateCreated        DateTime      @default(now())
   dateModified       DateTime      @default(now()) @updatedAt
+  groupMessage       String        @default("") @map("group_message")
 
   @@index([carpoolId])
   @@map(name: "user")
diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index 94784c4e..1f78d976 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -59,13 +59,56 @@ interface NoGroupInfoProps {
 }
 
 const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
-  const text =
-    role === Role.VIEWER
-      ? "You are in Viewer mode, switch to Rider or Driver to join a group"
-      : "You are not currently part of a carpool group";
+  const { data: user } = trpc.user.me.useQuery();
+  const [groupMessage, setGroupMessage] = useState(user?.groupMessage ?? "");
+  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation();
+
+  useEffect(() => {
+    if (user?.groupMessage) {
+      setGroupMessage(user.groupMessage);
+    }
+  }, [user]);
+
+  const handleMessageSubmit = async () => {
+    if (user?.id && role === "DRIVER") {
+      await updateUserMessage({ message: groupMessage });
+    }
+  };
+
   return (
-    <div className="flex flex-grow items-center justify-center text-xl font-light">
-      {text}
+    <div className="flex flex-col">
+      {role === Role.VIEWER ? (
+        <div className="flex flex-grow items-center justify-center text-xl font-light">
+          You are in Viewer mode, switch to Rider or Driver to join a group
+        </div>
+      ) : (
+        <>
+          {role === "DRIVER" && (
+            <div className="mx-20 flex flex-col py-1">
+              <div className="my-1 text-xs italic text-slate-400">
+                Save a message to share with your future riders!
+              </div>
+              <div className="flex flex-row divide-y-2 overflow-auto">
+                <textarea
+                  className="form-input h-10 min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
+                  maxLength={140}
+                  value={groupMessage}
+                  onChange={(e) => setGroupMessage(e.target.value)}
+                />
+                <button
+                  className="ml-8 h-full w-[150px] rounded-md bg-red-700 text-white"
+                  onClick={handleMessageSubmit}
+                >
+                  Submit
+                </button>
+              </div>
+            </div>
+          )}
+          <div className="flex flex-grow items-center justify-center text-xl font-light">
+            You are not currently part of a carpool group
+          </div>
+        </>
+      )}
     </div>
   );
 };
diff --git a/src/server/router/user/email.ts b/src/server/router/user/email.ts
index 5c0ab5b6..35e5b344 100644
--- a/src/server/router/user/email.ts
+++ b/src/server/router/user/email.ts
@@ -7,12 +7,10 @@ import {
   SendTemplatedEmailCommand,
   SendTemplatedEmailCommandInput,
 } from "@aws-sdk/client-ses";
-const gmailEmailSchema = z.string().email().refine(
-  (email) => process.env.NEXT_PUBLIC_ENV !== 'staging' || email.toLowerCase().endsWith('@gmail.com'),
-  {
-    message: "Only gmail.com email addresses are accepted in the staging environment",
-  }
-);
+const gmailEmailSchema = z.string().email().refine((email) =>        
+  (process.env.NEXT_PUBLIC_ENV === "staging" && email.toLowerCase().endsWith("@gmail.com")) 
+|| process.env.NEXT_PUBLIC_ENV !== "staging",    
+{message:"Only gmail.com email addresses are accepted in the staging environment",});
 
 export const emailsRouter = router({
   sendRequestNotification: protectedRouter
diff --git a/src/server/router/user/groups.ts b/src/server/router/user/groups.ts
index f589db56..ea2e9375 100644
--- a/src/server/router/user/groups.ts
+++ b/src/server/router/user/groups.ts
@@ -61,14 +61,16 @@ export const groupsRouter = router({
           message: "Driver does not have space available in their car",
         });
       }
+      
       const group = await ctx.prisma.carpoolGroup.create({
         data: {
           users: {
             connect: { id: input.driverId },
           },
-          message: "",
+          message: driver.groupMessage || "",
         },
       });
+      
       const nGroup = await ctx.prisma.carpoolGroup.update({
         where: { id: group.id },
         data: {
@@ -207,4 +209,19 @@ export const groupsRouter = router({
       });
       return updatedGroup;
     }),
+  updateUserMessage: protectedRouter
+    .input(
+      z.object({
+        message: z.string(),
+      })
+    )
+    .mutation(async ({ ctx, input }) => {
+      const updatedUser = await ctx.prisma.user.update({
+        where: { id: ctx.session.user?.id },
+        data: {
+          groupMessage: input.message,
+        },
+      });
+      return updatedUser;
+    }),
 });

From b33bead32b5a7a82666100b024f0027ac1302d76 Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Tue, 19 Nov 2024 15:30:19 -0500
Subject: [PATCH 02/44] Various changes to group page + changes to DB to
 support more characters in group message, feature working now

---
 .../migration.sql                             | 13 +++++++
 .../migration.sql                             |  2 +
 prisma/schema.prisma                          |  4 +-
 src/components/GroupPage.tsx                  | 38 +++++++++++++------
 4 files changed, 43 insertions(+), 14 deletions(-)
 create mode 100644 prisma/migrations/20241119202005_increase_group_message_length/migration.sql
 create mode 100644 prisma/migrations/20241119202706_add_text_type/migration.sql

diff --git a/prisma/migrations/20241119202005_increase_group_message_length/migration.sql b/prisma/migrations/20241119202005_increase_group_message_length/migration.sql
new file mode 100644
index 00000000..9c1e142e
--- /dev/null
+++ b/prisma/migrations/20241119202005_increase_group_message_length/migration.sql
@@ -0,0 +1,13 @@
+-- AlterTable
+ALTER TABLE `conversation` ADD COLUMN `dateCreated` DATETIME(3) NOT NULL DEFAULT CURRENT_TIMESTAMP(3);
+
+-- AlterTable
+ALTER TABLE `group` ADD COLUMN `dateCreated` DATETIME(3) NOT NULL DEFAULT CURRENT_TIMESTAMP(3);
+
+-- AlterTable
+ALTER TABLE `user` ADD COLUMN `coop_end_date` DATE NULL,
+    ADD COLUMN `coop_start_date` DATE NULL,
+    ADD COLUMN `dateCreated` DATETIME(3) NOT NULL DEFAULT CURRENT_TIMESTAMP(3),
+    ADD COLUMN `dateModified` DATETIME(3) NOT NULL DEFAULT CURRENT_TIMESTAMP(3),
+    ADD COLUMN `group_message` TEXT NULL,
+    MODIFY `role` ENUM('RIDER', 'DRIVER', 'VIEWER') NOT NULL DEFAULT 'VIEWER';
diff --git a/prisma/migrations/20241119202706_add_text_type/migration.sql b/prisma/migrations/20241119202706_add_text_type/migration.sql
new file mode 100644
index 00000000..c0e2a9a0
--- /dev/null
+++ b/prisma/migrations/20241119202706_add_text_type/migration.sql
@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE `group` MODIFY `message` TEXT NOT NULL;
diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index 21bffa31..c5c01b8e 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -111,7 +111,7 @@ model Message {
 // Represents a group of users
 model CarpoolGroup {
   id          String   @id @default(cuid()) // primary key
-  message     String
+  message     String   @db.Text
   users       User[]
   dateCreated DateTime @default(now())
 
@@ -162,7 +162,7 @@ model User {
   Message            Message[]
   dateCreated        DateTime      @default(now())
   dateModified       DateTime      @default(now()) @updatedAt
-  groupMessage       String        @default("") @map("group_message")
+  groupMessage       String?       @map("group_message") @db.Text
 
   @@index([carpoolId])
   @@map(name: "user")
diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index 1f78d976..60ec241a 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -48,7 +48,7 @@ const GroupBody = ({
   onClose: () => void;
 }) => {
   return !curUser?.carpoolId ? (
-    <NoGroupInfo role={curUser.role} />
+    <NoGroupInfo role={curUser.role} onClose={onClose} />
   ) : (
     <GroupInfo curUser={curUser} onClose={onClose} />
   );
@@ -56,12 +56,19 @@ const GroupBody = ({
 
 interface NoGroupInfoProps {
   role: Role;
+  onClose: () => void;
 }
 
-const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
+const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
+  const utils = trpc.useContext();
   const { data: user } = trpc.user.me.useQuery();
   const [groupMessage, setGroupMessage] = useState(user?.groupMessage ?? "");
-  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation();
+  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation({
+    onSuccess: () => {
+      // Invalidate and refetch the user.me query
+      utils.user.me.invalidate();
+    },
+  });
 
   useEffect(() => {
     if (user?.groupMessage) {
@@ -84,20 +91,22 @@ const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
       ) : (
         <>
           {role === "DRIVER" && (
-            <div className="mx-20 flex flex-col py-1">
+            <div className="mx-20 flex flex-col py-1 mb-8">
               <div className="my-1 text-xs italic text-slate-400">
-                Save a message to share with your future riders!
+                Below, share any information that you'd like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
               </div>
-              <div className="flex flex-row divide-y-2 overflow-auto">
+              <div className="flex flex-row gap-2">
                 <textarea
-                  className="form-input h-10 min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
-                  maxLength={140}
+                  className="form-input min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
                   value={groupMessage}
                   onChange={(e) => setGroupMessage(e.target.value)}
                 />
                 <button
-                  className="ml-8 h-full w-[150px] rounded-md bg-red-700 text-white"
-                  onClick={handleMessageSubmit}
+                  className="w-[150px] rounded-md bg-red-700 py-2 text-white h-full"
+                  onClick={async () => {
+                    await handleMessageSubmit();
+                    onClose();
+                  }}
                 >
                   Submit
                 </button>
@@ -120,11 +129,16 @@ const GroupInfo = ({
   curUser: User;
   onClose: () => void;
 }) => {
+  const utils = trpc.useContext();
   const { data: group } = trpc.user.groups.me.useQuery();
   const users = group?.users ?? [];
   const [groupMessage, setGroupMessage] = useState(group?.message ?? "");
-  const { mutate: updateMessage } =
-    trpc.user.groups.updateMessage.useMutation();
+  const { mutate: updateMessage } = trpc.user.groups.updateMessage.useMutation({
+    onSuccess: () => {
+      // Invalidate and refetch the groups.me query
+      utils.user.groups.me.invalidate();
+    },
+  });
 
   useEffect(() => {
     setGroupMessage(group?.message ?? "");

From 9bedbd1416e1573731bd37ce27e27dbe13252cce Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Wed, 20 Nov 2024 10:32:40 -0500
Subject: [PATCH 03/44] Minor changes on rider side group page when in group

---
 src/components/GroupPage.tsx | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index 60ec241a..1b9cb4a6 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -174,6 +174,8 @@ const GroupInfo = ({
         </div>
       ) : (
         <div className="mx-16 flex flex-col py-1">
+          <div className="text-center">Carpool Information from Driver</div>
+          <br/>
           <p className="flex-1 justify-center rounded-md border px-3 py-2 text-center text-sm shadow-sm">
             {groupMessage != ""
               ? groupMessage

From dabc6dd8c629a5d422a4f4a5504edc518a65be5a Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Thu, 21 Nov 2024 11:34:44 -0500
Subject: [PATCH 04/44] Fixed tsc + lint errors

---
 src/components/GroupPage.tsx     | 2 +-
 src/server/router/user/groups.ts | 6 +++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index 1b9cb4a6..e5b59da2 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -93,7 +93,7 @@ const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
           {role === "DRIVER" && (
             <div className="mx-20 flex flex-col py-1 mb-8">
               <div className="my-1 text-xs italic text-slate-400">
-                Below, share any information that you'd like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
+                Below, share any information that you would like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
               </div>
               <div className="flex flex-row gap-2">
                 <textarea
diff --git a/src/server/router/user/groups.ts b/src/server/router/user/groups.ts
index ea2e9375..1e3b06a8 100644
--- a/src/server/router/user/groups.ts
+++ b/src/server/router/user/groups.ts
@@ -55,10 +55,10 @@ export const groupsRouter = router({
         where: { id: input.driverId },
       });
 
-      if (driver?.seatAvail === 0) {
+      if (!driver) {
         throw new TRPCError({
-          code: "BAD_REQUEST",
-          message: "Driver does not have space available in their car",
+          code: "NOT_FOUND",
+          message: "Driver not found",
         });
       }
       

From 549694ccb1648a7233022af2bed489e13292e37c Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Mon, 18 Nov 2024 16:45:21 -0500
Subject: [PATCH 05/44] Backend logic working, now just frontend edits
 remaining

---
 prisma/schema.prisma             |  1 +
 src/components/GroupPage.tsx     | 55 ++++++++++++++++++++++++++++----
 src/server/router/user/groups.ts | 19 ++++++++++-
 3 files changed, 68 insertions(+), 7 deletions(-)

diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index 2857e2fe..5e6bdd1f 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -163,6 +163,7 @@ model User {
   Message            Message[]
   dateCreated        DateTime      @default(now())
   dateModified       DateTime      @default(now()) @updatedAt
+  groupMessage       String        @default("") @map("group_message")
 
   @@index([carpoolId])
   @@map(name: "user")
diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index 94784c4e..1f78d976 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -59,13 +59,56 @@ interface NoGroupInfoProps {
 }
 
 const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
-  const text =
-    role === Role.VIEWER
-      ? "You are in Viewer mode, switch to Rider or Driver to join a group"
-      : "You are not currently part of a carpool group";
+  const { data: user } = trpc.user.me.useQuery();
+  const [groupMessage, setGroupMessage] = useState(user?.groupMessage ?? "");
+  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation();
+
+  useEffect(() => {
+    if (user?.groupMessage) {
+      setGroupMessage(user.groupMessage);
+    }
+  }, [user]);
+
+  const handleMessageSubmit = async () => {
+    if (user?.id && role === "DRIVER") {
+      await updateUserMessage({ message: groupMessage });
+    }
+  };
+
   return (
-    <div className="flex flex-grow items-center justify-center text-xl font-light">
-      {text}
+    <div className="flex flex-col">
+      {role === Role.VIEWER ? (
+        <div className="flex flex-grow items-center justify-center text-xl font-light">
+          You are in Viewer mode, switch to Rider or Driver to join a group
+        </div>
+      ) : (
+        <>
+          {role === "DRIVER" && (
+            <div className="mx-20 flex flex-col py-1">
+              <div className="my-1 text-xs italic text-slate-400">
+                Save a message to share with your future riders!
+              </div>
+              <div className="flex flex-row divide-y-2 overflow-auto">
+                <textarea
+                  className="form-input h-10 min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
+                  maxLength={140}
+                  value={groupMessage}
+                  onChange={(e) => setGroupMessage(e.target.value)}
+                />
+                <button
+                  className="ml-8 h-full w-[150px] rounded-md bg-red-700 text-white"
+                  onClick={handleMessageSubmit}
+                >
+                  Submit
+                </button>
+              </div>
+            </div>
+          )}
+          <div className="flex flex-grow items-center justify-center text-xl font-light">
+            You are not currently part of a carpool group
+          </div>
+        </>
+      )}
     </div>
   );
 };
diff --git a/src/server/router/user/groups.ts b/src/server/router/user/groups.ts
index f589db56..ea2e9375 100644
--- a/src/server/router/user/groups.ts
+++ b/src/server/router/user/groups.ts
@@ -61,14 +61,16 @@ export const groupsRouter = router({
           message: "Driver does not have space available in their car",
         });
       }
+      
       const group = await ctx.prisma.carpoolGroup.create({
         data: {
           users: {
             connect: { id: input.driverId },
           },
-          message: "",
+          message: driver.groupMessage || "",
         },
       });
+      
       const nGroup = await ctx.prisma.carpoolGroup.update({
         where: { id: group.id },
         data: {
@@ -207,4 +209,19 @@ export const groupsRouter = router({
       });
       return updatedGroup;
     }),
+  updateUserMessage: protectedRouter
+    .input(
+      z.object({
+        message: z.string(),
+      })
+    )
+    .mutation(async ({ ctx, input }) => {
+      const updatedUser = await ctx.prisma.user.update({
+        where: { id: ctx.session.user?.id },
+        data: {
+          groupMessage: input.message,
+        },
+      });
+      return updatedUser;
+    }),
 });

From f87d963f867cb0dc3569835dfde1ac9483b4e89a Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Tue, 19 Nov 2024 15:30:19 -0500
Subject: [PATCH 06/44] Various changes to group page + changes to DB to
 support more characters in group message, feature working now

---
 .../migration.sql                             | 13 +++++++
 .../migration.sql                             |  2 +
 prisma/schema.prisma                          |  4 +-
 src/components/GroupPage.tsx                  | 38 +++++++++++++------
 4 files changed, 43 insertions(+), 14 deletions(-)
 create mode 100644 prisma/migrations/20241119202005_increase_group_message_length/migration.sql
 create mode 100644 prisma/migrations/20241119202706_add_text_type/migration.sql

diff --git a/prisma/migrations/20241119202005_increase_group_message_length/migration.sql b/prisma/migrations/20241119202005_increase_group_message_length/migration.sql
new file mode 100644
index 00000000..9c1e142e
--- /dev/null
+++ b/prisma/migrations/20241119202005_increase_group_message_length/migration.sql
@@ -0,0 +1,13 @@
+-- AlterTable
+ALTER TABLE `conversation` ADD COLUMN `dateCreated` DATETIME(3) NOT NULL DEFAULT CURRENT_TIMESTAMP(3);
+
+-- AlterTable
+ALTER TABLE `group` ADD COLUMN `dateCreated` DATETIME(3) NOT NULL DEFAULT CURRENT_TIMESTAMP(3);
+
+-- AlterTable
+ALTER TABLE `user` ADD COLUMN `coop_end_date` DATE NULL,
+    ADD COLUMN `coop_start_date` DATE NULL,
+    ADD COLUMN `dateCreated` DATETIME(3) NOT NULL DEFAULT CURRENT_TIMESTAMP(3),
+    ADD COLUMN `dateModified` DATETIME(3) NOT NULL DEFAULT CURRENT_TIMESTAMP(3),
+    ADD COLUMN `group_message` TEXT NULL,
+    MODIFY `role` ENUM('RIDER', 'DRIVER', 'VIEWER') NOT NULL DEFAULT 'VIEWER';
diff --git a/prisma/migrations/20241119202706_add_text_type/migration.sql b/prisma/migrations/20241119202706_add_text_type/migration.sql
new file mode 100644
index 00000000..c0e2a9a0
--- /dev/null
+++ b/prisma/migrations/20241119202706_add_text_type/migration.sql
@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE `group` MODIFY `message` TEXT NOT NULL;
diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index 5e6bdd1f..b601b228 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -112,7 +112,7 @@ model Message {
 // Represents a group of users
 model CarpoolGroup {
   id          String   @id @default(cuid()) // primary key
-  message     String
+  message     String   @db.Text
   users       User[]
   dateCreated DateTime @default(now())
 
@@ -163,7 +163,7 @@ model User {
   Message            Message[]
   dateCreated        DateTime      @default(now())
   dateModified       DateTime      @default(now()) @updatedAt
-  groupMessage       String        @default("") @map("group_message")
+  groupMessage       String?       @map("group_message") @db.Text
 
   @@index([carpoolId])
   @@map(name: "user")
diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index 1f78d976..60ec241a 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -48,7 +48,7 @@ const GroupBody = ({
   onClose: () => void;
 }) => {
   return !curUser?.carpoolId ? (
-    <NoGroupInfo role={curUser.role} />
+    <NoGroupInfo role={curUser.role} onClose={onClose} />
   ) : (
     <GroupInfo curUser={curUser} onClose={onClose} />
   );
@@ -56,12 +56,19 @@ const GroupBody = ({
 
 interface NoGroupInfoProps {
   role: Role;
+  onClose: () => void;
 }
 
-const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
+const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
+  const utils = trpc.useContext();
   const { data: user } = trpc.user.me.useQuery();
   const [groupMessage, setGroupMessage] = useState(user?.groupMessage ?? "");
-  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation();
+  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation({
+    onSuccess: () => {
+      // Invalidate and refetch the user.me query
+      utils.user.me.invalidate();
+    },
+  });
 
   useEffect(() => {
     if (user?.groupMessage) {
@@ -84,20 +91,22 @@ const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
       ) : (
         <>
           {role === "DRIVER" && (
-            <div className="mx-20 flex flex-col py-1">
+            <div className="mx-20 flex flex-col py-1 mb-8">
               <div className="my-1 text-xs italic text-slate-400">
-                Save a message to share with your future riders!
+                Below, share any information that you'd like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
               </div>
-              <div className="flex flex-row divide-y-2 overflow-auto">
+              <div className="flex flex-row gap-2">
                 <textarea
-                  className="form-input h-10 min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
-                  maxLength={140}
+                  className="form-input min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
                   value={groupMessage}
                   onChange={(e) => setGroupMessage(e.target.value)}
                 />
                 <button
-                  className="ml-8 h-full w-[150px] rounded-md bg-red-700 text-white"
-                  onClick={handleMessageSubmit}
+                  className="w-[150px] rounded-md bg-red-700 py-2 text-white h-full"
+                  onClick={async () => {
+                    await handleMessageSubmit();
+                    onClose();
+                  }}
                 >
                   Submit
                 </button>
@@ -120,11 +129,16 @@ const GroupInfo = ({
   curUser: User;
   onClose: () => void;
 }) => {
+  const utils = trpc.useContext();
   const { data: group } = trpc.user.groups.me.useQuery();
   const users = group?.users ?? [];
   const [groupMessage, setGroupMessage] = useState(group?.message ?? "");
-  const { mutate: updateMessage } =
-    trpc.user.groups.updateMessage.useMutation();
+  const { mutate: updateMessage } = trpc.user.groups.updateMessage.useMutation({
+    onSuccess: () => {
+      // Invalidate and refetch the groups.me query
+      utils.user.groups.me.invalidate();
+    },
+  });
 
   useEffect(() => {
     setGroupMessage(group?.message ?? "");

From 6fd35e8aa9536c469613df4389c87aa9c38aae7f Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Wed, 20 Nov 2024 10:32:40 -0500
Subject: [PATCH 07/44] Minor changes on rider side group page when in group

---
 src/components/GroupPage.tsx | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index 60ec241a..1b9cb4a6 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -174,6 +174,8 @@ const GroupInfo = ({
         </div>
       ) : (
         <div className="mx-16 flex flex-col py-1">
+          <div className="text-center">Carpool Information from Driver</div>
+          <br/>
           <p className="flex-1 justify-center rounded-md border px-3 py-2 text-center text-sm shadow-sm">
             {groupMessage != ""
               ? groupMessage

From 2519c6ec60e47097304e00f756777f22991464ce Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Thu, 21 Nov 2024 11:34:44 -0500
Subject: [PATCH 08/44] Fixed tsc + lint errors

---
 src/components/GroupPage.tsx     | 2 +-
 src/server/router/user/groups.ts | 6 +++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index 1b9cb4a6..e5b59da2 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -93,7 +93,7 @@ const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
           {role === "DRIVER" && (
             <div className="mx-20 flex flex-col py-1 mb-8">
               <div className="my-1 text-xs italic text-slate-400">
-                Below, share any information that you'd like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
+                Below, share any information that you would like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
               </div>
               <div className="flex flex-row gap-2">
                 <textarea
diff --git a/src/server/router/user/groups.ts b/src/server/router/user/groups.ts
index ea2e9375..1e3b06a8 100644
--- a/src/server/router/user/groups.ts
+++ b/src/server/router/user/groups.ts
@@ -55,10 +55,10 @@ export const groupsRouter = router({
         where: { id: input.driverId },
       });
 
-      if (driver?.seatAvail === 0) {
+      if (!driver) {
         throw new TRPCError({
-          code: "BAD_REQUEST",
-          message: "Driver does not have space available in their car",
+          code: "NOT_FOUND",
+          message: "Driver not found",
         });
       }
       

From b731e4bf71ef93d8e59242a0fe0615e4262e3318 Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Thu, 21 Nov 2024 13:12:07 -0500
Subject: [PATCH 09/44] rebased changes from email.ts

---
 src/server/router/user/email.ts | 7 -------
 1 file changed, 7 deletions(-)

diff --git a/src/server/router/user/email.ts b/src/server/router/user/email.ts
index a06bdbf8..ee652850 100644
--- a/src/server/router/user/email.ts
+++ b/src/server/router/user/email.ts
@@ -7,7 +7,6 @@ import {
   SendTemplatedEmailCommand,
   SendTemplatedEmailCommandInput,
 } from "@aws-sdk/client-ses";
-<<<<<<< HEAD
 const gmailEmailSchema = z
   .string()
   .email()
@@ -21,12 +20,6 @@ const gmailEmailSchema = z
         "Only gmail.com email addresses are accepted in the staging environment",
     }
   );
-=======
-const gmailEmailSchema = z.string().email().refine((email) =>        
-  (process.env.NEXT_PUBLIC_ENV === "staging" && email.toLowerCase().endsWith("@gmail.com")) 
-|| process.env.NEXT_PUBLIC_ENV !== "staging",    
-{message:"Only gmail.com email addresses are accepted in the staging environment",});
->>>>>>> dabc6dd8c629a5d422a4f4a5504edc518a65be5a
 
 export const emailsRouter = router({
   sendRequestNotification: protectedRouter

From e1a280a9ab768e8ea615511e429da187a425a42f Mon Sep 17 00:00:00 2001
From: Graham Mather <mather.g@northeastern.edu>
Date: Fri, 22 Nov 2024 11:19:51 -0500
Subject: [PATCH 10/44] FTUE tracking + view route event fix

---
 src/components/UserCards/UserCard.tsx |  7 +++---
 src/pages/profile/setup.tsx           |  9 +++++--
 src/utils/mixpanel.ts                 | 35 +++++++++++++++++----------
 3 files changed, 33 insertions(+), 18 deletions(-)

diff --git a/src/components/UserCards/UserCard.tsx b/src/components/UserCards/UserCard.tsx
index 6ced5733..68547540 100644
--- a/src/components/UserCards/UserCard.tsx
+++ b/src/components/UserCards/UserCard.tsx
@@ -236,10 +236,11 @@ export const UserCard = (props: UserCardProps): JSX.Element => {
         <div className="flex flex-row justify-between gap-2">
           <button
             disabled={user.status === "INACTIVE" && user.role !== "VIEWER"}
-            onClick={() =>
+            onClick={() => {
               props.onViewRouteClick &&
-              props.onViewRouteClick(user, props.otherUser)
-            }
+                props.onViewRouteClick(user, props.otherUser);
+              trackViewRoute();
+            }}
             className="my-1 w-1/2 rounded-md border border-black p-1 text-center hover:bg-stone-200 disabled:hover:bg-transparent"
           >
             View Route
diff --git a/src/pages/profile/setup.tsx b/src/pages/profile/setup.tsx
index a308dbd6..b10954f0 100644
--- a/src/pages/profile/setup.tsx
+++ b/src/pages/profile/setup.tsx
@@ -21,7 +21,11 @@ import StepThree from "../../components/Setup/StepThree";
 import { SetupContainer } from "../../components/Setup/SetupContainer";
 import StepFour from "../../components/Setup/StepFour";
 import { Role } from "@prisma/client";
-import { trackProfileCompletion } from "../../utils/mixpanel";
+import {
+  trackFTUECompletion,
+  trackFTUEStep,
+  trackProfileCompletion,
+} from "../../utils/mixpanel";
 import { useUploadFile } from "../../utils/profile/useUploadFile";
 import { ComplianceModal } from "../../components/CompliancePortal";
 import { useAddressSelection } from "../../utils/useAddressSelection";
@@ -162,7 +166,7 @@ const Setup: NextPage = () => {
       sessionName,
       mutation: editUserMutation,
     });
-    trackProfileCompletion(userInfo.role, userInfo.status);
+    trackFTUECompletion(userInfo.role);
   };
 
   const handleNextStep = async () => {
@@ -203,6 +207,7 @@ const Setup: NextPage = () => {
       await handleSubmit(onSubmit)();
       return;
     }
+    trackFTUEStep(step);
     setStep((prevStep) => prevStep + 1);
   };
   if (isLoading || !user) {
diff --git a/src/utils/mixpanel.ts b/src/utils/mixpanel.ts
index 4abced61..eb132246 100644
--- a/src/utils/mixpanel.ts
+++ b/src/utils/mixpanel.ts
@@ -1,41 +1,50 @@
-import mixpanel from 'mixpanel-browser';
-import { browserEnv } from './env/browser';
+import mixpanel from "mixpanel-browser";
+import { browserEnv } from "./env/browser";
 
 const mixpanelToken = browserEnv.NEXT_PUBLIC_MIXPANEL_PROJECT_TOKEN;
 
 if (!mixpanelToken) {
-  throw new Error('NEXT_PUBLIC_MIXPANEL_PROJECT_TOKEN is not defined');
+  throw new Error("NEXT_PUBLIC_MIXPANEL_PROJECT_TOKEN is not defined");
 }
 
 mixpanel.init(mixpanelToken, {
-  debug: process.env.NODE_ENV !== 'production',
+  debug: process.env.NODE_ENV !== "production",
   track_pageview: true,
-  persistence: 'localStorage'
+  persistence: "localStorage",
 });
 
-export const trackEvent = (eventName: string, properties?: Record<string, any>) => {
+export const trackEvent = (
+  eventName: string,
+  properties?: Record<string, any>
+) => {
   mixpanel.track(eventName, properties);
 };
 
 export const setUserProperties = (properties: Record<string, any>) => {
   mixpanel.people.set(properties);
 };
-
+export const trackFTUECompletion = (role: string) => {
+  trackEvent("FTUE Completed", { role });
+};
+export const trackFTUEStep = (step: number) => {
+  const name = "FTUE Step " + step;
+  trackEvent(name);
+};
 // Add this new function
 export const trackProfileCompletion = (role: string, status: string) => {
-  trackEvent('Profile Completed', { role, status });
+  trackEvent("Profile Completed", { role, status });
 };
 
 // Add this new function
 export const trackViewRoute = () => {
-  trackEvent('View Route Clicked', {
-    timestamp: new Date().toISOString()
+  trackEvent("View Route Clicked", {
+    timestamp: new Date().toISOString(),
   });
 };
 
-export const trackRequestResponse = (action: 'accept' | 'decline') => {
-  trackEvent('Request Response', {
+export const trackRequestResponse = (action: "accept" | "decline") => {
+  trackEvent("Request Response", {
     action,
-    timestamp: new Date().toISOString()
+    timestamp: new Date().toISOString(),
   });
 };

From 4ce2c52b8b189ab1f87ede481dcd33f94cc109d2 Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Mon, 25 Nov 2024 08:39:00 -0800
Subject: [PATCH 11/44] Changes per review

---
 src/components/GroupPage.tsx                  | 21 ++++++++++++++++---
 .../Modals/ReceivedRequestModal.tsx           |  2 +-
 2 files changed, 19 insertions(+), 4 deletions(-)

diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index e5b59da2..f7ae0593 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -5,6 +5,9 @@ import { trpc } from "../utils/trpc";
 import { UserContext } from "../utils/userContext";
 import { Role, User } from "@prisma/client";
 import Spinner from "./Spinner";
+import { toast } from "react-toastify";
+import { TRPCClientError } from "@trpc/client";
+import { useToasts } from "react-toast-notifications";
 
 interface GroupPageProps {
   onClose: () => void;
@@ -105,7 +108,7 @@ const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
                   className="w-[150px] rounded-md bg-red-700 py-2 text-white h-full"
                   onClick={async () => {
                     await handleMessageSubmit();
-                    onClose();
+                    toast.success('Group message successfully saved!');
                   }}
                 >
                   Submit
@@ -139,14 +142,23 @@ const GroupInfo = ({
       utils.user.groups.me.invalidate();
     },
   });
+  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation({
+    onSuccess: () => {
+      // Invalidate and refetch the user.me query
+      utils.user.me.invalidate();
+    },
+  });
 
   useEffect(() => {
-    setGroupMessage(group?.message ?? "");
+    if (group?.message !== undefined) {
+      setGroupMessage(group.message);
+    }
   }, [group]);
 
   const handleMessageSubmit = async () => {
     if (group?.id && curUser?.role === "DRIVER") {
       await updateMessage({ groupId: group.id, message: groupMessage });
+      await updateUserMessage({ message: groupMessage });
     }
   };
 
@@ -166,7 +178,10 @@ const GroupInfo = ({
             />
             <button
               className="ml-8 h-full w-[150px] rounded-md bg-red-700 text-white"
-              onClick={handleMessageSubmit}
+              onClick={async () => {
+                await handleMessageSubmit();
+                toast.success('Group message successfully saved!');
+              }}
             >
               Submit
             </button>
diff --git a/src/components/Modals/ReceivedRequestModal.tsx b/src/components/Modals/ReceivedRequestModal.tsx
index 3005f4fe..1b1a405d 100644
--- a/src/components/Modals/ReceivedRequestModal.tsx
+++ b/src/components/Modals/ReceivedRequestModal.tsx
@@ -136,7 +136,7 @@ const ReceivedRequestModal = (props: ReceivedModalProps): JSX.Element => {
       onClose();
       addToast(
         props.otherUser.preferredName +
-          "'s request to carpool with you has been accepted.",
+          "'s request to carpool with you has been accepted. If you're a driver, do make sure you add information on the group page for your riders!",
         { appearance: "success" }
       );
     }

From 6a7e4cd9811e6b0379e62d0c0a08c496276bfee2 Mon Sep 17 00:00:00 2001
From: Graham Mather <mather.g@northeastern.edu>
Date: Mon, 25 Nov 2024 17:17:01 -0500
Subject: [PATCH 12/44] Admin dashboard initial setup

---
 src/components/Admin/AdminSidebar.tsx         |  29 ++++
 src/components/Admin/UserManagement.tsx       | 140 ++++++++++++++++++
 src/components/Header.tsx                     |  17 +++
 .../Profile/ControlledTimePicker.tsx          |   2 -
 src/pages/admin.tsx                           |  43 ++++++
 src/pages/api/auth/[...nextauth].ts           |   1 +
 src/server/router/user.ts                     |   2 +
 src/server/router/user/admin.ts               |  53 +++++++
 8 files changed, 285 insertions(+), 2 deletions(-)
 create mode 100644 src/components/Admin/AdminSidebar.tsx
 create mode 100644 src/components/Admin/UserManagement.tsx
 create mode 100644 src/pages/admin.tsx
 create mode 100644 src/server/router/user/admin.ts

diff --git a/src/components/Admin/AdminSidebar.tsx b/src/components/Admin/AdminSidebar.tsx
new file mode 100644
index 00000000..211718a1
--- /dev/null
+++ b/src/components/Admin/AdminSidebar.tsx
@@ -0,0 +1,29 @@
+type AdminSidebarProps = {
+  option: string;
+  setOption: React.Dispatch<React.SetStateAction<string>>;
+};
+
+const AdminSidebar = ({ option, setOption }: AdminSidebarProps) => {
+  const baseButton =
+    "px-4 py-2 text-northeastern-red font-montserrat text-base md:text-lg ";
+  const selectedButton = " font-bold underline underline-offset-8 ";
+  return (
+    <div className="h-full w-full  ">
+      <div className="mt-6 flex flex-col items-start gap-4">
+        <button
+          className={baseButton + (option === "management" && selectedButton)}
+          onClick={() => setOption("management")}
+        >
+          Management
+        </button>
+        <button
+          className={baseButton + (option === "data" && selectedButton)}
+          onClick={() => setOption("data")}
+        >
+          Data
+        </button>
+      </div>
+    </div>
+  );
+};
+export default AdminSidebar;
diff --git a/src/components/Admin/UserManagement.tsx b/src/components/Admin/UserManagement.tsx
new file mode 100644
index 00000000..fae27a29
--- /dev/null
+++ b/src/components/Admin/UserManagement.tsx
@@ -0,0 +1,140 @@
+import { Permission } from "@prisma/client";
+import { trpc } from "../../utils/trpc";
+import React, { useEffect, useState } from "react";
+import Spinner from "../Spinner";
+import { toast } from "react-toastify";
+import { ConfigProvider, Select } from "antd";
+
+type TempUser = {
+  id: string;
+  email: string;
+  permission: Permission;
+};
+
+const UserManagement = () => {
+  const [loading, setLoading] = useState<boolean>(true);
+  const [selectedUser, setSelectedUser] = React.useState<TempUser | null>(null);
+  const [selectedPermission, setSelectedPermission] =
+    React.useState<Permission | null>(null);
+  const { data: users } = trpc.user.admin.getAllUsers.useQuery<TempUser[]>();
+  const utils = trpc.useUtils();
+
+  const updateUserPermission = trpc.user.admin.updateUserPermission.useMutation(
+    {
+      onSuccess: () => {
+        toast.success("User permission updated successfully!");
+        utils.user.admin.getAllUsers.refetch();
+      },
+      onError: (error) => {
+        toast.error(`Failed to update permission: ${error.message}`);
+      },
+    }
+  );
+  useEffect(() => {
+    if (users) {
+      setLoading(false);
+    }
+  }, [users]);
+  const handleUserChange = (value: string) => {
+    const user = users?.find((user) => user.id === value);
+    if (user) {
+      setSelectedUser(user);
+      setSelectedPermission(user.permission);
+    }
+  };
+  const updatePermission = () => {
+    if (selectedUser && selectedPermission) {
+      updateUserPermission.mutate({
+        userId: selectedUser.id,
+        permission: selectedPermission,
+      });
+    } else {
+      toast.error("User or Permission not selected");
+    }
+  };
+  const groupedOptions = users
+    ? [
+        {
+          label: "Managers",
+          options: users
+            .filter((user) => user.permission === "MANAGER")
+            .map((user) => ({ label: user.email, value: user.id })),
+        },
+        {
+          label: "Admins",
+          options: users
+            .filter((user) => user.permission === "ADMIN")
+            .map((user) => ({ label: user.email, value: user.id })),
+        },
+        {
+          label: "Users",
+          options: users
+            .filter((user) => user.permission === "USER")
+            .map((user) => ({ label: user.email, value: user.id })),
+        },
+      ]
+    : [];
+
+  return (
+    <div className="h-full w-full">
+      {loading && <Spinner />}
+      {!loading && users && (
+        <div className="m-auto p-20 ">
+          <div className="flex flex-col gap-10 p-10 ">
+            <h1 className="text-center font-montserrat text-3xl font-bold text-black">
+              Permissions Management
+            </h1>
+            <div className="flex flex-row items-center justify-center gap-8">
+              <ConfigProvider
+                theme={{
+                  token: {
+                    fontFamily: "Lato",
+                    fontSize: 16,
+                    colorPrimary: "#C8102E",
+                  },
+                }}
+              >
+                <Select
+                  showSearch
+                  style={{ width: "180px" }}
+                  placeholder="Select a User"
+                  onChange={handleUserChange}
+                  popupMatchSelectWidth={false}
+                  placement={"bottomRight"}
+                  filterOption={(input, option) =>
+                    (option?.label ?? "")
+                      .toLowerCase()
+                      .includes(input.toLowerCase())
+                  }
+                  options={groupedOptions}
+                />
+                <Select
+                  placeholder="Change Permission"
+                  value={selectedPermission}
+                  onChange={(value: Permission) => {
+                    console.log(value);
+                    setSelectedPermission(value);
+                  }}
+                  popupMatchSelectWidth={false}
+                  placement={"bottomLeft"}
+                  options={[
+                    { value: "USER", label: "user" },
+                    { value: "ADMIN", label: "admin" },
+                    { value: "MANAGER", label: "manager" },
+                  ]}
+                />
+              </ConfigProvider>
+            </div>
+            <button
+              className="text-bold w-full justify-center rounded-2xl bg-northeastern-red py-2 font-lato text-white hover:bg-busy-red "
+              onClick={updatePermission}
+            >
+              Update Permission
+            </button>
+          </div>
+        </div>
+      )}
+    </div>
+  );
+};
+export default UserManagement;
diff --git a/src/components/Header.tsx b/src/components/Header.tsx
index 7f5095b7..3e868d95 100644
--- a/src/components/Header.tsx
+++ b/src/components/Header.tsx
@@ -4,6 +4,8 @@ import DropDownMenu from "./DropDownMenu";
 import { createPortal } from "react-dom";
 import { GroupPage } from "./GroupPage";
 import { trpc } from "../utils/trpc";
+import { UserContext } from "../utils/userContext";
+import { useRouter } from "next/router";
 
 const HeaderDiv = styled.div`
   display: flex;
@@ -15,6 +17,7 @@ const HeaderDiv = styled.div`
   box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.25);
   height: 8.5%;
   width: 100%;
+  z-index: 10;
 `;
 
 export const Logo = styled.h1`
@@ -43,6 +46,8 @@ export type HeaderOptions = "explore" | "requests";
 const Header = (props: HeaderProps) => {
   const { data: unreadMessagesCount } =
     trpc.user.messages.getUnreadMessageCount.useQuery();
+  const user = useContext(UserContext);
+  const router = useRouter();
 
   const [displayGroup, setDisplayGroup] = useState<boolean>(false);
   const renderClassName = (sidebarValue: string, sidebarText: string) => {
@@ -64,6 +69,9 @@ const Header = (props: HeaderProps) => {
       return "rounded-xl p-4 font-medium text-xl text-white";
     }
   };
+  const handleAdminClick = () => {
+    router.push("/admin");
+  };
   const renderSidebarOptions = ({
     sidebarValue,
     setSidebar,
@@ -107,6 +115,15 @@ const Header = (props: HeaderProps) => {
         >
           My Group
         </button>
+        {user?.permission !== "USER" && (
+          <button
+            onClick={handleAdminClick}
+            disabled={disabled}
+            className={renderClassName(sidebarValue, "filler")}
+          >
+            Admin
+          </button>
+        )}
       </div>
     );
   };
diff --git a/src/components/Profile/ControlledTimePicker.tsx b/src/components/Profile/ControlledTimePicker.tsx
index b65790a0..a69ada77 100644
--- a/src/components/Profile/ControlledTimePicker.tsx
+++ b/src/components/Profile/ControlledTimePicker.tsx
@@ -46,11 +46,9 @@ const ControlledTimePicker = (props: ControlledTimePickerProps) => {
       name={props.name}
       control={props.control}
       render={({ field: { ref, ...fieldProps }, fieldState }) => {
-        // Log the error state to the console
         if (fieldState.error) {
           console.log("Error in TimePicker:", fieldState.error);
         }
-
         return (
           <ConfigProvider
             theme={{
diff --git a/src/pages/admin.tsx b/src/pages/admin.tsx
new file mode 100644
index 00000000..a710c7d6
--- /dev/null
+++ b/src/pages/admin.tsx
@@ -0,0 +1,43 @@
+import { GetServerSidePropsContext, NextPage } from "next";
+import { getSession } from "next-auth/react";
+import Header from "../components/Header";
+import AdminSidebar from "../components/Admin/AdminSidebar";
+import { useState } from "react";
+import UserManagement from "../components/Admin/UserManagement";
+
+export async function getServerSideProps(context: GetServerSidePropsContext) {
+  const session = await getSession(context);
+
+  if (session?.user) {
+    if (session.user.permission === "USER") {
+      return {
+        redirect: {
+          destination: "/",
+          permanent: false,
+        },
+      };
+    }
+  }
+
+  return {
+    props: {},
+  };
+}
+
+const Admin: NextPage = () => {
+  const [option, setOption] = useState<string>("management");
+  return (
+    <div className="relative h-full max-h-screen w-full ">
+      <Header />
+      <div className="flex h-full  flex-row">
+        <div className="z-0 min-w-[150px] max-w-[250px] flex-[1] border-r-4 border-busy-red   bg-stone-100">
+          <AdminSidebar option={option} setOption={setOption} />
+        </div>
+        <div className="flex-[3]">
+          {option === "management" && <UserManagement />}
+        </div>
+      </div>
+    </div>
+  );
+};
+export default Admin;
diff --git a/src/pages/api/auth/[...nextauth].ts b/src/pages/api/auth/[...nextauth].ts
index 7a9866ce..2a87e37b 100644
--- a/src/pages/api/auth/[...nextauth].ts
+++ b/src/pages/api/auth/[...nextauth].ts
@@ -32,6 +32,7 @@ export const authOptions: NextAuthOptions = {
       if (session.user) {
         session.user.id = user.id;
         session.user.isOnboarded = user.isOnboarded;
+        session.user.permission = user.permission;
       }
       return session;
     },
diff --git a/src/server/router/user.ts b/src/server/router/user.ts
index 0ddd347b..740b88c1 100644
--- a/src/server/router/user.ts
+++ b/src/server/router/user.ts
@@ -15,6 +15,7 @@ import {
   generatePresignedUrl,
   getPresignedImageUrl,
 } from "../../utils/uploadToS3";
+import { adminRouter } from "./user/admin";
 const getPresignedDownloadUrlInput = z.object({
   userId: z.string().optional(),
 });
@@ -155,4 +156,5 @@ export const userRouter = router({
   requests: requestsRouter,
   groups: groupsRouter,
   emails: emailsRouter,
+  admin: adminRouter,
 });
diff --git a/src/server/router/user/admin.ts b/src/server/router/user/admin.ts
new file mode 100644
index 00000000..c62c4702
--- /dev/null
+++ b/src/server/router/user/admin.ts
@@ -0,0 +1,53 @@
+import { protectedRouter, router } from "../createRouter";
+import { z } from "zod";
+import { Permission } from "@prisma/client";
+
+// Router for admin dashboard queries, only Managers can edit roles
+// User must be Manager or Admin to view user data
+export const adminRouter = router({
+  getAllUsers: protectedRouter.query(async ({ ctx, input }) => {
+    const permission = ctx.session.user?.permission;
+    console.log(ctx.session);
+    if (permission !== "MANAGER") {
+      throw new Error("Unauthorized access.");
+    }
+
+    return ctx.prisma.user.findMany({
+      where: {
+        email: {
+          not: null,
+        },
+      },
+      select: {
+        id: true,
+        email: true,
+        permission: true,
+      },
+    });
+  }),
+  updateUserPermission: protectedRouter
+    .input(
+      z.object({
+        userId: z.string(),
+        permission: z.nativeEnum(Permission),
+      })
+    )
+    .mutation(async ({ ctx, input }) => {
+      const permission = ctx.session.user?.permission;
+      if (permission !== "MANAGER") {
+        throw new Error("Unauthorized access.");
+      }
+      if (input.userId === ctx.session.user?.id) {
+        throw new Error("Cannot change own permission.");
+      }
+
+      return ctx.prisma.user.update({
+        where: {
+          id: input.userId,
+        },
+        data: {
+          permission: input.permission,
+        },
+      });
+    }),
+});

From 6e2db6216718073bc59a093671ff6aeb1e3bf885 Mon Sep 17 00:00:00 2001
From: Graham Mather <mather.g@northeastern.edu>
Date: Tue, 26 Nov 2024 10:30:35 -0500
Subject: [PATCH 13/44] Admin setup and perm management done

---
 prisma/schema.prisma                    |  7 +++++
 src/components/Admin/UserManagement.tsx |  1 -
 src/components/Header.tsx               | 38 ++++++++++++++++++-------
 src/pages/admin.tsx                     |  2 +-
 4 files changed, 35 insertions(+), 13 deletions(-)

diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index 2857e2fe..f1b239a5 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -22,6 +22,12 @@ enum Role {
   VIEWER
 }
 
+enum Permission {
+  USER
+  ADMIN
+  MANAGER
+}
+
 // Represents a Status.
 enum Status {
   ACTIVE
@@ -132,6 +138,7 @@ model User {
   accounts           Account[] // can have multiple accounts
   sessions           Session[] // can have multiple settings
   role               Role          @default(VIEWER)
+  permission         Permission    @default(USER)
   status             Status        @default(ACTIVE)
   seatAvail          Int           @default(0) @map("seat_avail")
   companyName        String        @default("") @map("company_name")
diff --git a/src/components/Admin/UserManagement.tsx b/src/components/Admin/UserManagement.tsx
index fae27a29..bd931ef7 100644
--- a/src/components/Admin/UserManagement.tsx
+++ b/src/components/Admin/UserManagement.tsx
@@ -112,7 +112,6 @@ const UserManagement = () => {
                   placeholder="Change Permission"
                   value={selectedPermission}
                   onChange={(value: Permission) => {
-                    console.log(value);
                     setSelectedPermission(value);
                   }}
                   popupMatchSelectWidth={false}
diff --git a/src/components/Header.tsx b/src/components/Header.tsx
index 3e868d95..e4e632a7 100644
--- a/src/components/Header.tsx
+++ b/src/components/Header.tsx
@@ -39,6 +39,7 @@ interface HeaderProps {
     setSidebar: Dispatch<SetStateAction<HeaderOptions>>;
     disabled: boolean;
   };
+  admin?: boolean;
 }
 
 export type HeaderOptions = "explore" | "requests";
@@ -70,7 +71,11 @@ const Header = (props: HeaderProps) => {
     }
   };
   const handleAdminClick = () => {
-    router.push("/admin");
+    if (!props.admin) {
+      router.push("/admin");
+    } else {
+      router.push("/");
+    }
   };
   const renderSidebarOptions = ({
     sidebarValue,
@@ -131,18 +136,29 @@ const Header = (props: HeaderProps) => {
   return (
     <HeaderDiv>
       <Logo>CarpoolNU</Logo>
-      {props.data && (
+      {props.admin ? (
         <div className="flex items-center">
-          {renderSidebarOptions(props.data)}
-          <DropDownMenu />
-          <>
-            {displayGroup &&
-              createPortal(
-                <GroupPage onClose={() => setDisplayGroup(false)} />,
-                document.body
-              )}
-          </>
+          <button
+            onClick={handleAdminClick}
+            className="rounded-xl p-4 text-xl font-medium text-white"
+          >
+            Home
+          </button>
         </div>
+      ) : (
+        props.data && (
+          <div className="flex items-center">
+            {renderSidebarOptions(props.data)}
+            <DropDownMenu />
+            <>
+              {displayGroup &&
+                createPortal(
+                  <GroupPage onClose={() => setDisplayGroup(false)} />,
+                  document.body
+                )}
+            </>
+          </div>
+        )
       )}
     </HeaderDiv>
   );
diff --git a/src/pages/admin.tsx b/src/pages/admin.tsx
index a710c7d6..8dc0967f 100644
--- a/src/pages/admin.tsx
+++ b/src/pages/admin.tsx
@@ -28,7 +28,7 @@ const Admin: NextPage = () => {
   const [option, setOption] = useState<string>("management");
   return (
     <div className="relative h-full max-h-screen w-full ">
-      <Header />
+      <Header admin={true} />
       <div className="flex h-full  flex-row">
         <div className="z-0 min-w-[150px] max-w-[250px] flex-[1] border-r-4 border-busy-red   bg-stone-100">
           <AdminSidebar option={option} setOption={setOption} />

From cece9520518589736257d2ff6771886fa507d622 Mon Sep 17 00:00:00 2001
From: Graham Mather <mather.g@northeastern.edu>
Date: Tue, 26 Nov 2024 10:34:47 -0500
Subject: [PATCH 14/44] hide overflow

---
 src/pages/admin.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/admin.tsx b/src/pages/admin.tsx
index 8dc0967f..c44c7b85 100644
--- a/src/pages/admin.tsx
+++ b/src/pages/admin.tsx
@@ -27,7 +27,7 @@ export async function getServerSideProps(context: GetServerSidePropsContext) {
 const Admin: NextPage = () => {
   const [option, setOption] = useState<string>("management");
   return (
-    <div className="relative h-full max-h-screen w-full ">
+    <div className="relative h-full w-full overflow-hidden  ">
       <Header admin={true} />
       <div className="flex h-full  flex-row">
         <div className="z-0 min-w-[150px] max-w-[250px] flex-[1] border-r-4 border-busy-red   bg-stone-100">

From 6d9859e5379ca905e2d83dc7aa4c975e66357d4a Mon Sep 17 00:00:00 2001
From: Graham Mather <mather.g@northeastern.edu>
Date: Tue, 26 Nov 2024 10:53:15 -0500
Subject: [PATCH 15/44] missed file

---
 next-auth.d.ts | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/next-auth.d.ts b/next-auth.d.ts
index 48a58309..72505f15 100644
--- a/next-auth.d.ts
+++ b/next-auth.d.ts
@@ -1,4 +1,5 @@
 import { DefaultSession } from "next-auth";
+import { Permission } from "@prisma/client";
 
 declare module "next-auth" {
   /**
@@ -8,10 +9,12 @@ declare module "next-auth" {
     user?: {
       id?: string;
       isOnboarded: boolean;
+      permission: Permission;
     } & DefaultSession["user"];
   }
 
-  interface User {
-    isOnboarded: boolean & DefaultUser;
+  interface User extends DefaultUser {
+    isOnboarded: boolean;
+    permission: Permission;
   }
 }

From f5465065450db81ef9afa52eee22b89bcc543bdb Mon Sep 17 00:00:00 2001
From: Graham Mather <mather.g@northeastern.edu>
Date: Tue, 26 Nov 2024 12:00:40 -0500
Subject: [PATCH 16/44] Logic improvement for admin users + tooltip

---
 src/components/Admin/UserManagement.tsx | 39 +++++++++++++++++++------
 src/components/Header.tsx               | 27 +++++++++--------
 src/pages/admin.tsx                     | 39 +++++++++++++++++++------
 src/server/router/user/admin.ts         |  2 +-
 4 files changed, 74 insertions(+), 33 deletions(-)

diff --git a/src/components/Admin/UserManagement.tsx b/src/components/Admin/UserManagement.tsx
index bd931ef7..a963798e 100644
--- a/src/components/Admin/UserManagement.tsx
+++ b/src/components/Admin/UserManagement.tsx
@@ -4,14 +4,17 @@ import React, { useEffect, useState } from "react";
 import Spinner from "../Spinner";
 import { toast } from "react-toastify";
 import { ConfigProvider, Select } from "antd";
+import { Note } from "../../styles/profile";
 
 type TempUser = {
   id: string;
   email: string;
   permission: Permission;
 };
-
-const UserManagement = () => {
+type UserManagementProps = {
+  permission: Permission;
+};
+const UserManagement = ({ permission }: UserManagementProps) => {
   const [loading, setLoading] = useState<boolean>(true);
   const [selectedUser, setSelectedUser] = React.useState<TempUser | null>(null);
   const [selectedPermission, setSelectedPermission] =
@@ -84,6 +87,17 @@ const UserManagement = () => {
             <h1 className="text-center font-montserrat text-3xl font-bold text-black">
               Permissions Management
             </h1>
+            {permission !== "MANAGER" && (
+              <div className="items-center gap-1 text-center">
+                <Note>
+                  Admins can view user permissions but cannot modify them.
+                </Note>
+                <Note>
+                  To change your permission, contact a MANAGER from the
+                  dropdown.
+                </Note>
+              </div>
+            )}
             <div className="flex flex-row items-center justify-center gap-8">
               <ConfigProvider
                 theme={{
@@ -97,7 +111,11 @@ const UserManagement = () => {
                 <Select
                   showSearch
                   style={{ width: "180px" }}
-                  placeholder="Select a User"
+                  placeholder={
+                    permission === "MANAGER"
+                      ? "Select a User"
+                      : "View User List"
+                  }
                   onChange={handleUserChange}
                   popupMatchSelectWidth={false}
                   placement={"bottomRight"}
@@ -111,6 +129,7 @@ const UserManagement = () => {
                 <Select
                   placeholder="Change Permission"
                   value={selectedPermission}
+                  disabled={permission !== "MANAGER"}
                   onChange={(value: Permission) => {
                     setSelectedPermission(value);
                   }}
@@ -124,12 +143,14 @@ const UserManagement = () => {
                 />
               </ConfigProvider>
             </div>
-            <button
-              className="text-bold w-full justify-center rounded-2xl bg-northeastern-red py-2 font-lato text-white hover:bg-busy-red "
-              onClick={updatePermission}
-            >
-              Update Permission
-            </button>
+            {permission === "MANAGER" && (
+              <button
+                className="text-bold w-full justify-center rounded-2xl bg-northeastern-red py-2 font-lato text-white hover:bg-busy-red "
+                onClick={updatePermission}
+              >
+                Update Permission
+              </button>
+            )}
           </div>
         </div>
       )}
diff --git a/src/components/Header.tsx b/src/components/Header.tsx
index e4e632a7..19cfecf9 100644
--- a/src/components/Header.tsx
+++ b/src/components/Header.tsx
@@ -140,25 +140,24 @@ const Header = (props: HeaderProps) => {
         <div className="flex items-center">
           <button
             onClick={handleAdminClick}
-            className="rounded-xl p-4 text-xl font-medium text-white"
+            className="rounded-xl pr-10 text-xl font-medium text-white"
           >
             Home
           </button>
+          <DropDownMenu />
         </div>
       ) : (
-        props.data && (
-          <div className="flex items-center">
-            {renderSidebarOptions(props.data)}
-            <DropDownMenu />
-            <>
-              {displayGroup &&
-                createPortal(
-                  <GroupPage onClose={() => setDisplayGroup(false)} />,
-                  document.body
-                )}
-            </>
-          </div>
-        )
+        <div className="flex items-center">
+          {props.data && renderSidebarOptions(props.data)}
+          <DropDownMenu />
+          <>
+            {displayGroup &&
+              createPortal(
+                <GroupPage onClose={() => setDisplayGroup(false)} />,
+                document.body
+              )}
+          </>
+        </div>
       )}
     </HeaderDiv>
   );
diff --git a/src/pages/admin.tsx b/src/pages/admin.tsx
index c44c7b85..4908bcb8 100644
--- a/src/pages/admin.tsx
+++ b/src/pages/admin.tsx
@@ -4,6 +4,8 @@ import Header from "../components/Header";
 import AdminSidebar from "../components/Admin/AdminSidebar";
 import { useState } from "react";
 import UserManagement from "../components/Admin/UserManagement";
+import Spinner from "../components/Spinner";
+import { Permission } from "@prisma/client";
 
 export async function getServerSideProps(context: GetServerSidePropsContext) {
   const session = await getSession(context);
@@ -17,26 +19,45 @@ export async function getServerSideProps(context: GetServerSidePropsContext) {
         },
       };
     }
+  } else {
+    return {
+      redirect: {
+        destination: "/",
+        permanent: false,
+      },
+    };
   }
 
   return {
-    props: {},
+    props: {
+      userPermission: session.user.permission,
+    },
   };
 }
 
-const Admin: NextPage = () => {
+interface AdminProps {
+  userPermission: Permission;
+}
+
+const Admin: NextPage<AdminProps> = ({ userPermission }) => {
   const [option, setOption] = useState<string>("management");
   return (
     <div className="relative h-full w-full overflow-hidden  ">
       <Header admin={true} />
-      <div className="flex h-full  flex-row">
-        <div className="z-0 min-w-[150px] max-w-[250px] flex-[1] border-r-4 border-busy-red   bg-stone-100">
-          <AdminSidebar option={option} setOption={setOption} />
-        </div>
-        <div className="flex-[3]">
-          {option === "management" && <UserManagement />}
+      {!userPermission ? (
+        <Spinner />
+      ) : (
+        <div className="flex h-full  flex-row">
+          <div className="z-0 min-w-[150px] max-w-[250px] flex-[1] border-r-4 border-busy-red   bg-stone-100">
+            <AdminSidebar option={option} setOption={setOption} />
+          </div>
+          <div className="flex-[3]">
+            {option === "management" && (
+              <UserManagement permission={userPermission} />
+            )}
+          </div>
         </div>
-      </div>
+      )}
     </div>
   );
 };
diff --git a/src/server/router/user/admin.ts b/src/server/router/user/admin.ts
index c62c4702..123d1e84 100644
--- a/src/server/router/user/admin.ts
+++ b/src/server/router/user/admin.ts
@@ -8,7 +8,7 @@ export const adminRouter = router({
   getAllUsers: protectedRouter.query(async ({ ctx, input }) => {
     const permission = ctx.session.user?.permission;
     console.log(ctx.session);
-    if (permission !== "MANAGER") {
+    if (permission === "USER") {
       throw new Error("Unauthorized access.");
     }
 

From 1a006438555d3000cdf5d1e7445d513d07644f6b Mon Sep 17 00:00:00 2001
From: Graham Mather <mather.g@northeastern.edu>
Date: Tue, 26 Nov 2024 17:34:26 -0500
Subject: [PATCH 17/44] Admin Charts

---
 chartjs-adapter-date-fns.d.ts               |   1 +
 package.json                                |   4 +
 src/components/Admin/AdminData.tsx          |  39 +++
 src/components/Admin/BarChartOnboarding.tsx | 113 +++++++++
 src/components/Admin/LineChartCount.tsx     | 260 ++++++++++++++++++++
 src/components/Admin/UserManagement.tsx     |   6 +-
 src/pages/admin.tsx                         |   7 +-
 src/server/router/createRouter.ts           |  16 ++
 src/server/router/user.ts                   |   4 +-
 src/server/router/user/admin.ts             |  53 +++-
 src/utils/adminDataUtils.ts                 |  50 ++++
 src/utils/types.ts                          |  17 +-
 yarn.lock                                   |  40 +++
 13 files changed, 587 insertions(+), 23 deletions(-)
 create mode 100644 chartjs-adapter-date-fns.d.ts
 create mode 100644 src/components/Admin/AdminData.tsx
 create mode 100644 src/components/Admin/BarChartOnboarding.tsx
 create mode 100644 src/components/Admin/LineChartCount.tsx
 create mode 100644 src/utils/adminDataUtils.ts

diff --git a/chartjs-adapter-date-fns.d.ts b/chartjs-adapter-date-fns.d.ts
new file mode 100644
index 00000000..1a8ad33a
--- /dev/null
+++ b/chartjs-adapter-date-fns.d.ts
@@ -0,0 +1 @@
+declare module "chartjs-adapter-date-fns";
diff --git a/package.json b/package.json
index f767db1a..8bdd735f 100644
--- a/package.json
+++ b/package.json
@@ -49,6 +49,9 @@
     "@types/styled-components": "^5.1.26",
     "antd": "^5.22.1",
     "axios": "^0.27.2",
+    "chart.js": "^4.4.6",
+    "chartjs-adapter-date-fns": "^3.0.0",
+    "chartjs-plugin-zoom": "^2.2.0",
     "date-fns": "^4.1.0",
     "dayjs": "1.11.13",
     "envsafe": "^2.0.3",
@@ -63,6 +66,7 @@
     "rc-picker": "^4.8.1",
     "rc-trigger": "^5.3.4",
     "react": "^18.3.1",
+    "react-chartjs-2": "^5.2.0",
     "react-dom": "^18.3.1",
     "react-easy-crop": "^5.1.0",
     "react-hook-form": "^7.32.2",
diff --git a/src/components/Admin/AdminData.tsx b/src/components/Admin/AdminData.tsx
new file mode 100644
index 00000000..05bd4757
--- /dev/null
+++ b/src/components/Admin/AdminData.tsx
@@ -0,0 +1,39 @@
+import React, { useEffect, useState } from "react";
+import Spinner from "../Spinner";
+import { trpc } from "../../utils/trpc";
+import { TempUser, TempGroup } from "../../utils/types";
+import BarChartOnboarding from "./BarChartOnboarding";
+import LineChartCount from "./LineChartCount";
+
+function AdminData() {
+  const [loading, setLoading] = useState<boolean>(true);
+  const { data: users = [] } =
+    trpc.user.admin.getAllUsers.useQuery<TempUser[]>();
+  const { data: groups = [] } =
+    trpc.user.admin.getCarpoolGroups.useQuery<TempGroup[]>();
+
+  useEffect(() => {
+    if (users && groups) {
+      setLoading(false);
+    }
+  }, [users, groups]);
+
+  if (loading) {
+    return <Spinner />;
+  }
+
+  return (
+    <div className="relative my-4 h-[91.5%]  w-full">
+      <div className="absolute inset-0 flex h-full flex-col  space-y-6  px-8">
+        <div className="min-h-0 flex-[1.5] ">
+          <BarChartOnboarding users={users} />
+        </div>
+        <div className="min-h-0 flex-[2]">
+          <LineChartCount users={users} groups={groups} />
+        </div>
+      </div>
+    </div>
+  );
+}
+
+export default AdminData;
diff --git a/src/components/Admin/BarChartOnboarding.tsx b/src/components/Admin/BarChartOnboarding.tsx
new file mode 100644
index 00000000..31cabdf7
--- /dev/null
+++ b/src/components/Admin/BarChartOnboarding.tsx
@@ -0,0 +1,113 @@
+import React from "react";
+import { Bar } from "react-chartjs-2";
+import {
+  Chart as ChartJS,
+  CategoryScale,
+  LinearScale,
+  BarElement,
+  Title,
+  Tooltip,
+  Legend,
+  ChartData,
+  ChartOptions,
+} from "chart.js";
+
+ChartJS.register(
+  CategoryScale,
+  LinearScale,
+  BarElement,
+  Title,
+  Tooltip,
+  Legend
+);
+
+import { TempUser } from "../../utils/types";
+
+interface BarChartOnboardingProps {
+  users: TempUser[];
+}
+
+function BarChartOnboarding({ users }: BarChartOnboardingProps) {
+  const countOnboarded = users.filter((user) => user.isOnboarded).length;
+  const countNotOnboarded = users.length - countOnboarded;
+
+  const barData: ChartData<"bar"> = {
+    labels: ["Users"],
+    datasets: [
+      {
+        label: "Onboarded",
+        data: [countOnboarded],
+        backgroundColor: "#C8102E",
+      },
+      {
+        label: "Not Onboarded",
+        data: [countNotOnboarded],
+        backgroundColor: "#D3D3D3",
+      },
+    ],
+  };
+
+  const barOptions: ChartOptions<"bar"> = {
+    responsive: true,
+    maintainAspectRatio: false,
+    plugins: {
+      legend: {
+        position: "top",
+        labels: {
+          font: {
+            family: "Montserrat",
+            size: 16,
+            style: "normal",
+            weight: "bold",
+          },
+        },
+      },
+      title: {
+        display: true,
+        text: "User Onboarding Status",
+        font: {
+          family: "Montserrat",
+          size: 18,
+          style: "normal",
+          weight: "bold",
+        },
+        color: "#000000",
+      },
+    },
+    scales: {
+      x: {
+        ticks: {
+          font: {
+            family: "Montserrat",
+            size: 16,
+            style: "normal",
+            weight: "bold",
+          },
+        },
+      },
+      y: {
+        beginAtZero: true,
+        title: {
+          display: true,
+          text: "Number of Users",
+          font: {
+            family: "Montserrat",
+            size: 16,
+            style: "normal",
+            weight: "bold",
+          },
+        },
+      },
+    },
+  };
+
+  return (
+    <div className="h-full w-full ">
+      <div className="relative h-full">
+        <Bar data={barData} options={barOptions} />
+      </div>
+    </div>
+  );
+}
+
+export default BarChartOnboarding;
diff --git a/src/components/Admin/LineChartCount.tsx b/src/components/Admin/LineChartCount.tsx
new file mode 100644
index 00000000..96af50d5
--- /dev/null
+++ b/src/components/Admin/LineChartCount.tsx
@@ -0,0 +1,260 @@
+import React, { useEffect, useState } from "react";
+import { Line } from "react-chartjs-2";
+import {
+  Chart as ChartJS,
+  TimeScale,
+  LinearScale,
+  PointElement,
+  LineElement,
+  Title,
+  Tooltip,
+  Legend,
+  CategoryScale,
+  ChartData,
+  ChartOptions,
+} from "chart.js";
+import "chartjs-adapter-date-fns";
+import { format, startOfWeek, differenceInWeeks, addWeeks } from "date-fns";
+import { Slider } from "antd";
+
+ChartJS.register(
+  CategoryScale,
+  TimeScale,
+  LinearScale,
+  PointElement,
+  LineElement,
+  Title,
+  Tooltip,
+  Legend
+);
+
+import { TempUser, TempGroup } from "../../utils/types";
+import {
+  countCumulativeItemsPerWeek,
+  filterItemsByDate,
+} from "../../utils/adminDataUtils";
+
+interface LineChartCountProps {
+  users: TempUser[];
+  groups: TempGroup[];
+}
+
+function LineChartCount({ users, groups }: LineChartCountProps) {
+  const [sliderRange, setSliderRange] = useState<number[]>([0, 0]);
+  const [minDate, setMinDate] = useState<number>(0);
+  const [maxDate, setMaxDate] = useState<number>(0);
+
+  useEffect(() => {
+    if (users && groups) {
+      const allTimestamps = [
+        ...users.map((user) => user.dateCreated.getTime()),
+        ...groups.map((group) => group.dateCreated.getTime()),
+      ];
+
+      if (allTimestamps.length > 0) {
+        const minTimestamp = Math.min(...allTimestamps);
+        const maxTimestamp = Math.max(...allTimestamps);
+
+        setMinDate(minTimestamp);
+        setMaxDate(maxTimestamp);
+        setSliderRange([minTimestamp, maxTimestamp]);
+      }
+    }
+  }, [users, groups]);
+
+  const onSliderChange = (value: number[]) => {
+    setSliderRange(value);
+  };
+
+  // Filter items based on slider range
+  const filteredUsers = filterItemsByDate(
+    users,
+    sliderRange[0],
+    sliderRange[1]
+  );
+  const filteredGroups = filterItemsByDate(
+    groups,
+    sliderRange[0],
+    sliderRange[1]
+  );
+
+  // Generate week labels
+  const allDates = [
+    ...filteredUsers.map((user) => user.dateCreated),
+    ...filteredGroups.map((group) => group.dateCreated),
+  ];
+
+  let weekLabels: Date[] = [];
+  if (allDates.length > 0) {
+    const minWeekDate = startOfWeek(
+      new Date(Math.min(...allDates.map((date) => date.getTime()))),
+      { weekStartsOn: 1 }
+    );
+    const maxWeekDate = startOfWeek(
+      new Date(Math.max(...allDates.map((date) => date.getTime()))),
+      { weekStartsOn: 1 }
+    );
+
+    const weeksDifference = differenceInWeeks(maxWeekDate, minWeekDate) + 1;
+
+    for (let i = 0; i < weeksDifference; i++) {
+      const weekStart = addWeeks(minWeekDate, i);
+      weekLabels.push(weekStart);
+    }
+  }
+
+  const userCounts = countCumulativeItemsPerWeek(filteredUsers, weekLabels);
+  const groupCounts = countCumulativeItemsPerWeek(filteredGroups, weekLabels);
+
+  const lineData: ChartData<"line"> = {
+    labels: weekLabels,
+    datasets: [
+      {
+        label: "Users",
+        data: userCounts,
+        fill: false,
+        backgroundColor: "#C8102E",
+        borderColor: "#C8102E",
+        tension: 0.1,
+        pointRadius: 10,
+        spanGaps: true,
+      },
+      {
+        label: "Groups",
+        data: groupCounts,
+        fill: false,
+        showLine: true,
+        backgroundColor: "#C7EFB3",
+        borderColor: "#C7EFB3",
+        tension: 0.1,
+        pointRadius: 10,
+        spanGaps: true,
+      },
+    ],
+  };
+
+  const lineOptions: ChartOptions<"line"> = {
+    responsive: true,
+    maintainAspectRatio: false,
+    plugins: {
+      legend: {
+        position: "top",
+        labels: {
+          font: {
+            family: "Montserrat",
+            size: 18,
+            style: "normal",
+            weight: "bold",
+          },
+        },
+      },
+      title: {
+        display: true,
+        text: "Cumulative Users and Groups Over Time",
+        font: {
+          family: "Montserrat",
+          size: 18,
+          style: "normal",
+          weight: "bold",
+        },
+        color: "#000000",
+      },
+      tooltip: {
+        enabled: true,
+        titleFont: {
+          family: "Montserrat",
+          size: 16,
+          style: "normal",
+          weight: "normal",
+        },
+        bodyFont: {
+          family: "Montserrat",
+          size: 16,
+          style: "normal",
+          weight: "normal",
+        },
+      },
+    },
+    scales: {
+      x: {
+        type: "time",
+        time: {
+          unit: "week",
+          tooltipFormat: "MMM dd, yyyy",
+          displayFormats: { week: "MMM dd" },
+        },
+        title: {
+          display: true,
+          text: "Date",
+          font: {
+            family: "Montserrat",
+            size: 16,
+            style: "normal",
+            weight: "bold",
+          },
+        },
+        ticks: {
+          font: {
+            family: "Montserrat",
+            size: 12,
+            style: "normal",
+            weight: "normal",
+          },
+        },
+      },
+      y: {
+        beginAtZero: true,
+        title: {
+          display: true,
+          text: "Cumulative Count",
+          font: {
+            family: "Montserrat",
+            size: 16,
+            style: "normal",
+            weight: "bold",
+          },
+        },
+        ticks: {
+          font: {
+            family: "Montserrat",
+            size: 12,
+            style: "normal",
+            weight: "normal",
+          },
+          color: "#000000",
+        },
+      },
+    },
+  };
+
+  const formatter = (value: any) => format(new Date(value), "MMM dd, yyyy");
+
+  return (
+    <div className="h-full w-full">
+      {allDates.length > 0 ? (
+        <div className="relative h-[calc(100%-4rem)] w-full">
+          <Line data={lineData} options={lineOptions} />
+        </div>
+      ) : (
+        <div>No data available for the selected date range.</div>
+      )}
+      <div className="w-full">
+        <Slider
+          range={{ draggableTrack: true }}
+          min={minDate}
+          max={maxDate}
+          value={sliderRange}
+          tooltip={{ formatter }}
+          onChange={onSliderChange}
+          step={24 * 60 * 60 * 1000}
+        />
+        <div className="flex justify-between">
+          <span>{format(new Date(sliderRange[0]), "MMM dd, yyyy")}</span>
+          <span>{format(new Date(sliderRange[1]), "MMM dd, yyyy")}</span>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+export default LineChartCount;
diff --git a/src/components/Admin/UserManagement.tsx b/src/components/Admin/UserManagement.tsx
index a963798e..15d432e1 100644
--- a/src/components/Admin/UserManagement.tsx
+++ b/src/components/Admin/UserManagement.tsx
@@ -5,12 +5,8 @@ import Spinner from "../Spinner";
 import { toast } from "react-toastify";
 import { ConfigProvider, Select } from "antd";
 import { Note } from "../../styles/profile";
+import { TempUser } from "../../utils/types";
 
-type TempUser = {
-  id: string;
-  email: string;
-  permission: Permission;
-};
 type UserManagementProps = {
   permission: Permission;
 };
diff --git a/src/pages/admin.tsx b/src/pages/admin.tsx
index 4908bcb8..eaadad17 100644
--- a/src/pages/admin.tsx
+++ b/src/pages/admin.tsx
@@ -6,6 +6,7 @@ import { useState } from "react";
 import UserManagement from "../components/Admin/UserManagement";
 import Spinner from "../components/Spinner";
 import { Permission } from "@prisma/client";
+import AdminData from "../components/Admin/AdminData";
 
 export async function getServerSideProps(context: GetServerSidePropsContext) {
   const session = await getSession(context);
@@ -47,13 +48,15 @@ const Admin: NextPage<AdminProps> = ({ userPermission }) => {
       {!userPermission ? (
         <Spinner />
       ) : (
-        <div className="flex h-full  flex-row">
+        <div className="flex h-[91.5%]  flex-row">
           <div className="z-0 min-w-[150px] max-w-[250px] flex-[1] border-r-4 border-busy-red   bg-stone-100">
             <AdminSidebar option={option} setOption={setOption} />
           </div>
           <div className="flex-[3]">
-            {option === "management" && (
+            {option === "management" ? (
               <UserManagement permission={userPermission} />
+            ) : (
+              <AdminData />
             )}
           </div>
         </div>
diff --git a/src/server/router/createRouter.ts b/src/server/router/createRouter.ts
index 9a6f6ff5..1d56c598 100644
--- a/src/server/router/createRouter.ts
+++ b/src/server/router/createRouter.ts
@@ -22,5 +22,21 @@ const isProtected = middleware(({ ctx, next }) => {
     },
   });
 });
+const isAdmin = middleware(({ ctx, next }) => {
+  if (!ctx.session || !ctx.session.user) {
+    throw new TRPCError({ code: "UNAUTHORIZED" });
+  }
+  if (ctx.session.user.permission === "USER") {
+    throw new TRPCError({ code: "UNAUTHORIZED" });
+  }
+
+  return next({
+    ctx: {
+      ...ctx,
+      session: ctx.session,
+    },
+  });
+});
 
 export const protectedRouter = procedure.use(isProtected);
+export const adminRouter = procedure.use(isAdmin);
diff --git a/src/server/router/user.ts b/src/server/router/user.ts
index 740b88c1..6b26b58e 100644
--- a/src/server/router/user.ts
+++ b/src/server/router/user.ts
@@ -15,7 +15,7 @@ import {
   generatePresignedUrl,
   getPresignedImageUrl,
 } from "../../utils/uploadToS3";
-import { adminRouter } from "./user/admin";
+import { adminDataRouter } from "./user/admin";
 const getPresignedDownloadUrlInput = z.object({
   userId: z.string().optional(),
 });
@@ -156,5 +156,5 @@ export const userRouter = router({
   requests: requestsRouter,
   groups: groupsRouter,
   emails: emailsRouter,
-  admin: adminRouter,
+  admin: adminDataRouter,
 });
diff --git a/src/server/router/user/admin.ts b/src/server/router/user/admin.ts
index 123d1e84..9fb5c884 100644
--- a/src/server/router/user/admin.ts
+++ b/src/server/router/user/admin.ts
@@ -1,17 +1,11 @@
-import { protectedRouter, router } from "../createRouter";
+import { adminRouter, router } from "../createRouter";
 import { z } from "zod";
-import { Permission } from "@prisma/client";
-
+import { Permission, Status } from "@prisma/client";
+import { Role } from "@prisma/client";
 // Router for admin dashboard queries, only Managers can edit roles
 // User must be Manager or Admin to view user data
-export const adminRouter = router({
-  getAllUsers: protectedRouter.query(async ({ ctx, input }) => {
-    const permission = ctx.session.user?.permission;
-    console.log(ctx.session);
-    if (permission === "USER") {
-      throw new Error("Unauthorized access.");
-    }
-
+export const adminDataRouter = router({
+  getAllUsers: adminRouter.query(async ({ ctx, input }) => {
     return ctx.prisma.user.findMany({
       where: {
         email: {
@@ -22,10 +16,45 @@ export const adminRouter = router({
         id: true,
         email: true,
         permission: true,
+        isOnboarded: true,
+        dateCreated: true,
+      },
+    });
+  }),
+  getCarpoolGroups: adminRouter.query(async ({ ctx, input }) => {
+    return ctx.prisma.carpoolGroup.findMany({
+      where: {
+        AND: [
+          {
+            users: {
+              some: {
+                role: Role.DRIVER,
+                status: Status.ACTIVE,
+              },
+            },
+          },
+          {
+            users: {
+              some: {
+                role: Role.RIDER,
+                status: Status.ACTIVE,
+              },
+            },
+          },
+        ],
+      },
+      select: {
+        id: true,
+        dateCreated: true,
+        _count: {
+          select: {
+            users: true,
+          },
+        },
       },
     });
   }),
-  updateUserPermission: protectedRouter
+  updateUserPermission: adminRouter
     .input(
       z.object({
         userId: z.string(),
diff --git a/src/utils/adminDataUtils.ts b/src/utils/adminDataUtils.ts
new file mode 100644
index 00000000..b2461aff
--- /dev/null
+++ b/src/utils/adminDataUtils.ts
@@ -0,0 +1,50 @@
+import { addWeeks } from "date-fns";
+
+interface ItemWithDate {
+  dateCreated: Date;
+}
+export const filterItemsByDate = (
+  items: ItemWithDate[],
+  startTimestamp: number,
+  endTimestamp: number
+) => {
+  return items.filter((item) => {
+    const itemTimestamp = item.dateCreated.getTime();
+    return itemTimestamp >= startTimestamp && itemTimestamp <= endTimestamp;
+  });
+};
+export const countCumulativeItemsPerWeek = (
+  items: ItemWithDate[],
+  weekLabels: Date[]
+): (number | null)[] => {
+  const counts: (number | null)[] = [];
+  let cumulativeCount = 0;
+  let prevCount = 0;
+  let itemIndex = 0;
+  const sortedItems = items
+    .slice()
+    .sort(
+      (a, b) =>
+        new Date(a.dateCreated).getTime() - new Date(b.dateCreated).getTime()
+    );
+
+  weekLabels.forEach((weekStart, index) => {
+    const weekEnd = addWeeks(weekStart, 1);
+    while (
+      itemIndex < sortedItems.length &&
+      new Date(sortedItems[itemIndex].dateCreated) < weekEnd
+    ) {
+      cumulativeCount++;
+      itemIndex++;
+    }
+
+    if (index === 0 || cumulativeCount > prevCount) {
+      counts.push(cumulativeCount);
+    } else {
+      counts.push(null);
+    }
+    prevCount = cumulativeCount;
+  });
+
+  return counts;
+};
diff --git a/src/utils/types.ts b/src/utils/types.ts
index 9f5a0311..48f9b66b 100644
--- a/src/utils/types.ts
+++ b/src/utils/types.ts
@@ -1,11 +1,24 @@
-import { Role } from "@prisma/client";
+import { Permission, Role } from "@prisma/client";
 import { Status } from "@prisma/client";
 import { Feature } from "geojson";
 import type { AppRouter } from "../server/router";
 import { inferRouterOutputs } from "@trpc/server";
 
 type RouterOutput = inferRouterOutputs<AppRouter>;
-
+export type TempUser = {
+  id: string;
+  email: string;
+  permission: Permission;
+  isOnboarded: boolean;
+  dateCreated: Date;
+};
+export type TempGroup = {
+  id: string;
+  dateCreated: Date;
+  _count: {
+    users: number;
+  };
+};
 export type PoiData = {
   location: string;
   coordLng: number;
diff --git a/yarn.lock b/yarn.lock
index 468d8d6a..577fb637 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1607,6 +1607,11 @@
     "@jridgewell/resolve-uri" "^3.1.0"
     "@jridgewell/sourcemap-codec" "^1.4.14"
 
+"@kurkle/color@^0.3.0":
+  version "0.3.4"
+  resolved "https://registry.yarnpkg.com/@kurkle/color/-/color-0.3.4.tgz#4d4ff677e1609214fc71c580125ddddd86abcabf"
+  integrity sha512-M5UknZPHRu3DEDWoipU6sE8PdkZ6Z/S+v4dD+Ke8IaNlpdSQah50lz1KtcFBa2vsdOnwbbnxJwVM4wty6udA5w==
+
 "@mapbox/geojson-rewind@^0.5.2":
   version "0.5.2"
   resolved "https://registry.yarnpkg.com/@mapbox/geojson-rewind/-/geojson-rewind-0.5.2.tgz#591a5d71a9cd1da1a0bf3420b3bea31b0fc7946a"
@@ -2666,6 +2671,11 @@
   dependencies:
     "@types/node" "*"
 
+"@types/hammerjs@^2.0.45":
+  version "2.0.46"
+  resolved "https://registry.yarnpkg.com/@types/hammerjs/-/hammerjs-2.0.46.tgz#381daaca1360ff8a7c8dff63f32e69745b9fb1e1"
+  integrity sha512-ynRvcq6wvqexJ9brDMS4BnBLzmr0e14d6ZJTEShTBWKymQiHwlAyGu0ZPEFI2Fh1U53F7tN9ufClWM5KvqkKOw==
+
 "@types/hoist-non-react-statics@*":
   version "3.3.5"
   resolved "https://registry.yarnpkg.com/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.5.tgz#dab7867ef789d87e2b4b0003c9d65c49cc44a494"
@@ -3464,6 +3474,26 @@ char-regex@^1.0.2:
   resolved "https://registry.yarnpkg.com/char-regex/-/char-regex-1.0.2.tgz#d744358226217f981ed58f479b1d6bcc29545dcf"
   integrity sha512-kWWXztvZ5SBQV+eRgKFeh8q5sLuZY2+8WUIzlxWVTg+oGwY14qylx1KbKzHd8P6ZYkAg0xyIDU9JMHhyJMZ1jw==
 
+chart.js@^4.4.6:
+  version "4.4.6"
+  resolved "https://registry.yarnpkg.com/chart.js/-/chart.js-4.4.6.tgz#da39b84ca752298270d4c0519675c7659936abec"
+  integrity sha512-8Y406zevUPbbIBA/HRk33khEmQPk5+cxeflWE/2rx1NJsjVWMPw/9mSP9rxHP5eqi6LNoPBVMfZHxbwLSgldYA==
+  dependencies:
+    "@kurkle/color" "^0.3.0"
+
+chartjs-adapter-date-fns@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/chartjs-adapter-date-fns/-/chartjs-adapter-date-fns-3.0.0.tgz#c25f63c7f317c1f96f9a7c44bd45eeedb8a478e5"
+  integrity sha512-Rs3iEB3Q5pJ973J93OBTpnP7qoGwvq3nUnoMdtxO+9aoJof7UFcRbWcIDteXuYd1fgAvct/32T9qaLyLuZVwCg==
+
+chartjs-plugin-zoom@^2.2.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/chartjs-plugin-zoom/-/chartjs-plugin-zoom-2.2.0.tgz#79928acf2d22bd60b5442e0ef73139b261c65d19"
+  integrity sha512-in6kcdiTlP6npIVLMd4zXZ08PDUXC52gZ4FAy5oyjk1zX3gKarXMAof7B9eFiisf9WOC3bh2saHg+J5WtLXZeA==
+  dependencies:
+    "@types/hammerjs" "^2.0.45"
+    hammerjs "^2.0.8"
+
 chokidar@^3.6.0:
   version "3.6.0"
   resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.6.0.tgz#197c6cc669ef2a8dc5e7b4d97ee4e092c3eb0d5b"
@@ -4700,6 +4730,11 @@ grid-index@^1.1.0:
   resolved "https://registry.yarnpkg.com/grid-index/-/grid-index-1.1.0.tgz#97f8221edec1026c8377b86446a7c71e79522ea7"
   integrity sha512-HZRwumpOGUrHyxO5bqKZL0B0GlUpwtCAzZ42sgxUPniu33R1LSFH5yrIcBCHjkctCAh3mtWKcKd9J4vDDdeVHA==
 
+hammerjs@^2.0.8:
+  version "2.0.8"
+  resolved "https://registry.yarnpkg.com/hammerjs/-/hammerjs-2.0.8.tgz#04ef77862cff2bb79d30f7692095930222bf60f1"
+  integrity sha512-tSQXBXS/MWQOn/RKckawJ61vvsDpCom87JgxiYdGwHdOa0ht0vzUWDlfioofFCRU0L+6NGDt6XzbgoJvZkMeRQ==
+
 hard-rejection@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/hard-rejection/-/hard-rejection-2.1.0.tgz#1c6eda5c1685c63942766d79bb40ae773cecd883"
@@ -6934,6 +6969,11 @@ rc-virtual-list@^3.14.2, rc-virtual-list@^3.5.1, rc-virtual-list@^3.5.2:
     rc-resize-observer "^1.0.0"
     rc-util "^5.36.0"
 
+react-chartjs-2@^5.2.0:
+  version "5.2.0"
+  resolved "https://registry.yarnpkg.com/react-chartjs-2/-/react-chartjs-2-5.2.0.tgz#43c1e3549071c00a1a083ecbd26c1ad34d385f5d"
+  integrity sha512-98iN5aguJyVSxp5U3CblRLH67J8gkfyGNbiK3c+l1QI/G4irHMPQw44aEPmjVag+YKTyQ260NcF82GTQ3bdscA==
+
 react-dom@^18.3.1:
   version "18.3.1"
   resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-18.3.1.tgz#c2265d79511b57d479b3dd3fdfa51536494c5cb4"

From 75ab43d91c19b1d86ba1772eebb95acd5ef87790 Mon Sep 17 00:00:00 2001
From: Graham Mather <mather.g@northeastern.edu>
Date: Wed, 27 Nov 2024 11:58:54 -0500
Subject: [PATCH 18/44] Both charts fully implemented

---
 src/components/Admin/AdminData.tsx            |  4 +-
 ...tOnboarding.tsx => BarChartUserCounts.tsx} | 61 ++++++++++++-------
 src/components/Admin/LineChartCount.tsx       | 36 +++++++----
 .../Profile/ControlledTimePicker.tsx          |  2 +-
 src/server/router/user/admin.ts               |  1 +
 src/utils/types.ts                            |  1 +
 6 files changed, 67 insertions(+), 38 deletions(-)
 rename src/components/Admin/{BarChartOnboarding.tsx => BarChartUserCounts.tsx} (63%)

diff --git a/src/components/Admin/AdminData.tsx b/src/components/Admin/AdminData.tsx
index 05bd4757..6f872c23 100644
--- a/src/components/Admin/AdminData.tsx
+++ b/src/components/Admin/AdminData.tsx
@@ -2,7 +2,7 @@ import React, { useEffect, useState } from "react";
 import Spinner from "../Spinner";
 import { trpc } from "../../utils/trpc";
 import { TempUser, TempGroup } from "../../utils/types";
-import BarChartOnboarding from "./BarChartOnboarding";
+import BarChartUserCounts from "./BarChartUserCounts";
 import LineChartCount from "./LineChartCount";
 
 function AdminData() {
@@ -26,7 +26,7 @@ function AdminData() {
     <div className="relative my-4 h-[91.5%]  w-full">
       <div className="absolute inset-0 flex h-full flex-col  space-y-6  px-8">
         <div className="min-h-0 flex-[1.5] ">
-          <BarChartOnboarding users={users} />
+          <BarChartUserCounts users={users} />
         </div>
         <div className="min-h-0 flex-[2]">
           <LineChartCount users={users} groups={groups} />
diff --git a/src/components/Admin/BarChartOnboarding.tsx b/src/components/Admin/BarChartUserCounts.tsx
similarity index 63%
rename from src/components/Admin/BarChartOnboarding.tsx
rename to src/components/Admin/BarChartUserCounts.tsx
index 31cabdf7..3ae0195e 100644
--- a/src/components/Admin/BarChartOnboarding.tsx
+++ b/src/components/Admin/BarChartUserCounts.tsx
@@ -27,22 +27,47 @@ interface BarChartOnboardingProps {
   users: TempUser[];
 }
 
-function BarChartOnboarding({ users }: BarChartOnboardingProps) {
+function BarChartUserCounts({ users }: BarChartOnboardingProps) {
+  const totalCount = users.length;
   const countOnboarded = users.filter((user) => user.isOnboarded).length;
-  const countNotOnboarded = users.length - countOnboarded;
+  const countNotOnboarded = totalCount - countOnboarded;
+  const driverCount = users.filter((user) => user.role === "DRIVER").length;
+  const riderCount = users.filter((user) => user.role === "RIDER").length;
+
+  const viewerCount = totalCount - (driverCount + riderCount);
+  const dataPoints = [
+    totalCount,
+    countOnboarded,
+    countNotOnboarded,
+    driverCount,
+    riderCount,
+    viewerCount,
+  ];
+  const barColors = [
+    "#000000",
+    "#FFA9A9",
+    "#808080",
+    "#C8102E",
+    "#DA7D25",
+    "#2454DD",
+  ];
+  const labels = [
+    "Total",
+    "Onboarded",
+    "Not Onboarded",
+    "Driver",
+    "Rider",
+    "Viewer",
+  ];
 
   const barData: ChartData<"bar"> = {
-    labels: ["Users"],
+    labels,
+
     datasets: [
       {
-        label: "Onboarded",
-        data: [countOnboarded],
-        backgroundColor: "#C8102E",
-      },
-      {
-        label: "Not Onboarded",
-        data: [countNotOnboarded],
-        backgroundColor: "#D3D3D3",
+        label: "User Counts",
+        data: dataPoints,
+        backgroundColor: barColors,
       },
     ],
   };
@@ -52,19 +77,11 @@ function BarChartOnboarding({ users }: BarChartOnboardingProps) {
     maintainAspectRatio: false,
     plugins: {
       legend: {
-        position: "top",
-        labels: {
-          font: {
-            family: "Montserrat",
-            size: 16,
-            style: "normal",
-            weight: "bold",
-          },
-        },
+        display: false,
       },
       title: {
         display: true,
-        text: "User Onboarding Status",
+        text: "User Counts",
         font: {
           family: "Montserrat",
           size: 18,
@@ -110,4 +127,4 @@ function BarChartOnboarding({ users }: BarChartOnboardingProps) {
   );
 }
 
-export default BarChartOnboarding;
+export default BarChartUserCounts;
diff --git a/src/components/Admin/LineChartCount.tsx b/src/components/Admin/LineChartCount.tsx
index 96af50d5..994ef8f0 100644
--- a/src/components/Admin/LineChartCount.tsx
+++ b/src/components/Admin/LineChartCount.tsx
@@ -15,7 +15,7 @@ import {
 } from "chart.js";
 import "chartjs-adapter-date-fns";
 import { format, startOfWeek, differenceInWeeks, addWeeks } from "date-fns";
-import { Slider } from "antd";
+import { Slider, ConfigProvider } from "antd";
 
 ChartJS.register(
   CategoryScale,
@@ -66,7 +66,7 @@ function LineChartCount({ users, groups }: LineChartCountProps) {
     setSliderRange(value);
   };
 
-  // Filter items based on slider range
+  // Filter based on slider range
   const filteredUsers = filterItemsByDate(
     users,
     sliderRange[0],
@@ -142,7 +142,7 @@ function LineChartCount({ users, groups }: LineChartCountProps) {
         labels: {
           font: {
             family: "Montserrat",
-            size: 18,
+            size: 16,
             style: "normal",
             weight: "bold",
           },
@@ -239,16 +239,26 @@ function LineChartCount({ users, groups }: LineChartCountProps) {
         <div>No data available for the selected date range.</div>
       )}
       <div className="w-full">
-        <Slider
-          range={{ draggableTrack: true }}
-          min={minDate}
-          max={maxDate}
-          value={sliderRange}
-          tooltip={{ formatter }}
-          onChange={onSliderChange}
-          step={24 * 60 * 60 * 1000}
-        />
-        <div className="flex justify-between">
+        <ConfigProvider
+          theme={{
+            token: {
+              fontFamily: "Montserrat",
+              fontSize: 16,
+              colorPrimary: "#C8102E",
+            },
+          }}
+        >
+          <Slider
+            range={{ draggableTrack: true }}
+            min={minDate}
+            max={maxDate}
+            value={sliderRange}
+            tooltip={{ formatter }}
+            onChange={onSliderChange}
+            step={24 * 60 * 60 * 1000}
+          />
+        </ConfigProvider>
+        <div className="flex justify-between font-montserrat">
           <span>{format(new Date(sliderRange[0]), "MMM dd, yyyy")}</span>
           <span>{format(new Date(sliderRange[1]), "MMM dd, yyyy")}</span>
         </div>
diff --git a/src/components/Profile/ControlledTimePicker.tsx b/src/components/Profile/ControlledTimePicker.tsx
index a69ada77..db7bf56d 100644
--- a/src/components/Profile/ControlledTimePicker.tsx
+++ b/src/components/Profile/ControlledTimePicker.tsx
@@ -1,5 +1,5 @@
 import { TimePicker, ConfigProvider } from "antd";
-import dayjs, { Dayjs } from "dayjs";
+import dayjs from "dayjs";
 import customParseFormat from "dayjs/plugin/customParseFormat";
 dayjs.extend(customParseFormat);
 import utc from "dayjs/plugin/utc";
diff --git a/src/server/router/user/admin.ts b/src/server/router/user/admin.ts
index 9fb5c884..cd3b8b9b 100644
--- a/src/server/router/user/admin.ts
+++ b/src/server/router/user/admin.ts
@@ -18,6 +18,7 @@ export const adminDataRouter = router({
         permission: true,
         isOnboarded: true,
         dateCreated: true,
+        role: true,
       },
     });
   }),
diff --git a/src/utils/types.ts b/src/utils/types.ts
index 48f9b66b..5cebb632 100644
--- a/src/utils/types.ts
+++ b/src/utils/types.ts
@@ -11,6 +11,7 @@ export type TempUser = {
   permission: Permission;
   isOnboarded: boolean;
   dateCreated: Date;
+  role: Role;
 };
 export type TempGroup = {
   id: string;

From a6e543263e2eec5efcddf1d54d76ddb5a79e7a90 Mon Sep 17 00:00:00 2001
From: Graham Mather <mather.g@northeastern.edu>
Date: Wed, 27 Nov 2024 12:30:08 -0500
Subject: [PATCH 19/44] Slider step by week

---
 src/components/Admin/AdminSidebar.tsx   |  3 +--
 src/components/Admin/LineChartCount.tsx | 28 ++++++++++++++-----------
 2 files changed, 17 insertions(+), 14 deletions(-)

diff --git a/src/components/Admin/AdminSidebar.tsx b/src/components/Admin/AdminSidebar.tsx
index 211718a1..993dd9fc 100644
--- a/src/components/Admin/AdminSidebar.tsx
+++ b/src/components/Admin/AdminSidebar.tsx
@@ -4,8 +4,7 @@ type AdminSidebarProps = {
 };
 
 const AdminSidebar = ({ option, setOption }: AdminSidebarProps) => {
-  const baseButton =
-    "px-4 py-2 text-northeastern-red font-montserrat text-base md:text-lg ";
+  const baseButton = "px-4 py-2 text-northeastern-red font-montserrat text-xl ";
   const selectedButton = " font-bold underline underline-offset-8 ";
   return (
     <div className="h-full w-full  ">
diff --git a/src/components/Admin/LineChartCount.tsx b/src/components/Admin/LineChartCount.tsx
index 994ef8f0..d3be8a2b 100644
--- a/src/components/Admin/LineChartCount.tsx
+++ b/src/components/Admin/LineChartCount.tsx
@@ -57,7 +57,10 @@ function LineChartCount({ users, groups }: LineChartCountProps) {
 
         setMinDate(minTimestamp);
         setMaxDate(maxTimestamp);
-        setSliderRange([minTimestamp, maxTimestamp]);
+        setSliderRange([
+          startOfWeek(minTimestamp).getTime(),
+          startOfWeek(maxTimestamp).getTime(),
+        ]);
       }
     }
   }, [users, groups]);
@@ -87,12 +90,10 @@ function LineChartCount({ users, groups }: LineChartCountProps) {
   let weekLabels: Date[] = [];
   if (allDates.length > 0) {
     const minWeekDate = startOfWeek(
-      new Date(Math.min(...allDates.map((date) => date.getTime()))),
-      { weekStartsOn: 1 }
+      new Date(Math.min(...allDates.map((date) => date.getTime())))
     );
     const maxWeekDate = startOfWeek(
-      new Date(Math.max(...allDates.map((date) => date.getTime()))),
-      { weekStartsOn: 1 }
+      new Date(Math.max(...allDates.map((date) => date.getTime())))
     );
 
     const weeksDifference = differenceInWeeks(maxWeekDate, minWeekDate) + 1;
@@ -105,7 +106,6 @@ function LineChartCount({ users, groups }: LineChartCountProps) {
 
   const userCounts = countCumulativeItemsPerWeek(filteredUsers, weekLabels);
   const groupCounts = countCumulativeItemsPerWeek(filteredGroups, weekLabels);
-
   const lineData: ChartData<"line"> = {
     labels: weekLabels,
     datasets: [
@@ -150,7 +150,7 @@ function LineChartCount({ users, groups }: LineChartCountProps) {
       },
       title: {
         display: true,
-        text: "Cumulative Users and Groups Over Time",
+        text: "Cumulative Users and Current Groups Over Time",
         font: {
           family: "Montserrat",
           size: 18,
@@ -250,17 +250,21 @@ function LineChartCount({ users, groups }: LineChartCountProps) {
         >
           <Slider
             range={{ draggableTrack: true }}
-            min={minDate}
-            max={maxDate}
+            min={startOfWeek(minDate).getTime()}
+            max={startOfWeek(maxDate).getTime()}
             value={sliderRange}
             tooltip={{ formatter }}
             onChange={onSliderChange}
-            step={24 * 60 * 60 * 1000}
+            step={7 * 24 * 60 * 60 * 1000}
           />
         </ConfigProvider>
         <div className="flex justify-between font-montserrat">
-          <span>{format(new Date(sliderRange[0]), "MMM dd, yyyy")}</span>
-          <span>{format(new Date(sliderRange[1]), "MMM dd, yyyy")}</span>
+          <span>
+            {format(startOfWeek(new Date(sliderRange[0])), "MMM dd, yyyy")}
+          </span>
+          <span>
+            {format(startOfWeek(new Date(sliderRange[1])), "MMM dd, yyyy")}
+          </span>
         </div>
       </div>
     </div>

From 20ad30711811a1402d1188588386a497263a43f0 Mon Sep 17 00:00:00 2001
From: Graham Mather <mather.g@northeastern.edu>
Date: Wed, 27 Nov 2024 12:33:59 -0500
Subject: [PATCH 20/44] End range of slider inclusive

---
 src/utils/adminDataUtils.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/utils/adminDataUtils.ts b/src/utils/adminDataUtils.ts
index b2461aff..b6e26536 100644
--- a/src/utils/adminDataUtils.ts
+++ b/src/utils/adminDataUtils.ts
@@ -1,4 +1,4 @@
-import { addWeeks } from "date-fns";
+import { addWeeks, startOfWeek } from "date-fns";
 
 interface ItemWithDate {
   dateCreated: Date;
@@ -9,7 +9,7 @@ export const filterItemsByDate = (
   endTimestamp: number
 ) => {
   return items.filter((item) => {
-    const itemTimestamp = item.dateCreated.getTime();
+    const itemTimestamp = startOfWeek(item.dateCreated).getTime();
     return itemTimestamp >= startTimestamp && itemTimestamp <= endTimestamp;
   });
 };

From c458bf5ebd8c1d4a146adbd1b94082d97662dc26 Mon Sep 17 00:00:00 2001
From: Graham Mather <mather.g@northeastern.edu>
Date: Wed, 27 Nov 2024 13:37:05 -0500
Subject: [PATCH 21/44] Inactive user settings, main is overwhelmed otherwise

---
 src/components/Admin/BarChartUserCounts.tsx | 23 ++++++++---
 src/components/Admin/LineChartCount.tsx     | 42 +++++++++++++++++----
 src/server/router/user/admin.ts             |  1 +
 src/utils/types.ts                          |  1 +
 4 files changed, 54 insertions(+), 13 deletions(-)

diff --git a/src/components/Admin/BarChartUserCounts.tsx b/src/components/Admin/BarChartUserCounts.tsx
index 3ae0195e..c3dc71ef 100644
--- a/src/components/Admin/BarChartUserCounts.tsx
+++ b/src/components/Admin/BarChartUserCounts.tsx
@@ -28,11 +28,15 @@ interface BarChartOnboardingProps {
 }
 
 function BarChartUserCounts({ users }: BarChartOnboardingProps) {
-  const totalCount = users.length;
-  const countOnboarded = users.filter((user) => user.isOnboarded).length;
+  const activeUsers = users.filter((user) => user.status === "ACTIVE");
+  const totalCount = activeUsers.length;
+  const inactiveCount = users.length - totalCount;
+  const countOnboarded = activeUsers.filter((user) => user.isOnboarded).length;
   const countNotOnboarded = totalCount - countOnboarded;
-  const driverCount = users.filter((user) => user.role === "DRIVER").length;
-  const riderCount = users.filter((user) => user.role === "RIDER").length;
+  const driverCount = activeUsers.filter(
+    (user) => user.role === "DRIVER"
+  ).length;
+  const riderCount = activeUsers.filter((user) => user.role === "RIDER").length;
 
   const viewerCount = totalCount - (driverCount + riderCount);
   const dataPoints = [
@@ -42,6 +46,7 @@ function BarChartUserCounts({ users }: BarChartOnboardingProps) {
     driverCount,
     riderCount,
     viewerCount,
+    inactiveCount,
   ];
   const barColors = [
     "#000000",
@@ -50,6 +55,7 @@ function BarChartUserCounts({ users }: BarChartOnboardingProps) {
     "#C8102E",
     "#DA7D25",
     "#2454DD",
+    "#808080",
   ];
   const labels = [
     "Total",
@@ -58,6 +64,7 @@ function BarChartUserCounts({ users }: BarChartOnboardingProps) {
     "Driver",
     "Rider",
     "Viewer",
+    "Inactive",
   ];
 
   const barData: ChartData<"bar"> = {
@@ -65,7 +72,7 @@ function BarChartUserCounts({ users }: BarChartOnboardingProps) {
 
     datasets: [
       {
-        label: "User Counts",
+        label: "Active User Counts",
         data: dataPoints,
         backgroundColor: barColors,
       },
@@ -120,8 +127,12 @@ function BarChartUserCounts({ users }: BarChartOnboardingProps) {
 
   return (
     <div className="h-full w-full ">
-      <div className="relative h-full">
+      <div className="relative flex h-full flex-col">
         <Bar data={barData} options={barOptions} />
+        <span className="w-full text-center font-lato text-sm text-gray-400">
+          All bars currently only include active users aside from
+          &quot;Inactive&quot;
+        </span>
       </div>
     </div>
   );
diff --git a/src/components/Admin/LineChartCount.tsx b/src/components/Admin/LineChartCount.tsx
index d3be8a2b..9d5b1127 100644
--- a/src/components/Admin/LineChartCount.tsx
+++ b/src/components/Admin/LineChartCount.tsx
@@ -33,6 +33,7 @@ import {
   countCumulativeItemsPerWeek,
   filterItemsByDate,
 } from "../../utils/adminDataUtils";
+import _ from "lodash";
 
 interface LineChartCountProps {
   users: TempUser[];
@@ -43,7 +44,10 @@ function LineChartCount({ users, groups }: LineChartCountProps) {
   const [sliderRange, setSliderRange] = useState<number[]>([0, 0]);
   const [minDate, setMinDate] = useState<number>(0);
   const [maxDate, setMaxDate] = useState<number>(0);
-
+  const activeUsers = users.filter(
+    (user: TempUser) => user.status === "ACTIVE"
+  );
+  const inactiveUsers = _.differenceBy(users, activeUsers);
   useEffect(() => {
     if (users && groups) {
       const allTimestamps = [
@@ -70,8 +74,13 @@ function LineChartCount({ users, groups }: LineChartCountProps) {
   };
 
   // Filter based on slider range
-  const filteredUsers = filterItemsByDate(
-    users,
+  const filteredActiveUsers = filterItemsByDate(
+    activeUsers,
+    sliderRange[0],
+    sliderRange[1]
+  );
+  const filteredInactiveUsers = filterItemsByDate(
+    inactiveUsers,
     sliderRange[0],
     sliderRange[1]
   );
@@ -83,7 +92,7 @@ function LineChartCount({ users, groups }: LineChartCountProps) {
 
   // Generate week labels
   const allDates = [
-    ...filteredUsers.map((user) => user.dateCreated),
+    ...users.map((user) => user.dateCreated),
     ...filteredGroups.map((group) => group.dateCreated),
   ];
 
@@ -104,14 +113,22 @@ function LineChartCount({ users, groups }: LineChartCountProps) {
     }
   }
 
-  const userCounts = countCumulativeItemsPerWeek(filteredUsers, weekLabels);
+  const activeUserCount = countCumulativeItemsPerWeek(
+    filteredActiveUsers,
+    weekLabels
+  );
+  const inactiveUserCount = countCumulativeItemsPerWeek(
+    filteredInactiveUsers,
+    weekLabels
+  );
+
   const groupCounts = countCumulativeItemsPerWeek(filteredGroups, weekLabels);
   const lineData: ChartData<"line"> = {
     labels: weekLabels,
     datasets: [
       {
-        label: "Users",
-        data: userCounts,
+        label: "Active Users",
+        data: activeUserCount,
         fill: false,
         backgroundColor: "#C8102E",
         borderColor: "#C8102E",
@@ -119,6 +136,17 @@ function LineChartCount({ users, groups }: LineChartCountProps) {
         pointRadius: 10,
         spanGaps: true,
       },
+      {
+        label: "Inactive Users",
+        data: inactiveUserCount,
+        fill: false,
+        hidden: true,
+        backgroundColor: "#808080",
+        borderColor: "#808080",
+        tension: 0.1,
+        pointRadius: 10,
+        spanGaps: true,
+      },
       {
         label: "Groups",
         data: groupCounts,
diff --git a/src/server/router/user/admin.ts b/src/server/router/user/admin.ts
index cd3b8b9b..775d14a8 100644
--- a/src/server/router/user/admin.ts
+++ b/src/server/router/user/admin.ts
@@ -19,6 +19,7 @@ export const adminDataRouter = router({
         isOnboarded: true,
         dateCreated: true,
         role: true,
+        status: true,
       },
     });
   }),
diff --git a/src/utils/types.ts b/src/utils/types.ts
index 5cebb632..520d88e9 100644
--- a/src/utils/types.ts
+++ b/src/utils/types.ts
@@ -12,6 +12,7 @@ export type TempUser = {
   isOnboarded: boolean;
   dateCreated: Date;
   role: Role;
+  status: Status;
 };
 export type TempGroup = {
   id: string;

From 69860fbec62da6ff705969b8d4df20dcbb87812c Mon Sep 17 00:00:00 2001
From: Graham Mather <mather.g@northeastern.edu>
Date: Mon, 2 Dec 2024 15:21:01 -0500
Subject: [PATCH 22/44] Added toast popup, blocks drivers from switching roles
 in a group

---
 src/pages/profile/index.tsx | 25 +++++++++++++++++++++----
 1 file changed, 21 insertions(+), 4 deletions(-)

diff --git a/src/pages/profile/index.tsx b/src/pages/profile/index.tsx
index ff6df2a5..e990625f 100644
--- a/src/pages/profile/index.tsx
+++ b/src/pages/profile/index.tsx
@@ -179,7 +179,19 @@ const Index: NextPage = () => {
     });
     trackProfileCompletion(userInfo.role, userInfo.status);
   };
-
+  const handleRoleChange = (newRole: Role) => {
+    if (
+      user?.role === Role.DRIVER &&
+      user.carpoolId &&
+      newRole !== Role.DRIVER
+    ) {
+      toast.error(
+        "You are currently in a carpool group. To switch roles, please leave the group."
+      );
+    } else {
+      setValue("role", newRole, { shouldValidate: true });
+    }
+  };
   if (isLoading || !user) {
     return (
       <div className="fixed inset-0 z-50 flex items-center justify-center bg-white ">
@@ -208,8 +220,10 @@ const Index: NextPage = () => {
                       role={Role.VIEWER}
                       value={Role.VIEWER}
                       currentlySelected={watch("role")}
-                      {...register("role")}
+                      onChange={() => handleRoleChange(Role.VIEWER)}
+                      checked={watch("role") === Role.VIEWER}
                     />
+
                     <Radio
                       label="Rider"
                       id="rider"
@@ -217,8 +231,10 @@ const Index: NextPage = () => {
                       role={Role.RIDER}
                       value={Role.RIDER}
                       currentlySelected={watch("role")}
-                      {...register("role")}
+                      onChange={() => handleRoleChange(Role.RIDER)}
+                      checked={watch("role") === Role.RIDER}
                     />
+
                     <Radio
                       label="Driver"
                       id="driver"
@@ -226,7 +242,8 @@ const Index: NextPage = () => {
                       role={Role.DRIVER}
                       value={Role.DRIVER}
                       currentlySelected={watch("role")}
-                      {...register("role")}
+                      onChange={() => handleRoleChange(Role.DRIVER)}
+                      checked={watch("role") === Role.DRIVER}
                     />
 
                     {watch("role") == Role.DRIVER && (

From 86b3622a6c4d2f30fe32430bc7a5e81e019467b2 Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Mon, 18 Nov 2024 16:45:21 -0500
Subject: [PATCH 23/44] Backend logic working, now just frontend edits
 remaining

---
 prisma/schema.prisma             |  1 +
 src/components/GroupPage.tsx     | 55 ++++++++++++++++++++++++++++----
 src/server/router/user/groups.ts | 19 ++++++++++-
 3 files changed, 68 insertions(+), 7 deletions(-)

diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index f1b239a5..4b6b4a05 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -170,6 +170,7 @@ model User {
   Message            Message[]
   dateCreated        DateTime      @default(now())
   dateModified       DateTime      @default(now()) @updatedAt
+  groupMessage       String        @default("") @map("group_message")
 
   @@index([carpoolId])
   @@map(name: "user")
diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index 94784c4e..1f78d976 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -59,13 +59,56 @@ interface NoGroupInfoProps {
 }
 
 const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
-  const text =
-    role === Role.VIEWER
-      ? "You are in Viewer mode, switch to Rider or Driver to join a group"
-      : "You are not currently part of a carpool group";
+  const { data: user } = trpc.user.me.useQuery();
+  const [groupMessage, setGroupMessage] = useState(user?.groupMessage ?? "");
+  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation();
+
+  useEffect(() => {
+    if (user?.groupMessage) {
+      setGroupMessage(user.groupMessage);
+    }
+  }, [user]);
+
+  const handleMessageSubmit = async () => {
+    if (user?.id && role === "DRIVER") {
+      await updateUserMessage({ message: groupMessage });
+    }
+  };
+
   return (
-    <div className="flex flex-grow items-center justify-center text-xl font-light">
-      {text}
+    <div className="flex flex-col">
+      {role === Role.VIEWER ? (
+        <div className="flex flex-grow items-center justify-center text-xl font-light">
+          You are in Viewer mode, switch to Rider or Driver to join a group
+        </div>
+      ) : (
+        <>
+          {role === "DRIVER" && (
+            <div className="mx-20 flex flex-col py-1">
+              <div className="my-1 text-xs italic text-slate-400">
+                Save a message to share with your future riders!
+              </div>
+              <div className="flex flex-row divide-y-2 overflow-auto">
+                <textarea
+                  className="form-input h-10 min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
+                  maxLength={140}
+                  value={groupMessage}
+                  onChange={(e) => setGroupMessage(e.target.value)}
+                />
+                <button
+                  className="ml-8 h-full w-[150px] rounded-md bg-red-700 text-white"
+                  onClick={handleMessageSubmit}
+                >
+                  Submit
+                </button>
+              </div>
+            </div>
+          )}
+          <div className="flex flex-grow items-center justify-center text-xl font-light">
+            You are not currently part of a carpool group
+          </div>
+        </>
+      )}
     </div>
   );
 };
diff --git a/src/server/router/user/groups.ts b/src/server/router/user/groups.ts
index f589db56..ea2e9375 100644
--- a/src/server/router/user/groups.ts
+++ b/src/server/router/user/groups.ts
@@ -61,14 +61,16 @@ export const groupsRouter = router({
           message: "Driver does not have space available in their car",
         });
       }
+      
       const group = await ctx.prisma.carpoolGroup.create({
         data: {
           users: {
             connect: { id: input.driverId },
           },
-          message: "",
+          message: driver.groupMessage || "",
         },
       });
+      
       const nGroup = await ctx.prisma.carpoolGroup.update({
         where: { id: group.id },
         data: {
@@ -207,4 +209,19 @@ export const groupsRouter = router({
       });
       return updatedGroup;
     }),
+  updateUserMessage: protectedRouter
+    .input(
+      z.object({
+        message: z.string(),
+      })
+    )
+    .mutation(async ({ ctx, input }) => {
+      const updatedUser = await ctx.prisma.user.update({
+        where: { id: ctx.session.user?.id },
+        data: {
+          groupMessage: input.message,
+        },
+      });
+      return updatedUser;
+    }),
 });

From d596dd33ee209bc4dc455d3b09a4160cf5c3dc53 Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Tue, 19 Nov 2024 15:30:19 -0500
Subject: [PATCH 24/44] Various changes to group page + changes to DB to
 support more characters in group message, feature working now

---
 .../migration.sql                             | 13 +++++++
 .../migration.sql                             |  2 +
 prisma/schema.prisma                          |  4 +-
 src/components/GroupPage.tsx                  | 38 +++++++++++++------
 4 files changed, 43 insertions(+), 14 deletions(-)
 create mode 100644 prisma/migrations/20241119202005_increase_group_message_length/migration.sql
 create mode 100644 prisma/migrations/20241119202706_add_text_type/migration.sql

diff --git a/prisma/migrations/20241119202005_increase_group_message_length/migration.sql b/prisma/migrations/20241119202005_increase_group_message_length/migration.sql
new file mode 100644
index 00000000..9c1e142e
--- /dev/null
+++ b/prisma/migrations/20241119202005_increase_group_message_length/migration.sql
@@ -0,0 +1,13 @@
+-- AlterTable
+ALTER TABLE `conversation` ADD COLUMN `dateCreated` DATETIME(3) NOT NULL DEFAULT CURRENT_TIMESTAMP(3);
+
+-- AlterTable
+ALTER TABLE `group` ADD COLUMN `dateCreated` DATETIME(3) NOT NULL DEFAULT CURRENT_TIMESTAMP(3);
+
+-- AlterTable
+ALTER TABLE `user` ADD COLUMN `coop_end_date` DATE NULL,
+    ADD COLUMN `coop_start_date` DATE NULL,
+    ADD COLUMN `dateCreated` DATETIME(3) NOT NULL DEFAULT CURRENT_TIMESTAMP(3),
+    ADD COLUMN `dateModified` DATETIME(3) NOT NULL DEFAULT CURRENT_TIMESTAMP(3),
+    ADD COLUMN `group_message` TEXT NULL,
+    MODIFY `role` ENUM('RIDER', 'DRIVER', 'VIEWER') NOT NULL DEFAULT 'VIEWER';
diff --git a/prisma/migrations/20241119202706_add_text_type/migration.sql b/prisma/migrations/20241119202706_add_text_type/migration.sql
new file mode 100644
index 00000000..c0e2a9a0
--- /dev/null
+++ b/prisma/migrations/20241119202706_add_text_type/migration.sql
@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE `group` MODIFY `message` TEXT NOT NULL;
diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index 4b6b4a05..ad7f8588 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -118,7 +118,7 @@ model Message {
 // Represents a group of users
 model CarpoolGroup {
   id          String   @id @default(cuid()) // primary key
-  message     String
+  message     String   @db.Text
   users       User[]
   dateCreated DateTime @default(now())
 
@@ -170,7 +170,7 @@ model User {
   Message            Message[]
   dateCreated        DateTime      @default(now())
   dateModified       DateTime      @default(now()) @updatedAt
-  groupMessage       String        @default("") @map("group_message")
+  groupMessage       String?       @map("group_message") @db.Text
 
   @@index([carpoolId])
   @@map(name: "user")
diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index 1f78d976..60ec241a 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -48,7 +48,7 @@ const GroupBody = ({
   onClose: () => void;
 }) => {
   return !curUser?.carpoolId ? (
-    <NoGroupInfo role={curUser.role} />
+    <NoGroupInfo role={curUser.role} onClose={onClose} />
   ) : (
     <GroupInfo curUser={curUser} onClose={onClose} />
   );
@@ -56,12 +56,19 @@ const GroupBody = ({
 
 interface NoGroupInfoProps {
   role: Role;
+  onClose: () => void;
 }
 
-const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
+const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
+  const utils = trpc.useContext();
   const { data: user } = trpc.user.me.useQuery();
   const [groupMessage, setGroupMessage] = useState(user?.groupMessage ?? "");
-  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation();
+  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation({
+    onSuccess: () => {
+      // Invalidate and refetch the user.me query
+      utils.user.me.invalidate();
+    },
+  });
 
   useEffect(() => {
     if (user?.groupMessage) {
@@ -84,20 +91,22 @@ const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
       ) : (
         <>
           {role === "DRIVER" && (
-            <div className="mx-20 flex flex-col py-1">
+            <div className="mx-20 flex flex-col py-1 mb-8">
               <div className="my-1 text-xs italic text-slate-400">
-                Save a message to share with your future riders!
+                Below, share any information that you'd like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
               </div>
-              <div className="flex flex-row divide-y-2 overflow-auto">
+              <div className="flex flex-row gap-2">
                 <textarea
-                  className="form-input h-10 min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
-                  maxLength={140}
+                  className="form-input min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
                   value={groupMessage}
                   onChange={(e) => setGroupMessage(e.target.value)}
                 />
                 <button
-                  className="ml-8 h-full w-[150px] rounded-md bg-red-700 text-white"
-                  onClick={handleMessageSubmit}
+                  className="w-[150px] rounded-md bg-red-700 py-2 text-white h-full"
+                  onClick={async () => {
+                    await handleMessageSubmit();
+                    onClose();
+                  }}
                 >
                   Submit
                 </button>
@@ -120,11 +129,16 @@ const GroupInfo = ({
   curUser: User;
   onClose: () => void;
 }) => {
+  const utils = trpc.useContext();
   const { data: group } = trpc.user.groups.me.useQuery();
   const users = group?.users ?? [];
   const [groupMessage, setGroupMessage] = useState(group?.message ?? "");
-  const { mutate: updateMessage } =
-    trpc.user.groups.updateMessage.useMutation();
+  const { mutate: updateMessage } = trpc.user.groups.updateMessage.useMutation({
+    onSuccess: () => {
+      // Invalidate and refetch the groups.me query
+      utils.user.groups.me.invalidate();
+    },
+  });
 
   useEffect(() => {
     setGroupMessage(group?.message ?? "");

From c9151bd95a8638ebb0d3a8052764176cbad7260e Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Wed, 20 Nov 2024 10:32:40 -0500
Subject: [PATCH 25/44] Minor changes on rider side group page when in group

---
 src/components/GroupPage.tsx | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index 60ec241a..1b9cb4a6 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -174,6 +174,8 @@ const GroupInfo = ({
         </div>
       ) : (
         <div className="mx-16 flex flex-col py-1">
+          <div className="text-center">Carpool Information from Driver</div>
+          <br/>
           <p className="flex-1 justify-center rounded-md border px-3 py-2 text-center text-sm shadow-sm">
             {groupMessage != ""
               ? groupMessage

From f0fe5c69128ba0e7920d8264b0df665b5178acd9 Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Thu, 21 Nov 2024 11:34:44 -0500
Subject: [PATCH 26/44] Fixed tsc + lint errors

---
 src/components/GroupPage.tsx     | 2 +-
 src/server/router/user/groups.ts | 6 +++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index 1b9cb4a6..e5b59da2 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -93,7 +93,7 @@ const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
           {role === "DRIVER" && (
             <div className="mx-20 flex flex-col py-1 mb-8">
               <div className="my-1 text-xs italic text-slate-400">
-                Below, share any information that you'd like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
+                Below, share any information that you would like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
               </div>
               <div className="flex flex-row gap-2">
                 <textarea
diff --git a/src/server/router/user/groups.ts b/src/server/router/user/groups.ts
index ea2e9375..1e3b06a8 100644
--- a/src/server/router/user/groups.ts
+++ b/src/server/router/user/groups.ts
@@ -55,10 +55,10 @@ export const groupsRouter = router({
         where: { id: input.driverId },
       });
 
-      if (driver?.seatAvail === 0) {
+      if (!driver) {
         throw new TRPCError({
-          code: "BAD_REQUEST",
-          message: "Driver does not have space available in their car",
+          code: "NOT_FOUND",
+          message: "Driver not found",
         });
       }
       

From fd1d45350ebe8e86a2c2fc6671f891389901d32e Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Mon, 18 Nov 2024 16:45:21 -0500
Subject: [PATCH 27/44] Backend logic working, now just frontend edits
 remaining

---
 prisma/schema.prisma         |  2 +-
 src/components/GroupPage.tsx | 26 ++++++++++++++++++--------
 2 files changed, 19 insertions(+), 9 deletions(-)

diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index ad7f8588..99e84008 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -170,7 +170,7 @@ model User {
   Message            Message[]
   dateCreated        DateTime      @default(now())
   dateModified       DateTime      @default(now()) @updatedAt
-  groupMessage       String?       @map("group_message") @db.Text
+  groupMessage       String        @default("") @map("group_message")
 
   @@index([carpoolId])
   @@map(name: "user")
diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index e5b59da2..3bd66e15 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -59,16 +59,10 @@ interface NoGroupInfoProps {
   onClose: () => void;
 }
 
-const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
-  const utils = trpc.useContext();
+const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
   const { data: user } = trpc.user.me.useQuery();
   const [groupMessage, setGroupMessage] = useState(user?.groupMessage ?? "");
-  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation({
-    onSuccess: () => {
-      // Invalidate and refetch the user.me query
-      utils.user.me.invalidate();
-    },
-  });
+  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation();
 
   useEffect(() => {
     if (user?.groupMessage) {
@@ -91,6 +85,7 @@ const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
       ) : (
         <>
           {role === "DRIVER" && (
+<<<<<<< HEAD
             <div className="mx-20 flex flex-col py-1 mb-8">
               <div className="my-1 text-xs italic text-slate-400">
                 Below, share any information that you would like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
@@ -98,15 +93,30 @@ const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
               <div className="flex flex-row gap-2">
                 <textarea
                   className="form-input min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
+=======
+            <div className="mx-20 flex flex-col py-1">
+              <div className="my-1 text-xs italic text-slate-400">
+                Save a message to share with your future riders!
+              </div>
+              <div className="flex flex-row divide-y-2 overflow-auto">
+                <textarea
+                  className="form-input h-10 min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
+                  maxLength={140}
+>>>>>>> Backend logic working, now just frontend edits remaining
                   value={groupMessage}
                   onChange={(e) => setGroupMessage(e.target.value)}
                 />
                 <button
+<<<<<<< HEAD
                   className="w-[150px] rounded-md bg-red-700 py-2 text-white h-full"
                   onClick={async () => {
                     await handleMessageSubmit();
                     onClose();
                   }}
+=======
+                  className="ml-8 h-full w-[150px] rounded-md bg-red-700 text-white"
+                  onClick={handleMessageSubmit}
+>>>>>>> Backend logic working, now just frontend edits remaining
                 >
                   Submit
                 </button>

From 11c2436a69430a1a85d2556c0ecb7acca82d482b Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Tue, 19 Nov 2024 15:30:19 -0500
Subject: [PATCH 28/44] Various changes to group page + changes to DB to
 support more characters in group message, feature working now

---
 prisma/schema.prisma         |  2 +-
 src/components/GroupPage.tsx | 49 ++++++++++++++++++++----------------
 2 files changed, 28 insertions(+), 23 deletions(-)

diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index 99e84008..ad7f8588 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -170,7 +170,7 @@ model User {
   Message            Message[]
   dateCreated        DateTime      @default(now())
   dateModified       DateTime      @default(now()) @updatedAt
-  groupMessage       String        @default("") @map("group_message")
+  groupMessage       String?       @map("group_message") @db.Text
 
   @@index([carpoolId])
   @@map(name: "user")
diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index 3bd66e15..a4f40de9 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -5,6 +5,9 @@ import { trpc } from "../utils/trpc";
 import { UserContext } from "../utils/userContext";
 import { Role, User } from "@prisma/client";
 import Spinner from "./Spinner";
+import { toast } from "react-toastify";
+import { TRPCClientError } from "@trpc/client";
+import { useToasts } from "react-toast-notifications";
 
 interface GroupPageProps {
   onClose: () => void;
@@ -59,10 +62,16 @@ interface NoGroupInfoProps {
   onClose: () => void;
 }
 
-const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
+const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
+  const utils = trpc.useContext();
   const { data: user } = trpc.user.me.useQuery();
   const [groupMessage, setGroupMessage] = useState(user?.groupMessage ?? "");
-  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation();
+  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation({
+    onSuccess: () => {
+      // Invalidate and refetch the user.me query
+      utils.user.me.invalidate();
+    },
+  });
 
   useEffect(() => {
     if (user?.groupMessage) {
@@ -85,7 +94,6 @@ const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
       ) : (
         <>
           {role === "DRIVER" && (
-<<<<<<< HEAD
             <div className="mx-20 flex flex-col py-1 mb-8">
               <div className="my-1 text-xs italic text-slate-400">
                 Below, share any information that you would like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
@@ -93,30 +101,15 @@ const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
               <div className="flex flex-row gap-2">
                 <textarea
                   className="form-input min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
-=======
-            <div className="mx-20 flex flex-col py-1">
-              <div className="my-1 text-xs italic text-slate-400">
-                Save a message to share with your future riders!
-              </div>
-              <div className="flex flex-row divide-y-2 overflow-auto">
-                <textarea
-                  className="form-input h-10 min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
-                  maxLength={140}
->>>>>>> Backend logic working, now just frontend edits remaining
                   value={groupMessage}
                   onChange={(e) => setGroupMessage(e.target.value)}
                 />
                 <button
-<<<<<<< HEAD
                   className="w-[150px] rounded-md bg-red-700 py-2 text-white h-full"
                   onClick={async () => {
                     await handleMessageSubmit();
-                    onClose();
+                    toast.success('Group message successfully saved!');
                   }}
-=======
-                  className="ml-8 h-full w-[150px] rounded-md bg-red-700 text-white"
-                  onClick={handleMessageSubmit}
->>>>>>> Backend logic working, now just frontend edits remaining
                 >
                   Submit
                 </button>
@@ -149,14 +142,23 @@ const GroupInfo = ({
       utils.user.groups.me.invalidate();
     },
   });
+  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation({
+    onSuccess: () => {
+      // Invalidate and refetch the user.me query
+      utils.user.me.invalidate();
+    },
+  });
 
   useEffect(() => {
-    setGroupMessage(group?.message ?? "");
+    if (group?.message !== undefined) {
+      setGroupMessage(group.message);
+    }
   }, [group]);
 
   const handleMessageSubmit = async () => {
     if (group?.id && curUser?.role === "DRIVER") {
       await updateMessage({ groupId: group.id, message: groupMessage });
+      await updateUserMessage({ message: groupMessage });
     }
   };
 
@@ -176,7 +178,10 @@ const GroupInfo = ({
             />
             <button
               className="ml-8 h-full w-[150px] rounded-md bg-red-700 text-white"
-              onClick={handleMessageSubmit}
+              onClick={async () => {
+                await handleMessageSubmit();
+                toast.success('Group message successfully saved!');
+              }}
             >
               Submit
             </button>
@@ -198,4 +203,4 @@ const GroupInfo = ({
       </div>
     </>
   );
-};
+};
\ No newline at end of file

From 44913a6d4dcf11c161359817e85d3402017f3b02 Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Mon, 25 Nov 2024 08:39:00 -0800
Subject: [PATCH 29/44] Changes per review

---
 src/components/Modals/ReceivedRequestModal.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/Modals/ReceivedRequestModal.tsx b/src/components/Modals/ReceivedRequestModal.tsx
index 3005f4fe..1b1a405d 100644
--- a/src/components/Modals/ReceivedRequestModal.tsx
+++ b/src/components/Modals/ReceivedRequestModal.tsx
@@ -136,7 +136,7 @@ const ReceivedRequestModal = (props: ReceivedModalProps): JSX.Element => {
       onClose();
       addToast(
         props.otherUser.preferredName +
-          "'s request to carpool with you has been accepted.",
+          "'s request to carpool with you has been accepted. If you're a driver, do make sure you add information on the group page for your riders!",
         { appearance: "success" }
       );
     }

From 10de7788f562afe09f115fefcb4c9f7522446a1c Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Mon, 18 Nov 2024 16:45:21 -0500
Subject: [PATCH 30/44] Backend logic working, now just frontend edits
 remaining

---
 prisma/schema.prisma             |  1 +
 src/components/GroupPage.tsx     | 55 ++++++++++++++++++++++++++++----
 src/server/router/user/email.ts  |  4 +++
 src/server/router/user/groups.ts | 19 ++++++++++-
 4 files changed, 72 insertions(+), 7 deletions(-)

diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index f1b239a5..4b6b4a05 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -170,6 +170,7 @@ model User {
   Message            Message[]
   dateCreated        DateTime      @default(now())
   dateModified       DateTime      @default(now()) @updatedAt
+  groupMessage       String        @default("") @map("group_message")
 
   @@index([carpoolId])
   @@map(name: "user")
diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index 94784c4e..1f78d976 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -59,13 +59,56 @@ interface NoGroupInfoProps {
 }
 
 const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
-  const text =
-    role === Role.VIEWER
-      ? "You are in Viewer mode, switch to Rider or Driver to join a group"
-      : "You are not currently part of a carpool group";
+  const { data: user } = trpc.user.me.useQuery();
+  const [groupMessage, setGroupMessage] = useState(user?.groupMessage ?? "");
+  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation();
+
+  useEffect(() => {
+    if (user?.groupMessage) {
+      setGroupMessage(user.groupMessage);
+    }
+  }, [user]);
+
+  const handleMessageSubmit = async () => {
+    if (user?.id && role === "DRIVER") {
+      await updateUserMessage({ message: groupMessage });
+    }
+  };
+
   return (
-    <div className="flex flex-grow items-center justify-center text-xl font-light">
-      {text}
+    <div className="flex flex-col">
+      {role === Role.VIEWER ? (
+        <div className="flex flex-grow items-center justify-center text-xl font-light">
+          You are in Viewer mode, switch to Rider or Driver to join a group
+        </div>
+      ) : (
+        <>
+          {role === "DRIVER" && (
+            <div className="mx-20 flex flex-col py-1">
+              <div className="my-1 text-xs italic text-slate-400">
+                Save a message to share with your future riders!
+              </div>
+              <div className="flex flex-row divide-y-2 overflow-auto">
+                <textarea
+                  className="form-input h-10 min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
+                  maxLength={140}
+                  value={groupMessage}
+                  onChange={(e) => setGroupMessage(e.target.value)}
+                />
+                <button
+                  className="ml-8 h-full w-[150px] rounded-md bg-red-700 text-white"
+                  onClick={handleMessageSubmit}
+                >
+                  Submit
+                </button>
+              </div>
+            </div>
+          )}
+          <div className="flex flex-grow items-center justify-center text-xl font-light">
+            You are not currently part of a carpool group
+          </div>
+        </>
+      )}
     </div>
   );
 };
diff --git a/src/server/router/user/email.ts b/src/server/router/user/email.ts
index ee652850..7faa3034 100644
--- a/src/server/router/user/email.ts
+++ b/src/server/router/user/email.ts
@@ -20,6 +20,10 @@ const gmailEmailSchema = z
         "Only gmail.com email addresses are accepted in the staging environment",
     }
   );
+const gmailEmailSchema = z.string().email().refine((email) =>        
+  (process.env.NEXT_PUBLIC_ENV === "staging" && email.toLowerCase().endsWith("@gmail.com")) 
+|| process.env.NEXT_PUBLIC_ENV !== "staging",    
+{message:"Only gmail.com email addresses are accepted in the staging environment",});
 
 export const emailsRouter = router({
   sendRequestNotification: protectedRouter
diff --git a/src/server/router/user/groups.ts b/src/server/router/user/groups.ts
index f589db56..ea2e9375 100644
--- a/src/server/router/user/groups.ts
+++ b/src/server/router/user/groups.ts
@@ -61,14 +61,16 @@ export const groupsRouter = router({
           message: "Driver does not have space available in their car",
         });
       }
+      
       const group = await ctx.prisma.carpoolGroup.create({
         data: {
           users: {
             connect: { id: input.driverId },
           },
-          message: "",
+          message: driver.groupMessage || "",
         },
       });
+      
       const nGroup = await ctx.prisma.carpoolGroup.update({
         where: { id: group.id },
         data: {
@@ -207,4 +209,19 @@ export const groupsRouter = router({
       });
       return updatedGroup;
     }),
+  updateUserMessage: protectedRouter
+    .input(
+      z.object({
+        message: z.string(),
+      })
+    )
+    .mutation(async ({ ctx, input }) => {
+      const updatedUser = await ctx.prisma.user.update({
+        where: { id: ctx.session.user?.id },
+        data: {
+          groupMessage: input.message,
+        },
+      });
+      return updatedUser;
+    }),
 });

From e771ec1502778c823989d04f43a1c3b7d0f8d542 Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Tue, 19 Nov 2024 15:30:19 -0500
Subject: [PATCH 31/44] Various changes to group page + changes to DB to
 support more characters in group message, feature working now

---
 .../migration.sql                             | 13 +++++++
 .../migration.sql                             |  2 +
 prisma/schema.prisma                          |  4 +-
 src/components/GroupPage.tsx                  | 38 +++++++++++++------
 4 files changed, 43 insertions(+), 14 deletions(-)
 create mode 100644 prisma/migrations/20241119202005_increase_group_message_length/migration.sql
 create mode 100644 prisma/migrations/20241119202706_add_text_type/migration.sql

diff --git a/prisma/migrations/20241119202005_increase_group_message_length/migration.sql b/prisma/migrations/20241119202005_increase_group_message_length/migration.sql
new file mode 100644
index 00000000..9c1e142e
--- /dev/null
+++ b/prisma/migrations/20241119202005_increase_group_message_length/migration.sql
@@ -0,0 +1,13 @@
+-- AlterTable
+ALTER TABLE `conversation` ADD COLUMN `dateCreated` DATETIME(3) NOT NULL DEFAULT CURRENT_TIMESTAMP(3);
+
+-- AlterTable
+ALTER TABLE `group` ADD COLUMN `dateCreated` DATETIME(3) NOT NULL DEFAULT CURRENT_TIMESTAMP(3);
+
+-- AlterTable
+ALTER TABLE `user` ADD COLUMN `coop_end_date` DATE NULL,
+    ADD COLUMN `coop_start_date` DATE NULL,
+    ADD COLUMN `dateCreated` DATETIME(3) NOT NULL DEFAULT CURRENT_TIMESTAMP(3),
+    ADD COLUMN `dateModified` DATETIME(3) NOT NULL DEFAULT CURRENT_TIMESTAMP(3),
+    ADD COLUMN `group_message` TEXT NULL,
+    MODIFY `role` ENUM('RIDER', 'DRIVER', 'VIEWER') NOT NULL DEFAULT 'VIEWER';
diff --git a/prisma/migrations/20241119202706_add_text_type/migration.sql b/prisma/migrations/20241119202706_add_text_type/migration.sql
new file mode 100644
index 00000000..c0e2a9a0
--- /dev/null
+++ b/prisma/migrations/20241119202706_add_text_type/migration.sql
@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE `group` MODIFY `message` TEXT NOT NULL;
diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index 4b6b4a05..ad7f8588 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -118,7 +118,7 @@ model Message {
 // Represents a group of users
 model CarpoolGroup {
   id          String   @id @default(cuid()) // primary key
-  message     String
+  message     String   @db.Text
   users       User[]
   dateCreated DateTime @default(now())
 
@@ -170,7 +170,7 @@ model User {
   Message            Message[]
   dateCreated        DateTime      @default(now())
   dateModified       DateTime      @default(now()) @updatedAt
-  groupMessage       String        @default("") @map("group_message")
+  groupMessage       String?       @map("group_message") @db.Text
 
   @@index([carpoolId])
   @@map(name: "user")
diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index 1f78d976..60ec241a 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -48,7 +48,7 @@ const GroupBody = ({
   onClose: () => void;
 }) => {
   return !curUser?.carpoolId ? (
-    <NoGroupInfo role={curUser.role} />
+    <NoGroupInfo role={curUser.role} onClose={onClose} />
   ) : (
     <GroupInfo curUser={curUser} onClose={onClose} />
   );
@@ -56,12 +56,19 @@ const GroupBody = ({
 
 interface NoGroupInfoProps {
   role: Role;
+  onClose: () => void;
 }
 
-const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
+const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
+  const utils = trpc.useContext();
   const { data: user } = trpc.user.me.useQuery();
   const [groupMessage, setGroupMessage] = useState(user?.groupMessage ?? "");
-  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation();
+  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation({
+    onSuccess: () => {
+      // Invalidate and refetch the user.me query
+      utils.user.me.invalidate();
+    },
+  });
 
   useEffect(() => {
     if (user?.groupMessage) {
@@ -84,20 +91,22 @@ const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
       ) : (
         <>
           {role === "DRIVER" && (
-            <div className="mx-20 flex flex-col py-1">
+            <div className="mx-20 flex flex-col py-1 mb-8">
               <div className="my-1 text-xs italic text-slate-400">
-                Save a message to share with your future riders!
+                Below, share any information that you'd like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
               </div>
-              <div className="flex flex-row divide-y-2 overflow-auto">
+              <div className="flex flex-row gap-2">
                 <textarea
-                  className="form-input h-10 min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
-                  maxLength={140}
+                  className="form-input min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
                   value={groupMessage}
                   onChange={(e) => setGroupMessage(e.target.value)}
                 />
                 <button
-                  className="ml-8 h-full w-[150px] rounded-md bg-red-700 text-white"
-                  onClick={handleMessageSubmit}
+                  className="w-[150px] rounded-md bg-red-700 py-2 text-white h-full"
+                  onClick={async () => {
+                    await handleMessageSubmit();
+                    onClose();
+                  }}
                 >
                   Submit
                 </button>
@@ -120,11 +129,16 @@ const GroupInfo = ({
   curUser: User;
   onClose: () => void;
 }) => {
+  const utils = trpc.useContext();
   const { data: group } = trpc.user.groups.me.useQuery();
   const users = group?.users ?? [];
   const [groupMessage, setGroupMessage] = useState(group?.message ?? "");
-  const { mutate: updateMessage } =
-    trpc.user.groups.updateMessage.useMutation();
+  const { mutate: updateMessage } = trpc.user.groups.updateMessage.useMutation({
+    onSuccess: () => {
+      // Invalidate and refetch the groups.me query
+      utils.user.groups.me.invalidate();
+    },
+  });
 
   useEffect(() => {
     setGroupMessage(group?.message ?? "");

From 85fcdf065f933825477b25f7905acf0c88b1b0a0 Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Wed, 20 Nov 2024 10:32:40 -0500
Subject: [PATCH 32/44] Minor changes on rider side group page when in group

---
 src/components/GroupPage.tsx | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index 60ec241a..1b9cb4a6 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -174,6 +174,8 @@ const GroupInfo = ({
         </div>
       ) : (
         <div className="mx-16 flex flex-col py-1">
+          <div className="text-center">Carpool Information from Driver</div>
+          <br/>
           <p className="flex-1 justify-center rounded-md border px-3 py-2 text-center text-sm shadow-sm">
             {groupMessage != ""
               ? groupMessage

From 6eed6303674ee3b114c0943b4e2ffe701d8dcb52 Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Thu, 21 Nov 2024 11:34:44 -0500
Subject: [PATCH 33/44] Fixed tsc + lint errors

---
 src/components/GroupPage.tsx     | 2 +-
 src/server/router/user/groups.ts | 6 +++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index 1b9cb4a6..e5b59da2 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -93,7 +93,7 @@ const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
           {role === "DRIVER" && (
             <div className="mx-20 flex flex-col py-1 mb-8">
               <div className="my-1 text-xs italic text-slate-400">
-                Below, share any information that you'd like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
+                Below, share any information that you would like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
               </div>
               <div className="flex flex-row gap-2">
                 <textarea
diff --git a/src/server/router/user/groups.ts b/src/server/router/user/groups.ts
index ea2e9375..1e3b06a8 100644
--- a/src/server/router/user/groups.ts
+++ b/src/server/router/user/groups.ts
@@ -55,10 +55,10 @@ export const groupsRouter = router({
         where: { id: input.driverId },
       });
 
-      if (driver?.seatAvail === 0) {
+      if (!driver) {
         throw new TRPCError({
-          code: "BAD_REQUEST",
-          message: "Driver does not have space available in their car",
+          code: "NOT_FOUND",
+          message: "Driver not found",
         });
       }
       

From 740b137d277c5fcb357ebfb064b5e9a31e3279ba Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Mon, 18 Nov 2024 16:45:21 -0500
Subject: [PATCH 34/44] Backend logic working, now just frontend edits
 remaining

---
 prisma/schema.prisma         |  2 +-
 src/components/GroupPage.tsx | 26 +++++++++-----------------
 2 files changed, 10 insertions(+), 18 deletions(-)

diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index ad7f8588..99e84008 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -170,7 +170,7 @@ model User {
   Message            Message[]
   dateCreated        DateTime      @default(now())
   dateModified       DateTime      @default(now()) @updatedAt
-  groupMessage       String?       @map("group_message") @db.Text
+  groupMessage       String        @default("") @map("group_message")
 
   @@index([carpoolId])
   @@map(name: "user")
diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index e5b59da2..dc1f8605 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -59,16 +59,10 @@ interface NoGroupInfoProps {
   onClose: () => void;
 }
 
-const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
-  const utils = trpc.useContext();
+const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
   const { data: user } = trpc.user.me.useQuery();
   const [groupMessage, setGroupMessage] = useState(user?.groupMessage ?? "");
-  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation({
-    onSuccess: () => {
-      // Invalidate and refetch the user.me query
-      utils.user.me.invalidate();
-    },
-  });
+  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation();
 
   useEffect(() => {
     if (user?.groupMessage) {
@@ -91,22 +85,20 @@ const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
       ) : (
         <>
           {role === "DRIVER" && (
-            <div className="mx-20 flex flex-col py-1 mb-8">
+            <div className="mx-20 flex flex-col py-1">
               <div className="my-1 text-xs italic text-slate-400">
-                Below, share any information that you would like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
+                Save a message to share with your future riders!
               </div>
-              <div className="flex flex-row gap-2">
+              <div className="flex flex-row divide-y-2 overflow-auto">
                 <textarea
-                  className="form-input min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
+                  className="form-input h-10 min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
+                  maxLength={140}
                   value={groupMessage}
                   onChange={(e) => setGroupMessage(e.target.value)}
                 />
                 <button
-                  className="w-[150px] rounded-md bg-red-700 py-2 text-white h-full"
-                  onClick={async () => {
-                    await handleMessageSubmit();
-                    onClose();
-                  }}
+                  className="ml-8 h-full w-[150px] rounded-md bg-red-700 text-white"
+                  onClick={handleMessageSubmit}
                 >
                   Submit
                 </button>

From 2135e5053cb55b6b308306c8636ac3c4f64dc237 Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Tue, 19 Nov 2024 15:30:19 -0500
Subject: [PATCH 35/44] Various changes to group page + changes to DB to
 support more characters in group message, feature working now

---
 prisma/schema.prisma         |  2 +-
 src/components/GroupPage.tsx | 26 +++++++++++++++++---------
 2 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index 99e84008..ad7f8588 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -170,7 +170,7 @@ model User {
   Message            Message[]
   dateCreated        DateTime      @default(now())
   dateModified       DateTime      @default(now()) @updatedAt
-  groupMessage       String        @default("") @map("group_message")
+  groupMessage       String?       @map("group_message") @db.Text
 
   @@index([carpoolId])
   @@map(name: "user")
diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index dc1f8605..1b9cb4a6 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -59,10 +59,16 @@ interface NoGroupInfoProps {
   onClose: () => void;
 }
 
-const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
+const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
+  const utils = trpc.useContext();
   const { data: user } = trpc.user.me.useQuery();
   const [groupMessage, setGroupMessage] = useState(user?.groupMessage ?? "");
-  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation();
+  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation({
+    onSuccess: () => {
+      // Invalidate and refetch the user.me query
+      utils.user.me.invalidate();
+    },
+  });
 
   useEffect(() => {
     if (user?.groupMessage) {
@@ -85,20 +91,22 @@ const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
       ) : (
         <>
           {role === "DRIVER" && (
-            <div className="mx-20 flex flex-col py-1">
+            <div className="mx-20 flex flex-col py-1 mb-8">
               <div className="my-1 text-xs italic text-slate-400">
-                Save a message to share with your future riders!
+                Below, share any information that you'd like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
               </div>
-              <div className="flex flex-row divide-y-2 overflow-auto">
+              <div className="flex flex-row gap-2">
                 <textarea
-                  className="form-input h-10 min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
-                  maxLength={140}
+                  className="form-input min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
                   value={groupMessage}
                   onChange={(e) => setGroupMessage(e.target.value)}
                 />
                 <button
-                  className="ml-8 h-full w-[150px] rounded-md bg-red-700 text-white"
-                  onClick={handleMessageSubmit}
+                  className="w-[150px] rounded-md bg-red-700 py-2 text-white h-full"
+                  onClick={async () => {
+                    await handleMessageSubmit();
+                    onClose();
+                  }}
                 >
                   Submit
                 </button>

From 0138d1a77a0719a71ef51b214570d48e6958e421 Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Thu, 21 Nov 2024 11:34:44 -0500
Subject: [PATCH 36/44] Fixed tsc + lint errors

---
 src/components/GroupPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index 1b9cb4a6..e5b59da2 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -93,7 +93,7 @@ const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
           {role === "DRIVER" && (
             <div className="mx-20 flex flex-col py-1 mb-8">
               <div className="my-1 text-xs italic text-slate-400">
-                Below, share any information that you'd like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
+                Below, share any information that you would like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
               </div>
               <div className="flex flex-row gap-2">
                 <textarea

From e159d15209f5f9f907afd51684b8ec622755b218 Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Thu, 21 Nov 2024 13:12:07 -0500
Subject: [PATCH 37/44] rebased changes from email.ts

---
 src/server/router/user/email.ts | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/src/server/router/user/email.ts b/src/server/router/user/email.ts
index 7faa3034..ee652850 100644
--- a/src/server/router/user/email.ts
+++ b/src/server/router/user/email.ts
@@ -20,10 +20,6 @@ const gmailEmailSchema = z
         "Only gmail.com email addresses are accepted in the staging environment",
     }
   );
-const gmailEmailSchema = z.string().email().refine((email) =>        
-  (process.env.NEXT_PUBLIC_ENV === "staging" && email.toLowerCase().endsWith("@gmail.com")) 
-|| process.env.NEXT_PUBLIC_ENV !== "staging",    
-{message:"Only gmail.com email addresses are accepted in the staging environment",});
 
 export const emailsRouter = router({
   sendRequestNotification: protectedRouter

From 17544c68e16b4287269f8dff4401a51fd4190c6a Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Mon, 25 Nov 2024 08:39:00 -0800
Subject: [PATCH 38/44] Changes per review

---
 src/components/GroupPage.tsx                  | 21 ++++++++++++++++---
 .../Modals/ReceivedRequestModal.tsx           |  2 +-
 2 files changed, 19 insertions(+), 4 deletions(-)

diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index e5b59da2..f7ae0593 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -5,6 +5,9 @@ import { trpc } from "../utils/trpc";
 import { UserContext } from "../utils/userContext";
 import { Role, User } from "@prisma/client";
 import Spinner from "./Spinner";
+import { toast } from "react-toastify";
+import { TRPCClientError } from "@trpc/client";
+import { useToasts } from "react-toast-notifications";
 
 interface GroupPageProps {
   onClose: () => void;
@@ -105,7 +108,7 @@ const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
                   className="w-[150px] rounded-md bg-red-700 py-2 text-white h-full"
                   onClick={async () => {
                     await handleMessageSubmit();
-                    onClose();
+                    toast.success('Group message successfully saved!');
                   }}
                 >
                   Submit
@@ -139,14 +142,23 @@ const GroupInfo = ({
       utils.user.groups.me.invalidate();
     },
   });
+  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation({
+    onSuccess: () => {
+      // Invalidate and refetch the user.me query
+      utils.user.me.invalidate();
+    },
+  });
 
   useEffect(() => {
-    setGroupMessage(group?.message ?? "");
+    if (group?.message !== undefined) {
+      setGroupMessage(group.message);
+    }
   }, [group]);
 
   const handleMessageSubmit = async () => {
     if (group?.id && curUser?.role === "DRIVER") {
       await updateMessage({ groupId: group.id, message: groupMessage });
+      await updateUserMessage({ message: groupMessage });
     }
   };
 
@@ -166,7 +178,10 @@ const GroupInfo = ({
             />
             <button
               className="ml-8 h-full w-[150px] rounded-md bg-red-700 text-white"
-              onClick={handleMessageSubmit}
+              onClick={async () => {
+                await handleMessageSubmit();
+                toast.success('Group message successfully saved!');
+              }}
             >
               Submit
             </button>
diff --git a/src/components/Modals/ReceivedRequestModal.tsx b/src/components/Modals/ReceivedRequestModal.tsx
index 3005f4fe..1b1a405d 100644
--- a/src/components/Modals/ReceivedRequestModal.tsx
+++ b/src/components/Modals/ReceivedRequestModal.tsx
@@ -136,7 +136,7 @@ const ReceivedRequestModal = (props: ReceivedModalProps): JSX.Element => {
       onClose();
       addToast(
         props.otherUser.preferredName +
-          "'s request to carpool with you has been accepted.",
+          "'s request to carpool with you has been accepted. If you're a driver, do make sure you add information on the group page for your riders!",
         { appearance: "success" }
       );
     }

From f040fd5006c575e7e70d6719165e8d87d1fe0e48 Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Mon, 18 Nov 2024 16:45:21 -0500
Subject: [PATCH 39/44] Backend logic working, now just frontend edits
 remaining

---
 prisma/schema.prisma         |  2 +-
 src/components/GroupPage.tsx | 26 +++++++++-----------------
 2 files changed, 10 insertions(+), 18 deletions(-)

diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index ad7f8588..99e84008 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -170,7 +170,7 @@ model User {
   Message            Message[]
   dateCreated        DateTime      @default(now())
   dateModified       DateTime      @default(now()) @updatedAt
-  groupMessage       String?       @map("group_message") @db.Text
+  groupMessage       String        @default("") @map("group_message")
 
   @@index([carpoolId])
   @@map(name: "user")
diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index f7ae0593..be74754a 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -62,16 +62,10 @@ interface NoGroupInfoProps {
   onClose: () => void;
 }
 
-const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
-  const utils = trpc.useContext();
+const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
   const { data: user } = trpc.user.me.useQuery();
   const [groupMessage, setGroupMessage] = useState(user?.groupMessage ?? "");
-  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation({
-    onSuccess: () => {
-      // Invalidate and refetch the user.me query
-      utils.user.me.invalidate();
-    },
-  });
+  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation();
 
   useEffect(() => {
     if (user?.groupMessage) {
@@ -94,22 +88,20 @@ const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
       ) : (
         <>
           {role === "DRIVER" && (
-            <div className="mx-20 flex flex-col py-1 mb-8">
+            <div className="mx-20 flex flex-col py-1">
               <div className="my-1 text-xs italic text-slate-400">
-                Below, share any information that you would like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
+                Save a message to share with your future riders!
               </div>
-              <div className="flex flex-row gap-2">
+              <div className="flex flex-row divide-y-2 overflow-auto">
                 <textarea
-                  className="form-input min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
+                  className="form-input h-10 min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
+                  maxLength={140}
                   value={groupMessage}
                   onChange={(e) => setGroupMessage(e.target.value)}
                 />
                 <button
-                  className="w-[150px] rounded-md bg-red-700 py-2 text-white h-full"
-                  onClick={async () => {
-                    await handleMessageSubmit();
-                    toast.success('Group message successfully saved!');
-                  }}
+                  className="ml-8 h-full w-[150px] rounded-md bg-red-700 text-white"
+                  onClick={handleMessageSubmit}
                 >
                   Submit
                 </button>

From 501c5de31eeeb930436883ad4c7ca06fe4541a30 Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Tue, 19 Nov 2024 15:30:19 -0500
Subject: [PATCH 40/44] Various changes to group page + changes to DB to
 support more characters in group message, feature working now

---
 prisma/schema.prisma         |  2 +-
 src/components/GroupPage.tsx | 26 +++++++++++++++++---------
 2 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index 99e84008..ad7f8588 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -170,7 +170,7 @@ model User {
   Message            Message[]
   dateCreated        DateTime      @default(now())
   dateModified       DateTime      @default(now()) @updatedAt
-  groupMessage       String        @default("") @map("group_message")
+  groupMessage       String?       @map("group_message") @db.Text
 
   @@index([carpoolId])
   @@map(name: "user")
diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index be74754a..3587cbc7 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -62,10 +62,16 @@ interface NoGroupInfoProps {
   onClose: () => void;
 }
 
-const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
+const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
+  const utils = trpc.useContext();
   const { data: user } = trpc.user.me.useQuery();
   const [groupMessage, setGroupMessage] = useState(user?.groupMessage ?? "");
-  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation();
+  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation({
+    onSuccess: () => {
+      // Invalidate and refetch the user.me query
+      utils.user.me.invalidate();
+    },
+  });
 
   useEffect(() => {
     if (user?.groupMessage) {
@@ -88,20 +94,22 @@ const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
       ) : (
         <>
           {role === "DRIVER" && (
-            <div className="mx-20 flex flex-col py-1">
+            <div className="mx-20 flex flex-col py-1 mb-8">
               <div className="my-1 text-xs italic text-slate-400">
-                Save a message to share with your future riders!
+                Below, share any information that you'd like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
               </div>
-              <div className="flex flex-row divide-y-2 overflow-auto">
+              <div className="flex flex-row gap-2">
                 <textarea
-                  className="form-input h-10 min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
-                  maxLength={140}
+                  className="form-input min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
                   value={groupMessage}
                   onChange={(e) => setGroupMessage(e.target.value)}
                 />
                 <button
-                  className="ml-8 h-full w-[150px] rounded-md bg-red-700 text-white"
-                  onClick={handleMessageSubmit}
+                  className="w-[150px] rounded-md bg-red-700 py-2 text-white h-full"
+                  onClick={async () => {
+                    await handleMessageSubmit();
+                    onClose();
+                  }}
                 >
                   Submit
                 </button>

From 35b40703cef0969d428fa500e5adf25fa672a342 Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Thu, 21 Nov 2024 11:34:44 -0500
Subject: [PATCH 41/44] Fixed tsc + lint errors

---
 src/components/GroupPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index 3587cbc7..d6683da5 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -96,7 +96,7 @@ const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
           {role === "DRIVER" && (
             <div className="mx-20 flex flex-col py-1 mb-8">
               <div className="my-1 text-xs italic text-slate-400">
-                Below, share any information that you'd like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
+                Below, share any information that you would like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
               </div>
               <div className="flex flex-row gap-2">
                 <textarea

From 03ab9541947cedfb40a82f4dedd1629713657cd9 Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Mon, 18 Nov 2024 16:45:21 -0500
Subject: [PATCH 42/44] Backend logic working, now just frontend edits
 remaining

---
 prisma/schema.prisma         |  2 +-
 src/components/GroupPage.tsx | 26 ++++++++++++++++++--------
 2 files changed, 19 insertions(+), 9 deletions(-)

diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index ad7f8588..99e84008 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -170,7 +170,7 @@ model User {
   Message            Message[]
   dateCreated        DateTime      @default(now())
   dateModified       DateTime      @default(now()) @updatedAt
-  groupMessage       String?       @map("group_message") @db.Text
+  groupMessage       String        @default("") @map("group_message")
 
   @@index([carpoolId])
   @@map(name: "user")
diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index d6683da5..9dd9ddf6 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -62,16 +62,10 @@ interface NoGroupInfoProps {
   onClose: () => void;
 }
 
-const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
-  const utils = trpc.useContext();
+const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
   const { data: user } = trpc.user.me.useQuery();
   const [groupMessage, setGroupMessage] = useState(user?.groupMessage ?? "");
-  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation({
-    onSuccess: () => {
-      // Invalidate and refetch the user.me query
-      utils.user.me.invalidate();
-    },
-  });
+  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation();
 
   useEffect(() => {
     if (user?.groupMessage) {
@@ -94,6 +88,7 @@ const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
       ) : (
         <>
           {role === "DRIVER" && (
+<<<<<<< HEAD
             <div className="mx-20 flex flex-col py-1 mb-8">
               <div className="my-1 text-xs italic text-slate-400">
                 Below, share any information that you would like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
@@ -101,15 +96,30 @@ const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
               <div className="flex flex-row gap-2">
                 <textarea
                   className="form-input min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
+=======
+            <div className="mx-20 flex flex-col py-1">
+              <div className="my-1 text-xs italic text-slate-400">
+                Save a message to share with your future riders!
+              </div>
+              <div className="flex flex-row divide-y-2 overflow-auto">
+                <textarea
+                  className="form-input h-10 min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
+                  maxLength={140}
+>>>>>>> Backend logic working, now just frontend edits remaining
                   value={groupMessage}
                   onChange={(e) => setGroupMessage(e.target.value)}
                 />
                 <button
+<<<<<<< HEAD
                   className="w-[150px] rounded-md bg-red-700 py-2 text-white h-full"
                   onClick={async () => {
                     await handleMessageSubmit();
                     onClose();
                   }}
+=======
+                  className="ml-8 h-full w-[150px] rounded-md bg-red-700 text-white"
+                  onClick={handleMessageSubmit}
+>>>>>>> Backend logic working, now just frontend edits remaining
                 >
                   Submit
                 </button>

From 679d9bddf088b8e657ed428a85c53afd78749764 Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Tue, 19 Nov 2024 15:30:19 -0500
Subject: [PATCH 43/44] Various changes to group page + changes to DB to
 support more characters in group message, feature working now

---
 prisma/schema.prisma         |  2 +-
 src/components/GroupPage.tsx | 30 ++++++++++--------------------
 2 files changed, 11 insertions(+), 21 deletions(-)

diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index 99e84008..ad7f8588 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -170,7 +170,7 @@ model User {
   Message            Message[]
   dateCreated        DateTime      @default(now())
   dateModified       DateTime      @default(now()) @updatedAt
-  groupMessage       String        @default("") @map("group_message")
+  groupMessage       String?       @map("group_message") @db.Text
 
   @@index([carpoolId])
   @@map(name: "user")
diff --git a/src/components/GroupPage.tsx b/src/components/GroupPage.tsx
index 9dd9ddf6..a4f40de9 100644
--- a/src/components/GroupPage.tsx
+++ b/src/components/GroupPage.tsx
@@ -62,10 +62,16 @@ interface NoGroupInfoProps {
   onClose: () => void;
 }
 
-const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
+const NoGroupInfo = ({ role, onClose }: NoGroupInfoProps) => {
+  const utils = trpc.useContext();
   const { data: user } = trpc.user.me.useQuery();
   const [groupMessage, setGroupMessage] = useState(user?.groupMessage ?? "");
-  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation();
+  const { mutate: updateUserMessage } = trpc.user.groups.updateUserMessage.useMutation({
+    onSuccess: () => {
+      // Invalidate and refetch the user.me query
+      utils.user.me.invalidate();
+    },
+  });
 
   useEffect(() => {
     if (user?.groupMessage) {
@@ -88,7 +94,6 @@ const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
       ) : (
         <>
           {role === "DRIVER" && (
-<<<<<<< HEAD
             <div className="mx-20 flex flex-col py-1 mb-8">
               <div className="my-1 text-xs italic text-slate-400">
                 Below, share any information that you would like riders joining you your Carpool to know. You can indicate when you generally like to be leaving your place, what your preferred method of communication is, what your preference is to split gas and what your Carpool vibe will be like.
@@ -96,30 +101,15 @@ const NoGroupInfo = ({ role }: NoGroupInfoProps) => {
               <div className="flex flex-row gap-2">
                 <textarea
                   className="form-input min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
-=======
-            <div className="mx-20 flex flex-col py-1">
-              <div className="my-1 text-xs italic text-slate-400">
-                Save a message to share with your future riders!
-              </div>
-              <div className="flex flex-row divide-y-2 overflow-auto">
-                <textarea
-                  className="form-input h-10 min-h-[50px] flex-grow resize-none rounded-md py-2 shadow-sm"
-                  maxLength={140}
->>>>>>> Backend logic working, now just frontend edits remaining
                   value={groupMessage}
                   onChange={(e) => setGroupMessage(e.target.value)}
                 />
                 <button
-<<<<<<< HEAD
                   className="w-[150px] rounded-md bg-red-700 py-2 text-white h-full"
                   onClick={async () => {
                     await handleMessageSubmit();
-                    onClose();
+                    toast.success('Group message successfully saved!');
                   }}
-=======
-                  className="ml-8 h-full w-[150px] rounded-md bg-red-700 text-white"
-                  onClick={handleMessageSubmit}
->>>>>>> Backend logic working, now just frontend edits remaining
                 >
                   Submit
                 </button>
@@ -213,4 +203,4 @@ const GroupInfo = ({
       </div>
     </>
   );
-};
+};
\ No newline at end of file

From 6a8e44572899cc2d87323c12e994fea0b209c714 Mon Sep 17 00:00:00 2001
From: aaryansinha <sinha.aar@northeastern.edu>
Date: Tue, 3 Dec 2024 12:20:09 -0500
Subject: [PATCH 44/44] rebased off schema

---
 prisma/schema.prisma | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index ad7f8588..39cff557 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -118,7 +118,7 @@ model Message {
 // Represents a group of users
 model CarpoolGroup {
   id          String   @id @default(cuid()) // primary key
-  message     String   @db.Text
+  message     String
   users       User[]
   dateCreated DateTime @default(now())
 
@@ -184,4 +184,4 @@ model VerificationToken {
 
   @@unique([identifier, token])
   @@map(name: "verification_token")
-}
+}
\ No newline at end of file