@plone/volto 17.0.0-alpha.1 → 17.0.0-alpha.10

package/src/reducers/relations/relations.js

@@ -0,0 +1,173 @@
+/**
+ * Relations reducer.
+ * @module reducers/relations/relations
+ */
+
+import {
+  CREATE_RELATIONS,
+  DELETE_RELATIONS,
+  LIST_RELATIONS,
+  REBUILD_RELATIONS,
+} from '@plone/volto/constants/ActionTypes';
+
+const initialState = {
+  relations: null,
+  stats: null,
+  create: {
+    error: null,
+    loaded: false,
+    loading: false,
+  },
+  delete: {
+    error: null,
+    loaded: false,
+    loading: false,
+  },
+  list: {
+    error: null,
+    loaded: false,
+    loading: false,
+  },
+  rebuild: {
+    error: null,
+    loaded: false,
+    loading: false,
+  },
+  subrequests: {},
+};
+
+/**
+ * Get request key
+ * @function getRequestKey
+ * @param {string} actionType Action type.
+ * @returns {string} Request key.
+ */
+function getRequestKey(actionType) {
+  return actionType.split('_')[0].toLowerCase();
+}
+
+/**
+ * Relations reducer.
+ * @function relations
+ * @param {Object} state Current state.
+ * @param {Object} action Action to be handled.
+ * @returns {Object} New state.
+ */
+export default function relations(state = initialState, action = {}) {
+  switch (action.type) {
+    case `${CREATE_RELATIONS}_PENDING`:
+    case `${DELETE_RELATIONS}_PENDING`:
+    case `${REBUILD_RELATIONS}_PENDING`:
+      return {
+        ...state,
+        [getRequestKey(action.type)]: {
+          loading: true,
+          loaded: false,
+          error: null,
+        },
+      };
+    case `${LIST_RELATIONS}_PENDING`:
+      return action.subrequest
+        ? {
+            ...state,
+            subrequests: {
+              ...state.subrequests,
+              [action.subrequest]: {
+                ...(state.subrequests[action.subrequest] || {
+                  relations: null,
+                  stats: null,
+                }),
+                loaded: false,
+                loading: true,
+                error: null,
+              },
+            },
+          }
+        : {
+            ...state,
+            [getRequestKey(action.type)]: {
+              loading: true,
+              loaded: false,
+              error: null,
+            },
+          };
+    case `${LIST_RELATIONS}_SUCCESS`:
+      return action.subrequest
+        ? {
+            ...state,
+            subrequests: {
+              ...state.subrequests,
+              [action.subrequest]: {
+                loading: false,
+                loaded: true,
+                error: null,
+                relations: action.result.relations
+                  ? action.result.relations
+                  : state.relations,
+                stats: null,
+              },
+            },
+          }
+        : {
+            ...state,
+            relations: action.result.relations
+              ? action.result.relations
+              : state.relations,
+            stats: action.result.stats ? action.result : state.stats,
+            [getRequestKey(action.type)]: {
+              loading: false,
+              loaded: true,
+              error: null,
+            },
+          };
+    case `${CREATE_RELATIONS}_SUCCESS`:
+    case `${DELETE_RELATIONS}_SUCCESS`:
+    case `${REBUILD_RELATIONS}_SUCCESS`:
+      return {
+        ...state,
+        [getRequestKey(action.type)]: {
+          loading: false,
+          loaded: true,
+          error: null,
+        },
+      };
+    case `${LIST_RELATIONS}_FAIL`:
+      return action.subrequest
+        ? {
+            ...state,
+            subrequests: {
+              ...state.subrequests,
+              [action.subrequest]: {
+                relations: null,
+                stats: null,
+                loading: false,
+                loaded: false,
+                error: action.error,
+              },
+            },
+          }
+        : {
+            ...state,
+            relations: null,
+            stats: null,
+            [getRequestKey(action.type)]: {
+              loading: false,
+              loaded: false,
+              error: action.error,
+            },
+          };
+    case `${CREATE_RELATIONS}_FAIL`:
+    case `${DELETE_RELATIONS}_FAIL`:
+    case `${REBUILD_RELATIONS}_FAIL`:
+      return {
+        ...state,
+        [getRequestKey(action.type)]: {
+          loading: false,
+          loaded: false,
+          error: action.error,
+        },
+      };
+    default:
+      return state;
+  }
+}

package/src/reducers/types/types.js

@@ -39,7 +39,7 @@ export default function types(state = initialState, action = {}) {
         'types',
         getBaseUrl(flattenToAppURL(action.result['@id'])),
       );
