showing calls

frontend/src/features/calls/callsSlice.js

@@ -6,7 +6,10 @@ import {
   
   import { apiSlice } from '../api/apiSlice'
 
-  const callsAdapter = createEntityAdapter({
+// in order for the initial fetch to happen this call needs to be made in index.js
+// store.dispatch(extendedApiSlice.endpoints.getCalls.initiate())
+
+  export const callsAdapter = createEntityAdapter({
     selectId: (call) => call._id,
     sortComparer: (a, b) => a.time.localeCompare(b.time),
   })
@@ -16,11 +19,15 @@ import {
   export const extendedApiSlice = apiSlice.injectEndpoints({
     endpoints: builder => ({
       getCalls: builder.query({
-          query: ({shortName,filterType=0,filterCode=0}) => ({
+            query: ({shortName,filterType=0,filterCode=0}) => ({
               url: `/${shortName}/calls`,
               method: "GET", 
               params: { filterType, filterCode },
             }),
+            /*query: () => ({
+                url: `/test/calls`,
+                method: "GET"
+              }),*/
         transformResponse: responseData => {
             responseData = responseData.calls;
           return callsAdapter.setAll(initialState, responseData)
@@ -29,20 +36,28 @@ import {
     })
   })
   
+
+  // from tutorials: https://redux.js.org/tutorials/essentials/part-8-rtk-query-advanced#transforming-responses
   export const { useGetCallsQuery } = extendedApiSlice
-
-
 // Calling `someEndpoint.select(someArg)` generates a new selector that will return
 // the query result object for a query with those parameters.
 // To generate a selector for a specific query argument, call `select(theQueryArg)`.
 // In this case, the users query has no params, so we don't pass anything to select()
-export const selectCallsResult = extendedApiSlice.endpoints.getCalls.select()
+export const selectCallsResult = extendedApiSlice.endpoints.getCalls.select({"shortName":"test"})
 
-
-export const selectCallsData = createSelector(
+const selectCallsData = createSelector(
   selectCallsResult,
-  callsResult => callsResult.data 
+  (callsResult) => {
+    return callsResult.data
+  }
 )
 
-export const { selectAll: selectAllCalls, selectById: selectCallById } =
-  callsAdapter.getSelectors(state => selectCallsData(state) ?? initialState)
+export const { selectAll: selectAllCalls, selectById: selectCallById } = callsAdapter.getSelectors(state => { 
+    return selectCallsData(state) ?? initialState
+})
+
+  /*
+export const {selectAll: selectAllCalls}  = callsAdapter.getSelectors((state) =>  {
+    return state.api}
+    );*/
+