Server-side should not cancel XHR requests

- add several fixes from genesys

packages/client/src/ui/matchRoutes.ts

@@ -6,7 +6,9 @@ const matchRoutes = (routes, pathname, parentPath = '', branch = []) => {
   routes.some((route) => {
     let match = null;
     const absolutePath = (route.path) ? (parentPath !== '/' ? (parentPath + route.path) : route.path) : route.path;
-    console.log(`Matching route ${pathname} for abs=${absolutePath} parentPath=${parentPath} route.path=${route.path}`);
+    if (typeof window !== 'undefined') {
+      console.log(`Matching route ${pathname} for abs=${absolutePath} parentPath=${parentPath} route.path=${route.path}`);
+    }
     const options = {
       path: absolutePath,
       exact: route.exact,

packages/client/src/utilities/requestUtils.ts

@@ -28,16 +28,19 @@ export const axiosBackend = axios.create({
 axiosBackend.interceptors.response.use(
   (config) => config,
   (error) => {
-    console.log('Backend error!! Error', error);
 
-    if (axios.isCancel(error)) {
+     if (axios.isCancel(error)) {
       throw error;
     }
 
+    console.log('Backend error!! Error', error);
+
     if (error.response && error.response.status === 401 && error.response.data.error === 'invalid_token') {
       console.log('Error on 401, invalid token: ', error);
-      clearCookies();
-      window.location.replace('/');
+      if (typeof window !== 'undefined') {
+        clearCookies();
+        window.location.replace('/');
+      }
     }
 
     throw error;

packages/ui-express/server/middleware/prerenderer.tsx

@@ -56,14 +56,14 @@ const prerenderer = (html, errHtml) => (req, res) => {
   store.dispatch(configure({ frontendPath: config.frontendPath, apiUrl: config.apiUrl, googleClientId: config.googleClientId, clientId: config.clientId, anonToken: config.access_token }));
   const sagaReady = sagaMiddleware.run(sagas);
 
-  console.log('Processing request', req._parsedOriginalUrl);
+  // console.log('Processing request', req._parsedOriginalUrl);
   const pathname = req._parsedOriginalUrl.pathname;
   const search = req._parsedOriginalUrl.search;
   const context = {};
 
   function setLocale() {
     const locale = detectLocaleFromPath(config.frontendPath, pathname, 0);
-    console.log('Detected locale for SSR is', locale);
+    // console.log('Detected locale for SSR is', locale);
     req.i18n.changeLanguage(locale);
   }
 
@@ -130,7 +130,7 @@ const prerenderer = (html, errHtml) => (req, res) => {
     // HTML meta for activity posts
 
     return html.replace(/SERVER_RENDERED_(CSS|STATE|HTML|TITLE|I18NSTORE|DIR|LANG|HEADLINKS|BUNDLECSS|BUNDLESCRIPTS)/g, (match, x) => {
-      console.log(`Injecting ${match}`);
+      // console.log(`Injecting ${match}`);
       switch (match) {
         case 'SERVER_RENDERED_BUNDLECSS': return bundleStyles.map((style) => {
           return `<link href="${style.file}" rel="stylesheet"/>`;
@@ -173,7 +173,27 @@ const prerenderer = (html, errHtml) => (req, res) => {
       .then(() => {
         return sagaReady.toPromise().then(() => {
           console.log('Fetched all component data');
-          return renderView();
+          const html = renderView();
+          const serverRenderTime = `${Date.now() - startTime}ms`;
+          console.log('Server render time:', startTime, Date.now(), serverRenderTime);
+
+          const keyStatus = 'status';
+          const keyUrl = 'url';
+          const status = context[keyStatus];
+          const url = context[keyUrl];
+
+          if (status && status === 404) {
+            res.status(404);
+          }
+          if (url) {
+            if (url === '/login') {
+              res.status(401);
+            } else {
+              res.status(302);
+            }
+          }
+
+          return res.set('Content-Type', 'text/html').send(html);
         });
       })
       .catch((err) => {
@@ -185,39 +205,14 @@ const prerenderer = (html, errHtml) => (req, res) => {
         }
 
         console.log('Error fetching component data', ApiError.axiosError(err));
-        res.status(500).end(makeErrorHtml(errHtml, { status: err.code || 500, data: err.message }, true));
-      // const errFilledHtml = makeErrorHtml(errHtml, err);
-      // res.status(500).set('Content-Type', 'text/html').send(errFilledHtml);
-      }).then((html) => {
-        const serverRenderTime = `${Date.now() - startTime}ms`;
-        console.log('Server render time:', startTime, Date.now(), serverRenderTime);
-
-        const keyStatus = 'status';
-        const keyUrl = 'url';
-        const status = context[keyStatus];
-        const url = context[keyUrl];
-
-        if (status && status === 404) {
-          res.status(404);
-        }
-        if (url) {
-          if (url === '/login') {
-            res.status(401);
-          } else {
-            res.status(302);
-          }
-        }
+        return res.status(500).end(makeErrorHtml(errHtml, {status: err.code || 500, data: err.message}, true));
+        // res.status(500).set('Content-Type', 'text/html').send(errFilledHtml);
+      })
 
-        return res.set('Content-Type', 'text/html').send(html);
-      }).catch((err) => {
-        console.error('Error:', err);
-        const errFilledHtml = makeErrorHtml(errHtml, err, false);
-        res.status(503).set('Content-Type', 'text/html').send(errFilledHtml);
-      });
   }).catch((err) => {
     console.error('Error:', err.message);
     const errFilledHtml = makeErrorHtml(errHtml, err, true);
-    res.status(503).set('Content-Type', 'text/html').send(errFilledHtml);
+    return res.status(503).set('Content-Type', 'text/html').send(errFilledHtml);
   });
 };