diff --git a/src/components/TestDetailsDialog/TestDetailsModal.tsx b/src/components/TestDetailsDialog/TestDetailsModal.tsx index 72a6c9e6..3ed2577d 100644 --- a/src/components/TestDetailsDialog/TestDetailsModal.tsx +++ b/src/components/TestDetailsDialog/TestDetailsModal.tsx @@ -82,7 +82,7 @@ const TestDetailsModal: React.FunctionComponent<{ const [valueOfIgnoreOrCompare, setValueOfIgnoreOrCompare] = useState( "Ignore Areas" ); - const [isDiffShown, setIsDiffShown] = useState(!!testRun.diffName); + const [isDiffShown, setIsDiffShown] = useState(false); const [selectedRectId, setSelectedRectId] = React.useState(); const [ignoreAreas, setIgnoreAreas] = React.useState([]); const [applyIgnoreDialogOpen, setApplyIgnoreDialogOpen] = React.useState( @@ -111,6 +111,10 @@ const TestDetailsModal: React.FunctionComponent<{ // eslint-disable-next-line }, [image]); + React.useEffect(() => { + setIsDiffShown(!!testRun.diffName); + }, [testRun.diffName]); + React.useEffect(() => { setIgnoreAreas(JSON.parse(testRun.ignoreAreas)); }, [testRun]); @@ -250,11 +254,10 @@ const TestDetailsModal: React.FunctionComponent<{ useHotkeys( "d", - () => - shouldDiffHotKeyBeActive && setIsDiffShown((isDiffShown) => !isDiffShown) + () => !!testRun.diffName && setIsDiffShown((isDiffShown) => !isDiffShown), + [testRun.diffName] ); useHotkeys("ESC", handleClose, [handleClose]); - const shouldDiffHotKeyBeActive = !!testRun.diffName; return ( @@ -264,7 +267,7 @@ const TestDetailsModal: React.FunctionComponent<{ {testRun.name} - {shouldDiffHotKeyBeActive && ( + {testRun.diffName && (