From 0b5e82bfcc035f897f4bf2012d7ea93c630737c3 Mon Sep 17 00:00:00 2001
From: regalijan <r@regalijan.com>
Date: Thu, 19 Oct 2023 16:50:21 -0400
Subject: [PATCH] Display inactivity notices in the mod queue

---
 app/routes/mod-queue.tsx | 30 +++++++++++++++++++++---------
 1 file changed, 21 insertions(+), 9 deletions(-)

diff --git a/app/routes/mod-queue.tsx b/app/routes/mod-queue.tsx
index fe27ef2..5d22704 100644
--- a/app/routes/mod-queue.tsx
+++ b/app/routes/mod-queue.tsx
@@ -16,7 +16,7 @@ import {
   useToast,
   VStack,
 } from "@chakra-ui/react";
-import { useEffect, useState } from "react";
+import { type ReactElement, useEffect, useState } from "react";
 import AppealCard from "../../components/AppealCard.js";
 import GameAppealCard from "../../components/GameAppealCard.js";
 import NewGameBan from "../../components/NewGameBan.js";
@@ -24,6 +24,7 @@ import NewInfractionModal from "../../components/NewInfractionModal.js";
 import ReportCard from "../../components/ReportCard.js";
 import { useLoaderData } from "@remix-run/react";
 import NewInactivityNotice from "../../components/NewInactivityNotice.js";
+import InactivityNoticeCard from "../../components/InactivityNoticeCard.js";
 
 export async function loader({ context }: { context: RequestContext }) {
   const { current_user: currentUser } = context.data;
@@ -108,23 +109,23 @@ export default function () {
   const pageProps = useLoaderData<typeof loader>();
   const isDesktop = useBreakpointValue({ base: false, lg: true });
   const entryTypes = [];
-  const [entries, setEntries] = useState([] as JSX.Element[]);
-  const [before, setBefore] = useState(0);
+  const [entries, setEntries] = useState([] as ReactElement[]);
+  const [before, setBefore] = useState(Date.now());
 
   for (const type of pageProps.entry_types)
     entryTypes.push(
       <option key={type.value} value={type.value}>
         {type.name}
-      </option>
+      </option>,
     );
 
   async function updateQueue(
     queue_type: string,
-    before = Date.now(),
-    show_closed = false
+    before: number,
+    show_closed = false,
   ): Promise<void> {
     const queueReq = await fetch(
-      `/api/mod-queue/list?before=${before}&showClosed=${show_closed}&type=${queue_type}`
+      `/api/mod-queue/list?before=${before}&showClosed=${show_closed}&type=${queue_type}`,
     );
 
     if (!queueReq.ok) {
@@ -148,7 +149,11 @@ export default function () {
     const entryData: { [k: string]: any }[] = await queueReq.json();
     const newEntries = [...entries];
 
-    if (itemId && itemType && ["appeal", "gma", "report"].includes(itemType)) {
+    if (
+      itemId &&
+      itemType &&
+      ["appeal", "gma", "inactivity", "report"].includes(itemType)
+    ) {
       const itemReq = await fetch(`/api/mod-queue/${itemType}/${itemId}`);
 
       if (!itemReq.ok) {
@@ -180,6 +185,13 @@ export default function () {
 
           break;
 
+        case "inactivity":
+          newEntries.push(
+            <InactivityNoticeCard {...(entry as InactivityNoticeProps)} />,
+          );
+
+          break;
+
         case "report":
           newEntries.push(<ReportCard {...(entry as ReportCardProps)} />);
 
@@ -206,7 +218,7 @@ export default function () {
 
   useEffect(() => {
     (async function () {
-      await updateQueue(pageProps.entry_types[0].value);
+      await updateQueue(pageProps.entry_types[0].value, before);
     })();
 
     const searchParams = new URLSearchParams(location.search);