From 19a7dbb6e581d7574cbede3f384be1b7b8ce553c Mon Sep 17 00:00:00 2001
From: Regalijan <r@regalijan.com>
Date: Thu, 5 Dec 2024 21:55:47 -0500
Subject: [PATCH] Hopefully fix ui mismatch on strikes page

---
 app/routes/et-members_.strikes_.$uid.tsx | 18 ++++++++----------
 1 file changed, 8 insertions(+), 10 deletions(-)

diff --git a/app/routes/et-members_.strikes_.$uid.tsx b/app/routes/et-members_.strikes_.$uid.tsx
index b23745b..7a3a833 100644
--- a/app/routes/et-members_.strikes_.$uid.tsx
+++ b/app/routes/et-members_.strikes_.$uid.tsx
@@ -24,7 +24,7 @@ import {
 } from "@chakra-ui/react";
 import { LoaderFunctionArgs } from "@remix-run/cloudflare";
 import { useLoaderData } from "@remix-run/react";
-import { useEffect, useState } from "react";
+import { useState } from "react";
 
 export async function loader({
   context,
@@ -60,15 +60,11 @@ export async function loader({
 
 export default function () {
   const { can_manage, strikes, user } = useLoaderData<typeof loader>();
-  const [strikeData, setStrikeData] = useState([] as typeof strikes);
+  const [strikeData, setStrikeData] = useState(strikes);
   const toast = useToast();
   const [rmStrikeId, setRmStrikeId] = useState("");
   const [strikeReason, setStrikeReason] = useState("");
 
-  useEffect(() => {
-    setStrikeData(strikes);
-  }, []);
-
   async function removeStrike(id: string) {
     const removeResp = await fetch(`/api/events-team/strikes/${id}`, {
       method: "DELETE",
@@ -208,10 +204,12 @@ export default function () {
       <TableContainer>
         <Table variant="simple">
           <Thead>
-            <Th>Time Added</Th>
-            <Th>Added By</Th>
-            <Th>Reason</Th>
-            <Th>Remove</Th>
+            <Tr>
+              <Th>Time Added</Th>
+              <Th>Added By</Th>
+              <Th>Reason</Th>
+              <Th>Remove</Th>
+            </Tr>
           </Thead>
           <Tbody>
             {strikeData.map((strike: { [k: string]: any }) => (