From 19f20086173c62dce8d0f03b3e85591153e15e15 Mon Sep 17 00:00:00 2001
From: Atridad Lahiji <me@atri.dad>
Date: Sun, 13 Aug 2023 11:17:08 -0600
Subject: [PATCH] Initial changes to helpers (scope creep)

---
 src/pages/dashboard/index.tsx  |   5 +-
 src/pages/room/[id].tsx        | 195 +++++++++++++++++----------------
 src/server/api/routers/room.ts |   1 -
 src/utils/helpers.ts           |   8 ++
 4 files changed, 110 insertions(+), 99 deletions(-)

diff --git a/src/pages/dashboard/index.tsx b/src/pages/dashboard/index.tsx
index 2056b14..f46aaf5 100644
--- a/src/pages/dashboard/index.tsx
+++ b/src/pages/dashboard/index.tsx
@@ -8,6 +8,7 @@ import { useEffect, useState } from "react";
 import { FaShieldAlt } from "react-icons/fa";
 import { GiStarFormation } from "react-icons/gi";
 import { useUser } from "@clerk/nextjs";
+import { isAdmin, isVIP } from "~/utils/helpers";
 
 const Home: NextPage = () => {
   return (
@@ -43,10 +44,10 @@ const HomePageBody = () => {
     <>
       <h1 className="flex flex-row flex-wrap text-center justify-center items-center gap-1 text-4xl font-bold mx-auto">
         Hi, {user?.fullName}!{" "}
-        {(user?.publicMetadata.isAdmin as boolean | undefined) && (
+        {isVIP(user?.publicMetadata) && (
           <FaShieldAlt className="inline-block text-primary" />
         )}
-        {(user?.publicMetadata.isVIP as boolean | undefined) && (
+        {isAdmin(user?.publicMetadata) && (
           <GiStarFormation className="inline-block text-secondary" />
         )}
       </h1>
diff --git a/src/pages/room/[id].tsx b/src/pages/room/[id].tsx
index 9dca889..b88cacc 100644
--- a/src/pages/room/[id].tsx
+++ b/src/pages/room/[id].tsx
@@ -22,7 +22,7 @@ import Link from "next/link";
 import { FaShieldAlt } from "react-icons/fa";
 import { RiVipCrownFill } from "react-icons/ri";
 import { env } from "~/env.mjs";
-import { downloadCSV } from "~/utils/helpers";
+import { downloadCSV, isAdmin, isVIP } from "~/utils/helpers";
 import type { PresenceItem } from "~/utils/types";
 import { useUser } from "@clerk/nextjs";
 
@@ -96,8 +96,8 @@ const RoomBody = ({}) => {
       name: user?.fullName || "",
       image: user?.imageUrl || "",
       client_id: user?.id || "",
-      isAdmin: (user?.publicMetadata.isAdmin as boolean | undefined) || false,
-      isVIP: (user?.publicMetadata.isVIP as boolean | undefined) || false,
+      isAdmin: isAdmin(user?.publicMetadata),
+      isVIP: isVIP(user?.publicMetadata),
     }
   );
 
@@ -347,108 +347,111 @@ const RoomBody = ({}) => {
           </div>
         )}
 
-        {isSignedIn && !!roomFromDb && roomFromDb.userId === user.id && (
-          <>
-            <div className="card card-compact bg-neutral shadow-xl mx-auto m-4">
-              <div className="card-body flex flex-col flex-wrap">
-                <h2 className="card-title mx-auto">Room Settings</h2>
+        {isSignedIn &&
+          !!roomFromDb &&
+          (roomFromDb.userId === user.id || isAdmin(user?.publicMetadata)) && (
+            <>
+              <div className="card card-compact bg-neutral shadow-xl mx-auto m-4">
+                <div className="card-body flex flex-col flex-wrap">
+                  <h2 className="card-title mx-auto">Room Settings</h2>
 
-                <label className="label mx-auto">
-                  {"Vote Scale (Comma Separated):"}{" "}
-                </label>
+                  <label className="label mx-auto">
+                    {"Vote Scale (Comma Separated):"}{" "}
+                  </label>
 
-                <input
-                  type="text"
-                  placeholder="Scale (Comma Separated)"
-                  className="input input-bordered m-auto"
-                  value={roomScale}
-                  onChange={(event) => {
-                    setRoomScale(event.target.value);
-                  }}
-                />
+                  <input
+                    type="text"
+                    placeholder="Scale (Comma Separated)"
+                    className="input input-bordered m-auto"
+                    value={roomScale}
+                    onChange={(event) => {
+                      setRoomScale(event.target.value);
+                    }}
+                  />
 
-                <label className="label mx-auto">{"Story Name:"} </label>
+                  <label className="label mx-auto">{"Story Name:"} </label>
 
-                <input
-                  type="text"
-                  placeholder="Story Name"
-                  className="input input-bordered m-auto"
-                  value={storyNameText}
-                  onChange={(event) => {
-                    setStoryNameText(event.target.value);
-                  }}
-                />
+                  <input
+                    type="text"
+                    placeholder="Story Name"
+                    className="input input-bordered m-auto"
+                    value={storyNameText}
+                    onChange={(event) => {
+                      setStoryNameText(event.target.value);
+                    }}
+                  />
 
-                <div className="flex flex-row flex-wrap text-center items-center justify-center gap-2">
-                  <div>
-                    <button
-                      onClick={() => saveRoom(!roomFromDb.visible, false)}
-                      className="btn btn-primary inline-flex"
-                    >
-                      {roomFromDb.visible ? (
-                        <>
-                          <IoEyeOffOutline className="text-xl mr-1" />
-                          Hide
-                        </>
-                      ) : (
-                        <>
-                          <IoEyeOutline className="text-xl mr-1" />
-                          Show
-                        </>
-                      )}
-                    </button>
-                  </div>
-
-                  <div>
-                    <button
-                      onClick={() =>
-                        saveRoom(
-                          false,
-                          true,
-                          roomFromDb.storyName === storyNameText ||
-                            votesFromDb?.length === 0
-                            ? false
-                            : true
-                        )
-                      }
-                      className="btn btn-primary inline-flex"
-                      disabled={
-                        [...new Set(roomScale.split(","))].filter(
-                          (item) => item !== ""
-                        ).length <= 1
-                      }
-                    >
-                      {roomFromDb.storyName === storyNameText ||
-                      votesFromDb?.length === 0 ? (
-                        <>
-                          <IoReloadOutline className="text-xl mr-1" /> Reset
-                        </>
-                      ) : (
-                        <>
-                          <IoSaveOutline className="text-xl mr-1" /> Save
-                        </>
-                      )}
-                    </button>
-                  </div>
-
-                  {votesFromDb &&
-                    (roomFromDb.logs.length > 0 || votesFromDb.length > 0) && (
-                      <div>
-                        <button
-                          onClick={() => downloadLogs()}
-                          className="btn btn-primary inline-flex hover:animate-pulse"
-                        >
+                  <div className="flex flex-row flex-wrap text-center items-center justify-center gap-2">
+                    <div>
+                      <button
+                        onClick={() => saveRoom(!roomFromDb.visible, false)}
+                        className="btn btn-primary inline-flex"
+                      >
+                        {roomFromDb.visible ? (
                           <>
-                            <IoDownloadOutline className="text-xl" />
+                            <IoEyeOffOutline className="text-xl mr-1" />
+                            Hide
                           </>
-                        </button>
-                      </div>
-                    )}
+                        ) : (
+                          <>
+                            <IoEyeOutline className="text-xl mr-1" />
+                            Show
+                          </>
+                        )}
+                      </button>
+                    </div>
+
+                    <div>
+                      <button
+                        onClick={() =>
+                          saveRoom(
+                            false,
+                            true,
+                            roomFromDb.storyName === storyNameText ||
+                              votesFromDb?.length === 0
+                              ? false
+                              : true
+                          )
+                        }
+                        className="btn btn-primary inline-flex"
+                        disabled={
+                          [...new Set(roomScale.split(","))].filter(
+                            (item) => item !== ""
+                          ).length <= 1
+                        }
+                      >
+                        {roomFromDb.storyName === storyNameText ||
+                        votesFromDb?.length === 0 ? (
+                          <>
+                            <IoReloadOutline className="text-xl mr-1" /> Reset
+                          </>
+                        ) : (
+                          <>
+                            <IoSaveOutline className="text-xl mr-1" /> Save
+                          </>
+                        )}
+                      </button>
+                    </div>
+
+                    {votesFromDb &&
+                      (roomFromDb.logs.length > 0 ||
+                        votesFromDb.length > 0) && (
+                        <div>
+                          <button
+                            onClick={() => downloadLogs()}
+                            className="btn btn-primary inline-flex hover:animate-pulse"
+                          >
+                            <>
+                              <IoDownloadOutline className="text-xl" />
+                            </>
+                          </button>
+                        </div>
+                      )}
+                  </div>
                 </div>
               </div>
-            </div>
-          </>
-        )}
+            </>
+          )}
       </span>
     );
     // Room does not exist
diff --git a/src/server/api/routers/room.ts b/src/server/api/routers/room.ts
index cf8c096..6853122 100644
--- a/src/server/api/routers/room.ts
+++ b/src/server/api/routers/room.ts
@@ -139,7 +139,6 @@ export const roomRouter = createTRPCRouter({
         .update(rooms)
         .set({
           storyName: input.name,
-          userId: ctx.auth.userId,
           visible: input.visible,
           scale: [...new Set(input.scale.split(","))]
             .filter((item) => item !== "")
diff --git a/src/utils/helpers.ts b/src/utils/helpers.ts
index 2303fdc..04ec281 100644
--- a/src/utils/helpers.ts
+++ b/src/utils/helpers.ts
@@ -15,3 +15,11 @@ export function downloadCSV(
   link.click();
   document.body.removeChild(link);
 }
+
+export function isAdmin(meta: UserPublicMetadata | undefined) {
+  return (meta?.isAdmin as boolean | undefined) || false;
+}
+
+export function isVIP(meta: UserPublicMetadata | undefined) {
+  return (meta?.isVIP as boolean | undefined) || false;
+}