feat: enable/disable external link icon in listing template SmallBloc…

…ksLink * fix: smallblockslink template and accessibility icon for external links * chore: update RELEASE.md
RedTurtle · Sep 20, 2023 · 0f9f872 · 0f9f872
1 parent b478952
commit 0f9f872
Show file tree

Hide file tree

Showing 13 changed files with 104 additions and 11 deletions.
diff --git a/RELEASE.md b/RELEASE.md
@@ -30,6 +30,17 @@
 - ...
 -->
 
+
+## Versione x.x.x (dd/mm/yyyy)
+
+### Migliorie
+
+Nel template Blocco link solo immagini con link esterni, icona accessibilità per link esterni ora è disattivabile attraverso opzione del template
+
+### Fix
+
+- Fissato il layout del template Blocco link solo immagini con link esterni, icona accessibilità per link esterni ora è posizionata invece in overlay se presente
+
 ## Versione 7.21.0 (19/09/2023)
 
 ### Novità
@@ -41,6 +52,7 @@
 - Blocco info: Colori dentro editor di testo sistemati (bottoni draftJS)
 - I link nella modulistica mostrano la remoteUrl
 
+
 ## Versione 7.20.4 (13/09/2023)
 
 ### Fix

diff --git a/locales/de/LC_MESSAGES/volto.po b/locales/de/LC_MESSAGES/volto.po
@@ -2497,6 +2497,11 @@ msgstr ""
 msgid "other_info"
 msgstr ""
 
+#: config/Blocks/ListingOptions/smallBlockLinksTemplate
+# defaultMessage: Non mostrare l'icona di accessibilità per i link a siti esterni
+msgid "override_links_accessibility_marker"
+msgstr "Barrierefreiheitssymbol nicht für Links anzeigen, die auf externe Websites oder Ressourcen verweisen"
+
 #: components/ItaliaTheme/View/Commons/TrasparenzaFields
 # defaultMessage: Pagamenti previsti e modalità
 msgid "pagamenti"

diff --git a/locales/en/LC_MESSAGES/volto.po b/locales/en/LC_MESSAGES/volto.po
@@ -2482,6 +2482,11 @@ msgstr "Ohter topics"
 msgid "other_info"
 msgstr "Further information"
 
+#: config/Blocks/ListingOptions/smallBlockLinksTemplate
+# defaultMessage: Non mostrare l'icona di accessibilità per i link a siti esterni
+msgid "override_links_accessibility_marker"
+msgstr "Do not show accessibility icon for links pointing to external websites or resources"
+
 #: components/ItaliaTheme/View/Commons/TrasparenzaFields
 # defaultMessage: Pagamenti previsti e modalità
 msgid "pagamenti"

diff --git a/locales/es/LC_MESSAGES/volto.po b/locales/es/LC_MESSAGES/volto.po
@@ -2491,6 +2491,11 @@ msgstr "Otros temas"
 msgid "other_info"
 msgstr "Más información"
 
+#: config/Blocks/ListingOptions/smallBlockLinksTemplate
+# defaultMessage: Non mostrare l'icona di accessibilità per i link a siti esterni
+msgid "override_links_accessibility_marker"
+msgstr "No mostrar el ícono de accesibilidad para enlaces que apuntan a sitios web o recursos externos"
+
 #: components/ItaliaTheme/View/Commons/TrasparenzaFields
 # defaultMessage: Pagamenti previsti e modalità
 msgid "pagamenti"

diff --git a/locales/fr/LC_MESSAGES/volto.po b/locales/fr/LC_MESSAGES/volto.po
@@ -2499,6 +2499,11 @@ msgstr "Autres sujets"
 msgid "other_info"
 msgstr "Informations complémentaires"
 
+#: config/Blocks/ListingOptions/smallBlockLinksTemplate
+# defaultMessage: Non mostrare l'icona di accessibilità per i link a siti esterni
+msgid "override_links_accessibility_marker"
+msgstr "Ne pas afficher l'icône d'accessibilité pour les liens pointant vers des sites Web ou des ressources externes"
+
 #: components/ItaliaTheme/View/Commons/TrasparenzaFields
 # defaultMessage: Pagamenti previsti e modalità
 msgid "pagamenti"

diff --git a/locales/it/LC_MESSAGES/volto.po b/locales/it/LC_MESSAGES/volto.po
@@ -2482,6 +2482,11 @@ msgstr "Altri argomenti"
 msgid "other_info"
 msgstr "Ulteriori informazioni"
 
+#: config/Blocks/ListingOptions/smallBlockLinksTemplate
+# defaultMessage: Non mostrare l'icona di accessibilità per i link a siti esterni
+msgid "override_links_accessibility_marker"
+msgstr ""
+
 #: components/ItaliaTheme/View/Commons/TrasparenzaFields
 # defaultMessage: Pagamenti previsti e modalità
 msgid "pagamenti"

diff --git a/locales/volto.pot b/locales/volto.pot
@@ -1,7 +1,7 @@
 msgid ""
 msgstr ""
 "Project-Id-Version: Plone\n"
-"POT-Creation-Date: 2023-09-04T15:56:21.451Z\n"
+"POT-Creation-Date: 2023-09-19T07:30:36.575Z\n"
 "Last-Translator: Plone i18n <[email protected]>\n"
 "Language-Team: Plone i18n <[email protected]>\n"
 "MIME-Version: 1.0\n"
@@ -2484,6 +2484,11 @@ msgstr ""
 msgid "other_info"
 msgstr ""
 
+#: config/Blocks/ListingOptions/smallBlockLinksTemplate
+# defaultMessage: Non mostrare l'icona di accessibilità per i link a siti esterni
+msgid "override_links_accessibility_marker"
+msgstr ""
+
 #: components/ItaliaTheme/View/Commons/TrasparenzaFields
 # defaultMessage: Pagamenti previsti e modalità
 msgid "pagamenti"

