Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Fix "in progress" and "error" states of
UpdateStatus
component
This bug was likely introduced when upgrading to React Router 6. The `UpdateStatus` component needed access to the router's state in order to block navigation (and show a confirmation dialog to the user) when there are unsaved changes. With the upgrade to React Router 6, this required wrapping class components in a custom `withRouter` HOC. The `UpdateStatus` component exposes the different states (`SUCCESS`, `ERROR`, `IN_PROGRESS`) as static class fields (e.g. `UpdateStatus.IN_PROGRESS`). When wrapping the component in `withRouter`, those static class fields aren't forwarded, i.e. `UpdateStatus.IN_PROGRESS` is undefined. However, at the moment, blocking navigation isn't possible anyway (at least temporarily), as React Router v6 has removed support for relevant features required to implement this (although it will hopefully return soon [1]). So for now, I have simply removed `withRouter` altogether. Once blocking navigation is possible again, we should refactor this component to a function component and use the hooks provided by React Router. [1] remix-run/react-router#8139
- Loading branch information