Dynamic route/ Param doesn't work in coreui-free-react-admin-template

Question

Dynamic route doesn't work in coreui-free-react-admin-template

const routes = [ 

{ path: '/users/details/:id', exact: true, name: 'Users Details', component: UsersDetails },

]

Answer 1

You will also need to add the following import:

import { matchPath } from 'react-router-dom'

Then add on the page AppBreadcrumb.js

  const getRouteName = (pathname, routes) => {
    for (var i = 0; i < routes.length; i++) {
      var routePath = routes[i]
      if (matchPath(pathname, { path: routePath.path, exact: true, strict: false })) {
        return routePath.name
      }
    }
    return null
  }

  const getBreadcrumbs = (location) => {
    const breadcrumbs = []
    location.split('/').reduce((prev, curr, index, array) => {
      const currentPathname = `${prev}/${curr}`
      const routeName = getRouteName(currentPathname, routes)
      if (routeName) {
        breadcrumbs.push({
          pathname: currentPathname,
          name: routeName,
          active: index + 1 === array.length ? true : false,
        })
      }
      return currentPathname
    });
    return breadcrumbs
  }