@plone/volto 19.0.0-alpha.2 → 19.0.0-alpha.20

package/src/helpers/Url/Url.test.js

@@ -19,6 +19,8 @@ import {
   normaliseMail,
   normalizeTelephone,
   flattenScales,
+  addSubpathPrefix,
+  stripSubpathPrefix,
 } from './Url';
 
 beforeEach(() => {
@@ -533,4 +535,64 @@ describe('Url', () => {
       });
     });
   });
+
+  describe('Subpath tests', () => {
+    beforeEach(() => {
+      settings.subpathPrefix = '/site';
+    });
+    describe('addSubpathPrefix', () => {
+      it('adds subpath prefix to internal URLs', () => {
+        expect(addSubpathPrefix('/some-page')).toBe('/site/some-page');
+        expect(addSubpathPrefix('/news/article')).toBe('/site/news/article');
+      });
+
+      it('does not add subpath prefix to URLs that already have it', () => {
+        expect(addSubpathPrefix('/site/some-page')).toBe('/site/some-page');
+      });
+
+      it('does not add subpath prefix to external URLs', () => {
+        expect(addSubpathPrefix('https://example.com/page')).toBe(
+          'https://example.com/page',
+        );
+      });
+
+      it('handles empty subpath prefix', () => {
+        settings.subpathPrefix = '';
+        expect(addSubpathPrefix('/some-page')).toBe('/some-page');
+      });
+
+      it('handles undefined subpath prefix', () => {
+        settings.subpathPrefix = undefined;
+        expect(addSubpathPrefix('/some-page')).toBe('/some-page');
+      });
+    });
+
+    describe('stripSubpathPrefix', () => {
+      beforeEach(() => {
+        settings.subpathPrefix = '/site';
+      });
+      it('removes subpath prefix from URLs that have it', () => {
+        expect(stripSubpathPrefix('/site/some-page')).toBe('/some-page');
+        expect(stripSubpathPrefix('/site/news/article')).toBe('/news/article');
+      });
+
+      it('leaves URLs unchanged if they do not have the prefix', () => {
+        expect(stripSubpathPrefix('/other/some-page')).toBe('/other/some-page');
+      });
+
+      it('handles the case where URL is exactly the subpath prefix', () => {
+        expect(stripSubpathPrefix('/site')).toBe('');
+      });
+
+      it('handles empty subpath prefix', () => {
+        settings.subpathPrefix = '';
+        expect(stripSubpathPrefix('/some-page')).toBe('/some-page');
+      });
+
+      it('handles undefined subpath prefix', () => {
+        settings.subpathPrefix = undefined;
+        expect(stripSubpathPrefix('/some-page')).toBe('/some-page');
+      });
+    });
+  });
 });

package/src/hooks/user/useUser.js

