fix: fix router links on error page

Author: gregberge

packages/smooth/src/client/Routes.js

@@ -2,6 +2,7 @@ import React from 'react'
 import { Switch, Route } from '../router'
 import Page, { getPages } from '../page/Page'
 import { HiddenRouter } from '../router/HiddenRouter'
+import { CoreRouter } from '../router/CoreRouter'
 
 const pages = getPages()
 
@@ -26,9 +27,9 @@ export default function Routes({ match: { url } }) {
     </Switch>
   )
   return (
-    <>
+    <CoreRouter>
       {routes}
       <HiddenRouter>{routes}</HiddenRouter>
-    </>
+    </CoreRouter>
   )
 }

packages/smooth/src/router/CoreRouter.js

@@ -0,0 +1,13 @@
+import React from 'react'
+
+const CoreRouterContext = React.createContext(false)
+
+export function CoreRouter({ children }) {
+  return (
+    <CoreRouterContext.Provider value>{children}</CoreRouterContext.Provider>
+  )
+}
+
+export function useIsRouterReady() {
+  return React.useContext(CoreRouterContext)
+}

packages/smooth/src/router/Link.js

@@ -2,12 +2,27 @@ import React from 'react'
 import { Link as BaseLink, NavLink as BaseNavLink } from 'react-router-dom'
 import { formatLangUrl, useLang } from '../i18n'
 import { HiddenLinkRouter } from './HiddenLinkRouter'
+import { useIsRouterReady } from './CoreRouter'
 
 function createLink(Component) {
-  const Link = ({ waitBeforeTransition, ...props }) => {
+  const Link = ({ waitBeforeTransition, onClick, ...props }) => {
+    const routerReady = useIsRouterReady()
     const lang = useLang()
     const to = formatLangUrl(props.to, lang)
-    const link = <Component {...props} to={to} />
+    const handleClick = React.useCallback(
+      event => {
+        if (onClick) {
+          onClick(event)
+        }
+        if (!routerReady) {
+          event.preventDefault()
+          // eslint-disable-next-line
+          window.location = to
+        }
+      },
+      [to, routerReady, onClick],
+    )
+    const link = <Component {...props} to={to} onClick={handleClick} />
 
     return waitBeforeTransition ? (
       <HiddenLinkRouter>{link}</HiddenLinkRouter>