@zengenti/contensis-react-base 4.0.0-beta.8 → 4.0.0

package/esm/contensis-react-base.js

@@ -1,23 +1,26 @@
-import { c as cachedSearch, S as SSRContextProvider, d as deliveryApi } from './SSRContext-BE8ElZ3X.js';
+import { c as cachedSearch, d as deliveryApi } from './ContensisDeliveryApi-LWYXevZ1.js';
 import { Query as Query$1 } from 'contensis-delivery-api';
 import React from 'react';
 import { Provider } from 'react-redux';
+import { a as actions } from './slice-C6JLQik8.js';
 import mapJson from 'jsonpath-mapper';
-import { a8 as defaultExpressions, a9 as termExpressions, aa as contentTypeIdExpression, ab as filterExpressions, ac as orderByExpression, ad as customWhereExpressions, ae as cloneDeep } from './sagas-xJU-zOpn.js';
+import { a7 as defaultExpressions, a8 as termExpressions, a9 as contentTypeIdExpression, aa as filterExpressions, ab as orderByExpression, ac as customWhereExpressions, ad as cloneDeep } from './sagas-Fr9yRduO.js';
 import 'reselect';
 import 'immer';
 import 'deep-equal';
 import 'deepmerge';
 import 'query-string';
 import { Op, Query } from 'contensis-core-api';
-import { s as setCachingHeaders, u as url } from './VersionInfo-Cno7K0OA.js';
+import { s as setCachingHeaders, u as urls } from './urls-tLxo_skx.js';
 import 'isomorphic-fetch';
 import express from 'express';
 import http from 'http';
 import httpProxy from 'http-proxy';
+import { s as shorten, c as createLocaleRoutes, h as history, p as pickProject, r as rootSaga } from './App-Bvs7Km54.js';
+export { A as ReactApp } from './App-Bvs7Km54.js';
 import fs from 'fs';
 import path from 'path';
-import { path as path$1 } from 'app-root-path';
+import appRootPath from 'app-root-path';
 import { renderToPipeableStream, renderToString } from 'react-dom/server';
 import { matchRoutes } from 'react-router-dom';
 import { Helmet } from 'react-helmet';
@@ -25,32 +28,38 @@ import { ServerStyleSheet } from 'styled-components';
 import serialize from 'serialize-javascript';
 import { noop, identity } from 'lodash';
 import { buildCleaner } from 'lodash-clean';
-import { a as Cookies } from './CookieHelper.class-FTURFpz3.js';
+import { a as Cookies } from './CookieHelper.class-C6rTRl_1.js';
 import cookiesMiddleware from 'universal-cookie-express';
-import { c as createStore } from './store-3u0RzHZ0.js';
-import { h as history, p as pickProject, r as rootSaga } from './App-DLZweVSp.js';
-export { A as ReactApp } from './App-DLZweVSp.js';
-import { s as setVersionStatus, d as setVersion } from './version-BlsI7hX2.js';
-import { a3 as selectSurrogateKeys, a4 as selectSsrApiCalls, h as selectRouteEntry, n as selectCurrentProject, g as getImmutableOrJS, d as setCurrentProject, K as selectCurrentSearch } from './selectors-DO2ocdOp.js';
-import { H as HttpContext, m as mergeStaticRoutes } from './RouteLoader-xeQBXywk.js';
+import { c as createStore } from './store-B4IrBYHm.js';
+import { s as setVersionStatus, c as setVersion } from './version-CA9Mdm3A.js';
+import { a6 as selectSurrogateKeys, a7 as selectSsrApiCalls, j as selectRouteEntry, f as selectCurrentProject, g as getImmutableOrJS, s as setCurrentProject, F as selectCurrentSearch } from './selectors-8ROQrTd7.js';
+import { H as HttpContext, m as mergeStaticRoutes } from './RouteLoader-CzrlySZf.js';
 import { Transform } from 'stream';
 import { ChunkExtractor, ChunkExtractorManager } from '@loadable/server';
 import chalk from 'chalk';
 import minifyCssString from 'minify-css-string';
 import { CookiesProvider } from 'react-cookie';