@@ -12,7 +12,7 @@ const useUser = () => {
   const dispatch = useDispatch();
 
   useEffect(() => {
-    if (!user?.id && users?.get.loading === false) {
+    if (userId && !user?.id && users?.get.loading === false) {
       dispatch(getUser(userId));
     }
   }, [dispatch, userId, user, users?.get.loading]);

package/src/internalChecks.test.ts

@@ -0,0 +1,11 @@
+import { describe, it, expect } from 'vitest';
+import packageJson from '../package.json';
+
+describe('internal checks', () => {
+  it('keeps prettier listed as a runtime dependency', () => {
+    const dependencies = packageJson.dependencies ?? {};
+
+    expect(dependencies).toHaveProperty('prettier');
+    expect(typeof dependencies.prettier).toBe('string');
+  });
+});

package/src/middleware/Api.test.js

@@ -25,6 +25,8 @@ describe('api middleware helpers', () => {
     const result = addExpandersToPath(
       '/de/mypage?expand=translations',
       GET_CONTENT,
+      false,
+      true,
     );
     expect(result).toEqual('/de/mypage?expand=translations,mycustomexpander');
   });
@@ -183,6 +185,8 @@ describe('api middleware helpers', () => {
     const result = addExpandersToPath(
       '/de/mypage/@navigation?expand=translations&expand.navigation.depth=3&someotherquery=1&someotherquery=2',
       GET_CONTENT,
+      false,
+      true,
     );
     // No need to stringify
     expect(result).toEqual(

package/src/middleware/api.js

@@ -35,7 +35,7 @@ let socket = null;
  *
  * - It should add the expanders set in the config settings
  * - It should preserve any query if present
- * - It should preserve (and add) any expand parameter (if present) e.g. translations
+ * - It should preserve (and add) any expand parameter (if present)
  * - It should take use the correct codification for arrays in querystring (repeated parameter for each member of the array)
  *
  * @function addExpandersToPath
@@ -43,7 +43,7 @@ let socket = null;
  * @param {*} type The action type
  * @returns {string} The url/path with the configured expanders added to the query string
  */
-export function addExpandersToPath(path, type, isAnonymous) {
+export function addExpandersToPath(path, type, isAnonymous, isMultilingual) {
   const { settings } = config;
   const { apiExpanders = [] } = settings;
 
@@ -58,7 +58,14 @@ export function addExpandersToPath(path, type, isAnonymous) {
 
   const expandMerge = compact(
     union([expand, ...flatten(expandersFromConfig)]),
-  ).filter((item) => !(item === 'types' && isAnonymous)); // Remove types expander if isAnonymous
+  ).filter(
+    // Remove types for anonymous, translations unless multilingual
+    (item) =>
+      !(
+        (item === 'types' && isAnonymous) ||
+        (item === 'translations' && !isMultilingual)
+      ),
+  );
 
   const stringifiedExpand = qs.stringify(
     { expand: expandMerge },
@@ -128,6 +135,8 @@ function sendOnSocket(request) {
  * @param {Object} api Api object.
  * @returns {Promise} Action promise.
  */
+let isHydrating = __CLIENT__ ? true : false;
+
 const apiMiddlewareFactory =
   (api) =>
   ({ dispatch, getState }) =>
@@ -135,14 +144,17 @@ const apiMiddlewareFactory =
   (action) => {
     const { settings } = config;
 
-    const token = getState().userSession.token;
-    let uploadedFiles = getState().content.uploadedFiles;
+    const state = getState();
+    const token = state.userSession.token;
+    let uploadedFiles = state.content.uploadedFiles;
+    const isMultilingual = state.site.data.features?.multilingual;
     let isAnonymous = true;
     if (token) {
       const tokenExpiration = jwtDecode(token).exp;
       const currentTime = new Date().getTime() / 1000;
       isAnonymous = !token || currentTime > tokenExpiration;
     }
+    const hasExistingError = state.content.get?.error;
 
     if (typeof action === 'function') {
       return action(dispatch, getState);
@@ -164,14 +176,24 @@ const apiMiddlewareFactory =
             request.map((item) =>
               sendOnSocket({
                 ...item,
-                path: addExpandersToPath(item.path, type, isAnonymous),
+                path: addExpandersToPath(
+                  item.path,
+                  type,
+                  isAnonymous,
+                  isMultilingual,
+                ),
                 id: type,
               }),
             ),
           )
         : sendOnSocket({
             ...request,
-            path: addExpandersToPath(request.path, type, isAnonymous),
+            path: addExpandersToPath(
+              request.path,
+              type,
+              isAnonymous,
+              isMultilingual,
+            ),
             id: type,
           });
     } else {
@@ -180,7 +202,12 @@ const apiMiddlewareFactory =
           ? request.reduce((prevPromise, item) => {
               return prevPromise.then((acc) => {
                 return api[item.op](
-                  addExpandersToPath(item.path, type, isAnonymous),
+                  addExpandersToPath(
+                    item.path,
+                    type,
+                    isAnonymous,
+                    isMultilingual,
+                  ),
                   {
                     data: item.data,
                     type: item.type,
@@ -201,28 +228,42 @@ const apiMiddlewareFactory =
             }, Promise.resolve([]))
           : Promise.all(
               request.map((item) =>
-                api[item.op](addExpandersToPath(item.path, type, isAnonymous), {
-                  data: item.data,
-                  type: item.type,
-                  headers: item.headers,
-                  params: request.params,
-                  checkUrl: settings.actions_raising_api_errors.includes(
-                    action.type,
+                api[item.op](
+                  addExpandersToPath(
+                    item.path,
+                    type,
+                    isAnonymous,
+                    isMultilingual,
                   ),
-                  attach: item.attach,
-                }),
+                  {
+                    data: item.data,
+                    type: item.type,
+                    headers: item.headers,
+                    params: request.params,
+                    checkUrl: settings.actions_raising_api_errors.includes(
+                      action.type,
+                    ),
+                    attach: item.attach,
+                  },
+                ),
               ),
             )
-        : api[request.op](addExpandersToPath(request.path, type, isAnonymous), {
-            data: request.data,
-            type: request.type,
-            headers: request.headers,
-            params: request.params,
-            checkUrl: settings.actions_raising_api_errors.includes(action.type),
-            attach: request.attach,
-          });
+        : api[request.op](
+            addExpandersToPath(request.path, type, isAnonymous, isMultilingual),
+            {
+              data: request.data,
+              type: request.type,
+              headers: request.headers,
+              params: request.params,
+              checkUrl: settings.actions_raising_api_errors.includes(
+                action.type,
+              ),
+              attach: request.attach,
+            },
+          );
       actionPromise.then(
         (result) => {
+          isHydrating = false;
           if (uploadedFiles !== 0) {
             dispatch(updateUploadedFiles(0));
           }
@@ -298,8 +339,21 @@ const apiMiddlewareFactory =
           }
         },
         (error) => {
+          // Make sure an error during hydration
+          // (for example when serving an archived page)
+          // doesn't hide the SSR content. Only suppress GET_CONTENT failures;
+          // user-initiated actions (LOGIN, etc.) must always dispatch _FAIL so
+          // loaders stop and errors surface.
+          const shouldIgnoreHydrationError =
+            isHydrating && !hasExistingError && type === GET_CONTENT;
+
+          if (shouldIgnoreHydrationError) {
+            isHydrating = false;
+            return;
+          }
+
           // Only SSR can set ECONNREFUSED
-          if (error.code === 'ECONNREFUSED') {
+          if (error?.code === 'ECONNREFUSED') {
             next({
               ...rest,
               error,
@@ -310,7 +364,7 @@ const apiMiddlewareFactory =
           }
 
           // Response error is marked crossDomain if CORS error happen
-          else if (error.crossDomain) {
+          else if (error?.crossDomain) {
             next({
               ...rest,
               error,
@@ -361,7 +415,7 @@ const apiMiddlewareFactory =
                 ...rest,
                 error,
                 statusCode: error.response,
-                message: error.response.body.message,
+                message: error.response?.body?.message,
                 connectionRefused: false,
                 type: SET_APIERROR,
               });

package/src/middleware/storeProtectLoadUtils.test.js

@@ -445,9 +445,9 @@ describe('storeProtectLoadUtils', () => {
           isCounting: false,
         });
       };
-      test('pending', expectPass({ type: 'ANY_PENDING' }), 2);
-      test('success', expectPass({ type: 'ANY_SUCCESS' }), 2);
-      test('failure', expectPass({ type: 'ANY_FAIL' }), 2);
+      test('pending', expectPass({ type: 'ANY_PENDING' }, 2));
+      test('success', expectPass({ type: 'ANY_SUCCESS' }, 2));
+      test('failure', expectPass({ type: 'ANY_FAIL' }, 2));
     });
     describe('counting', () => {
       const expectCount = (action, from, to) => () => {

package/src/reducers/content/content.js

@@ -3,11 +3,10 @@
  * @module reducers/content/content
  */
 
-import map from 'lodash/map';
-import mapKeys from 'lodash/mapKeys';
 import omit from 'lodash/omit';
 
 import { flattenToAppURL } from '@plone/volto/helpers/Url/Url';
+import { flattenStaticBehaviors } from '@plone/volto/helpers/Content/Content';
 
 import {
   CREATE_CONTENT,
@@ -131,14 +130,7 @@ export default function content(state = initialState, action = {}) {
             },
           };
     case `${CREATE_CONTENT}_SUCCESS`:
-      if (result['@static_behaviors']) {
-        map(result['@static_behaviors'], (behavior) => {
-          result = {
-            ...omit(result, behavior),
-            ...mapKeys(result[behavior], (value, key) => `${behavior}.${key}`),
-          };
-        });
-      }
+      result = flattenStaticBehaviors(result);
       const data = action.subrequest
         ? Array.isArray(result)
           ? result.map((item) => ({
@@ -188,14 +180,7 @@ export default function content(state = initialState, action = {}) {
             },
           };
     case `${GET_CONTENT}_SUCCESS`:
-      if (result['@static_behaviors']) {
-        map(result['@static_behaviors'], (behavior) => {
-          result = {
-            ...omit(result, behavior),
-            ...mapKeys(result[behavior], (value, key) => `${behavior}.${key}`),
-          };
-        });
-      }
+      result = flattenStaticBehaviors(result);
 
       const transforms = config.getUtilities({
         type: 'transform',

package/src/reducers/diff/diff.js

@@ -4,6 +4,7 @@
  */
 
 import { GET_DIFF } from '@plone/volto/constants/ActionTypes';
+import { flattenStaticBehaviors } from '@plone/volto/helpers/Content/Content';
 
 const initialState = {
   error: null,
@@ -29,10 +30,13 @@ export default function diff(state = initialState, action = {}) {
         loading: true,
       };
     case `${GET_DIFF}_SUCCESS`:
+      const first_result = flattenStaticBehaviors(action.result[0]);
+      const second_result = flattenStaticBehaviors(action.result[1]);
+
       return {
         ...state,
         error: null,
-        data: action.result,
+        data: [first_result, second_result],
         loaded: true,
         loading: false,
       };

package/src/reducers/diff/diff.test.js

@@ -1,5 +1,5 @@
-import diff from './diff';
 import { GET_DIFF } from '@plone/volto/constants/ActionTypes';
+import diff from './diff';
 
 describe('Diff reducer', () => {
   it('should return the initial state', () => {
@@ -24,15 +24,71 @@ describe('Diff reducer', () => {
     });
   });
 
-  it('should handle GET_DIFF_SUCCESS', () => {
+  it('should handle GET_DIFF_SUCCESS with array result with static behaviors', () => {
+    expect(
+      diff(undefined, {
+        type: `${GET_DIFF}_SUCCESS`,
+        result: [
+          {
+            '@static_behaviors': [
+              'guillotina.behaviors.dublincore.IDublinCore',
+            ],
+            'guillotina.behaviors.dublincore.IDublinCore': {
+              title: 'test page',
+            },
+          },
+          {
+            '@static_behaviors': [
+              'guillotina.behaviors.dublincore.IDublinCore',
+            ],
+            'guillotina.behaviors.dublincore.IDublinCore': {
+              title: 'test second page',
+            },
+          },
+        ],
+      }),
+    ).toEqual({
+      error: null,
+      data: [
+        {
+          '@static_behaviors': ['guillotina.behaviors.dublincore.IDublinCore'],
+
+          'guillotina.behaviors.dublincore.IDublinCore.title': 'test page',
+        },
+        {
+          '@static_behaviors': ['guillotina.behaviors.dublincore.IDublinCore'],
+          'guillotina.behaviors.dublincore.IDublinCore.title':
+            'test second page',
+        },
+      ],
+      loaded: true,
+      loading: false,
+    });
+  });
+
+  it('should handle GET_DIFF_SUCCESS with array result without static behaviors', () => {
+    const data = [
+      {
+        title: 'test page',
+        'guillotina.behaviors.dublincore.IDublinCore': {
+          title: 'test page',
+        },
+      },
+      {
+        title: 'test second page',
+        'guillotina.behaviors.dublincore.IDublinCore': {
+          title: 'test second page',
+        },
+      },
+    ];
     expect(
       diff(undefined, {
         type: `${GET_DIFF}_SUCCESS`,
-        result: 'result',
+        result: data,
       }),
     ).toEqual({
       error: null,
-      data: 'result',
+      data: data,
       loaded: true,
       loading: false,
     });

package/src/reducers/querystring/querystring.js

@@ -30,10 +30,17 @@ export default function querystring(state = initialState, action = {}) {
         loading: true,
       };
     case `${GET_QUERYSTRING}_SUCCESS`:
+      let indexes = action.result.indexes;
+      if (indexes?.path?.operations) {
+        //remove path operation, to remove unhandled 'Navigation path' option from QueryWidget
+        indexes.path.operations = indexes.path.operations.filter(
+          (o) => o !== 'plone.app.querystring.operation.string.path',
+        );
+      }
       return {
         ...state,
         error: null,
-        indexes: action.result.indexes,
+        indexes: indexes,
         sortable_indexes: action.result.sortable_indexes,
         loaded: true,
         loading: false,

package/src/routes.js

@@ -52,6 +52,8 @@ import {
   UpgradeControlPanel,
 } from '@plone/volto/components/manage/Controlpanels';
 
+import withClientSideContent from '@plone/volto/helpers/Content/withClientSideContent';
+
 import App from '@plone/volto/components/theme/App/App';
 import View from '@plone/volto/components/theme/View/View';
 
@@ -127,7 +129,7 @@ export function getExternalRoutes() {
 export const defaultRoutes = [
   // redirect to external links if path is in blacklist
   ...getExternalRoutes(),
-  ...((config.settings?.isMultilingual && multilingualRoutes) || []),
+  ...(config.settings?.isMultilingual !== false ? multilingualRoutes : []),
   {
     path: '/',
     component: View,
@@ -244,7 +246,7 @@ export const defaultRoutes = [
   },
   {
     path: ['/edit', '/**/edit'],
-    component: Edit,
+    component: withClientSideContent(Edit),
   },
   {
     path: ['/contents', '/**/contents'],

package/src/server.jsx

@@ -18,8 +18,9 @@ import { CookiesProvider } from 'react-cookie';
 import cookiesMiddleware from 'universal-cookie-express';
 import debug from 'debug';
 
-import routes from '@root/routes';
+import routes from '@plone/volto/routes';
 import config from '@plone/volto/registry';
+import okMiddleware from '@plone/volto/express-middleware/ok';
 
 import { flattenToAppURL } from '@plone/volto/helpers/Url/Url';
 import Html from '@plone/volto/helpers/Html/Html';
@@ -39,10 +40,14 @@ import ErrorPage from '@plone/volto/error';
 import languages from '@plone/volto/constants/Languages.cjs';
 
 import configureStore from '@plone/volto/store';
-import { ReduxAsyncConnect, loadOnServer } from './helpers/AsyncConnect';
+import {
+  ReduxAsyncConnect,
+  loadOnServer,
+} from '@plone/volto/helpers/AsyncConnect';
 
 let locales = {};
 
+// Load locales listed in supportedLanguages setting
 if (config.settings) {
   config.settings.supportedLanguages.forEach((lang) => {
     const langFileName = toGettextLang(lang);
@@ -68,10 +73,30 @@ const server = express()
   })
   .use(cookiesMiddleware());
 
+// If Volto is being served under a subpath,
+// make sure the static files are available there too.
+// (The static middleware loads too early to access the config.)
+if (config.settings.subpathPrefix) {
+  server.use(
+    config.settings.subpathPrefix,
+    express.static(
+      process.env.BUILD_DIR
+        ? path.join(process.env.BUILD_DIR, 'public')
+        : process.env.RAZZLE_PUBLIC_DIR,
+      {
+        redirect: false, // Avoid /my-prefix from being redirected to /my-prefix/
+      },
+    ),
+  );
+}
+
 const middleware = (config.settings.expressMiddleware || []).filter((m) => m);
 
 server.all('*', setupServer);
-if (middleware.length) server.use('/', middleware);
+if (middleware.length) {
+  server.use(config.settings.subpathPrefix || '/', middleware);
+}
+server.use('/', okMiddleware());
 
 server.use(function (err, req, res, next) {
   if (err) {
@@ -107,7 +132,6 @@ function setupServer(req, res, next) {
   const lang = toReactIntlLang(
     new locale.Locales(
       req.universalCookies.get('I18N_LANGUAGE') ||
-        config.settings.defaultLanguage ||
         req.headers['accept-language'],
     )
       .best(supported)
@@ -160,8 +184,10 @@ function setupServer(req, res, next) {
     res.locals.detectedHost = `${
       req.headers['x-forwarded-proto'] || req.protocol
     }://${req.headers.host}`;
-    config.settings.apiPath = res.locals.detectedHost;
-    config.settings.publicURL = res.locals.detectedHost;
+    config.settings.apiPath =
+      res.locals.detectedHost + config.settings.subpathPrefix;
+    config.settings.publicURL =
+      res.locals.detectedHost + config.settings.subpathPrefix;
   }
 
   res.locals = {
@@ -184,7 +210,6 @@ server.get('/*', (req, res) => {
   const lang = toReactIntlLang(
     new locale.Locales(
       req.universalCookies.get('I18N_LANGUAGE') ||
-        config.settings.defaultLanguage ||
         req.headers['accept-language'],
     )
       .best(supported)
@@ -224,9 +249,10 @@ server.get('/*', (req, res) => {
 
   loadOnServer({ store, location, routes, api })
     .then(() => {
+      const state = store.getState();
       const initialLang =
         req.universalCookies.get('I18N_LANGUAGE') ||
-        config.settings.defaultLanguage ||
+        state.site.data['plone.default_language'] ||
         req.headers['accept-language'];
 
       // The content info is in the store at this point thanks to the asynconnect
@@ -236,10 +262,9 @@ server.get('/*', (req, res) => {
       // TODO: there is a bug here with content that, for any reason, doesn't
       // present the language token field, for some reason. In this case, we
       // should follow the cookie rather then switching the language
-      const contentLang = store.getState().content.get?.error
+      const contentLang = state.content.get?.error
         ? initialLang
-        : store.getState().content.data?.language?.token ||
-          config.settings.defaultLanguage;
+        : state.content.data?.language?.token || initialLang;
 
       if (toBackendLang(initialLang) !== contentLang && url !== '/') {
         const newLang = toReactIntlLang(
@@ -254,7 +279,11 @@ server.get('/*', (req, res) => {
         <ChunkExtractorManager extractor={extractor}>
           <CookiesProvider cookies={req.universalCookies}>
             <Provider store={store} onError={reactIntlErrorHandler}>
-              <StaticRouter context={context} location={req.url}>
+              <StaticRouter
+                context={context}
+                location={req.url}
+                basename={config.settings.subpathPrefix}
+              >
                 <ReduxAsyncConnect routes={routes} helpers={api} />
               </StaticRouter>
             </Provider>
@@ -291,8 +320,8 @@ server.get('/*', (req, res) => {
             markup={markup}
             store={store}
             criticalCss={readCriticalCss(req)}
-            apiPath={res.locals.detectedHost || config.settings.apiPath}
-            publicURL={res.locals.detectedHost || config.settings.publicURL}
+            apiPath={config.settings.apiPath}
+            publicURL={config.settings.publicURL}
           />,
         )}
       `,
@@ -335,6 +364,8 @@ export const defaultReadCriticalCss = () => {
 
 // Exposed for the console bootstrap info messages
 server.apiPath = config.settings.apiPath;
+server.internalApiPath = config.settings.internalApiPath;
+server.subpathPrefix = config.settings.subpathPrefix;
 server.devProxyToApiPath = config.settings.devProxyToApiPath;
 server.proxyRewriteTarget = config.settings.proxyRewriteTarget;
 server.publicURL = config.settings.publicURL;