From 5f8598afaf582bf2072a09a3f5e8b7acd59de35d Mon Sep 17 00:00:00 2001
From: Atridad Lahiji <me@atri.dad>
Date: Wed, 6 Sep 2023 13:00:00 -0600
Subject: [PATCH] PLS!

---
 .../_components/{Loading.tsx => LoadingIndicator.tsx}    | 6 ++----
 src/app/_components/RoomList.tsx                         | 4 ++--
 src/app/_components/VoteUI.tsx                           | 4 ++--
 src/app/dashboard/page.tsx                               | 9 ++++-----
 src/app/room/[id]/loading.tsx                            | 6 ++++++
 src/app/room/[id]/page.tsx                               | 9 ++++-----
 6 files changed, 20 insertions(+), 18 deletions(-)
 rename src/app/_components/{Loading.tsx => LoadingIndicator.tsx} (69%)
 create mode 100644 src/app/room/[id]/loading.tsx

diff --git a/src/app/_components/Loading.tsx b/src/app/_components/LoadingIndicator.tsx
similarity index 69%
rename from src/app/_components/Loading.tsx
rename to src/app/_components/LoadingIndicator.tsx
index 3851c89..7b9b00e 100644
--- a/src/app/_components/Loading.tsx
+++ b/src/app/_components/LoadingIndicator.tsx
@@ -1,6 +1,4 @@
-"use client";
-
-const Loading = () => {
+const LoadingIndicator = () => {
   return (
     <div className="flex items-center justify-center">
       <span className="loading loading-dots loading-lg"></span>
@@ -8,4 +6,4 @@ const Loading = () => {
   );
 };
 
-export default Loading;
+export default LoadingIndicator;
diff --git a/src/app/_components/RoomList.tsx b/src/app/_components/RoomList.tsx
index 6eab59b..15356da 100644
--- a/src/app/_components/RoomList.tsx
+++ b/src/app/_components/RoomList.tsx
@@ -6,7 +6,7 @@ import { useState } from "react";
 import { IoEnterOutline, IoTrashBinOutline } from "react-icons/io5";
 import { env } from "@/env.mjs";
 import { trpc } from "../_trpc/client";
-import Loading from "./Loading";
+import LoadingIndicator from "./LoadingIndicator";
 import { useUser } from "@clerk/nextjs";
 
 export const dynamic = "force-dynamic";
@@ -137,7 +137,7 @@ const RoomList = () => {
         New Room
       </label>
 
-      {roomsFromDb === undefined && <Loading />}
+      {roomsFromDb === undefined && <LoadingIndicator />}
     </div>
   );
 };
diff --git a/src/app/_components/VoteUI.tsx b/src/app/_components/VoteUI.tsx
index 7faa269..d0ed858 100644
--- a/src/app/_components/VoteUI.tsx
+++ b/src/app/_components/VoteUI.tsx
@@ -24,7 +24,7 @@ import { env } from "@/env.mjs";
 import { isAdmin, isVIP, jsonToCsv } from "@/utils/helpers";
 import type { PresenceItem } from "@/utils/types";
 import { trpc } from "@/app/_trpc/client";
-import Loading from "@/app/_components/Loading";
+import LoadingIndicator from "@/app/_components/LoadingIndicator";
 import { useUser } from "@clerk/nextjs";
 
 export const dynamic = "force-dynamic";
@@ -211,7 +211,7 @@ const VoteUI = () => {
 
   // Room is loading
   if (roomFromDb === undefined) {
-    return <Loading />;
+    return <LoadingIndicator />;
     // Room has been loaded
   } else if (roomFromDb) {
     return (
diff --git a/src/app/dashboard/page.tsx b/src/app/dashboard/page.tsx
index a69f82a..2aabd19 100644
--- a/src/app/dashboard/page.tsx
+++ b/src/app/dashboard/page.tsx
@@ -3,11 +3,12 @@ import { FaShieldAlt } from "react-icons/fa";
 import { GiStarFormation } from "react-icons/gi";
 import { isAdmin, isVIP } from "@/utils/helpers";
 import { currentUser } from "@clerk/nextjs";
-import { Suspense } from "react";
-import Loading from "../_components/Loading";
 
 export const runtime = "edge";
 export const preferredRegion = ["pdx1"];
+export const dynamic = "force-dynamic";
+export const revalidate = 0;
+export const fetchCache = "force-no-store";
 
 export default async function Dashboard() {
   const user = await currentUser();
@@ -24,9 +25,7 @@ export default async function Dashboard() {
         )}
       </h1>
 
-      <Suspense fallback={<Loading />}>
-        <RoomList />
-      </Suspense>
+      <RoomList />
     </div>
   );
 }
diff --git a/src/app/room/[id]/loading.tsx b/src/app/room/[id]/loading.tsx
new file mode 100644
index 0000000..b61d5d9
--- /dev/null
+++ b/src/app/room/[id]/loading.tsx
@@ -0,0 +1,6 @@
+import LoadingIndicator from "@/app/_components/LoadingIndicator";
+
+export default function Loading() {
+  // You can add any UI inside Loading, including a Skeleton.
+  return <LoadingIndicator />;
+}
diff --git a/src/app/room/[id]/page.tsx b/src/app/room/[id]/page.tsx
index 6e5bcf3..fb3416c 100644
--- a/src/app/room/[id]/page.tsx
+++ b/src/app/room/[id]/page.tsx
@@ -1,16 +1,15 @@
-import Loading from "@/app/_components/Loading";
 import VoteUI from "@/app/_components/VoteUI";
-import { Suspense } from "react";
 
 export const runtime = "edge";
 export const preferredRegion = ["pdx1"];
+export const dynamic = "force-dynamic";
+export const revalidate = 0;
+export const fetchCache = "force-no-store";
 
 export default function Room() {
   return (
     <div className="flex flex-col items-center justify-center text-center gap-2">
-      <Suspense fallback={<Loading />}>
-        <VoteUI />
-      </Suspense>
+      <VoteUI />
     </div>
   );
 }