myheats

commit 105baaf30b1c3e0f0cc2c63d7f4fd2f0b006121b
parent db0a0a33bd50fc74cc57e365d76705c3b06d6a1b
Author: Andreas Gruhler <andreas.gruhler@adfinis.com>
Date:   Sat,  1 Apr 2023 00:46:43 +0200

feat(heats): delete heats

Diffstat:
M
src/App.js
 | 
3
+++
A
src/Heats.js
 | 
65
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
M
src/Rate.js
 | 
2
+-

3 files changed, 69 insertions(+), 1 deletion(-)
diff --git a/src/App.js b/src/App.js
@@ -5,6 +5,7 @@ import { supabase } from './supabaseClient'
 
 
 const Rate = lazy(() => import('./Rate'));
+const Heats = lazy(() => import('./Heats'));
 const Auth = lazy(() => import('./Auth'));
 const Leaderboard = lazy(() => import('./Leaderboard'));
 
@@ -17,6 +18,7 @@ function Layout({session}) {
         <ul>
           <li><Link to="/leaderboard">Leaderboard</Link></li>
           <li><Link to="/rate">Rate</Link></li>
+          <li><Link to="/heats">Manage Heats</Link></li>
           {session ? <li><button onClick={() => supabase.auth.signOut()}>Sign out {session.user.email}</button></li> : ""}
         </ul>
       </nav>
@@ -59,6 +61,7 @@ function App() {
             <Route path="/" element={<Layout session={session} />}>
               <Route path="/leaderboard" element={<Leaderboard />} />
               <Route path="/rate" element={<Rate session={session} />} />
+              <Route path="/heats" element={<Heats session={session} />} />
               <Route path="/auth" element={<Auth />} />
               <Route path="*" element={<NoMatch />} />
             </Route>
diff --git a/src/Heats.js b/src/Heats.js
@@ -0,0 +1,65 @@
+import { lazy, useEffect, useState } from 'react'
+import { supabase } from './supabaseClient';
+
+const Auth = lazy(() => import('./Auth'));
+
+async function deleteHeat(e, heatId, heatName) {
+  e.preventDefault()
+
+  if (window.confirm('Do you really want to delete heat "' + heatName + '"?')) {
+    await supabase
+      .from('heats')
+      .delete()
+      .eq('id', heatId)
+  }
+}
+
+function HeatForm({session}) {
+  const [heats, setHeats] = useState([])
+
+  useEffect(() => {
+    (async () => {
+      const heatList = await supabase.from('heats').select()
+      if (heatList.error === null)
+        setHeats(heatList.data)
+    })();
+  }, [heats])
+
+  return (
+    <div>
+      <h1>Manage Heats</h1>
+      <table>
+        <thead>
+          <tr>
+            <th>Name</th>
+            <th>Location</th>
+            <th>Planned start</th>
+            <th>Created at</th>
+            <th>Delete</th>
+          </tr>
+        </thead>
+        <tbody>
+          {heats.map(h => (
+            <tr key={h.id}>
+              <td>{h.name}</td>
+              <td>{h.location}</td>
+              <td className='right'>{h.planned_start}</td>
+              <td>{new Date(h.created_at).toLocaleString()}</td>
+              <td className='right'><button onClick={e => deleteHeat(e, h.id, h.name)}>🗑️</button></td>
+            </tr>
+          ))}
+        </tbody>
+      </table>
+    </div>
+  )
+}
+
+function Heats({session}) {
+    return (
+      <div>
+        {!session ? <Auth /> : <HeatForm key={session.user.id} session={session} />}
+      </div>
+    )
+  }
+  
+  export default Heats;
diff --git a/src/Rate.js b/src/Rate.js
@@ -34,7 +34,7 @@ function RatingForm({session}) {
       const heatList = await supabase.from('heats').select()
       setHeats(heatList.data)
 
-      let startlist = await getStartlistForHeats([heatSelection.value])
+      const startlist = await getStartlistForHeats([heatSelection.value])
 
       if (startlist.error)
         return