@zengenti/contensis-react-base 4.0.0-beta.6 → 4.0.0-beta.60

package/esm/contensis-react-base.js

@@ -1,23 +1,24 @@
-import { c as cachedSearch, S as SSRContextProvider, d as deliveryApi } from './SSRContext-BE8ElZ3X.js';
+import { c as cachedSearch, d as deliveryApi } from './ContensisDeliveryApi-CvEoOLCl.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-BZWjx5by.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 url } from './urls-DfCisos-.js';
 import 'isomorphic-fetch';
 import express from 'express';
 import http from 'http';
 import httpProxy from 'http-proxy';
 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 +26,40 @@ 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 createLocaleRoutes, h as history, p as pickProject, r as rootSaga } from './App-CrCf7gso.js';
+export { A as ReactApp } from './App-CrCf7gso.js';
+import { c as createStore } from './store-DSjRYsM2.js';
+import { s as setVersionStatus, c as setVersion } from './version-B75wA6Te.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-BpHhiAlL.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-CYxBWky3.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-BafFLYzn.js';
+import './selectors-DcmvOeX2.js';
 import './_commonjsHelpers-BFTU3MAI.js';
-import './version-wnf-TITV.js';
+import 'history';
+import 'await-to-js';
+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 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(`Proxy request for ${req.url} HostName:${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 */
+  app.all(['/api/delivery/{*splat}', '/api/forms/{*splat}', '/api/image/{*splat}', '/authenticate/{*splat}'], (req, res) => {
     console.log(`Proxying api request to ${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(`Proxy request for ${req.url} HostName:${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,29 +835,54 @@ 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) => {
-  let header = '';
-  let footer = '';
+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
   } = renderToPipeableStream(jsx, {
     onShellReady() {
-      const html = getContextHtml();
+      const html = getContextHtml(false);
       if (!html) {
         // this means we have finished with the response already
-        abort();
+        abortCleanup();
       } else {
-        [header, footer] = html.split('{{APP}}');
+        const header = html.split('{{APP}}')[0];
         response.setHeader('content-type', 'text/html; charset=utf-8');
         stream.write(header);
         pipe(stream);
       }
     },
     onAllReady() {
+      const footer = getContextHtml(true).split('{{APP}}')[1];
       stream.write(footer);
+      disposeTimeout(); // Clear the timeout, let stream end naturally
     },
     onShellError(error) {
+      abortCleanup(error); // Abnormal - destroy everything
       response.statusCode = 500;
       response.setHeader('content-type', 'text/html; charset=utf-8');
       response.send('<h1>Something went wrong</h1>');
@@ -835,10 +893,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);
 };
 
 /**
@@ -878,6 +939,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;
@@ -930,7 +1008,8 @@ const loadableChunkExtractors = () => {
         statsFile: path.resolve('dist/legacy/loadable-stats.json')
       });
     } catch (e) {
-      console.info('@loadable/server legacy ChunkExtractor not available');
+      // legacy bundling deprecated in v4
+      // console.info('@loadable/server legacy ChunkExtractor not available');
     }
     commonLoadableExtractor.addChunk = chunk => {
       var _modern, _legacy, _legacy2;
@@ -1071,7 +1150,6 @@ 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]];
@@ -1104,14 +1182,17 @@ const replaceHtml = ({
   let responseHTML = '';
   // Serve a blank HTML page with client scripts to load the app in the browser
   if (accessMethod.DYNAMIC) {
-    responseHTML = templateHTML.replace('{{TITLE}}', '').replace('{{SEO_CRITICAL_METADATA}}', '').replace('{{CRITICAL_CSS}}', '').replace('{{APP}}', '').replace('{{LOADABLE_CHUNKS}}', bundleTags).replace('{{REDUX_DATA}}', state);
+    responseHTML = templateHTML.replace('{{TITLE}}', '').replace('{{SEO_CRITICAL_METADATA}}', '').replace('{{CRITICAL_CSS}}', '').replace('{{APP}}', '')
+    // .replace('{{LOADABLE_CHUNKS}}', bundleTags)
+    .replace('{{REDUX_DATA}}', state);
   }
 
   // Page fragment served with client scripts and redux data that hydrate the app client side
   else if (accessMethod.FRAGMENT && !accessMethod.STATIC) {
     responseHTML = templateHTMLFragment.replace('{{TITLE}}', title).replace('{{SEO_CRITICAL_METADATA}}', metadata).replace('{{CRITICAL_CSS}}', minifyCssString(styleTags))
     //.replace('{{APP}}', html)
-    .replace('{{LOADABLE_CHUNKS}}', bundleTags).replace('{{REDUX_DATA}}', state);
+    // .replace('{{LOADABLE_CHUNKS}}', bundleTags)
+    .replace('{{REDUX_DATA}}', state);
   }
 
   // Full HTML page served statically
@@ -1125,7 +1206,8 @@ const replaceHtml = ({
   else if (!accessMethod.FRAGMENT && !accessMethod.STATIC) {
     responseHTML = templateHTML.replace('{{TITLE}}', title).replace('{{SEO_CRITICAL_METADATA}}', metadata).replace('{{CRITICAL_CSS}}', styleTags)
     //.replace('{{APP}}', html)
-    .replace('{{LOADABLE_CHUNKS}}', bundleTags).replace('{{REDUX_DATA}}', state);
+    // .replace('{{LOADABLE_CHUNKS}}', bundleTags)
+    .replace('{{REDUX_DATA}}', state);
   }
 
   // If react-helmet htmlAttributes are being used,
@@ -1134,7 +1216,12 @@ const replaceHtml = ({
   if (htmlAttributes) {
     responseHTML = responseHTML.replace(/<html?.+?>/, `<html ${htmlAttributes}>`);
   }
-  return html ? responseHTML.replace('{{APP}}', html) : responseHTML;
+  responseHTML = html ? responseHTML.replace('{{APP}}', html) : responseHTML;
+
+  // Only replace bundle tags at the very end when we have rendered and are
+  // streaming out the HTML "footer"
+  if (bundleTags) responseHTML = responseHTML.replace('{{LOADABLE_CHUNKS}}', bundleTags);
+  return responseHTML;
 };
 
 /**
@@ -1146,13 +1233,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
@@ -1161,16 +1250,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);
@@ -1178,7 +1271,7 @@ const ssrJsxProducer = (ReactApp, {
 
 const webApp = (app, ReactApp, config) => {
   const {
-    stateType = 'immutable',
+    stateType = 'js',
     routes,
     withReducers,
     withSagas,
@@ -1192,8 +1285,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);
@@ -1207,8 +1304,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) {
@@ -1248,25 +1353,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;
+    const subsitePath = getSubsitePath(request);
+    const subsitePathScript = subsitePath ? `window.subsitePath = ${serialize(subsitePath)};` : '';
     console.info(`Request for ${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
@@ -1281,12 +1383,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: {
@@ -1316,13 +1423,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);
 
@@ -1381,40 +1485,16 @@ 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>`;
           }
         }
 
         // Responses
-
-        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());
         addStandardHeaders(reduxState, response, packagejson, {
           allowedGroups,
           globalGroups
         });
-
-        // After running rootSaga there should be an additional react-loadable
-        // code-split bundles for any page components as well as core app bundles
-        const bundleTags = getBundleTags(loadableExtractor, scripts, staticRoutePath);
         const sheet = new ServerStyleSheet();
-        // 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
-        });
-        let styleTags = sheet.getStyleTags();
         const styledJsx = ssrJsxProducer(ReactApp, {
           providers: {
             ...jsxProviderProps,
@@ -1422,14 +1502,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
@@ -1440,7 +1537,8 @@ const webApp = (app, ReactApp, config) => {
            * we render the page as STATIC or render nothing
            * if the context has requested a redirect
            * */
-          const getContextHtml = renderedJsx => {
+          const getContextHtml = (isFinal = false, styleTags, renderedJsxMarkup) => {
+            var _loadableExtractor$mo;
             if (context.url) {
               response.redirect(context.statusCode || 302, context.url);
               return '';
@@ -1454,13 +1552,19 @@ const webApp = (app, ReactApp, config) => {
 
             // 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: renderedJsx,
+              html: renderedJsxMarkup,
               htmlAttributes,
               metadata,
               state: serialisedReduxData,
-              styleTags,
+              styleTags: `${styleTags || ''}${styles || ''}`,
               title,
               templateHTML,
               templateHTMLFragment,
@@ -1469,12 +1573,14 @@ const webApp = (app, ReactApp, config) => {
             return html;
           };
           if (isRenderingJsxToString) {
-            const html = renderToString(styledJsx);
-            styleTags = sheet.getStyleTags();
-            const responseHTML = getContextHtml(html);
+            // 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);
@@ -1536,5 +1642,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