cpvalente/ontime
1
0
Fork 0
mirror of https://github.com/cpvalente/ontime.git synced 2026-07-26 10:38:55 +00:00
Code Issues Packages Projects Releases 10 Wiki Activity

fix: rq optimistic mutations (#219)

Browse Source 
Fixes a mistake with the react query migration which prevented optimistic mutations from working
This commit is contained in:
Carlos Valente
2022-10-16 20:58:05 +02:00
committed by GitHub
parent cf963f6e05
commit 61cbce780d
4 changed files with 16 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "ontime-ui",
"version": "1.8.4",
"version": "1.8.5",
"private": true,
"dependencies": {
"@chakra-ui/react": "^2.3.2",
client/src/common/api/apiConstants.js
+2 -1
View File
@@ -2,7 +2,8 @@ export const STATIC_PORT = 4001;
export const EVENT_TABLE = ['event'];
export const ALIASES = ['aliases'];
export const USERFIELDS = ['userFields'];
export const EVENTS_TABLE = ['events'];
export const EVENTS_TABLE_KEY = 'events';
export const EVENTS_TABLE = [EVENTS_TABLE_KEY];
export const APP_TABLE = ['appinfo'];
export const OSC_SETTINGS = ['oscSettings'];
export const APP_SETTINGS = ['appSettings'];
client/src/features/editors/list/EventListWrapper.jsx
+12 -12
View File
@@ -1,6 +1,6 @@
import { useCallback, useContext, useEffect, useState } from 'react';
import { useMutation, useQueryClient } from '@tanstack/react-query';
import { EVENTS_TABLE } from 'common/api/apiConstants';
import { EVENTS_TABLE, EVENTS_TABLE_KEY } from 'common/api/apiConstants';
import {
fetchAllEvents,
requestApplyDelay,
@@ -79,13 +79,13 @@ export default function EventListWrapper() {
// we optimistically update here
onMutate: async (newEvent) => {
// cancel ongoing queries
queryClient.cancelQueries([EVENTS_TABLE, newEvent.id]);
queryClient.cancelQueries([EVENTS_TABLE_KEY, newEvent.id]);
// Snapshot the previous value
const previousEvent = queryClient.getQueryData([EVENTS_TABLE, newEvent.id]);
const previousEvent = queryClient.getQueryData([EVENTS_TABLE_KEY, newEvent.id]);
// optimistically update object
queryClient.setQueryData([EVENTS_TABLE, newEvent.id], newEvent);
queryClient.setQueryData([EVENTS_TABLE_KEY, newEvent.id], newEvent);
// Return a context with the previous and new todo
return { previousEvent, newEvent };
@@ -93,12 +93,12 @@ export default function EventListWrapper() {
// Mutation fails, rollback undos optimist update
onError: (error, newEvent, context) => {
queryClient.setQueryData([EVENTS_TABLE, context.newEvent.id], context.previousEvent);
queryClient.setQueryData([EVENTS_TABLE_KEY, context.newEvent.id], context.previousEvent);
},
// Mutation finished, failed or successful
// Fetch anyway, just to be sure
onSettled: (newEvent) => {
queryClient.invalidateQueries([EVENTS_TABLE, newEvent.id]);
queryClient.invalidateQueries([EVENTS_TABLE_KEY, newEvent.id]);
},
});
@@ -106,13 +106,13 @@ export default function EventListWrapper() {
// we optimistically update here
onMutate: async (newEvent) => {
// cancel ongoing queries
queryClient.cancelQueries([EVENTS_TABLE, newEvent.id]);
queryClient.cancelQueries([EVENTS_TABLE_KEY, newEvent.id]);
// Snapshot the previous value
const previousEvent = queryClient.getQueryData([EVENTS_TABLE, newEvent.id]);
const previousEvent = queryClient.getQueryData([EVENTS_TABLE_KEY, newEvent.id]);
// optimistically update object
queryClient.setQueryData([EVENTS_TABLE, newEvent.id], newEvent);
queryClient.setQueryData([EVENTS_TABLE_KEY, newEvent.id], newEvent);
// Return a context with the previous and new todo
return { previousEvent, newEvent };
@@ -120,13 +120,13 @@ export default function EventListWrapper() {
// Mutation fails, rollback undos optimist update
onError: (error, newEvent, context) => {
queryClient.setQueryData([EVENTS_TABLE, context.newEvent.id], context.previousEvent);
queryClient.setQueryData([EVENTS_TABLE_KEY, context.newEvent.id], context.previousEvent);
},
// Mutation finished, failed or successful
// Fetch anyway, just to be sure
onSettled: (newEvent) => {
if (newEvent) {
queryClient.invalidateQueries([EVENTS_TABLE, newEvent.id]);
queryClient.invalidateQueries([EVENTS_TABLE_KEY, newEvent.id]);
} else {
queryClient.invalidateQueries(EVENTS_TABLE);
}
@@ -137,7 +137,7 @@ export default function EventListWrapper() {
// we optimistically update here
onMutate: async (eventId) => {
// cancel ongoing queries
queryClient.cancelQueries([EVENTS_TABLE, eventId]);
queryClient.cancelQueries([EVENTS_TABLE_KEY, eventId]);
// Snapshot the previous value
const previousEvents = queryClient.getQueryData(EVENTS_TABLE);
server/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "ontime",
"version": "1.8.4",
"version": "1.8.5",
"author": "Carlos Valente",
"description": "Time keeping for live events",
"repository": "https://github.com/cpvalente/ontime",