diff options
| author | Fabian Mastenbroek <mail.fabianm@gmail.com> | 2021-07-08 16:08:02 +0200 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2021-07-08 16:08:02 +0200 |
| commit | 1a2416043f0b877f570e89da74e0d0a4aff1d8ae (patch) | |
| tree | 1bed18bb62d223be954faca87b0736d2a571b443 /opendc-web/opendc-web-ui/src/data/experiments.js | |
| parent | dfd2ded56780995cec6d91af37443b710d4ddb3b (diff) | |
| parent | 2c8d675c2cf140eac05988065a9d20fd2773399a (diff) | |
ui: Simplify data fetching in frontend
This pull request aims to simplify the data fetching logic in the OpenDC frontend.
Previously, the frontend used Redux extensively to sync the server state with the
client state, which introduced a lot of unnecessary complexity.
With this pull request, we move most of the data fetching logic out of Redux and
instead use React Query to perform the logic for fetching and caching API requests.
* Move all server data except topologies outside Redux
* Use React Query for fetching server data
* (De)normalize topology using Normalizr
* Remove current ids state from Redux
* Combine fetching of project relations
Diffstat (limited to 'opendc-web/opendc-web-ui/src/data/experiments.js')
| -rw-r--r-- | opendc-web/opendc-web-ui/src/data/experiments.js | 16 |
1 files changed, 13 insertions, 3 deletions
diff --git a/opendc-web/opendc-web-ui/src/data/experiments.js b/opendc-web/opendc-web-ui/src/data/experiments.js index aef512e5..a76ea53f 100644 --- a/opendc-web/opendc-web-ui/src/data/experiments.js +++ b/opendc-web/opendc-web-ui/src/data/experiments.js @@ -20,18 +20,28 @@ * SOFTWARE. */ -import { useSelector } from 'react-redux' +import { useQuery } from 'react-query' +import { fetchTraces } from '../api/traces' +import { fetchSchedulers } from '../api/schedulers' + +/** + * Configure the query defaults for the experiment endpoints. + */ +export function configureExperimentClient(queryClient, auth) { + queryClient.setQueryDefaults('traces', { queryFn: () => fetchTraces(auth) }) + queryClient.setQueryDefaults('schedulers', { queryFn: () => fetchSchedulers(auth) }) +} /** * Return the available traces to experiment with. */ export function useTraces() { - return useSelector((state) => Object.values(state.objects.trace)) + return useQuery('traces') } /** * Return the available schedulers to experiment with. */ export function useSchedulers() { - return useSelector((state) => Object.values(state.objects.scheduler)) + return useQuery('schedulers') } |
