search

pbeshai / react-url-query

A library for managing state through query parameters in the URL in React
https://pbeshai.github.io/react-url-query
MIT License
194 stars 38 forks source link

Support React Router v5 in RouterToUrlQuery #64

Closed UberMouse closed 5 years ago

UberMouse commented 5 years ago

React Router v5 switched from the old style React context (this.context) to the new React context style (, ). This change caused RouterToUrlQuery to stop working with React Router.

I've upgraded RouterToUrlQuery to either pull the router out of this.context, or, if you're using React Router v5 you can pass the __RouterContext to RouterToUrlQuery via the routerContext prop.

I've also updated the Webpack config to mark React and ReactDOM as external dependencies. This results in a smaller bundle size and I don't think it should cause any problems, assuming you weren't somehow relying on react-url-query for your React dependency 🤔

This change is Reviewable

UberMouse commented 5 years ago

Yep, I wasn't sure what approach would be best for the library. I just needed to solve this for us at work and this was the easiest solution. Making RouterToUrlQuery take an optional prop for the context object would work reasonably well I think. It can then either try to read from this.context or use the provided context object. I can make those changes when I get back to work on Monday.

UberMouse commented 5 years ago

@pbeshai I've redone the approach; now supports both v4 and v5 without the need for a react-router peer dependency.

pbeshai commented 5 years ago

cool, thanks for this! Then the expected use is:

import { __RouterContext as RouterContext } from 'react-router';
// ...
<RouterToUrlQuery routerContext={RouterContext}> 
  // ...
</RouterToUrlQuery>

Is that right?

pbeshai commented 5 years ago

FYI this is in v1.5.0 now. Let me know if there are any issues