UseEffect hook cleanup not running when error occurs somewhere in project

I have the following code in my component;

useEffect(() => {
    console.log("hi");

    return () => {
      console.log("Goodbye")
    }
  }, []);

When the page with said component opens hi is logged and whenever I leave said page Goodbye is logged.

That is, unless somewhere else in the app an error occurs, then the following gets logged;

hi
xhr.js:173 GET http://holiday-assistant.localhost/api/activities/search?answers[]=1&answers[]=3 400 (Bad Request)
dispatchXhrRequest @ xhr.js:173
xhrAdapter @ xhr.js:18
dispatchRequest @ dispatchRequest.js:49
Promise.then (async)
request @ Axios.js:55
Axios.(anonymous function) @ Axios.js:65
wrap @ bind.js:11
getActivities @ activities.ts:11
(anonymous) @ apiMiddleware.ts:66
handleSubmit @ QuestionsSelector.tsx:50
callCallback @ react-dom.development.js:147
invokeGuardedCallbackDev @ react-dom.development.js:196
invokeGuardedCallback @ react-dom.development.js:250
invokeGuardedCallbackAndCatchFirstError @ react-dom.development.js:265
executeDispatch @ react-dom.development.js:571
executeDispatchesInOrder @ react-dom.development.js:596
executeDispatchesAndRelease @ react-dom.development.js:695
executeDispatchesAndReleaseTopLevel @ react-dom.development.js:704
forEachAccumulated @ react-dom.development.js:676
runEventsInBatch @ react-dom.development.js:844
runExtractedEventsInBatch @ react-dom.development.js:852
handleTopLevel @ react-dom.development.js:5030
batchedUpdates$1 @ react-dom.development.js:21437
batchedUpdates @ react-dom.development.js:2247
dispatchEvent @ react-dom.development.js:5110
(anonymous) @ react-dom.development.js:21494
unstable_runWithPriority @ scheduler.development.js:255
interactiveUpdates$1 @ react-dom.development.js:21493
interactiveUpdates @ react-dom.development.js:2268
dispatchInteractiveEvent @ react-dom.development.js:5086

As you can see an error has occurred and is logged properly, however Goodbye is not logged anymore.

When looking in the React debugger the component is no longer there.

Recreating the component as a class component like so;

class ActivityList extends React.Component {
  componentWillUnmount(): void {
    console.log("Goodbye");
  }

  render() {
    return <p>hi</p>
  }
}

does work; Goodbye is logged even though the above error has occurred.

The report names the useEffect cleanup entry point and the reproducer files activities.ts, apiMiddleware.ts, and QuestionsSelector.tsx; begin by reproducing the 400 response while comparing the function and class components. No test or target file is supplied, so confirm whether the component is unmounted and define done as establishing the expected cleanup behavior with a regression test.