@plone/volto 18.0.0-alpha.42 → 18.0.0-alpha.44

package/src/config/slots.js

@@ -0,0 +1,12 @@
+import { Tags } from '@plone/volto/components';
+
+const slots = {
+  belowContent: [
+    {
+      name: 'tags',
+      component: Tags,
+    },
+  ],
+};
+
+export default slots;

package/src/helpers/Blocks/Blocks.js

@@ -161,7 +161,7 @@ export function addBlock(formData, type, index, blocksConfig) {
 
   return [
     id,
-    _applyBlockInitialValue({
+    applyBlockInitialValue({
       id,
       value,
       blocksConfig,
@@ -197,8 +197,12 @@ export function addBlock(formData, type, index, blocksConfig) {
  * to call `onChangeBlock` at their creation time, as this is prone to racing
  * issue on block data storage.
  */
-const _applyBlockInitialValue = ({ id, value, blocksConfig, formData }) => {
-  const blocksFieldname = getBlocksFieldname(formData);
+export const applyBlockInitialValue = ({
+  id,
+  value,
+  blocksConfig,
+  formData,
+}) => {
   const type = value['@type'];
   blocksConfig = blocksConfig || config.blocks.blocksConfig;
 
@@ -208,6 +212,7 @@ const _applyBlockInitialValue = ({ id, value, blocksConfig, formData }) => {
       value,
       formData,
     });
+    const blocksFieldname = getBlocksFieldname(formData);
     formData[blocksFieldname][id] = value;
   }
 
@@ -238,7 +243,7 @@ export function mutateBlock(formData, id, value, blocksConfig) {
   const trailId = formData[blocksLayoutFieldname].items[index];
   if (trailId) {
     const block = formData[blocksFieldname][trailId];
-    newFormData = _applyBlockInitialValue({
+    newFormData = applyBlockInitialValue({
       id,
       value,
       blocksConfig,
@@ -256,7 +261,7 @@ export function mutateBlock(formData, id, value, blocksConfig) {
   }
 
   const idTrailingBlock = uuid();
-  newFormData = _applyBlockInitialValue({
+  newFormData = applyBlockInitialValue({
     id,
     value,
     blocksConfig,
@@ -307,8 +312,8 @@ export function insertBlock(
   });
 
   const newBlockId = uuid();
-  const newFormData = _applyBlockInitialValue({
-    id,
+  const newFormData = applyBlockInitialValue({
+    id: newBlockId,
     value,
     blocksConfig,
     formData: {
@@ -713,7 +718,7 @@ export function isBlockContainer(block) {
  * @param {Object} types A list with the list of types to be matched
  * @return {Array} An array of block ids
  */
-export function findBlocks(blocks, types, result = []) {
+export function findBlocks(blocks = {}, types, result = []) {
   Object.keys(blocks).forEach((blockId) => {
     const block = blocks[blockId];
     // check blocks from data as well since some add-ons use that

package/src/helpers/Blocks/Blocks.test.js

@@ -511,6 +511,21 @@ describe('Blocks', () => {
       });
     });
 
+    it('initializes data for new block with initialValue in insertBlock', () => {
+      const [newId, form] = insertBlock(
+        {
+          blocks: { a: { value: 1 }, b: { value: 2 } },
+          blocks_layout: { items: ['a', 'b'] },
+        },
+        'b',
+        { '@type': 'dummyText' },
+      );
+      expect(form.blocks[newId]).toStrictEqual({
+        '@type': 'dummyText',
+        marker: true,
+      });
+    });
+
     it('initializes data for new block based on schema defaults', () => {
       const [newId, form] = addBlock(
         {

package/src/helpers/Blocks/cloneBlocks.ts

@@ -4,7 +4,7 @@ import {
   getBlocksFieldname,
   getBlocksLayoutFieldname,
   hasBlocksData,
-} from './Blocks';
+} from '@plone/volto/helpers/Blocks/Blocks';
 import config from '@plone/registry';
 
 export function cloneBlocks(blocksData) {

package/src/helpers/FormValidation/FormValidation.jsx

@@ -1,5 +1,5 @@
 import { map, keys, intersection, isEmpty } from 'lodash';
-import { messages } from '../MessageLabels/MessageLabels';
+import { messages } from '@plone/volto/helpers/MessageLabels/MessageLabels';
 import config from '@plone/volto/registry';
 import { toast } from 'react-toastify';
 import Toast from '@plone/volto/components/manage/Toast/Toast';
@@ -35,7 +35,14 @@ export const tryParseJSON = (requestItem) => {
     try {
       resultObj = JSON.parse(requestItem.replace(/'/g, '"'));
     } catch (e) {
-      resultObj = null;
+      try {
+        // Treats strings like: `'String "double quotes"'`
+        resultObj = JSON.parse(
+          requestItem.replace(/"/g, '\\"').replace(/'/g, '"'),
+        );
+      } catch (e) {
+        resultObj = null;
+      }
     }
   }
   return resultObj;
@@ -338,3 +345,13 @@ export const validateFileUploadSize = (file, intlFunc) => {
   }
   return isValid;
 };
+
+/**
+ * Extract invariant errors given an array of errors.
+ * @param {Array} erros
+ */
+export const extractInvariantErrors = (erros) => {
+  return erros
+    .filter((errorItem) => !('field' in errorItem))
+    .map((errorItem) => errorItem['message']);
+};

package/src/helpers/FormValidation/validators.ts

@@ -1,4 +1,4 @@
-import { validationMessage } from './FormValidation';
+import { validationMessage } from '@plone/volto/helpers/FormValidation/FormValidation';
 import { messages } from '@plone/volto/helpers/MessageLabels/MessageLabels';
 
 type MinMaxValidator = {

package/src/helpers/Url/Url.js

@@ -139,7 +139,10 @@ export const isCmsUi = memoize((currentPathname) => {
   // because the regexp test does not take that into account
   // https://github.com/plone/volto/issues/870
   return settings.nonContentRoutes.reduce(
-    (acc, route) => acc || new RegExp(route).test(`/${fullPath}`),
+    (acc, route) =>
+      acc ||
+      (!settings.nonContentRoutesPublic?.includes(route) &&
+        new RegExp(route).test(fullPath)),
     false,
   );
 });

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

@@ -151,15 +151,29 @@ describe('Url', () => {
   describe('isCmsUi', () => {
     [...settings.nonContentRoutes, '/controlpanel/mypanel'].forEach((route) => {
       if (typeof route === 'string') {
-        it(`matches non-content-route ${route}`, () => {
-          expect(isCmsUi(`/mycontent/${route}`)).toBe(true);
-        });
+        if (settings.nonContentRoutesPublic.includes(route)) {
+          it(`matches non-content-route-public ${route}`, () => {
+            expect(isCmsUi(route)).toBe(false);
+          });
+        } else {
+          it(`matches non-content-route ${route}`, () => {
+            expect(isCmsUi(`/mycontent/${route}`)).toBe(true);
+          });
+        }
       }
     });
 
     it('returns false on non-cms-ui views', () => {
       expect(isCmsUi('/mycontent')).toBe(false);
     });
+
+    it('returns true on non content routes', () => {
+      expect(isCmsUi('/mycontent/historyview')).toBe(true);
+    });
+
+    it('returns false on public non content routes', () => {
+      expect(isCmsUi('/mycontent/login')).toBe(false);
+    });
   });
 
   describe('flattenHTMLToAppURL', () => {
@@ -255,11 +269,24 @@ describe('Url', () => {
     });
     it('isUrl test 4', () => {
       const href = `https://www`;
-      expect(isUrl(href)).toBe(false);
+      expect(isUrl(href)).toBe(true);
     });
     it('isUrl test 5', () => {
+      const href = `https://www/foo/bar`;
+      expect(isUrl(href)).toBe(true);
+    });
+    it('isUrl test 6', () => {
+      // at the end of the day, this is a strange, but valid, URL
       const href = `www.e`;
-      expect(isUrl(href)).toBe(false);
+      expect(isUrl(href)).toBe(true);
+    });
+    it('isUrl test 7', () => {
+      const href = `file://server/folder/file.txt`;
+      expect(isUrl(href)).toBe(true);
+    });
+    it('isUrl test 8', () => {
+      const href = `file://server.dir.internal/folder/file.txt`;
+      expect(isUrl(href)).toBe(true);
     });
   });
   describe('getFieldURL', () => {

package/src/helpers/Url/urlRegex.js

@@ -52,7 +52,7 @@ export const urlRegex = (_opts) => {
   })\\.?`;
   const port = '(?::\\d{2,5})?';
   const path = '(?:[/?#][^\\s"]*)?';
-  const regex = `(?:${protocol}|www\\.)${auth}(?:localhost|${ip}|${host}${domain}${tld})${port}${path}`;
+  const regex = `(?:${protocol}|www\\.)${auth}(?:localhost|${ip}|${host}${domain}${tld}|${host})${port}${path}`;
 
   return opts.exact
     ? new RegExp(`(?:^${regex}$)`, 'i')

package/src/helpers/index.js

@@ -40,6 +40,7 @@ export {
   getLanguageIndependentFields,
 } from '@plone/volto/helpers/Content/Content';
 export {
+  applyBlockInitialValue,
   addBlock,
   insertBlock,
   blockHasValue,
@@ -85,6 +86,7 @@ export { default as Helmet } from './Helmet/Helmet';
 export { default as FormValidation } from './FormValidation/FormValidation';
 export { validateFileUploadSize } from './FormValidation/FormValidation';
 export { tryParseJSON } from './FormValidation/FormValidation';
+export { extractInvariantErrors } from './FormValidation/FormValidation';
 export {
   difference,
   getColor,

package/src/hooks/index.js

@@ -1,2 +1,3 @@
 export { default as useClipboard } from '@plone/volto/hooks/clipboard/useClipboard';
 export { useClient } from '@plone/volto/hooks/client/useClient';
+export { default as useUser } from '@plone/volto/hooks/user/useUser';

package/src/hooks/user/useUser.js

@@ -0,0 +1,23 @@
+import { useEffect } from 'react';
+import { useDispatch, useSelector } from 'react-redux';
+import jwtDecode from 'jwt-decode';
+import { getUser } from '@plone/volto/actions';
+
+const useUser = () => {
+  const users = useSelector((state) => state.users);
+  const user = users?.user;
+  const userId = useSelector((state) =>
+    state.userSession.token ? jwtDecode(state.userSession.token).sub : '',
+  );
+  const dispatch = useDispatch();
+
+  useEffect(() => {
+    if (!user?.id && users?.get.loading === false) {
+      dispatch(getUser(userId));
+    }
+  }, [dispatch, userId, user, users?.get.loading]);
+
+  return user;
+};
+
+export default useUser;

package/src/middleware/api.js

@@ -222,7 +222,8 @@ const apiMiddlewareFactory =
           }
 
           const { settings } = config;
-          if (getState().apierror.connectionRefused) {
+          const state = getState();
+          if (state.apierror.connectionRefused) {
             next({
               ...rest,
               type: RESET_APIERROR,
@@ -232,7 +233,7 @@ const apiMiddlewareFactory =
             const lang = result?.language?.token;
             if (
               lang &&
-              getState().intl.locale !== toReactIntlLang(lang) &&
+              state.intl.locale !== toReactIntlLang(lang) &&
               !subrequest &&
               config.settings.supportedLanguages.includes(lang)
             ) {
@@ -244,6 +245,7 @@ const apiMiddlewareFactory =
               });
             }
           }
+
           if (type === LOGIN && settings.websockets) {
             const cookies = new Cookies();
             cookies.set(

package/src/middleware/index.js

@@ -11,3 +11,4 @@ export {
   protectLoadEnd,
   loadProtector,
 } from '@plone/volto/middleware/storeProtectLoadUtils';
+export { default as userSessionReset } from './userSessionReset';

package/src/middleware/userSessionReset.js

@@ -0,0 +1,46 @@
+import Cookies from 'universal-cookie';
+
+const LOCATION_CHANGE = '@@router/LOCATION_CHANGE';
+
+const userSessionReset =
+  ({ dispatch, getState }) =>
+  (next) =>
+  (action) => {
+    if (typeof action === 'function') {
+      return next(action);
+    }
+
+    switch (action.type) {
+      case LOCATION_CHANGE:
+        if (action.request?.subrequest || __SERVER__) {
+          return next(action);
+        }
+
+        const cookies = new Cookies();
+        const token = cookies.get('auth_token');
+        const state = getState();
+
+        if (token && !state.userSession?.token) {
+          const loginAction = {
+            type: 'LOGIN_SUCCESS',
+            result: {
+              token,
+            },
+          };
+          dispatch(loginAction);
+        } else if (!token && state.userSession?.token) {
+          const logoutAction = {
+            type: 'LOGOUT_SUCCESS',
+            result: {
+              token,
+            },
+          };
+          dispatch(logoutAction);
+        }
+        return next(action);
+      default:
+        return next(action);
+    }
+  };
+
+export default userSessionReset;

package/src/store.js

@@ -13,6 +13,7 @@ import {
   protectLoadStart,
   protectLoadEnd,
   loadProtector,
+  userSessionReset,
 } from '@plone/volto/middleware';
 
 const configureStore = (initialState, history, apiHelper) => {
@@ -22,6 +23,7 @@ const configureStore = (initialState, history, apiHelper) => {
     routerMiddleware(history),
     thunk,
     ...(apiHelper ? [api(apiHelper)] : []),
+    userSessionReset,
     protectLoadEnd,
     ...(__CLIENT__
       ? [save({ states: config.settings.persistentReducers, debounce: 500 })]

package/test-setup-config.jsx

@@ -10,6 +10,7 @@ import React from 'react';
 import config from '@plone/volto/registry';
 import { loadables } from '@plone/volto/config/Loadables';
 import { nonContentRoutes } from '@plone/volto/config/NonContentRoutes';
+import { nonContentRoutesPublic } from '@plone/volto/config/NonContentRoutesPublic';
 import { contentIcons } from '@plone/volto/config/ContentIcons';
 import {
   styleClassNameConverters,
@@ -20,6 +21,7 @@ import {
   controlPanelsIcons,
   filterControlPanels,
   filterControlPanelsSchema,
+  unwantedControlPanelsFields,
 } from '@plone/volto/config/ControlPanels';
 
 import ListingBlockSchema from '@plone/volto/components/manage/Blocks/Listing/schema';
@@ -31,8 +33,10 @@ config.set('settings', {
   defaultLanguage: 'en',
   supportedLanguages: ['en'],
   defaultPageSize: 25,
+  showTags: true,
   isMultilingual: false,
   nonContentRoutes,
+  nonContentRoutesPublic,
   contentIcons: contentIcons,
   loadables,
   lazyBundles: {
@@ -49,6 +53,7 @@ config.set('settings', {
   controlPanelsIcons,
   filterControlPanels,
   filterControlPanelsSchema,
+  unwantedControlPanelsFields,
   apiExpanders: [],
   downloadableObjects: ['File'],
   viewableInBrowserObjects: [],

package/theme/themes/pastanaga/collections/form.overrides

@@ -50,6 +50,7 @@
 
   &:focus {
     border-radius: 0;
+    color: @textColor;
   }
 }
 

package/theme/themes/pastanaga/collections/table.overrides

@@ -6,7 +6,7 @@
 }
 
 /* Headers */
-.ui.table th {
+.ui.table thead th {
   padding: @headerVerticalPadding @headerHorizontalPadding;
   border-left: @headerDivider;
   background: @headerBackground;
@@ -34,3 +34,8 @@
 .ui.table tr:first-child > th:only-child {
   border-radius: @borderRadius @borderRadius 0em 0em;
 }
+
+/* inline link color*/
+.ui.table.inverted a {
+  color: @lightPrimaryColor;
+}

package/theme/themes/pastanaga/extras/blocks.less

@@ -1120,6 +1120,12 @@ div.image-upload-widget-image {
     flex-direction: row;
     align-items: center;
     margin-right: 0.5em;
+
+    .sorted-label-value {
+      margin-right: 0.5em;
+      margin-left: 0.7em;
+      color: @lightGrey;
+    }
   }
 
   .sort-label {

package/theme/themes/pastanaga/extras/main.less

@@ -367,9 +367,10 @@ button {
     p {
       font-weight: 300;
     }
-  }
 
-  .toast-dismiss-action {
+    ul {
+      padding: 0;
+    }
   }
 
   .Toastify__toast--info {

package/theme/themes/pastanaga/extras/toolbar.less

@@ -283,16 +283,28 @@ body:not(.has-sidebar):not(.has-sidebar-collapsed) {
 
   .toolbar-content,
   .toolbar {
-    button {
+    button,
+    a {
       // Default reset for button
       padding: 0;
       border: 0;
       background: transparent;
+      box-shadow: unset !important; // Some buttons have double outlines due to default styles. Safely disable those styles here.
       cursor: pointer;
       text-align: initial;
 
+      svg {
+        display: block; // SVGs are inline by default, causing the spacing to be odd
+        margin: 0; // Some SVGs have margin set by default styles.
+      }
+
       &:focus-visible {
-        outline: 1px auto;
+        outline: 2px solid black;
+        outline-offset: 2px;
+
+        &:has(.circled) {
+          border-radius: 50%;
+        }
       }
     }
   }

package/theme/themes/pastanaga/extras/widgets.less

@@ -280,3 +280,15 @@ body.babel-view .field.language-independent-field {
     }
   }
 }
+
+// ### FormFieldWrapper ###
+.language-independent-field .wrapper > label {
+  display: flex !important;
+  align-items: center;
+  justify-content: space-between;
+
+  .languageIndependent-icon {
+    display: flex;
+    margin-left: 8px;
+  }
+}

package/theme/themes/pastanaga/modules/accordion.variables

@@ -34,14 +34,14 @@
 
 /* Styled Title */
 @styledTitleFontWeight: @normal;
-@styledTitleColor: @teal;
+@styledTitleColor: @textColor;
 @styledTitleBorder: none;
 
 /* Styled Title States */
 @styledTitleHoverBackground: @darkWhite;
-@styledTitleHoverColor: @teal;
+@styledTitleHoverColor: @textColor;
 @styledActiveTitleBackground: @darkWhite;
-@styledActiveTitleColor: @teal;
+@styledActiveTitleColor: @textColor;
 
 /* Styled Child Title States */
 

package/types/components/manage/Actions/Actions.stories.d.ts

@@ -0,0 +1,8 @@
+export const Actions: any;
+declare namespace _default {
+    export let title: string;
+    export { Actions as component };
+    export let decorators: ((Story: any) => import("react/jsx-runtime").JSX.Element)[];
+    export let argTypes: {};
+}
+export default _default;

package/types/components/manage/Blocks/LeadImage/Edit.d.ts

@@ -1,5 +1,14 @@
-declare const _default: React.FC<import("react-intl").WithIntlProps<any>> & {
-    WrappedComponent: React.ComponentType<any>;
-};
-export default _default;
-import React from 'react';
+export default Edit;
+declare function Edit(props: any): import("react/jsx-runtime").JSX.Element;
+declare namespace Edit {
+    namespace propTypes {
+        let properties: any;
+        let selected: any;
+        let block: any;
+        let index: any;
+        let data: any;
+        let pathname: any;
+        let onChangeBlock: any;
+        let openObjectBrowser: any;
+    }
+}

package/types/components/manage/Blocks/Search/widgets/SelectMetadataField.d.ts

@@ -1,10 +1,5 @@
 declare const _default: {
     (props: any): import("react/jsx-runtime").JSX.Element;
-    /**
-     * Property types.
-     * @property {Object} propTypes Property types.
-     * @static
-     */
     displayName: string;
 };
 export default _default;

package/types/components/manage/Blocks/ToC/Edit.d.ts

@@ -1,7 +1,2 @@
 export default Edit;
-declare class Edit extends React.Component<any, any, any> {
-    constructor(props: any);
-    constructor(props: any, context: any);
-    render(): import("react/jsx-runtime").JSX.Element;
-}
-import React from 'react';
+declare function Edit(props: any): import("react/jsx-runtime").JSX.Element;

package/types/components/manage/Blocks/Video/Edit.d.ts

@@ -1,2 +1,2 @@
-declare const _default: any;
+declare const _default: (props: any) => import("react/jsx-runtime").JSX.Element;
 export default _default;

package/types/components/manage/Blocks/Video/Edit.stories.d.ts

@@ -0,0 +1,8 @@
+export const Video: any;
+declare namespace _default {
+    export let title: string;
+    export { Video as component };
+    export let decorators: ((Story: any) => import("react/jsx-runtime").JSX.Element)[];
+    export let argTypes: {};
+}
+export default _default;

package/types/components/manage/Contents/ContentsBreadcrumbs.stories.d.ts

@@ -0,0 +1,8 @@
+export const ContentBreadcrumbs: any;
+declare namespace _default {
+    export let title: string;
+    export { ContentBreadcrumbs as component };
+    export let decorators: ((Story: any) => import("react/jsx-runtime").JSX.Element)[];
+    export let argTypes: {};
+}
+export default _default;

package/types/components/manage/Contents/ContentsUploadModal.d.ts

@@ -1,2 +1,14 @@
-declare const _default: any;
-export default _default;
+export default ContentsUploadModal;
+declare function ContentsUploadModal(props: any): import("react/jsx-runtime").JSX.Element;
+declare namespace ContentsUploadModal {
+    namespace propTypes {
+        let pathname: any;
+        let open: any;
+        let onOk: any;
+        let onCancel: any;
+        let multiple: any;
+        let minSize: any;
+        let maxSize: any;
+        let accept: any;
+    }
+}

package/types/components/manage/Contents/ContentsUploadModal.stories.d.ts

@@ -0,0 +1,8 @@
+export const ContentUploadModal: any;
+declare namespace _default {
+    export let title: string;
+    export { ContentUploadModal as component };
+    export let decorators: ((Story: any) => import("react/jsx-runtime").JSX.Element)[];
+    export let argTypes: {};
+}
+export default _default;

package/types/components/manage/Contents/index.d.ts

@@ -3,7 +3,7 @@ export declare const ContentsRenameModal: import("@loadable/component").Loadable
 export declare const ContentsBreadcrumbs: import("@loadable/component").LoadableComponent<any>;
 export declare const ContentsIndexHeader: import("@loadable/component").LoadableClassComponent<any>;
 export declare const ContentsItem: import("@loadable/component").LoadableClassComponent<any>;
-export declare const ContentsUploadModal: import("@loadable/component").LoadableClassComponent<any>;
+export declare const ContentsUploadModal: import("@loadable/component").LoadableComponent<any>;
 export declare const ContentsPropertiesModal: import("@loadable/component").LoadableComponent<any>;
 export declare const ContentsWorkflowModal: import("@loadable/component").LoadableComponent<any>;
 export declare const ContentsTagsModal: import("@loadable/component").LoadableComponent<any>;

package/types/components/manage/Controlpanels/AddonsControlpanel.d.ts

@@ -1,2 +1,2 @@
-declare const _default: any;
-export default _default;
+export default AddonsControlpanel;
+declare function AddonsControlpanel(props: any): import("react/jsx-runtime").JSX.Element;