From 2afbe725335cfe8b63a37a7b429c8e19a3ae4d78 Mon Sep 17 00:00:00 2001
From: Luke Berndt <lukekb@gmail.com>
Date: Sun, 1 Jan 2023 09:52:31 -0500
Subject: [PATCH] call data fetching

---
 frontend/src/Call/CallPlayer.js       |  3 ++-
 frontend/src/Call/call-data.js        | 32 +++++++++++++++++++++++++--
 frontend/src/features/api/apiSlice.js |  5 ++---
 3 files changed, 34 insertions(+), 6 deletions(-)

diff --git a/frontend/src/Call/CallPlayer.js b/frontend/src/Call/CallPlayer.js
index cf6cfaf..4aeb027 100644
--- a/frontend/src/Call/CallPlayer.js
+++ b/frontend/src/Call/CallPlayer.js
@@ -20,7 +20,7 @@ import {
 import "./CallPlayer.css";
 //import setupSocket from '../socket/SetupSocket.js'
 import queryString from '../query-string';
-import {Groups} from "./call-data"
+import {Groups, Calls} from "./call-data"
 
 
 
@@ -545,6 +545,7 @@ class CallPlayer extends React.Component {
           <Link to="/systems"><Menu.Item link>Systems</Menu.Item></Link>
           <Link to="/about"><Menu.Item link>About</Menu.Item></Link>
           <Menu.Item link><Groups shortName={this.props.shortName}/></Menu.Item>
+          <Menu.Item link><Calls shortName={this.props.shortName}/></Menu.Item>
         </Sidebar>
         <Menu fixed="top">
           <Menu.Item onClick={this.handleSidebarToggle}>
diff --git a/frontend/src/Call/call-data.js b/frontend/src/Call/call-data.js
index c6f8c76..34e79d1 100644
--- a/frontend/src/Call/call-data.js
+++ b/frontend/src/Call/call-data.js
@@ -1,10 +1,38 @@
 import React from 'react'
-import { useGetGroupsQuery } from '../features/api/apiSlice'
+import { useGetGroupsQuery, useGetCallsQuery } from '../features/api/apiSlice'
 
 export const Groups = (args) => {
 
     const { data, isError, isLoading, isSuccess,error } = useGetGroupsQuery(args.shortName);
-    console.log(args.shortName)
+
+    let content
+  
+    if (isLoading) {
+      content = <div>Loading...</div>
+    } else if (isSuccess) {
+
+        for (const num in data) {
+            const group = data[num];
+            content =  <li>{group.groupName}</li>;
+          }
+
+    } else if (isError) {
+      content = <div>{error.toString()}</div>
+    }
+  
+    return (
+      <section className="posts-list">
+        <h2>Group</h2>
+        {content}
+      </section>
+    )
+  }
+
+
+  export const Calls = (args) => {
+
+    const { data, isError, isLoading, isSuccess,error } = useGetCallsQuery(args.shortName);
+
     let content
   
     if (isLoading) {
diff --git a/frontend/src/features/api/apiSlice.js b/frontend/src/features/api/apiSlice.js
index d72cd04..4b5e77b 100644
--- a/frontend/src/features/api/apiSlice.js
+++ b/frontend/src/features/api/apiSlice.js
@@ -27,10 +27,9 @@ export const apiSlice = createApi({
         }),
         getCalls: builder.query({
             // The URL for the request is '/fakeApi/posts'
-            query: ({shortName, filterType, filterCode}) => ({
+            query: (shortName) => ({
                 url: `/${shortName}/calls`,
-                method: "GET",
-                params: { filterType, filterCode },
+                method: "GET" //, params: { filterType, filterCode },
               })
         })
     })