+import { HelmetProvider } from 'react-helmet-async';
 import { StaticRouter } from 'react-router-dom/server';
+import { S as SSRContextProvider, g as getSubsitePath } from './SSRContext-Bxtg1KGv.js';
+import './VersionInfo-By2ZCZOh.js';
+import './CookieConstants-DEmbwzYr.js';
+import '@reduxjs/toolkit';
 import 'loglevel';
 import '@redux-saga/core/effects';
+import './version-BQAL8sQO.js';
+import './util-Bl2u6LpY.js';
+import './selectors-DcmvOeX2.js';
 import './_commonjsHelpers-BFTU3MAI.js';
-import './version-wnf-TITV.js';
+import 'history';
+import 'await-to-js';
+import 'redux-saga';
+import './ChangePassword.container-CUBtn82K.js';
+import './matchGroups-_w8BwzCC.js';
+import './ToJs-BnRRHk6f.js';
 import 'redux';
 import 'redux-thunk';
-import 'redux-saga';
 import 'redux-injectors-19';
-import 'history';
-import 'await-to-js';
-import './ChangePassword.container-BgzIy8dA.js';
-import './ToJs-CNzfvyxJ.js';
 
 /**
  * Util class holds our search results helper boilerplate methods
@@ -610,42 +619,66 @@ const makeLinkDepthMiddleware = ({
   }
 };
 
+/**
+ * Development proxy for Subsite PoC
+ * Catch all routes before they hit CRB handlers
+ * and rewrite them to include the subsite base path,
+ * this allows us to run the subsite in a subfolder in development
+ * In production we will handle this with a path rewrite in the Cloud Dashboard site configuration,
+ * @param subsitePath the content base path we will rewrite to
+ * @param exceptions an array of path prefixes to ignore when rewriting, useful for ignoring assets that do not live in the subsite base path
+ */
+const subsiteDebugMiddleware = (subsitePath, exceptions = []) => (req, res, next) => {
+  if (!subsitePath || req.hostname !== 'localhost' || req.path.startsWith('/api/') || exceptions.some(exception => req.path.startsWith(exception))) return next();
+  if (!req.path.startsWith(`${subsitePath}/`)) {
+    console.warn(`[subsite-debug-middleware] Rewriting (${subsitePath})${req.url}`);
+    if (req.path === '/' || req.path === subsitePath) req.url = subsitePath;else req.url = `${subsitePath}${req.url}`;
+    res.setHeader('x-crb-subsite-content-path', req.url);
+
+    // Important to set the subsite_path header as this drives the subsite-scoped routing logic
+    req.headers['subsite_path'] = subsitePath;
+  }
+  next();
+};
+
 const servers$1 = SERVERS; /* global SERVERS */
 const project = PROJECT; /* global PROJECT */
 const alias$1 = ALIAS; /* global ALIAS */
