build(deps): bump mobx-react from 8.0.0 to 9.0.0

[dependabot]

Bumps mobx-react from 8.0.0 to 9.0.0.

Release notes

Sourced from mobx-react's releases.

mobx-react@9.0.0

Major Changes

• 473cb3f5 #3718 Thanks @​mweststrate! - - Fixed observer in StrictMode #3671
  • [BREAKING CHANGE] Class component's props/state/context are no longer observable. Attempt to use these in any derivation other than component's render throws and error. For details see https://github.com/mobxjs/mobx/blob/main/packages/mobx-react/README.md#note-on-using-props-and-state-in-derivations
  • Extending or applying observer classes is now explicitly forbidden

Patch Changes

• Updated dependencies [58bb052c, 473cb3f5]:
  • mobx-react-lite@4.0.3

Commits

• See full diff in compare view

You can trigger a rebase of this PR by commenting @dependabot rebase.

---

Dependabot commands and options

You can trigger Dependabot actions by commenting on this PR:

• @dependabot rebase will rebase this PR
• @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
• @dependabot merge will merge this PR after your CI passes on it
• @dependabot squash and merge will squash and merge this PR after your CI passes on it
• @dependabot cancel merge will cancel a previously requested merge and block automerging
• @dependabot reopen will reopen this PR if it is closed
• @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
• @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
• @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
• @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)

> **Note** > Automatic rebases have been disabled on this pull request as it has been open for over 30 days.

[dependabot]

OK, I won't notify you again about this release, but will get in touch when a new version is available. If you'd rather skip all updates until the next major or minor version, let me know by commenting @dependabot ignore this major version or @dependabot ignore this minor version. You can also ignore all major, minor, or patch releases for a dependency by adding an ignore condition with the desired update_types to your config file.

If you change your mind, just re-open this PR and I'll resolve any conflicts on it.

[eatyourgreens]

Signing in or out on this branch doesn't update the user account details in the page header, which is why the tests are failing. If I sign out, my username (and the user account dropdown menu) still shows at the top of the page.

[eatyourgreens]

It seems like observer isn't reacting to changes in MobXProviderContext. That has wider implications for our code, since that's how most of our components connect to the store.

[eatyourgreens]

This is needed to run NextJS in development mode with React 18 (#3887), because it fixes mobxjs/mobx#3669.

[goplayoutside3]

In the release notes:
[BREAKING CHANGE] Class component's props/state/context are no longer observable.

Is the following buggy behavior due to AuthModalContainer being a class rather than functional component?

Signing in or out on this branch doesn't update the user account detail

[eatyourgreens]

The errors are in ZooHeaderWrapperContainer. I think I rewrote that as a functional component.

[eatyourgreens]

Here's a screen recording from my laptop. Sign out is broken and the classifier doesn't render properly.

Screen.Recording.2023-08-11.at.10.30.02.mov

[eatyourgreens]

Here's the dev classifier on this branch. The subject viewer initialises, but then never reacts to changes in the subject loading state.

Screen.Recording.2023-08-11.at.11.46.50.mov

[eatyourgreens]

To be fair, MobX React has always advised against using a global store for local component state, such as data loading state.

In general, we recommend to not resort to MobX observables for local component state too quickly, as this can theoretically lock you out of some features of React's Suspense mechanism. As a rule of thumb, use MobX observables when the state captures domain data that is shared among components (including children). Such as todo items, users, bookings, etc.

State that only captures UI state, like loading state, selections, etc, might be better served by the useState hook, since this will allow you to leverage React suspense features in the future.

https://mobx.js.org/react-integration.html#you-might-not-need-locally-observable-state

[eatyourgreens]

If I log the stored value of MobXProviderContext to the console, I can see that classifierStore.subjects.loadingState is set to 'success'. However, the observed SubjectViewer component sees that loading state as 'initialised'.

[dependabot]

Superseded by #5250.