[docs] Avoid breaking links when doing doc page splits

[flaviendelangle]

The problem

If we do a page split (for instance splitting the columns doc page), Then we change the links used to access the sections

For instance:

• /columns/#column-spanning => /column-spanning
• /columns/#controlling-the-pinned-columns => /column-pinning/#controlling-the-pinned-columns

It is very hard to do good redirection on the server because most of the time, it impacts the hash part of the URL (for instance #column-spanning) and the server is not aware of it.

Goal

When a user click on an old link created before the split of a page, it should redirect him as close as possible to the content linked to originally.

For instance, if you click on a link to /columns/#controlling-the-pinned-columns, right now it redirects to /columns-definition. It would be nice to at least redirect to /column-pinning (even better to /column-pinning#colntrolling-the-pinned-columns but might be harder).

[cherniavskii]

For instance, if you click on a link to /columns/#controlling-the-pinned-columns, right now it redirects to /columns-definition. It would be nice to at least redirect to /column-pinning (even better to /column-pinning#colntrolling-the-pinned-columns but might be harder).

One way of solving this is client-side redirect. I've tried something like this in _app.js:

React.useEffect(() => {
    if (router.asPath.includes('/x/react-data-grid/group-pivot/#')) {
      // e.g. /x/react-data-grid/group-pivot/#row-grouping => /x/react-data-grid/row-grouping
      const redirectPath = router.asPath.replace('group-pivot/#', '');
      router.replace(redirectPath, redirectPath);
    }
  }, [router]);

It's not perfect:

• it's kind of slow (since page should load first)
• it's not good for SEO (old links will still appear in search results)