From 3970dd6b796604a19d23e5a5d6836096b3517eb4 Mon Sep 17 00:00:00 2001 From: Luke Berndt Date: Fri, 30 Dec 2022 21:41:58 -0500 Subject: [PATCH] big change --- frontend/src/features/api/apiSlice.js | 93 +++++++++++++++++++++ frontend/src/features/call/callSlice.js | 0 frontend/src/features/group/groupSlice.js | 11 +++ frontend/src/redux-router/configureStore.js | 32 +++---- frontend/src/redux-router/reducers.js | 4 +- 5 files changed, 120 insertions(+), 20 deletions(-) create mode 100644 frontend/src/features/api/apiSlice.js create mode 100644 frontend/src/features/call/callSlice.js create mode 100644 frontend/src/features/group/groupSlice.js diff --git a/frontend/src/features/api/apiSlice.js b/frontend/src/features/api/apiSlice.js new file mode 100644 index 0000000..6710ffb --- /dev/null +++ b/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 \ No newline at end of file diff --git a/frontend/src/features/call/callSlice.js b/frontend/src/features/call/callSlice.js new file mode 100644 index 0000000..e69de29 diff --git a/frontend/src/features/group/groupSlice.js b/frontend/src/features/group/groupSlice.js new file mode 100644 index 0000000..640e1d4 --- /dev/null +++ b/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 \ No newline at end of file diff --git a/frontend/src/redux-router/configureStore.js b/frontend/src/redux-router/configureStore.js index 8982424..abd8a2b 100644 --- a/frontend/src/redux-router/configureStore.js +++ b/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) { - const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose; - const store = createStore( - createRootReducer(history), // root reducer with router state - preloadedState, - composeEnhancers( - applyMiddleware( - routerMiddleware(history), // for dispatching history actions - thunk, - // ... other middlewares ... - ), - ), - ) +import { configureStore } from '@reduxjs/toolkit' + + +export default function configureAppStore(preloadedState) { + const store = configureStore({ + reducer: { + [apiSlice.reducerPath]: apiSlice.reducer + }, + middleware: (getDefaultMiddleware) => + getDefaultMiddleware().concat(apiSlice.middleware), + preloadedState + }) return store } \ No newline at end of file diff --git a/frontend/src/redux-router/reducers.js b/frontend/src/redux-router/reducers.js index ac78ad6..e8d599c 100644 --- a/frontend/src/redux-router/reducers.js +++ b/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 }) \ No newline at end of file