Support optional parameters

[will14smith]

Fixes #224

Format the href using the react-router formatPattern method.

This is a BREAKING change as shown by the required change to the tests. Required parameters that are not present will now throw an invariant exception rather than substituting the key in. The old behavior could be restored by duplicating the formatPattern code and modifying it appropriately but this would have the downside of allow them to become out of sync again. I am open to suggestions on how to restore the old functionality if needed.

[nutgaard]

I see no problems introducing this breaking change. In many ways a better way of handling missing params imho. I'll merge and release a new version asap. 👍

[nutgaard]

Version 2.0.0 just released to npm. Hopefully this solves your issues. :)

[kumarharsh]

@will14smith @nutgaard how do I use the new version (2.0.0)? I see that this is a breaking change, but what changes have to be made to the code to get this working? Additionally, the demo seems to be outdated, thus I can't find a reference of the changes to be made.

I was perviously using 1.2.0, with the following config:

/* routes */
  ...
  <Route path="metrics" label={this._text.metrics} breadcrumbName="Metrics">
              <IndexRoute {...MetricListScreen} />
              <Route path="create" {...MetricCreateScreen} />
              <Route path=":id/edit" {...MetricEditScreen} />
              <Route path=":id" {...MetricViewScreen} />
  </Route>

/* MetricEdit */
class MetricEdit extends React.Component {
  static breadcrumbName = ':metricID';

  render() {
    return (
      <Breadcrumbs
        routes={this.props.routes}
        resolver={this.crumbResolver}
      />
       ...
    );
  }
  ...
}

...
export default {
  component: MetricEdit,
  breadcrumbName: MetricEdit.breadcrumbName,
}

Previously, this was working fine, but with the new version of the library, I see that the params passed into createHref is an empty object, which is making formatPattern throw: Missing "id" parameter for path "/metrics/:id/edit"

[nutgaard]

Hi, If I'm not mistaken you would have gotten some strange urls earlier. What seems to be missing is that you are not passing the params into the component. Let med know If that helps, if not I'll take a closer look at it for you

[kumarharsh]

Hi @nutgaard. I got this working just after posting this comment, but then couldn't find the page where I commented, so that I could delete it 😞 I referred to the docs, and this was clearly mentioned there.

Basically, this commit introduced the breaking change, which required the params parameter to be passed in whenever my URLs had splat patterns: /:id/edit.

So, the change was trivial:

Just added params={this.props.params} wherever I was using breadcrumbs.

So, I guess, sorry for the trouble. 😉 Although the demo is still old, and out of sync with current repo, so maybe you can look into that.