design-comuni-plone-theme 11.29.0 → 11.29.1

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 
 
+## [11.29.1](https://github.com/RedTurtle/design-comuni-plone-theme/compare/v11.29.0...v11.29.1) (2025-03-24)
+
+
+### Bug Fixes
+
+* document cards layout for ct persona ([#921](https://github.com/RedTurtle/design-comuni-plone-theme/issues/921)) ([63ae761](https://github.com/RedTurtle/design-comuni-plone-theme/commit/63ae7618d7202800538d650ee36a174ffe80a204))
+* focus of buttons + focus of inputs + contrast of buttons ([#915](https://github.com/RedTurtle/design-comuni-plone-theme/issues/915)) ([327b7d1](https://github.com/RedTurtle/design-comuni-plone-theme/commit/327b7d1907bfb0ec0f5c7d5e4c688fb4a5cb1dd6))
+* handle slash in search params in url regex ([#914](https://github.com/RedTurtle/design-comuni-plone-theme/issues/914)) ([6a8744d](https://github.com/RedTurtle/design-comuni-plone-theme/commit/6a8744d32f8250d25604789cae06528178822329))
+* link view redirects when user cannot edit, also redirects server side ([#919](https://github.com/RedTurtle/design-comuni-plone-theme/issues/919)) ([fee3622](https://github.com/RedTurtle/design-comuni-plone-theme/commit/fee362265f34069ad4ec4fbc8d096a12dc6294a3))
+* restored original end of assignment label ([#910](https://github.com/RedTurtle/design-comuni-plone-theme/issues/910)) ([472f264](https://github.com/RedTurtle/design-comuni-plone-theme/commit/472f2647d0043e85c820868dc3886966da43219a))
+* title link margin with no category + title style and bg gradient ([#917](https://github.com/RedTurtle/design-comuni-plone-theme/issues/917)) ([1f831c5](https://github.com/RedTurtle/design-comuni-plone-theme/commit/1f831c5cad258b631f13f681c550dc2101977905))
+
+
+### Documentation
+
+* updated publiccode and release log ([5be2bd3](https://github.com/RedTurtle/design-comuni-plone-theme/commit/5be2bd3e4931a943369e07c34aea96b4e7c0fcbc))
+
 ## [11.29.0](https://github.com/RedTurtle/design-comuni-plone-theme/compare/v11.28.0...v11.29.0) (2025-03-07)
 
 

package/RELEASE.md

@@ -41,6 +41,19 @@
 - ...
  -->
 
+## Versione 11.29.1 (24/03/2025)
+
+### Migliorie
+
+- Il CT Collegamento identifica meglio i permessi dell'utente e di conseguenza il reindirizzamento automatico è più preciso.
+
+### Fix
+
+- I bottoni presentano un contrasto corretto quando selezionati, e il bottone "scroll to top" può essere selezionato tramite navigazione da tastiera.
+- Nel titolo e nel testo del campo "Data di fine dell'incarico" è stato rimosso il riferimento al nome dell'incarico.
+- Risolto un problema con la validazione dei link inseriti nei campi url (ad es. URL del CT Collegamento).
+- Risolto un problema con il template del blocco Elenco, variazione Card con testo animato.
+
 ## Versione 11.29.0 (07/03/2025)
 
 ### Migliorie

package/locales/de/LC_MESSAGES/volto.po

@@ -1526,8 +1526,7 @@ msgid "data_conclusione"
 msgstr ""
 
 #: components/ItaliaTheme/View/IncaricoView/IncaricoView
-#: components/ItaliaTheme/View/PersonaView/PersonaRuolo
-# defaultMessage: Ha fatto parte dell'organizzazione comunale come {incarico} fino al
+# defaultMessage: Data di fine dell'incarico
 msgid "data_conclusione_incarico"
 msgstr ""
 

package/locales/en/LC_MESSAGES/volto.po

@@ -1511,8 +1511,7 @@ msgid "data_conclusione"
 msgstr "Assignment start date"
 
 #: components/ItaliaTheme/View/IncaricoView/IncaricoView
-#: components/ItaliaTheme/View/PersonaView/PersonaRuolo
-# defaultMessage: Ha fatto parte dell'organizzazione comunale come {incarico} fino al
+# defaultMessage: Data di fine dell'incarico
 msgid "data_conclusione_incarico"
 msgstr "He was part of the municipal organization until"
 

package/locales/es/LC_MESSAGES/volto.po

@@ -1520,8 +1520,7 @@ msgid "data_conclusione"
 msgstr ""
 
 #: components/ItaliaTheme/View/IncaricoView/IncaricoView
-#: components/ItaliaTheme/View/PersonaView/PersonaRuolo
-# defaultMessage: Ha fatto parte dell'organizzazione comunale come {incarico} fino al
+# defaultMessage: Data di fine dell'incarico
 msgid "data_conclusione_incarico"
 msgstr "Formó parte de la organización municipal hasta"
 

package/locales/fr/LC_MESSAGES/volto.po

@@ -1528,8 +1528,7 @@ msgid "data_conclusione"
 msgstr ""
 
 #: components/ItaliaTheme/View/IncaricoView/IncaricoView
-#: components/ItaliaTheme/View/PersonaView/PersonaRuolo
-# defaultMessage: Ha fatto parte dell'organizzazione comunale come {incarico} fino al
+# defaultMessage: Data di fine dell'incarico
 msgid "data_conclusione_incarico"
 msgstr "Date de conclusion de la mission"
 

package/locales/it/LC_MESSAGES/volto.po

@@ -1511,15 +1511,14 @@ msgid "data_conclusione"
 msgstr "Data conclusione incarico"
 
 #: components/ItaliaTheme/View/IncaricoView/IncaricoView
-#: components/ItaliaTheme/View/PersonaView/PersonaRuolo
-# defaultMessage: Ha fatto parte dell'organizzazione comunale come {incarico} fino al
+# defaultMessage: Data di fine dell'incarico
 msgid "data_conclusione_incarico"
-msgstr "Ha fatto parte dell'organizzazione comunale come {incarico} fino al"
+msgstr "Data di fine dell'incarico"
 
 #: components/ItaliaTheme/View/PersonaView/PersonaRuolo
 # defaultMessage: Data di fine dell'incarico
 msgid "data_conclusione_incarico_label"
-msgstr "Data di conclusione dell'incarico"
+msgstr "Data di fine dell'incarico"
 
 #: components/ItaliaTheme/View/IncaricoView/IncaricoView
 # defaultMessage: Data inizio incarico

package/locales/volto.pot

@@ -1,7 +1,7 @@
 msgid ""
 msgstr ""
 "Project-Id-Version: Plone\n"
-"POT-Creation-Date: 2025-03-04T14:31:20.722Z\n"
+"POT-Creation-Date: 2025-03-11T15:48:06.811Z\n"
 "Last-Translator: Plone i18n <plone-i18n@lists.sourceforge.net>\n"
 "Language-Team: Plone i18n <plone-i18n@lists.sourceforge.net>\n"
 "MIME-Version: 1.0\n"
@@ -1513,8 +1513,7 @@ msgid "data_conclusione"
 msgstr ""
 
 #: components/ItaliaTheme/View/IncaricoView/IncaricoView
-#: components/ItaliaTheme/View/PersonaView/PersonaRuolo
-# defaultMessage: Ha fatto parte dell'organizzazione comunale come {incarico} fino al
+# defaultMessage: Data di fine dell'incarico
 msgid "data_conclusione_incarico"
 msgstr ""
 

package/package.json

@@ -2,7 +2,7 @@
   "name": "design-comuni-plone-theme",
   "description": "Volto Theme for Italia design guidelines",
   "license": "GPL-v3",
-  "version": "11.29.0",
+  "version": "11.29.1",
   "main": "src/index.js",
   "repository": {
     "type": "git",

package/publiccode.yml

@@ -227,9 +227,9 @@ maintenance:
 name: io-Comune - Il sito AgID per Comuni ed Enti Pubblici
 platforms:
   - web
-releaseDate: '2025-03-07'
+releaseDate: '2025-03-24'
 softwareType: standalone/web
-softwareVersion: 11.29.0
+softwareVersion: 11.29.1
 url: 'https://github.com/italia/design-comuni-plone-theme'
 usedBy:
   - ASP Comuni Modenesi Area Nord

package/src/components/ItaliaTheme/Blocks/Listing/CardWithSlideUpTextTemplate.jsx

@@ -90,6 +90,9 @@ const CardWithSlideUpTextTemplate = (props) => {
                   href={isEditMode ? '#' : null}
                   key={index}
                   data-element={id_lighthouse}
+                  className={cx('title-link', {
+                    'auto-margin-link': !category && !date,
+                  })}
                 >
                   <h3
                     className={cx('title', {

package/src/components/ItaliaTheme/ScrollToTop/ScrollToTop.jsx

@@ -50,7 +50,6 @@ const ScrollToTop = () => {
             title={intl.formatMessage(messages.scrollToTop)}
             onClick={scrollToTop}
             aria-hidden="true"
-            tabIndex={-1}
           >
             <Icon icon="it-arrow-up" padding={false} size="sm" />
           </Button>

package/src/components/ItaliaTheme/View/IncaricoView/IncaricoView.jsx

@@ -36,8 +36,7 @@ const messages = defineMessages({
   },
   data_conclusione_incarico: {
     id: 'data_conclusione_incarico',
-    defaultMessage:
-      "Ha fatto parte dell'organizzazione comunale come {incarico} fino al",
+    defaultMessage: "Data di fine dell'incarico",
   },
   data_insediamento: {
     id: 'data_insediamento',
@@ -116,9 +115,7 @@ const IncaricoView = ({ content, moment: momentlib }) => {
         {content.data_conclusione_incarico && (
           <RichTextSection
             tag_id="data_conclusione_incarico"
-            title={intl.formatMessage(messages.data_conclusione_incarico, {
-              incarico: content.title,
-            })}
+            title={intl.formatMessage(messages.data_conclusione_incarico)}
           >
             <div className="font-serif">
               {moment(content.data_conclusione_incarico).format('D-MM-YYYY')}

package/src/components/ItaliaTheme/View/PersonaView/PersonaDocumenti.jsx

@@ -240,19 +240,19 @@ const PersonaDocumenti = ({ content }) => {
                 }
               />
             )}
-            {contentFolderHasItems(
-              content,
-              'dichiarazione-insussistenza-cause-di-inconferibilita-e-incompatibilita',
-            ) && (
-              <Attachments
-                content={content}
-                folder_name={
-                  'dichiarazione-insussistenza-cause-di-inconferibilita-e-incompatibilita'
-                }
-                as_section={false}
-              />
-            )}
           </div>
+          {contentFolderHasItems(
+            content,
+            'dichiarazione-insussistenza-cause-di-inconferibilita-e-incompatibilita',
+          ) && (
+            <Attachments
+              content={content}
+              folder_name={
+                'dichiarazione-insussistenza-cause-di-inconferibilita-e-incompatibilita'
+              }
+              as_section={false}
+            />
+          )}
         </RichTextSection>
       )}
       {(content.emolumenti_a_carico_della_finanza_pubblica?.download ||
@@ -277,19 +277,19 @@ const PersonaDocumenti = ({ content }) => {
                 }
               />
             )}
-            {contentFolderHasItems(
-              content,
-              'emolumenti-complessivi-percepiti-a-carico-della-finanza-pubblica',
-            ) && (
-              <Attachments
-                content={content}
-                folder_name={
-                  'emolumenti-complessivi-percepiti-a-carico-della-finanza-pubblica'
-                }
-                as_section={false}
-              />
-            )}
           </div>
+          {contentFolderHasItems(
+            content,
+            'emolumenti-complessivi-percepiti-a-carico-della-finanza-pubblica',
+          ) && (
+            <Attachments
+              content={content}
+              folder_name={
+                'emolumenti-complessivi-percepiti-a-carico-della-finanza-pubblica'
+              }
+              as_section={false}
+            />
+          )}
         </RichTextSection>
       )}
     </>

package/src/components/ItaliaTheme/View/PersonaView/PersonaRuolo.jsx

@@ -74,11 +74,6 @@ const messages = defineMessages({
     id: 'data_conclusione_incarico_label',
     defaultMessage: "Data di fine dell'incarico",
   },
-  data_conclusione_incarico: {
-    id: 'data_conclusione_incarico',
-    defaultMessage:
-      "Ha fatto parte dell'organizzazione comunale come {incarico} fino al",
-  },
   altri_incarichi: {
     id: 'altri_incarichi',
     defaultMessage: 'Altri incarichi',
@@ -129,13 +124,11 @@ const PersonaRuolo = ({ content }) => {
               )}
             >
               <div className="font-serif">
-                {`${intl.formatMessage(messages.data_conclusione_incarico, {
-                  incarico: content.incarichi_persona[0].title,
-                })} ${viewDate(
+                {viewDate(
                   intl.locale,
                   content.incarichi_persona[0].data_conclusione_incarico,
                   'DD MMMM Y',
-                )}`}
+                )}
               </div>
             </RichTextSection>
           )}

package/src/components/__tests__/FormValidation.test.js

@@ -0,0 +1,132 @@
+import FormValidation from '@plone/volto/helpers/FormValidation/FormValidation';
+import { messages } from '@plone/volto/helpers/MessageLabels/MessageLabels';
+
+// copied over and tweaked from
+// https://github.com/plone/volto/blob/17.x.x/src/helpers/FormValidation/FormValidation.test.js
+const schema = {
+  properties: {
+    username: { title: 'Username', type: 'string', description: '' },
+    email: { title: 'Email', type: 'string', widget: 'email', description: '' },
+    url: { title: 'url', type: 'string', widget: 'url', description: '' },
+  },
+  fieldsets: [
+    { id: 'default', title: 'FIXME: User Data', fields: ['username'] },
+    { id: 'second', title: 'Second: User Data', fields: ['email'] },
+  ],
+  required: ['username'],
+};
+// const errors = { email: ['The specified email is not valid.'] };
+const formData = { username: 'test username', email: 'test@example.com' };
+const formatMessage = (messageObj) => {
+  return messageObj?.defaultMessage;
+};
+const errorJSON =
+  "[{'message': 'The specified email is not valid.', 'field': 'email', 'error': 'ValidationError'}]";
+// end copied section
+
+describe('FormValidation', () => {
+  describe('validateFieldsPerFieldset', () => {
+    // Tests copied over from Volto
+    it('validates incorrect url', () => {
+      formData.url = 'foo';
+      expect(
+        FormValidation.validateFieldsPerFieldset({
+          schema,
+          formData,
+          formatMessage,
+        }),
+      ).toEqual({ url: [messages.isValidURL.defaultMessage] });
+    });
+    it('validates url', () => {
+      formData.url = 'https://plone.org/';
+      expect(
+        FormValidation.validateFieldsPerFieldset({
+          schema,
+          formData,
+          formatMessage,
+        }),
+      ).toEqual({});
+    });
+    it('validates url with ip', () => {
+      formData.url = 'http://127.0.0.1:8080/Plone';
+      expect(
+        FormValidation.validateFieldsPerFieldset({
+          schema,
+          formData,
+          formatMessage,
+        }),
+      ).toEqual({});
+    });
+    it('validates url with localhost', () => {
+      formData.url = 'http://localhost:8080/Plone';
+      expect(
+        FormValidation.validateFieldsPerFieldset({
+          schema,
+          formData,
+          formatMessage,
+        }),
+      ).toEqual({});
+    });
+    // Our additional tests
+    it('validates url with path', () => {
+      formData.url = 'https://plone.org/Plone';
+      expect(
+        FormValidation.validateFieldsPerFieldset({
+          schema,
+          formData,
+          formatMessage,
+        }),
+      ).toEqual({});
+    });
+    it('validates url with port', () => {
+      formData.url = 'https://plone.org:8080/Plone';
+      expect(
+        FormValidation.validateFieldsPerFieldset({
+          schema,
+          formData,
+          formatMessage,
+        }),
+      ).toEqual({});
+    });
+    it('validates url with query', () => {
+      formData.url = 'https://plone.org/Plone?query=1';
+      expect(
+        FormValidation.validateFieldsPerFieldset({
+          schema,
+          formData,
+          formatMessage,
+        }),
+      ).toEqual({});
+    });
+    it('validates url with query with slashes', () => {
+      formData.url = 'https://plone.org/Plone?query=1/2/3';
+      expect(
+        FormValidation.validateFieldsPerFieldset({
+          schema,
+          formData,
+          formatMessage,
+        }),
+      ).toEqual({});
+    });
+    it('validates url with fragment', () => {
+      formData.url = 'https://plone.org/Plone#fragment';
+      expect(
+        FormValidation.validateFieldsPerFieldset({
+          schema,
+          formData,
+          formatMessage,
+        }),
+      ).toEqual({});
+    });
+    it('validates url with query and fragment', () => {
+      formData.url = 'https://plone.org/Plone?query=1#fragment';
+      expect(
+        FormValidation.validateFieldsPerFieldset({
+          schema,
+          formData,
+          formatMessage,
+        }),
+      ).toEqual({});
+    });
+  });
+});

package/src/customizations/volto/components/theme/View/LinkView.jsx

@@ -1,24 +1,27 @@
 // CUSTOMIZATION:
-// - Added condition to check if user is SPID user (16-18 and 21)
+// - Added condition to check if the user can edit the link (18-21 and 24)
+// - Backported optimizations from volto 18 (lines 33-35 and more specific imports)
 
 import { useEffect } from 'react';
 import { useSelector } from 'react-redux';
 import PropTypes from 'prop-types';
 import { useHistory } from 'react-router-dom';
-import { isInternalURL, flattenToAppURL } from '@plone/volto/helpers';
+import { isInternalURL, flattenToAppURL } from '@plone/volto/helpers/Url/Url';
 import { Container as SemanticContainer } from 'semantic-ui-react';
-import { UniversalLink } from '@plone/volto/components';
+import UniversalLink from '@plone/volto/components/manage/UniversalLink/UniversalLink';
+import { Redirect } from 'react-router-dom';
 import { FormattedMessage } from 'react-intl';
 import config from '@plone/volto/registry';
 
-const LinkView = ({ token, content }) => {
+const LinkView = ({ content }) => {
   const history = useHistory();
-  const userWithoutRoles = useSelector((state) =>
-    state.users?.user ? state.users.user?.roles?.length === 0 : true,
+  const userCanEdit = useSelector(
+    (state) =>
+      !!state.actions.actions.object.find((action) => action.id === 'edit'),
   );
 
   useEffect(() => {
-    if (!token || userWithoutRoles) {
+    if (!userCanEdit) {
       const { remoteUrl } = content;
       if (isInternalURL(remoteUrl)) {
         history.replace(flattenToAppURL(remoteUrl));
@@ -26,7 +29,10 @@ const LinkView = ({ token, content }) => {
         window.location.href = flattenToAppURL(remoteUrl);
       }
     }
-  }, [content, history, token, userWithoutRoles]);
+  }, [content, history, userCanEdit]);
+  if (__SERVER__ && !userCanEdit && content.remoteUrl) {
+    return <Redirect to={content.remoteUrl} />;
+  }
   const { title, description, remoteUrl } = content;
   const { openExternalLinkInNewTab } = config.settings;
   const Container =

package/src/customizations/volto/helpers/FormValidation/FormValidation.js

@@ -108,7 +108,7 @@ const widgetValidation = {
           ')' +
           '(\\:\\d+)?' + // optional port
           '(\\/[-a-z\\d%_.~+]*)*' + // path
-          '(\\?[;&a-z\\d%_.~+=-]*)?' + // validate query string
+          '(\\?[;&a-z\\d%_.~+\\/=-]*)?' + // validate query string
           '(\\#[-a-z\\d_]*)?$', // validate fragment locator
         'i',
       );

package/src/theme/ItaliaTheme/Blocks/_cardWithSlideUpTextTemplate.scss

@@ -25,6 +25,10 @@
     padding: 1.2rem;
     text-decoration: none;
 
+    .title-link {
+      text-decoration: none;
+    }
+
     .title {
       z-index: 2;
       overflow: hidden;
@@ -43,6 +47,10 @@
       margin-top: auto !important;
     }
 
+    .auto-margin-link {
+      margin-top: auto;
+    }
+
     .category + .title {
       margin-top: 0 !important;
     }
@@ -104,7 +112,7 @@
       height: 100%;
       --bs-gradient: linear-gradient(
         to bottom,
-        rgba(0, 0, 0, 0.3) 0%,
+        rgba(0, 0, 0, 0.5) 0%,
         #000 100%
       );
       opacity: 0.4;

package/src/theme/ItaliaTheme/_common.scss

@@ -10,8 +10,10 @@
       outline: 2px solid $outer-focus-outline !important;
       outline-offset: 2px;
 
-      border: none !important;
       box-shadow: 0 0 0 2px $inner-focus-shadow !important;
+
+      // adds additional internal black border to buttons
+      border: 2px solid $outer-focus-outline !important;
     }
   }
 
@@ -40,6 +42,9 @@
         0 1px 1px $focus-outline-color,
         0 0 0 0.2rem $focus-outline-color;
       outline: none;
+
+      // adds additional black internal border to tertiary buttons
+      border: 2px solid $focus-outline-color !important;
     }
   }
 

package/src/theme/bootstrap-override/bootstrap-italia/_buttons.scss

@@ -6,3 +6,21 @@ button.btn.btn-primary:focus-visible,
     }
   }
 }
+
+button.btn.btn-primary:focus-visible {
+  // fix for primary buttons to ensure contrast upon focus
+  background-color: darken($color: $primary, $amount: 5%);
+  color: color-contrast($primary);
+}
+
+button.btn.btn-secondary:focus-visible {
+  // fix for secondary buttons to ensure contrast upon focus
+  background-color: darken($color: $secondary, $amount: 5%);
+  color: color-contrast($secondary);
+}
+
+button.btn.btn-tertiary:focus-visible {
+  // fix for tertiary buttons to ensure contrast upon focus
+  background-color: darken($color: $tertiary, $amount: 5%);
+  color: color-contrast($tertiary);
+}

package/src/theme/bootstrap-override/bootstrap-italia/_focus.scss

@@ -7,6 +7,20 @@
   box-shadow: 0 0 0 2px $inner-focus-shadow !important;
 }
 
+input:focus:not(.focus--mouse) {
+  // only add border to input besides default double outline
+  border: 2px solid $outer-focus-outline !important;
+}
+
 .skiplinks a:focus:not(.focus--mouse) {
   border: 2px solid;
 }
+
+.gdpr-privacy-show-banner:focus:not(.focus--mouse) {
+  // invert general :focus rule since button is always white
+  outline: 2px solid $inner-focus-shadow !important;
+  outline-offset: 2px;
+
+  border: none !important;
+  box-shadow: 0 0 0 2px $outer-focus-outline !important;
+}

package/src/theme/bootstrap-override/bootstrap-italia/_headercenter.scss

@@ -23,6 +23,11 @@
 
             border: none !important;
             box-shadow: 0 0 0 2px $inner-focus-shadow !important;
+
+            //adds border to ensure correct contrast on all bg
+            // dark bg + light button --> internal dark border + outer white shadow
+            // light bg + dark button --> external dark border + inner white shadow
+            border: 2px solid $outer-focus-outline !important;
           }
         }
       }