diff --git a/src/components/ItaliaTheme/Blocks/Listing/SmallBlockLinksTemplate.jsx b/src/components/ItaliaTheme/Blocks/Listing/SmallBlockLinksTemplate.jsx
@@ -17,6 +17,7 @@ const SmallBlockLinksTemplate = ({
   linkTitle,
   linkHref,
   center_cards,
+  override_links_accessibility_marker,
 }) => {
   return (
     <div className="small-block-links">
@@ -44,6 +45,9 @@ const SmallBlockLinksTemplate = ({
                       item={!isEditMode ? item : null}
                       href={isEditMode ? '#' : ''}
                       className="img-link"
+                      overrideMarkSpecialLinks={
+                        override_links_accessibility_marker
+                      }
                     >
                       {image}
                     </UniversalLink>

diff --git a/src/config/Blocks/ListingOptions/index.js b/src/config/Blocks/ListingOptions/index.js
@@ -19,3 +19,4 @@ export { addSliderTemplateOptions } from 'design-comuni-plone-theme/config/Block
 export { addSimpleListTemplateOptions } from 'design-comuni-plone-theme/config/Blocks/ListingOptions/simpleListTemplate';
 export { addCardWithSlideUpTextTemplateOptions } from 'design-comuni-plone-theme/config/Blocks/ListingOptions/cardWithSlideUpTextTemplate';
 export { addPhotogalleryTemplateOptions } from 'design-comuni-plone-theme/config/Blocks/ListingOptions/photogalleryTemplate';
+export { addSmallBlockLinksTemplateOptions } from 'design-comuni-plone-theme/config/Blocks/ListingOptions/smallBlockLinksTemplate';
diff --git a/src/config/Blocks/ListingOptions/smallBlockLinksTemplate.js b/src/config/Blocks/ListingOptions/smallBlockLinksTemplate.js
@@ -0,0 +1,32 @@
+import { defineMessages } from 'react-intl';
+
+import { addSchemaField } from 'design-comuni-plone-theme/config/Blocks/ListingOptions';
+
+const messages = defineMessages({
+  override_links_accessibility_marker: {
+    id: 'override_links_accessibility_marker',
+    defaultMessage:
+      "Non mostrare l'icona di accessibilità per i link a siti esterni",
+  },
+});
+
+export const addSmallBlockLinksTemplateOptions = (
+  schema,
+  formData,
+  intl,
+  position = 0,
+) => {
+  let pos = position;
+
+  addSchemaField(
+    schema,
+    'override_links_accessibility_marker',
+    intl.formatMessage(messages.override_links_accessibility_marker),
+    null,
+    { type: 'boolean' },
+    pos,
+  );
+  pos++;
+
+  return pos;
+};
diff --git a/src/config/Blocks/listingVariations.js b/src/config/Blocks/listingVariations.js
@@ -58,9 +58,13 @@ import {
   addSimpleListTemplateOptions,
   addCardWithSlideUpTextTemplateOptions,
   addPhotogalleryTemplateOptions,
+  addSmallBlockLinksTemplateOptions,
 } from 'design-comuni-plone-theme/config/Blocks/ListingOptions';
 
-import { addLighthouseField, cloneBlock } from 'design-comuni-plone-theme/config/Blocks/ListingOptions/utils';
+import {
+  addLighthouseField,
+  cloneBlock,
+} from 'design-comuni-plone-theme/config/Blocks/ListingOptions/utils';
 
 const italiaListingVariations = [
   {
@@ -168,7 +172,8 @@ const italiaListingVariations = [
     template: SmallBlockLinksTemplate,
     skeleton: SmallBlockLinksTemplateSkeleton,
     schemaEnhancer: ({ schema, formData, intl }) => {
-      /*let pos = */ addDefaultOptions(schema, formData, intl);
+      let pos = addDefaultOptions(schema, formData, intl);
+      addSmallBlockLinksTemplateOptions(schema, formData, intl, pos);
       return schema;
     },
     cloneData: cloneBlock,

diff --git a/src/customizations/volto/components/manage/UniversalLink/UniversalLink.jsx b/src/customizations/volto/components/manage/UniversalLink/UniversalLink.jsx
@@ -30,6 +30,7 @@ const UniversalLink = ({
   children,
   className = null,
   title = null,
+  overrideMarkSpecialLinks = false,
   ...props
 }) => {
   const intl = useIntl();
@@ -117,14 +118,15 @@ const UniversalLink = ({
         {...props}
       >
         {children}
-        {config.settings.siteProperties.markSpecialLinks && (
-          <Icon
-            icon="it-external-link"
-            title={title}
-            size="xs"
-            className="align-top ml-1 external-link"
-          />
-        )}
+        {!overrideMarkSpecialLinks &&
+          config.settings.siteProperties.markSpecialLinks && (
+            <Icon
+              icon="it-external-link"
+              title={title}
+              size="xs"
+              className="align-top ml-1 external-link"
+            />
+          )}
       </a>
     );
   } else if (isDownload) {

diff --git a/theme/ItaliaTheme/Blocks/_smallblockLinkstemplate.scss b/theme/ItaliaTheme/Blocks/_smallblockLinkstemplate.scss
@@ -16,6 +16,13 @@
     background: $white;
     box-shadow: 0 2px 20px 0 rgba(0, 0, 0, 0.1);
 
+    .img-link svg {
+      position: absolute;
+      top: 4px;
+      right: 4px;
+      z-index: 2;
+    }
+
     img,
     .img-skeleton {
       width: auto;