big change

frontend/src/features/api/apiSlice.js

@@ -0,0 +1,93 @@
+// Import the RTK Query methods from the React-specific entry point
+import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react'
+
+
+function buildCallUrl(state, date, direction) {
+    var params = {};
+    var url = "";
+
+
+    if ((typeof direction === 'string') && (typeof date === 'number')) {
+        url = url + '/' + direction;
+        params["time"] = date;
+    } else {
+      if (state.call.filterDate){
+        url = url + '/older'
+        params["time"] = state.call.filterDate;
+      }
+    }
+    if (state.call.filterStarred) {
+      params["filter-starred"] = true;
+    }
+    switch(state.call.filterType) {
+      case 1:
+      params["filter-type"] = "group";
+      params["filter-code"] = state.call.filterGroupId;
+      break;
+      case 2:
+      params["filter-type"] = "talkgroup";
+      params["filter-code"] = state.call.filterTalkgroups;
+      break;
+      default:
+      case 0:
+    }
+/*
+
+    if (this.filterCode != "") {
+        params["filter-code"] = this.filterCode;
+    }
+
+    if (this.filterType == this.FilterType.Group) {
+        params["filter-type"] = "group";
+        params["filter-name"] = this.filterName;
+    }
+
+    if (this.filterType == this.FilterType.Talkgroup) {
+        params["filter-type"] = "talkgroup";
+    }
+
+    if (this.filterType == this.FilterType.Unit) {
+        params["filter-type"] = "unit";
+    }
+
+*/
+  //  url = startUp.backend_server + "/" + startUp.shortName.toLowerCase() + "/calls" + url + '?' + buildUrlParams(params);
+    url = process.env.REACT_APP_BACKEND_SERVER + "/" + state.call.shortName + "/calls" + url + '?' + buildUrlParams(params);
+    console.log("Trying to fetch data from this url: " + url);
+    return url;
+}
+
+// Define our single API slice object
+export const apiSlice = createApi({
+    // The cache reducer expects to be added at `state.api` (already default - this is optional)
+    reducerPath: 'api',
+    // All of our requests will have URLs starting with '/fakeApi'
+    baseQuery: fetchBaseQuery({ baseUrl: process.env.REACT_APP_BACKEND_SERVER }),
+    // The "endpoints" represent operations and requests for this server
+    endpoints: builder => ({
+        // The `getPosts` endpoint is a "query" operation that returns data
+        getGroups: builder.query({
+            // The URL for the request is '/fakeApi/posts'
+            query: (shortName) => ({ url: '/${shortName}/groups' })
+        }),
+        getSystems: builder.query({
+            // The URL for the request is '/fakeApi/posts'
+            query: () => ({ url: '/systems' })
+        }),
+        getTalkgroups: builder.query({
+            // The URL for the request is '/fakeApi/posts'
+            query: (shortName) => ({ url: '/${shortName}/talkgroups' })
+        }),
+        getCalls: builder.query({
+            // The URL for the request is '/fakeApi/posts'
+            query: ({shortName, filterType, filterCode}) => ({
+                url: "/${shortName}/calls",
+                method: "GET",
+                params: { filterType, filterCode },
+              })
+        })
+    })
+})
+
+// Export the auto-generated hook for the `getPosts` query endpoint
+export const { useGetGroupsQuery, useGetSystemsQuery, useGetTalkgroupsQuery, useGetCallsQuery } = apiSlice

frontend/src/features/group/groupSlice.js

@@ -0,0 +1,11 @@
+const groupSlice = createSlice({
+    name: 'group',
+    initialState: [],
+    reducers: {
+    },
+  })
+
+  // Extract the action creators object and the reducer
+const { actions, reducer } = groupSlice
+// Export the reducer, either as a default or named export
+export default reducer

frontend/src/redux-router/configureStore.js

@@ -1,27 +1,21 @@
 // https://github.com/supasate/connected-react-router
 // configureStore.js
 
-import { createBrowserHistory } from 'history'
-import { applyMiddleware, compose, createStore } from 'redux'
-import { routerMiddleware } from 'connected-react-router'
-import createRootReducer from './reducers'
-import thunk from 'redux-thunk';
 
-export const history = createBrowserHistory()
+import { apiSlice } from '../features/api/apiSlice'
 
-export default function configureStore(preloadedState) {
+import { configureStore } from '@reduxjs/toolkit'
-  const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
+
-  const store = createStore(
+
-    createRootReducer(history), // root reducer with router state
+export default function configureAppStore(preloadedState) {
-    preloadedState,  
+  const store = configureStore({
-    composeEnhancers(
+    reducer: {
-      applyMiddleware(
+      [apiSlice.reducerPath]: apiSlice.reducer
-        routerMiddleware(history), // for dispatching history actions
+    },
-        thunk,
+    middleware: (getDefaultMiddleware) =>
-        // ... other middlewares ...
+    getDefaultMiddleware().concat(apiSlice.middleware),
-      ),
+    preloadedState
-    ),
+  })
-  )
 
   return store
 }

frontend/src/redux-router/reducers.js

@@ -6,11 +6,13 @@ import systemReducer from "../System/system-reducer"
 import talkgroupReducer from "../Talkgroups/talkgroup-reducer"
 import groupReducer from "../Group/group-reducer"
 import callReducer from "../Call/call-reducer"
+import { apiSlice } from '../features/api/apiSlice'
 
 export default (history) => combineReducers({
   router: connectRouter(history),
   system: systemReducer,
   talkgroup: talkgroupReducer,
 	group: groupReducer,
-	call: callReducer
+	call: callReducer,
+  [apiSlice.reducerPath]: apiSlice.reducer
 })