appbaseio / reactivesearch

Search UI components for React and Vue
https://opensource.appbase.io/reactivesearch
Apache License 2.0
4.89k stars 466 forks source link

Feature Request: Add property to make UrlParams a directory instead of a GET param #301

Closed davidklebanoff closed 6 years ago

davidklebanoff commented 6 years ago

Issue Type: enhancement

Platform: Web

Description: Sometimes it makes more sense for a parameter to be represented as a directory as opposed to a GET parameter. For example, consider the Meetup search with a non-multiselect ToggleButton.

<ToggleButton
  componentId="MeetupTops"
  dataField="group_topics.topic_name.raw"
  data={
    [{"label": "Social",   "value": "social"},
     {"label": "Travel",   "value": "travel"},
     {"label": "Outdoors", "value": "outdoors"}]
  }
  defaultSelected=["Social"]
  multiSelect={false}
  filterLabel="category"
  URLParams={true}
/>

Currently the url would be: http://www.example.com?category=%22social%22

But it would be nice if a property was added that made the parameter a directory, like: http://www.example.com/social

Thoughts?

metagrover commented 6 years ago

Hi @davidklebanoff, IMO this should not be the library's concern as there is no way for our root component to figure out which component does the value social map to (in http://www.example.com/social url). Also, there is no trivial way to support multiple values in such patterns of urls.

You can easily implement it for your use-case via react-router though: Handle the route param in your root component and assign it as defaultSelected in the desired reactivesearch component.

Hope this helps!

davidklebanoff commented 6 years ago

@metagrover Thanks!

axeff commented 6 years ago

Does anyone have an idea on how to do that with next-routes? My pattern for, let's say some country filter, should look like this: pattern: '/country/:countryname/ instead of ?country="{countryname}"

divyanshu013 commented 6 years ago

Hi @axeff you can access the url in your root component and pass the countryname as the defaultSelected value in the country filter.