Type checking params of CustomLink

CustomLink.tsx

interface Props<TParams> {
  params: TParams,
  path: string,
  children: React.ReactChild,
}

const CustomLink = <TParams extends any>(props: Props<TParams>) => {
  const {
    path,
    params,
    children,
  } = props;

  console.log(path, params);

  return (
    <div>
      Hello {children}
    </div>
  )
}

const siteRouteParams = '/site/:siteId/page/:pageNumber';

type SiteLinkParams = {
  siteId: string,
  pageNumber: number,
}

<>
  <CustomLink<SiteLinkParams>
    path={siteRouteParams}
    params={{ siteId: 'netflix', page }}
  >
    Netflix
  </CustomLink>

  <CustomLink<SiteLinkParams>
    path={siteRouteParams}
    params={{ sitName: 'google', pageNumber: 2 }}
  >
    Google
  </CustomLink>
</>