Replace react-router-redux with redux-first-history

[anshgoyalevil]

Which problem is this PR solving?

• related to: Upgrade react-router-dom to latest version #1825
• The react-router-redux is a dead project and is not compatible with react-router-dom v5 and v6.
• The whole react-router community suggested using redux-first-history which is compatible with v4, v5 and v6 both.

How was this change tested?

• Manually along with redux dev toolkit and automated testing

Checklist

• I have read https://github.com/jaegertracing/jaeger/blob/master/CONTRIBUTING_GUIDELINES.md
• I have signed all commits
• I have added unit tests for the new functionality
• I have run lint and test steps successfully
  • for jaeger: make lint test
  • for jaeger-ui: yarn lint and yarn test

[codecov]

Codecov Report

All modified lines are covered by tests ✅

Files	Coverage Δ
packages/jaeger-ui/src/components/App/index.jsx	100.00% <ø> (ø)
packages/jaeger-ui/src/middlewares/index.js	86.66% <ø> (ø)
packages/jaeger-ui/src/utils/configure-store.js	88.88% <100.00%> (+5.55%)	⬆️

📢 Thoughts on this report? Let us know!.

[yurishkuro]

Manually along with redux dev toolkit and automated testing

Can you elaborate on these tests? It's impossible to understand the impact from the change alone.

[anshgoyalevil]

Manually along with redux dev toolkit and automated testing

Can you elaborate on these tests? It's impossible to understand the impact of the change alone.

Yes, Since the change is related to react-router-redux, it affects the UiFindInput Component directly, since this consumes the state.router.location from the Redux Store.

Now, if something is broken on the redux-first-history part, the Find Span By ID feature won't work unless we reload the page.

How do I verify?

• Visit any TracePage in Jaeger UI
• Copy a span ID, and paste it into the search box at the TracePage header.
• If the copies span id's span gets highlighted, redux-first-history is working behind the scenes.

Now, try creating a new history object instead of using the one imported from configure-store.
Repeat the above steps, the UiFindInput feature won't highlight the span anymore.

• Test using Redux DevTools
  Using the Redux DevTools, we can see that every action is being dispatched. Like the specified above TracePage's search bar input, on entering a value, the redux-first-history dispatches an action of saving the value to history and then uses the location from the history of the redux store to highlight the span.