-      if (hasExpander) {
+      if (hasExpander && !action.subrequest) {
         return {
           ...state,
           error: null,

package/src/routes.js

@@ -29,6 +29,7 @@ import {
   ModerateComments,
   NotFound,
   PasswordReset,
+  Relations,
   Register,
   Rules,
   RequestPasswordReset,
@@ -224,6 +225,10 @@ export const defaultRoutes = [
     path: '/controlpanel/rules',
     component: RulesControlpanel,
   },
+  {
+    path: '/controlpanel/relations',
+    component: Relations,
+  },
   {
     path: '/controlpanel/:id',
     component: Controlpanel,

package/src/server.jsx

@@ -26,8 +26,9 @@ import {
   Html,
   Api,
   persistAuthToken,
-  normalizeLanguageName,
-  toLangUnderscoreRegion,
+  toBackendLang,
+  toGettextLang,
+  toReactIntlLang,
 } from '@plone/volto/helpers';
 import { changeLanguage } from '@plone/volto/actions';
 
@@ -44,9 +45,9 @@ let locales = {};
 
 if (config.settings) {
   config.settings.supportedLanguages.forEach((lang) => {
-    const langFileName = normalizeLanguageName(lang);
+    const langFileName = toGettextLang(lang);
     import('@root/../locales/' + langFileName + '.json').then((locale) => {
-      locales = { ...locales, [lang]: locale.default };
+      locales = { ...locales, [toReactIntlLang(lang)]: locale.default };
     });
   });
 }
@@ -101,13 +102,15 @@ server.use(function (err, req, res, next) {
 function setupServer(req, res, next) {
   const api = new Api(req);
 
-  const lang = new locale.Locales(
-    req.universalCookies.get('I18N_LANGUAGE') ||
-      config.settings.defaultLanguage ||
-      req.headers['accept-language'],
-  )
-    .best(supported)
-    .toString();
+  const lang = toReactIntlLang(
+    new locale.Locales(
+      req.universalCookies.get('I18N_LANGUAGE') ||
+        config.settings.defaultLanguage ||
+        req.headers['accept-language'],
+    )
+      .best(supported)
+      .toString(),
+  );
 
   // Minimum initial state for the fake Redux store instance
   const initialState = {
@@ -176,13 +179,15 @@ server.get('/*', (req, res) => {
 
   const browserdetect = detect(req.headers['user-agent']);
 
-  const lang = new locale.Locales(
-    req.universalCookies.get('I18N_LANGUAGE') ||
-      config.settings.defaultLanguage ||
-      req.headers['accept-language'],
-  )
-    .best(supported)
-    .toString();
+  const lang = toReactIntlLang(
+    new locale.Locales(
+      req.universalCookies.get('I18N_LANGUAGE') ||
+        config.settings.defaultLanguage ||
+        req.headers['accept-language'],
+    )
+      .best(supported)
+      .toString(),
+  );
 
   const authToken = req.universalCookies.get('auth_token');
   const initialState = {
@@ -217,7 +222,7 @@ server.get('/*', (req, res) => {
 
   loadOnServer({ store, location, routes, api })
     .then(() => {
-      const cookie_lang =
+      const initialLang =
         req.universalCookies.get('I18N_LANGUAGE') ||
         config.settings.defaultLanguage ||
         req.headers['accept-language'];
@@ -230,15 +235,15 @@ server.get('/*', (req, res) => {
       // 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
-        ? cookie_lang
+        ? initialLang
         : store.getState().content.data?.language?.token ||
           config.settings.defaultLanguage;
 
-      if (cookie_lang !== contentLang) {
-        const newLocale = toLangUnderscoreRegion(
+      if (toBackendLang(initialLang) !== contentLang) {
+        const newLang = toReactIntlLang(
           new locale.Locales(contentLang).best(supported).toString(),
         );
-        store.dispatch(changeLanguage(newLocale, locales[newLocale], req));
+        store.dispatch(changeLanguage(newLang, locales[newLang], req));
       }
 
       const context = {};

package/test-setup-config.js

@@ -82,6 +82,7 @@ config.set('settings', {
   viewableInBrowserObjects: [],
   styleClassNameConverters,
   styleClassNameExtenders,
+  blockSettingsTabFieldsetsInitialStateOpen: true,
 });
 config.set('blocks', {
   blocksConfig: {

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

@@ -38,6 +38,7 @@
   .ui.menu.top-menu {
     padding: 10px 0;
     border-bottom: 4px solid #c7d5d8;
+    overflow-x: scroll;
   }
 
   .ui.menu .menu.top-menu-menu {

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

@@ -8,7 +8,6 @@
 @import (multiple) '../../theme.config';
 
 // Extras (third party libs)
-@import (less) '~hamburgers/dist/hamburgers.css';
 @import (less) '~react-toastify/dist/ReactToastify.css';
 
 // Mixins
@@ -494,6 +493,86 @@ fieldset.invisible {
 .hamburger-wrapper {
   position: relative;
   z-index: 5;
+  width: 70px;
+  height: 59px;
+  padding: 15px 15px;
+
+  .hamburger {
+    position: relative;
+    width: 40px;
+    height: 24px;
+    padding: 0;
+    border: none;
+    background-color: transparent;
+    cursor: pointer;
+    transition: 0.3s ease-in-out;
+  }
+
+  .hamburger::after {
+    position: absolute;
+    top: 0;
+    left: 0;
+    display: inline-block;
+    width: 100%;
+    height: 4px;
+    background-color: #000;
+    border-radius: 4px;
+    content: '';
+    transition: 0.3s ease-in-out;
+  }
+
+  .hamburger::before {
+    position: absolute;
+    top: 20px;
+    left: 0;
+    display: inline-block;
+    width: 100%;
+    height: 4px;
+    background-color: #000;
+    border-radius: 4px;
+    content: '';
+    transition: 0.3s ease-in-out;
+  }
+
+  .hamburger-inner {
+    position: absolute;
+    top: 10px;
+    left: 0;
+    display: inline-block;
+    width: 100%;
+    height: 4px;
+    border-radius: 4px;
+    transition: 0.3s ease-in-out;
+  }
+
+  .hamburger.is-active::after,
+  .hamburger.is-active::before {
+    top: 10px;
+    left: 50%;
+    width: 0%;
+  }
+
+  .hamburger-inner::after,
+  .hamburger-inner::before {
+    position: absolute;
+    top: 0;
+    left: 0;
+    display: block;
+    width: 100%;
+    height: 4px;
+    background-color: #000;
+    border-radius: 4px;
+    content: '';
+    transition: 0.3s ease-in-out;
+  }
+
+  .hamburger.is-active .hamburger-inner::after {
+    transform: rotate(45deg);
+  }
+
+  .hamburger.is-active .hamburger-inner::before {
+    transform: rotate(-45deg);
+  }
 }
 
 .mobile-menu {

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

@@ -75,3 +75,9 @@
     text-align: center;
   }
 }
+
+.block.search {
+  .advanced-facet-hidden {
+    display: none !important;
+  }
+}

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

@@ -489,3 +489,7 @@
     margin-left: 5px;
   }
 }
+
+.formtabs {
+  flex-wrap: wrap;
+}

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

@@ -27,45 +27,48 @@
 }
 
 .controlpanel_matrix {
-  display: grid;
-  grid-gap: 2rem;
-  grid-template-columns: 5fr 5fr 2fr;
+  .ui.action.input button.ui.icon.button {
+    background-color: transparent;
+  }
 
   .controlpanel_select_relation {
-    grid-column: 1;
-    grid-row: 1;
+    margin-bottom: 2rem;
   }
 
-  .controlpanel_search_y {
-    grid-column: 1;
-    grid-row: 1;
+  .controlpanel_search_wrapper {
+    display: flex;
+    flex-wrap: wrap;
+    row-gap: 3rem;
+    column-gap: 5rem;
+    justify-content: flex-start;
+    margin-bottom: 2rem;
+    & > * {
+      min-width: 30rem;
+    }
   }
 
-  .controlpanel_search_x {
-    grid-column: 2;
-    grid-row: 1;
+  .add_potential_sources .field,
+  .add_potential_targets .field,
+  .controlpanel_search_x .field,
+  .controlpanel_search_y .field {
+    display: flex;
   }
 
-  .controlpanel_filter {
+  .controlpanel_listing_wrapper {
     display: flex;
-    flex-direction: column;
-    grid-column: 3;
-    grid-row: 2;
-
-    .ui.checkbox {
-      margin-top: 0.5rem;
+    gap: 1rem;
+    justify-content: flex-end;
+    flex-wrap: wrap;
+    flex-direction: row-reverse;
+    margin-bottom: 2rem;
+    .administration_matrix {
+      flex-grow: 2;
+      min-width: 30rem;
+    }
+    .controlpanel_filter {
+      display: flex;
+      flex-direction: column;
     }
-  }
-
-  .administration_matrix {
-    display: grid;
-    height: 60rem;
-    padding-right: 0;
-    grid-column-end: 3;
-    grid-column-start: 1;
-    grid-row: 2;
-    grid-template-rows: 14rem 1fr;
-    overflow-x: scroll;
   }
 }
 
@@ -75,71 +78,91 @@
   }
 
   .label-options {
+    // display: flex;
+    // justify-content: start;
     position: sticky;
-    z-index: 1000;
     top: 0;
-    left: 0;
-    display: flex;
-    height: 14rem;
-    align-items: baseline;
-    justify-content: flex-end;
-    padding-right: 2rem;
+    z-index: 100;
     .stickyLabelLayerBackground();
 
-    .label-options-label {
+    .target-labels {
+      z-index: 2;
+      top: 0;
+      left: 0;
       display: flex;
-      align-items: flex-end;
+      height: 14rem;
+      align-items: baseline;
+      // justify-content: flex-end;
+      // padding-right: 5rem;
+      @media only screen and (max-width: (@largestMobileScreen)) {
+        flex-direction: column;
+      }
+      & > div:first-child {
+        min-width: 15rem;
+      }
+      & > div:nth-child(2) {
+        flex-grow: 2;
+        display: flex;
+      }
 
-      &.inclined {
-        width: 3.5rem;
-        height: 13rem;
-        white-space: nowrap;
+      .label-options-label {
+        display: flex;
+        align-items: flex-end;
+
+        &.inclined {
+          width: 3.5rem;
+          height: 13rem;
+          white-space: nowrap;
 
-        div {
-          transform: rotate(315deg);
-          transform-origin: top left;
+          div {
+            transform: rotate(315deg);
+            transform-origin: top left;
+          }
         }
       }
     }
   }
 
-  .items {
-    padding-top: 0.5rem;
-
-    .listing-row {
-      padding-right: 2rem;
-
-      &:nth-child(2n) {
-        background-color: rgba(0, 0, 50, 0.05);
+  .listing-row {
+    &:nth-child(2n) {
+      background-color: rgba(0, 0, 50, 0.05);
+    }
+    .listing-item {
+      display: flex;
+      width: 100%;
+      align-items: baseline;
+      justify-content: space-between;
+      padding: 0.5rem 0.1rem;
+      margin: 0.2rem 0;
+
+      & > div:first-child {
+        min-width: 15rem;
       }
+      .matrix_options {
+        flex-grow: 2;
+        display: flex;
+        flex-direction: row;
 
-      &.selectall {
-        margin-bottom: 1rem;
-      }
+        & > div {
+          width: 3rem;
+          padding: 0.3rem 0.1rem;
+          margin-left: 0.5rem;
 
-      .listing-item {
-        display: flex;
-        width: 100%;
-        align-items: baseline;
-        justify-content: space-between;
-        padding: 0.5rem 0.1rem;
-        margin: 0.2rem 0;
-
-        .matrix_options {
-          display: flex;
-          flex-direction: row;
-
-          & > div {
-            width: 3rem;
-            padding: 0.3rem 0.1rem;
-            margin-left: 0.5rem;
-
-            .ui.checkbox {
-              margin: auto;
-            }
+          .ui.checkbox {
+            margin: auto;
           }
         }
+        .ui.checkbox.toggle-target label:before {
+          border: 3px solid #826a6a;
+        }
       }
     }
   }
+
+  // Rows
+  .items {
+    .not-published {
+      opacity: 0.6;
+    }
+  }
 }

package/.changelog.draft

@@ -1,28 +0,0 @@
-## 17.0.0-alpha.1 (2023-03-09)
-
-### Feature
-
-- - Add directive to cache stable resources in browser or intermediate server for 365 days by default directly in the SSR Express server, static resource that could change after a new deployment for 1 minute. @mamico [#2216](https://github.com/plone/volto/issues/2216)
-- Use popperjs in BlockChooser, move the markup to the bottom of the body tag. @sneridagh [#4141](https://github.com/plone/volto/issues/4141)
-- Improvements to the dev API proxy:
-  - Prefer RAZZLE_INTERNAL_API_PATH over RAZZLE_API_PATH as the target of the proxy.
-    The target of the API proxy is now always logged on startup, even in production mode.
-  - Support proxying to a backend served over https. For this configuration it
-    might be necessary to set RAZZLE_DEV_PROXY_INSECURE=1 if the backend
-    certificate can't be verified.
-
-  [davisagli] [#4434](https://github.com/plone/volto/issues/4434)
-
-### Bugfix
-
-- fix: newsitem and event views wrapper classNames @nzambello [#4443](https://github.com/plone/volto/issues/4443)
-- Fix weird GHA failure on config option not supported @sneridagh [#4466](https://github.com/plone/volto/issues/4466)
-- Fix history view dropdown for first entry, showing 'Revert to this version option' always @sneridagh [#4471](https://github.com/plone/volto/issues/4471)
-- Fix order of row of long table in edit and view mode @iFlameing [#4473](https://github.com/plone/volto/issues/4473)
-- Improve flaky test in autofocus Cypress tests @sneridagh [#4475](https://github.com/plone/volto/issues/4475)
-
-### Documentation
-
-- Complete teaser docs, add new section in `Blocks`: `Core Blocks developers notes` @sneridagh [#4461](https://github.com/plone/volto/issues/4461)
-- Change from links to inline literals in `CHANGELOG.md` to fix linkcheckbroken. @stevepiercy [#4470](https://github.com/plone/volto/issues/4470)
-