diff --git a/weave-js/src/components/PagePanelComponents/Home/Browse3/feedback/StructuredFeedback/HumanAnnotation.tsx b/weave-js/src/components/PagePanelComponents/Home/Browse3/feedback/StructuredFeedback/HumanAnnotation.tsx index 7facffe9556..24dcc5f986b 100644 --- a/weave-js/src/components/PagePanelComponents/Home/Browse3/feedback/StructuredFeedback/HumanAnnotation.tsx +++ b/weave-js/src/components/PagePanelComponents/Home/Browse3/feedback/StructuredFeedback/HumanAnnotation.tsx @@ -53,17 +53,11 @@ export const HumanAnnotationCell: React.FC = props => { const feedbackSpecRef = props.hfSpec.ref; useEffect(() => { - if (!props.readOnly) { - // We don't need to listen for feedback changes if the cell is editable - // it is being controlled by local state - return; - } return getTsClient().registerOnFeedbackListener( props.callRef, query.refetch ); - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [props.callRef]); + }, [props.callRef, query.refetch, getTsClient]); useEffect(() => { if (foundFeedbackCallRef && props.callRef !== foundFeedbackCallRef) { @@ -183,13 +177,22 @@ const FeedbackComponentSelector: React.FC<{ }) => { const wrappedOnAddFeedback = useCallback( async (value: any) => { + if (value == null || value === foundValue || value === '') { + // Remove from unsaved changes if value is invalid + setUnsavedFeedbackChanges(curr => { + const rest = {...curr}; + delete rest[feedbackSpecRef]; + return rest; + }); + return true; + } setUnsavedFeedbackChanges(curr => ({ ...curr, [feedbackSpecRef]: () => onAddFeedback(value), })); return true; }, - [onAddFeedback, setUnsavedFeedbackChanges, feedbackSpecRef] + [onAddFeedback, setUnsavedFeedbackChanges, feedbackSpecRef, foundValue] ); switch (type) { @@ -346,21 +349,10 @@ export const NumericalFeedbackColumn = ({ focused?: boolean; isInteger?: boolean; }) => { - const debouncedFn = useMemo( - () => - _.debounce((val: number | null) => onAddFeedback?.(val), DEBOUNCE_VAL), - [onAddFeedback] - ); - useEffect(() => { - return () => { - debouncedFn.cancel(); - }; - }, [debouncedFn]); - return ( onAddFeedback?.(value)} min={min} max={max} isInteger={isInteger} @@ -446,7 +438,7 @@ export const EnumFeedbackColumn = ({ })); return opts; }, [options]); - const [value, setValue] = useState