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

package/src/components/theme/MultilingualRedirector/MultilingualRedirector.jsx

@@ -10,6 +10,10 @@ const MultilingualRedirector = (props) => {
   const [cookies] = useCookies();
   const site = useSelector((state) => state.site.data);
   const isMultilingual = site.features?.multilingual;
+  const availableLanguages = useSelector(
+    (state) => state.site?.data?.['plone.available_languages'],
+  );
+  const currentLanguage = useSelector((state) => state.intl.locale);
   const redirectToLanguage =
     cookies['I18N_LANGUAGE'] || site['plone.default_language'];
   const dispatch = useDispatch();
@@ -18,21 +22,47 @@ const MultilingualRedirector = (props) => {
     // ToDo: Add means to support language negotiation (with config)
     // const detectedLang = (navigator.language || navigator.userLanguage).substring(0, 2);
     let mounted = true;
-    if (isMultilingual && pathname === '/') {
-      const langFileName = toGettextLang(redirectToLanguage);
-      import(
-        /* @vite-ignore */ '@root/../locales/' + langFileName + '.json'
-      ).then((locale) => {
-        if (mounted) {
-          dispatch(changeLanguage(redirectToLanguage, locale.default));
+
+    const performLanguageSwitch = (targetLang) => {
+      const langFileName = toGettextLang(targetLang);
+      import(/* @vite-ignore */ '@root/../locales/' + langFileName + '.json')
+        .then((locale) => {
+          if (mounted) {
+            dispatch(changeLanguage(targetLang, locale.default));
+          }
+        })
+        .catch(() => {
+          // If locale file doesn't exist, still switch language with empty locale
+          if (mounted) {
+            dispatch(changeLanguage(targetLang, {}));
+          }
+        });
+    };
+
+    if (isMultilingual) {
+      if (pathname === '/') {
+        performLanguageSwitch(redirectToLanguage);
+      } else {
+        const lang = pathname.split('/')[1];
+        if (
+          availableLanguages?.includes(lang) &&
+          lang !== toBackendLang(currentLanguage)
+        ) {
+          performLanguageSwitch(lang);
         }
-      });
+      }
     }
     return () => {
       mounted = false;
     };
-  }, [pathname, dispatch, redirectToLanguage, isMultilingual]);
-
+  }, [
+    pathname,
+    dispatch,
+    redirectToLanguage,
+    isMultilingual,
+    availableLanguages,
+    currentLanguage,
+  ]);
   return pathname === '/' && isMultilingual ? (
     <Redirect to={`/${toBackendLang(redirectToLanguage)}`} />
   ) : (

package/src/helpers/Blocks/Blocks.js

@@ -90,10 +90,9 @@ export const getBlocks = (properties) => {
   const blocksFieldName = getBlocksFieldname(properties);
   const blocksLayoutFieldname = getBlocksLayoutFieldname(properties);
   return (
-    properties[blocksLayoutFieldname]?.items?.map((n) => [
-      n,
-      properties[blocksFieldName][n],
-    ]) || []
+    properties?.[blocksLayoutFieldname]?.items
+      ?.map((n) => [n, properties?.[blocksFieldName]?.[n]])
+      .filter(([, block]) => block !== undefined) || []
   );
 };
 
@@ -812,12 +811,12 @@ export function findBlocks(blocks = {}, types, result = []) {
 export const getBlocksHierarchy = (properties) => {
   const blocksFieldName = getBlocksFieldname(properties);
   const blocksLayoutFieldname = getBlocksLayoutFieldname(properties);
-  return properties[blocksLayoutFieldname]?.items?.map((n) => ({
+  return properties?.[blocksLayoutFieldname]?.items?.map((n) => ({
     id: n,
-    title: properties[blocksFieldName][n]?.['@type'],
-    data: properties[blocksFieldName][n],
-    children: isBlockContainer(properties[blocksFieldName][n])
-      ? getBlocksHierarchy(properties[blocksFieldName][n])
+    title: properties?.[blocksFieldName]?.[n]?.['@type'],
+    data: properties?.[blocksFieldName]?.[n],
+    children: isBlockContainer(properties?.[blocksFieldName]?.[n])
+      ? getBlocksHierarchy(properties?.[blocksFieldName]?.[n])
       : [],
   }));
 };

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

@@ -129,10 +129,6 @@ body:not(.has-sidebar):not(.has-sidebar-collapsed) {
     }
 
     .toolbar-handler {
-      .toolbar-handler-button {
-        opacity: 0.3;
-      }
-
       // State colors
       .published:before {
         background: @teal-blue;
@@ -259,6 +255,15 @@ body:not(.has-sidebar):not(.has-sidebar-collapsed) {
           height: 4px;
           background-color: red;
           content: '';
+          opacity: 0.65;
+        }
+
+        &:hover,
+        &:focus {
+          &::before {
+            opacity: 1;
+            transition: opacity 0.3s;
+          }
         }
       }
     }
@@ -714,7 +719,7 @@ body:not(.has-sidebar):not(.has-sidebar-collapsed) {
     }
 
     .compare-languages {
-      @media (max-width: @largestMobileScreen - 1) {
+      @media (max-width: calc(@largestMobileScreen - 1px)) {
         position: fixed;
         top: 101px;
         left: 0;