Optional Url Params

[icd2k3]

Optional Url Params

[icd2k3]

Hey @luke-unifymonitor this key warning is fixed in 2.1.4. Here is the updated code sandbox: https://codesandbox.io/s/13j7vr75yl

[icd2k3]

👋 hey @luke-unifymonitor!

note: I removed my previous comment because I just had a chance to try out this approach below and it seems like it might work well for this use case.

Instead of a string, I recommend using a component breadcrumb that checks if the param is included or not:

const RegisterSensorBreadcrumb = ({ match }) => {
  // if the route includes `hubId` then return nothing for that breadcrumb
  // (alternatively you could also render a different breadcrumb IF the hubId is provided)
  if (match.params.hubId) { return null; }

  // if the route does NOT include `hubId` then return normal Register Sensor breadcrumb
  return <span>Register Sensor</span>;
};

const routesConfig = [
  {
    path: '/sensor/register/:hubId?',
    exact: true,
    component: RegisterSensorContainer,
    breadcrumb: RegisterSensorBreadcrumb,
  }
];

// /sensor/register == 'Register Sensor'
// /sensor/register/123 == 'Register Sensor'

In this case both /sensor/register and /sensor/register/123 paths will result in / Register Sensor.

Let me know if this works for you!

[icd2k3]

Gonna close this as the suggestion above should solve for this use case. If it doesn't, just let me know and I'll reopen this. Thanks!

[luke-unifymonitor]

Hi @icd2k3,

Apologies for not replying before. We had a re-think for the application and no longer needed the paths that caused the problem.

However, I did create this https://codesandbox.io/s/kok304yz1v and the console reads:

Warning: Encountered two children with the same key, /sensor/register/:hubId?. Keys should be unique so that components maintain their identity across updates. Non-unique keys may cause children to be duplicated and/or omitted — the behavior is unsupported and could change in a future version.

Many thanks for your help.

[icd2k3]

🤔 I should fix that warning. I'll look into this case in the near future.

Thanks for the reply and the code sandbox @luke-unifymonitor !