-const deliveryApiHostname = url(alias$1, project).api;
+const deliveryApiHostname = urls(alias$1, project).api;
+const proxyTimeoutMs = 45_000;
 const assetProxy = httpProxy.createProxyServer();
 const deliveryProxy = httpProxy.createProxyServer();
 const reverseProxies = (app, reverseProxyPaths = []) => {
   deliveryApiProxy(deliveryProxy, app);
-  app.all(reverseProxyPaths, (req, res) => {
-    const target = req.hostname.indexOf('preview-') || req.hostname.indexOf('preview.') || req.hostname === 'localhost' ? servers$1.previewIis || servers$1.iis : servers$1.iis;
+  app.all(reverseProxyPaths.map(proxyPath =>
+  // Patch to update paths for express v5
+  proxyPath.endsWith('/*') ? `${proxyPath.slice(0, -2)}/{*splat}` : proxyPath.endsWith('/**') ? `${proxyPath.slice(0, -3)}/{*splat}` : proxyPath), (req, res) => {
+    const target = req.hostname.includes('preview-') || req.hostname.includes('preview.') || req.hostname === 'localhost' ? servers$1.previewIis || servers$1.iis : servers$1.iis;
     assetProxy.web(req, res, {
       target,
-      changeOrigin: true
-    });
-    assetProxy.on('error', e => {
-      /* eslint-disable no-console */
-      console.log(`Proxy Request for ${req.path} HostName:${req.hostname} failed with ${e}`);
-      /* eslint-enable no-console */
+      changeOrigin: true,
+      proxyTimeout: proxyTimeoutMs,
+      timeout: proxyTimeoutMs
     });
   });
+  assetProxy.on('error', (e, req) => {
+    console.log(`[assetProxy] "${req.method} ${req.url}" host: ${req.headers.host} failed with ${e}`);
+  });
 };
 const deliveryApiProxy = (apiProxy, app) => {
   // This is just here to stop cors requests on localhost. In Production this is mapped using varnish.
-  app.all(['/api/delivery/*', '/api/forms/*', '/api/image/*', '/authenticate/*'], (req, res) => {
-    /* eslint-disable no-console */
-    console.log(`Proxying api request to ${servers$1.alias}`);
+  app.all(['/api/delivery/{*splat}', '/api/forms/{*splat}', '/api/image/{*splat}', '/authenticate/{*splat}'], (req, res) => {
+    console.log(`[apiProxy] "${req.method} ${shorten(req.url)}" target: ${servers$1.alias}`);
     apiProxy.web(req, res, {
       target: deliveryApiHostname,
-      changeOrigin: true
-    });
-    apiProxy.on('error', e => {
-      /* eslint-disable no-console */
-      console.log(`Proxy request for ${req.path} HostName:${req.hostname} failed with ${e}`);
-      /* eslint-enable no-console */
+      changeOrigin: true,
+      proxyTimeout: proxyTimeoutMs,
+      timeout: proxyTimeoutMs
     });
   });
+  apiProxy.on('error', (e, req) => {
+    console.log(`[apiProxy] "${req.method} ${req.url}" host: ${req.headers.host} failed with ${e}`);
+  });
 };
 
 const CacheDuration = {
@@ -720,9 +753,8 @@ const resolveStartupMiddleware = ({
       if (maxage) res.set('Cache-Control', `public, max-age=${maxage}`);
       res.sendFile(startupFileLocation);
     } catch (sendFileError) {
-      // eslint-disable-next-line no-console
       console.log(`Unable to send file startup.js at '${startupFileLocation}'`, sendFileError);
-      next();
+      res.status(404).send();
     }
   } else {
     next();
@@ -730,8 +762,11 @@ const resolveStartupMiddleware = ({
 };
 
 // Serving static assets
+const {
+  path: appPath
+} = appRootPath;
 const staticAssets = (app, {
-  appRootPath = path$1,
+  appRootPath = appPath,
   scripts = {},
   startupScriptFilename = 'startup.js',
   staticFolderPath = 'static',
@@ -750,9 +785,7 @@ const staticAssets = (app, {
     maxage: CacheDuration.static,
     startupScriptFilename: scripts.startup || startupScriptFilename,
     staticFolderPath
-  }),
-  // eslint-disable-next-line import/no-named-as-default-member
-  express.static(`dist/${staticFolderPath}`, {
+  }), express.static(`dist/${staticFolderPath}`, {
     // these maxage values are different in config but the same in runtime,
     // this one is somehow converted and should end up being the same as CacheDuration.static
     maxAge: CacheDuration.expressStatic
@@ -802,7 +835,31 @@ const handleResponse = (request, response, content, send = 'send') => {
  * @param response the express Response object
  * @param stream all chunks are piped to this stream to add additional style elements to each streamed chunk
  */
-const renderStream = (getContextHtml, jsx, response, stream) => {
+const renderStream = (getContextHtml, jsx, request, response, stream) => {
+  // Store timeout reference for cleanup on normal or abnormal termination
+  let timeoutId = null;
+  const disposeTimeout = () => {
+    if (timeoutId) {
+      clearTimeout(timeoutId);
+      timeoutId = null;
+    }
+  };
+
+  // Only used for abnormal termination
+  const abortCleanup = err => {
+    disposeTimeout();
+    stream.destroy(err instanceof Error ? err : undefined);
+    abort();
+  };
+
+  // Guard against client disconnect
+  request.on('close', () => abortCleanup());
+
+  // Guard against transform errors
+  stream.on('error', err => {
+    abortCleanup(err);
+    if (!response.headersSent) response.destroy(err);
+  });
   const {
     abort,
     pipe
@@ -811,7 +868,7 @@ const renderStream = (getContextHtml, jsx, response, stream) => {
       const html = getContextHtml(false);
       if (!html) {
         // this means we have finished with the response already
-        abort();
+        abortCleanup();
       } else {
         const header = html.split('{{APP}}')[0];
         response.setHeader('content-type', 'text/html; charset=utf-8');
@@ -822,11 +879,15 @@ const renderStream = (getContextHtml, jsx, response, stream) => {
     onAllReady() {
       const footer = getContextHtml(true).split('{{APP}}')[1];
       stream.write(footer);
+      disposeTimeout(); // Clear the timeout, let stream end naturally
     },
     onShellError(error) {
-      response.statusCode = 500;
-      response.setHeader('content-type', 'text/html; charset=utf-8');
-      response.send('<h1>Something went wrong</h1>');
+      abortCleanup(error); // Abnormal - destroy everything
+      if (!response.headersSent) {
+        response.statusCode = 500;
+        response.setHeader('content-type', 'text/html; charset=utf-8');
+        response.send('<h1>Something went wrong</h1>');
+      }
       console.error(`[renderToPipeableStream:onShellError]`, error);
     },
     onError(error) {
@@ -834,10 +895,13 @@ const renderStream = (getContextHtml, jsx, response, stream) => {
     }
   });
 
-  // Abandon and switch to client rendering if enough time passes.
+  // Abandon and switch to client rendering after 30s.
   // Try lowering this to see the client recover.
-  setTimeout(() => abort(), 30 * 1000);
-  stream === null || stream === void 0 || stream.pipe(response);
+  timeoutId = setTimeout(() => {
+    timeoutId = null;
+    abortCleanup();
+  }, 30_000);
+  stream.pipe(response);
 };
 
 /**
@@ -877,6 +941,23 @@ const styledComponentsStream = sheet => {
         this.push(styledCSS + renderedHtml);
       }
       callback();
+    },
+    destroy(err, callback) {
+      // Called on both stream.destroy() and natural end
+      // Stops the sheet intercepting styles & releases its references
+
+      // try/catch is required if sheet.seal() throws for any reason,
+      // callback(err) must still be called, as Node.js stream internals depend
+      // on it to complete teardown. Omitting it causes the stream to hang.
+      try {
+        sheet.seal();
+      } catch (sealErr) {
+        // Catch any errors from sealing the sheet, we MUST always call the
+        // callback to prevent hanging the stream
+
+        console.error('[styledComponentsStream] sheet.seal() failed - styles may leak:', sealErr);
+      }
+      callback(err);
     }
   });
   return readerWriter;
@@ -1038,6 +1119,7 @@ const unhandledExceptionHandler = (handleExceptions = handleDefaultEvents) => {
   }
 };
 
+const logPrefix = '[addHeaders]';
 const addStandardHeaders = (state, response, packagejson, groups) => {
   if (state) {
     try {
@@ -1051,14 +1133,14 @@ const addStandardHeaders = (state, response, packagejson, groups) => {
       // - add `any-update` header that will indiscriminately
       //   invalidate the SSR page cache when any content is updated
       const addAnyUpdateHeader = routingSurrogateKeys.length >= 2000 || response.statusCode >= 400 || anyApiError;
-      console.info(`[addStandardHeaders] ${addAnyUpdateHeader ? anyUpdateHeader : routingSurrogateKeys.length} surrogate keys for ${response.req.url}`);
+      console.info(`${logPrefix} ${addAnyUpdateHeader ? anyUpdateHeader : routingSurrogateKeys.length} surrogate keys for ${response.req.url}`);
       const surrogateKeys = addAnyUpdateHeader ? anyUpdateHeader : routingSurrogateKeys.join(' ');
       const surrogateKeyHeader = `${packagejson.name}-app ${surrogateKeys}`;
       response.setHeader('surrogate-key', surrogateKeyHeader);
       addVarnishAuthenticationHeaders(state, response, groups);
       response.setHeader('surrogate-control', `max-age=${getCacheDuration(response.statusCode)}`);
     } catch (e) {
-      console.info('[addStandardHeaders] Error adding headers', e.message);
+      console.info(`${logPrefix} Error adding headers`, e.message);
     }
   }
 };
@@ -1071,14 +1153,13 @@ const addVarnishAuthenticationHeaders = (state, response, groups = {}) => {
         globalGroups,
         allowedGroups
       } = groups;
-      // console.info(globalGroups, allowedGroups);
       let allGroups = Array.from(globalGroups && globalGroups[project] || {});
       if (stateEntry && getImmutableOrJS(stateEntry, ['authentication', 'isLoginRequired']) && allowedGroups && allowedGroups[project]) {
         allGroups = [...allGroups, ...allowedGroups[project]];
       }
       response.header('x-contensis-viewer-groups', allGroups.join('|'));
     } catch (e) {
-      console.info('Error adding authentication header', e);
+      console.info(`${logPrefix} Error adding authentication header`, e);
     }
   }
 };
@@ -1155,13 +1236,15 @@ const replaceHtml = ({
  */
 const ssrJsxProducer = (ReactApp, {
   providers,
-  props,
-  ssrAssets
+  props
+  // ssrAssets,
 }) => {
   var _providers$styledComp;
   // Recast ChunkExtractorManager to avoid TS error `Property 'children' does not exist on type...`
   const ChunkExtractor = ChunkExtractorManager;
-  const jsx = /*#__PURE__*/React.createElement(ChunkExtractor, {
+  const jsx = /*#__PURE__*/React.createElement(HelmetProvider, {
+    context: providers.helmet
+  }, /*#__PURE__*/React.createElement(ChunkExtractor, {
     extractor: providers.loadable.extractor
   }, /*#__PURE__*/React.createElement(CookiesProvider, {
     cookies: providers.cookies
@@ -1170,16 +1253,20 @@ const ssrJsxProducer = (ReactApp, {
   }, /*#__PURE__*/React.createElement(HttpContext.Provider, {
     value: providers.httpContext
   }, /*#__PURE__*/React.createElement(StaticRouter, {
-    location: providers.router.url
+    location: providers.router.url,
+    future: {
+      v7_startTransition: true,
+      v7_relativeSplatPath: true
+    }
   }, /*#__PURE__*/React.createElement(SSRContextProvider, {
     accessMethod: providers.ssrContext.accessMethod,
     request: providers.ssrContext.request,
-    response: providers.ssrContext.response,
-    ssrAssets: ssrAssets
+    response: providers.ssrContext.response
+    // ssrAssets={ssrAssets}
   }, /*#__PURE__*/React.createElement(ReactApp, {
     routes: props.routes,
     withEvents: props.withEvents
-  })))))));
+  }))))))));
 
   // Wrap the JSX in a StyleSheetManager if a ServerStyleSheet is provided
   return !((_providers$styledComp = providers.styledComponents) !== null && _providers$styledComp !== void 0 && _providers$styledComp.sheet) ? jsx : providers.styledComponents.sheet.collectStyles(jsx);
@@ -1201,8 +1288,12 @@ const webApp = (app, ReactApp, config) => {
     disableSsrRedux,
     enableSsrCookies,
     handleResponses,
-    handleExceptions = true
+    handleExceptions = true,
+    i18n
   } = config;
+
+  // process locales in static routes for i18n
+  const localeRoutes = createLocaleRoutes(routes);
   const staticRoutePath = config.staticRoutePath || staticFolderPath;
   let isRenderingJsxToString = config.renderToString || false;
   const bundleData = getBundleData(config, staticRoutePath);
@@ -1216,8 +1307,16 @@ const webApp = (app, ReactApp, config) => {
   if (handleExceptions !== false) unhandledExceptionHandler(handleExceptions); // Create `process.on` event handlers for unhandled exceptions (Node v15+)
 
   const versionInfo = getVersionInfo(staticFolderPath);
-  app.get('/*', cookiesMiddleware(), async (request, response) => {
-    const url = encodeURI(request.url);
+  app.get('/{*splat}', cookiesMiddleware(), async (request, response) => {
+    /*
+     * Do not inject url directly into HTML as it can lead to XSS attacks
+     * CWE-79: Improper Neutralization of Input During Web Page Generation ('Cross-site Scripting')
+     * CWE-96: Improper Neutralization of Script-Related HTML Tags in a Web Page (Basic XSS)
+     * Removed URL encoding as it causes inconsistencies when routes contain encoded characters in SSR
+     * e.g. /search?category=sport%20and%20wellbeing becomes /search?category=sport%2520and%2520wellbeing
+     * // const url = encodeURI(request.url);
+     */
+    const url = request.url;
     const matchedStaticRoute = matchRoutes(routes.StaticRoutes, request.path);
     const isStaticRoute = matchedStaticRoute && matchedStaticRoute.length > 0;
     if (isStaticRoute) {
@@ -1257,25 +1356,22 @@ const webApp = (app, ReactApp, config) => {
     // In server-side blocks world, the hostname requested by the client resides in the x-orig-host header
     // Because of this, we prioritize x-orig-host when setting our hostname
     const hostname = request.headers['x-orig-host'] || request.hostname;
-    console.info(`Request for ${request.path} hostname: ${hostname} versionStatus: ${versionStatus}`);
+    const subsitePath = getSubsitePath(request);
+    const subsitePathScript = subsitePath ? `window.subsitePath = ${serialize(subsitePath)};` : '';
+    console.info(`[webApp] "${request.method} ${request.path}" hostname: ${hostname} versionStatus: ${versionStatus}`);
     store.dispatch(setVersionStatus(versionStatus));
     store.dispatch(setVersion(versionInfo.commitRef, versionInfo.buildNo));
     const project = pickProject(hostname, request.query);
     const groups = allowedGroups && allowedGroups[project];
     store.dispatch(setCurrentProject(project, groups, hostname));
+    if (i18n) {
+      store.dispatch(actions.INIT_LOCALES({
+        locales: {},
+        routes: localeRoutes,
+        ...i18n
+      }));
+    }
     const loadableExtractor = loadableChunkExtractors();
-
-    // type ChunkExtractorManagerPropsForReact18 = ChunkExtractorManagerProps & {
-    //   children?: React.ReactNode;
-    // };
-
-    // // Recast ChunkExtractorManager to avoid TS error `Property 'children' does not exist on type...`
-    // const ChunkExtractor = ChunkExtractorManager as ClassType<
-    //   ChunkExtractorManagerPropsForReact18,
-    //   Component<ChunkExtractorManagerPropsForReact18>,
-    //   ComponentClass<ChunkExtractorManagerPropsForReact18>
-    // >;
-
     const ssrCookies = enableSsrCookies ?
     // these cookies are managed by the cookiesMiddleware and contain listeners
     // when cookies are read or written in ssr can be added to the `set-cookie` response header
@@ -1290,12 +1386,17 @@ const webApp = (app, ReactApp, config) => {
     // and read back any context props set by the ReactApp
     const context = {};
 
+    // Per-request helmet context object — populated by HelmetProvider during renderToString
+    // Using a fresh object per request ensures thread safety under concurrent SSR requests
+    const helmetContext = {};
+
     // Amalgamate all props for the various Providers we wrap the ReactApp with
     const jsxProviderProps = {
       loadable: {
         extractor: loadableExtractor.commonLoadableExtractor
       },
       cookies: ssrCookies,
+      helmet: helmetContext,
       redux: store,
       httpContext: context,
       router: {
@@ -1325,13 +1426,10 @@ const webApp = (app, ReactApp, config) => {
       // Dynamic doesn't need sagas
       // or styles, or any split component bundles
       // nor are we streaming responses
-      const isDynamicHints = `<script ${attributes}>window.versionStatus = "${versionStatus}"; window.isDynamic = true;</script>`;
+      const isDynamicHints = `<script ${attributes}>window.isDynamic = true; ${subsitePathScript}</script>`;
       const jsx = ssrJsxProducer(ReactApp, {
         providers: jsxProviderProps,
-        props: jsxReactAppProps,
-        ssrAssets: {
-          serializedState: isDynamicHints
-        }
+        props: jsxReactAppProps
       });
       renderToString(jsx);
 
@@ -1390,10 +1488,7 @@ const webApp = (app, ReactApp, config) => {
             return true;
           }
           if (!disableSsrRedux) {
-            // window.versionStatus is not strictly required here and is added to support cases
-            // where a consumer may not be using the contensisVersionStatus in redux and calling
-            // the `getClientSideVersionStatus()` method directly
-            serialisedReduxData = `<script ${attributes}>window.versionStatus = "${versionStatus}"; window.REDUX_DATA = ${serialisedReduxData}</script>`;
+            serialisedReduxData = `<script ${attributes}>${subsitePathScript} window.__USE_HYDRATE__ = true; window.REDUX_DATA = ${serialisedReduxData}</script>`;
           }
         }
 
@@ -1403,32 +1498,6 @@ const webApp = (app, ReactApp, config) => {
           globalGroups
         });
         const sheet = new ServerStyleSheet();
-        const helmet = Helmet.renderStatic();
-        Helmet.rewind();
-        // const htmlAttributes = helmet.htmlAttributes.toString();
-        // let title = helmet.title.toString();
-        // const metadata = helmet.meta
-        //   .toString()
-        //   .concat(helmet.base.toString())
-        //   .concat(helmet.link.toString())
-        //   .concat(helmet.script.toString())
-        //   .concat(helmet.noscript.toString());
-
-        // // Produce the ssr jsx one time so we can get any style tags to pass back in
-        // ssrJsxProducer(ReactApp, {
-        //   providers: { ...jsxProviderProps, styledComponents: { sheet } },
-        //   props: jsxReactAppProps,
-        // });
-
-        // // After running rootSaga (and rendering subsquent children)
-        // // there should be additional react-loadable
-        // // code-split bundles for any page components as well as core app bundles
-        // const bundleTags = getBundleTags(
-        //   loadableExtractor,
-        //   scripts,
-        //   staticRoutePath
-        // );
-
         const styledJsx = ssrJsxProducer(ReactApp, {
           providers: {
             ...jsxProviderProps,
@@ -1436,14 +1505,31 @@ const webApp = (app, ReactApp, config) => {
               sheet
             }
           },
-          props: jsxReactAppProps,
-          ssrAssets: {
-            // bundleTags,
-            // htmlAttributes,
-            // metadata,
-            // title,
-          }
+          props: jsxReactAppProps
         });
+
+        // We have to call renderToString() in order for all components to have
+        // had chance to set the helmet metadata
+        const html = renderToString(styledJsx);
+        // Helmet.renderStatic() has to be called synchronously immediately after calling renderToString()
+        // as it is not thread-safe (or specifically scoped to only this request)
+        // TODO: deprecate `react-helmet`
+        const helmet = Helmet.renderStatic();
+
+        // helmetContext is populated synchronously by HelmetProvider during renderToString()
+        // It is scoped per-request via the helmetContext object, making this thread-safe
+        // under concurrent SSR requests (unlike the previous Helmet.renderStatic() global singleton)
+        const {
+          helmet: helmetAsync
+        } = helmetContext;
+
+        // Because we have had to call renderToString() here to reliably gather all helmet metadata
+        // We could potentially call sheet.getStyleTags() here too and avoid piping a react-rendered
+        // stream to a second stream to inject styled-components CSS
+
+        const htmlAttributes = helmetAsync.htmlAttributes.toString() || helmet.htmlAttributes.toString();
+        let title = helmet.title.toString().includes('><') ? helmetAsync.title.toString() : helmet.title.toString();
+        const metadata = helmetAsync.meta.toString().concat(helmetAsync.base.toString()).concat(helmetAsync.priority.toString()).concat(helmetAsync.link.toString()).concat(helmetAsync.script.toString()).concat(helmetAsync.noscript.toString()).concat(helmet.meta.toString()).concat(helmet.base.toString()).concat(helmet.link.toString()).concat(helmet.script.toString()).concat(helmet.noscript.toString());
         try {
           /**
            * Loads all page assets into the provided templateHTML
@@ -1455,6 +1541,7 @@ const webApp = (app, ReactApp, config) => {
            * if the context has requested a redirect
            * */
           const getContextHtml = (isFinal = false, styleTags, renderedJsxMarkup) => {
+            var _loadableExtractor$mo;
             if (context.url) {
               response.redirect(context.statusCode || 302, context.url);
               return '';
@@ -1464,23 +1551,23 @@ const webApp = (app, ReactApp, config) => {
             if ((context.statusCode || 200) >= 404) {
               accessMethod.STATIC = true;
             }
-
-            // Title and metadata can be blank
-            const htmlAttributes = helmet.htmlAttributes.toString();
-            let title = helmet.title.toString();
-            const metadata = helmet.meta.toString().concat(helmet.base.toString()).concat(helmet.link.toString()).concat(helmet.script.toString()).concat(helmet.noscript.toString());
             if (context.statusCode === 404) title = '<title>404 page not found</title>';
 
             // Set response.status from React StaticRouter
             if (typeof context.statusCode === 'number') response.status(context.statusCode);
             const bundleTags = isFinal ? getBundleTags(loadableExtractor, scripts, staticRoutePath) : '';
+
+            // Getting style tags generated by "CSS Modules" because they will be
+            // available to loadable stats if we have built parts of the app with CSS
+            // plugins that are not within styled-components
+            const styles = loadableExtractor === null || loadableExtractor === void 0 || (_loadableExtractor$mo = loadableExtractor.modern) === null || _loadableExtractor$mo === void 0 ? void 0 : _loadableExtractor$mo.getStyleTags();
             const html = replaceHtml({
               bundleTags,
               html: renderedJsxMarkup,
               htmlAttributes,
               metadata,
               state: serialisedReduxData,
-              styleTags,
+              styleTags: `${styleTags || ''}${styles || ''}`,
               title,
               templateHTML,
               templateHTMLFragment,
@@ -1489,12 +1576,14 @@ const webApp = (app, ReactApp, config) => {
             return html;
           };
           if (isRenderingJsxToString) {
-            const html = renderToString(styledJsx);
+            // We have already (begrudgingly) rendered the JSX to a string above
+            // so we can get all of the Helmet metadata out from any rendered component
+            // const html = renderToString(styledJsx);
             const styleTags = sheet.getStyleTags();
             const responseHTML = getContextHtml(true, styleTags, html);
             responseHandler(request, response, responseHTML);
           } else {
-            renderStream(getContextHtml, styledJsx, response, styledComponentsStream(sheet));
+            renderStream(getContextHtml, styledJsx, request, response, styledComponentsStream(sheet));
           }
         } catch (err) {
           console.info(err.message);
@@ -1556,5 +1645,5 @@ var internalServer = {
   start
 };
 
-export { internalServer as default, makeLinkDepthApi as linkDepthApi };
+export { subsiteDebugMiddleware as DO_NOT_COMMIT_subsiteDebugMiddleware, internalServer as default, makeLinkDepthApi as linkDepthApi };
 //# sourceMappingURL=contensis-react-base.js.map