diff --git a/client/src/common/input/EditableText.jsx b/client/src/common/input/EditableText.jsx index 8e72ab963..0e13627ad 100644 --- a/client/src/common/input/EditableText.jsx +++ b/client/src/common/input/EditableText.jsx @@ -1,15 +1,19 @@ import { Editable, EditableInput, EditablePreview } from '@chakra-ui/editable'; -import { useState } from 'react'; +import { useEffect, useState } from 'react'; import style from './EditableText.module.css'; export default function EditableText(props) { const { label, defaultValue, placeholder, submitHandler } = props; - const [text, setText] = useState(props.defaultValue || ''); + const [text, setText] = useState(''); + + useEffect(() => { + if (defaultValue == null) setText(''); + else setText(defaultValue); + }, [defaultValue]); const handleSubmit = (submitedVal) => { // No need to update if it hasnt changed if (submitedVal === defaultValue) return; - submitHandler(submitedVal); }; diff --git a/client/src/features/editors/list/EventListWrapper.jsx b/client/src/features/editors/list/EventListWrapper.jsx index bac02c5e0..84905ea31 100644 --- a/client/src/features/editors/list/EventListWrapper.jsx +++ b/client/src/features/editors/list/EventListWrapper.jsx @@ -133,7 +133,7 @@ export default function EventListWrapper() { // Snapshot the previous value const previousEvents = queryClient.getQueryData(eventsNamespace); - let filtered = [...previousEvents] + let filtered = [...previousEvents]; filtered.filter((e) => e.id === 'eventId'); // optimistically update object @@ -144,12 +144,12 @@ export default function EventListWrapper() { }, // Mutation fails, rollback undos optimist update - onError: (error, newEvent, context) => { + onError: (error, eventId, context) => { queryClient.setQueryData(eventsNamespace, context.previousEvents); }, // Mutation finished, failed or successful // Fetch anyway, just to be sure - onSettled: (newEvent) => { + onSettled: () => { queryClient.invalidateQueries(eventsNamespace); }, }); @@ -163,7 +163,6 @@ export default function EventListWrapper() { // Events API const eventsHandler = async (action, payload) => { - let needsRefetch = false; switch (action) { case 'add': try { @@ -187,9 +186,8 @@ export default function EventListWrapper() { } break; case 'delete': - // TODO: could do optimistic update here? try { - await deleteEvent.mutateAsync(payload).then((needsRefetch = true)); + await deleteEvent.mutateAsync(payload); } catch (error) { showErrorToast('Error deleting event', error.message); } @@ -198,9 +196,6 @@ export default function EventListWrapper() { showErrorToast('Unrecognised request', action); break; } - if (needsRefetch) { - refetch(); - } }; return (