fix: rendering logic of ulteriori_informazioni section in every conte…

…nt type that has it (#584)
RedTurtle · Sep 19, 2022 · 8eb806e · 8eb806e
1 parent b5002ba
commit 8eb806e
Show file tree

Hide file tree

Showing 13 changed files with 129 additions and 86 deletions.
diff --git a/src/components/ItaliaTheme/View/BandoView/BandoUlterioriInformazioni.jsx b/src/components/ItaliaTheme/View/BandoView/BandoUlterioriInformazioni.jsx
@@ -9,7 +9,10 @@ import {
 
 const BandoUlterioriInformazioni = ({ content }) => {
   return (
-    <Metadata content={content}>
+    <Metadata
+      content={content}
+      showSectionTitle={richTextHasContent(content?.riferimenti_bando)}
+    >
       {richTextHasContent(content?.riferimenti_bando) && (
         <HelpBox text={content?.riferimenti_bando} />
       )}

diff --git a/src/components/ItaliaTheme/View/Commons/Metadata.jsx b/src/components/ItaliaTheme/View/Commons/Metadata.jsx
@@ -35,6 +35,7 @@ const Metadata = ({
   content,
   showTags = false,
   noMargin = false,
+  showSectionTitle = true,
   title,
   children,
 }) => {
@@ -45,9 +46,11 @@ const Metadata = ({
       id="metadata"
       className={cx('it-page-section', 'anchor-offset', { 'mt-5': !noMargin })}
     >
-      <h4 id="header-metadata" className="mb-3">
-        {title || intl.formatMessage(messages.other_info)}
-      </h4>
+      {showSectionTitle && (
+        <h4 id="header-metadata" className="mb-3">
+          {title || intl.formatMessage(messages.other_info)}
+        </h4>
+      )}
       {children}
       <p className="text-serif mb-0 mt-4">
         {intl.formatMessage(messages.modified)}
@@ -92,6 +95,7 @@ export default Metadata;
 Metadata.propTypes = {
   content: PropTypes.object,
   showTags: PropTypes.bool,
+  showSectionTitle: PropTypes.bool,
   noMargin: PropTypes.bool,
   title: PropTypes.string,
 };
diff --git a/src/components/ItaliaTheme/View/Commons/Sponsors.jsx b/src/components/ItaliaTheme/View/Commons/Sponsors.jsx
@@ -74,7 +74,6 @@ const Sponsors = ({ content, folder_name, title }) => {
             'path.depth': 1,
             sort_on: 'getObjPositionInParent',
             metadata_fields: '_all',
-            fullobjects: true,
           },
           folder_name,
         ),

diff --git a/src/components/ItaliaTheme/View/DocumentoView/DocumentoUlterioriInformazioni.jsx b/src/components/ItaliaTheme/View/DocumentoView/DocumentoUlterioriInformazioni.jsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useMemo } from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 
 import {
@@ -17,9 +17,14 @@ const messages = defineMessages({
 
 const DocumentoUlterioriInformazioni = ({ content }) => {
   const intl = useIntl();
-
+  const showSectionTitle = useMemo(
+    () =>
+      richTextHasContent(content?.ulteriori_informazioni) ||
+      richTextHasContent(content?.riferimenti_normativi),
+    [content],
+  );
   return (
-    <Metadata content={content}>
+    <Metadata content={content} showSectionTitle={showSectionTitle}>
       {richTextHasContent(content?.ulteriori_informazioni) && (
         <HelpBox text={content?.ulteriori_informazioni} />
       )}

diff --git a/src/components/ItaliaTheme/View/EventoView/EventoSponsors.jsx b/src/components/ItaliaTheme/View/EventoView/EventoSponsors.jsx
@@ -0,0 +1,14 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+import { Sponsors } from '@italia/components/ItaliaTheme/View';
+
+const EventoSponsors = ({ content }) => (
+  <Sponsors content={content} folder_name={'sponsor_evento'} />
+);
+
+EventoSponsors.propTypes = {
+  content: PropTypes.object.isRequired,
+};
+
+export default EventoSponsors;
diff --git a/src/components/ItaliaTheme/View/EventoView/EventoUlterioriInformazioni.jsx b/src/components/ItaliaTheme/View/EventoView/EventoUlterioriInformazioni.jsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useMemo } from 'react';
 import PropTypes from 'prop-types';
 
 import { defineMessages, useIntl } from 'react-intl';
@@ -8,7 +8,6 @@ import {
   richTextHasContent,
   Metadata,
   HelpBox,
-  Sponsors,
   GenericCard,
 } from '@italia/components/ItaliaTheme/View';
 
@@ -29,60 +28,54 @@ const messages = defineMessages({
 
 const EventoUlterioriInformazioni = ({ content }) => {
   const intl = useIntl();
+  const showSectionTitle = useMemo(
+    () =>
+      richTextHasContent(content?.ulteriori_informazioni) ||
+      content?.event_url ||
+      content?.patrocinato_da ||
+      content?.strutture_politiche.length > 0,
+    [content],
+  );
 
   return (
-    <Metadata content={content}>
-      {(richTextHasContent(content?.ulteriori_informazioni) ||
-        content?.event_url ||
-        content?.patrocinato_da ||
-        content?.strutture_politiche.length > 0 ||
-        content?.items?.some((e) => e.id === 'sponsor_evento')) && (
-        <>
-          {richTextHasContent(content?.ulteriori_informazioni) && (
-            <HelpBox text={content?.ulteriori_informazioni} />
-          )}
-
-          {content?.event_url && (
-            <div className="mt-4">
-              <h5>{intl.formatMessage(messages.event_url)}</h5>
-              <UniversalLink href={content.event_url}>
-                {content.event_url}
-              </UniversalLink>
-            </div>
-          )}
+    <Metadata content={content} showSectionTitle={showSectionTitle}>
+      {richTextHasContent(content?.ulteriori_informazioni) && (
+        <HelpBox text={content?.ulteriori_informazioni} />
+      )}
 
-          {content?.patrocinato_da && (
-            <div className="mt-4">
-              <h5>{intl.formatMessage(messages.patrocinato_da)}</h5>
-              {content.patrocinato_da}
-            </div>
-          )}
+      {content?.event_url && (
+        <div className="mt-4">
+          <h5>{intl.formatMessage(messages.event_url)}</h5>
+          <UniversalLink href={content.event_url}>
+            {content.event_url}
+          </UniversalLink>
+        </div>
+      )}
 
-          {content?.items?.some((e) => e.id === 'sponsor_evento') && (
-            <div className="mt-4">
-              <Sponsors content={content} folder_name={'sponsor_evento'} />
-            </div>
-          )}
+      {content?.patrocinato_da && (
+        <div className="mt-4">
+          <h5>{intl.formatMessage(messages.patrocinato_da)}</h5>
+          {content.patrocinato_da}
+        </div>
+      )}
 
-          {content?.strutture_politiche.length > 0 && (
-            <div className="mt-4">
-              <h5>{intl.formatMessage(messages.strutture_politiche)}</h5>
-              <div className="card-wrapper card-teaser-wrapper card-teaser-wrapper-equal">
-                {content.strutture_politiche.map((item, i) => (
-                  <GenericCard
-                    key={i}
-                    index={item['@id']}
-                    item={item}
-                    showimage={false}
-                    showDescription={false}
-                  />
-                ))}
-              </div>
-            </div>
-          )}
-          <div className="mt-4"></div>
-        </>
+      {content?.strutture_politiche.length > 0 && (
+        <div className="mt-4">
+          <h5>{intl.formatMessage(messages.strutture_politiche)}</h5>
+          <div className="card-wrapper card-teaser-wrapper card-teaser-wrapper-equal">
+            {content.strutture_politiche.map((item, i) => (
+              <GenericCard
+                key={i}
+                index={item['@id']}
+                item={item}
+                showimage={false}
+                showDescription={false}
+              />
+            ))}
+          </div>
+        </div>
       )}
+      <div className="mt-4"></div>
     </Metadata>
   );
 };

diff --git a/src/components/ItaliaTheme/View/EventoView/EventoView.jsx b/src/components/ItaliaTheme/View/EventoView/EventoView.jsx
@@ -24,6 +24,7 @@ import {
   RelatedItemInEvidence,
   SkipToMainContent,
   ContentTypeViewSections,
+  EventoSponsors,
 } from '@italia/components/ItaliaTheme/View';
 
 export const EventoViewSectionsOrder = [
@@ -40,6 +41,7 @@ export const EventoViewSectionsOrder = [
   { /* DOCUMENTI */ component: EventoDocumenti },
   { /* CONTATTI */ component: EventoContatti },
   { /* EVENTS */ component: EventoPadreEFigli },
+  { /* SPONSORS */ component: EventoSponsors },
   { /* ULTERIORI INFORMAZIONI */ component: EventoUlterioriInformazioni },
 ];
 

diff --git a/src/components/ItaliaTheme/View/NewsItemView/NewsItemMetadata.jsx b/src/components/ItaliaTheme/View/NewsItemView/NewsItemMetadata.jsx
@@ -1,10 +1,23 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 
-import { Metadata } from '@italia/components/ItaliaTheme/View';
+import {
+  Metadata,
+  HelpBox,
+  richTextHasContent,
+} from '@italia/components/ItaliaTheme/View';
 
 const NewsItemMetadata = ({ content }) => {
-  return <Metadata content={content} />;
+  return (
+    <Metadata
+      content={content}
+      showSectionTitle={richTextHasContent(content?.ulteriori_informazioni)}
+    >
+      {richTextHasContent(content?.ulteriori_informazioni) && (
+        <HelpBox text={content?.ulteriori_informazioni} />
+      )}
+    </Metadata>
+  );
 };
 
 NewsItemMetadata.propTypes = {

diff --git a/src/components/ItaliaTheme/View/PersonaView/PersonaUlterioriInformazioni.jsx b/src/components/ItaliaTheme/View/PersonaView/PersonaUlterioriInformazioni.jsx
@@ -7,7 +7,10 @@ import {
 
 const PersonaUlterioriInformazioni = ({ content }) => {
   return (
-    <Metadata content={content}>
+    <Metadata
+      content={content}
+      showSectionTitle={richTextHasContent(content?.ulteriori_informazioni)}
+    >
       {richTextHasContent(content?.ulteriori_informazioni) && (
         <HelpBox text={content?.ulteriori_informazioni} />
       )}

diff --git a/src/components/ItaliaTheme/View/ServizioView/ServizioUlterioriInformazioni.jsx b/src/components/ItaliaTheme/View/ServizioView/ServizioUlterioriInformazioni.jsx
@@ -8,7 +8,10 @@ import {
 
 const ServizioUlterioriInformazioni = ({ content }) => {
   return (
-    <Metadata content={content}>
+    <Metadata
+      content={content}
+      showSectionTitle={richTextHasContent(content.ulteriori_informazioni)}
+    >
       {richTextHasContent(content.ulteriori_informazioni) && (
         <HelpBox text={content.ulteriori_informazioni} />
       )}

diff --git a/src/components/ItaliaTheme/View/UOView/UOMoreInfos.jsx b/src/components/ItaliaTheme/View/UOView/UOMoreInfos.jsx
@@ -7,7 +7,11 @@ import {
 
 const UOMoreInfos = ({ content }) => {
   return (
-    <Metadata content={content} showTags={false}>
+    <Metadata
+      content={content}
+      showTags={false}
+      showSectionTitle={richTextHasContent(content?.ulteriori_informazioni)}
+    >
       {richTextHasContent(content?.ulteriori_informazioni) && (
         <HelpBox text={content.ulteriori_informazioni} />
       )}

diff --git a/src/components/ItaliaTheme/View/VenueView/VenueMoreInfos.jsx b/src/components/ItaliaTheme/View/VenueView/VenueMoreInfos.jsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useMemo } from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 
 import {
@@ -17,29 +17,28 @@ const messages = defineMessages({
 
 const VenueMoreInfos = ({ content }) => {
   const intl = useIntl();
-
+  const showSectionTitle = useMemo(
+    () =>
+      richTextHasContent(content?.ulteriori_informazioni) ||
+      content.sede_di?.length > 0,
+    [content],
+  );
   return (
-    <Metadata content={content}>
-      {(richTextHasContent(content?.ulteriori_informazioni) ||
-        content.sede_di?.length > 0) && (
-        <>
-          {/* SEDE DI */}
-          {content.sede_di?.length > 0 && (
-            <div className="mb-5">
-              <RelatedArticles
-                title_size={'h5'}
-                items={content.sede_di}
-                title={intl.formatMessage(messages.sede_di)}
-                noMargin
-              />
-            </div>
-          )}
-
-          {/* HELP BOX - ULTERIORI INFORMAZIONI */}
-          {richTextHasContent(content?.ulteriori_informazioni) && (
-            <HelpBox text={content?.ulteriori_informazioni} />
-          )}
-        </>
+    <Metadata content={content} showSectionTitle={showSectionTitle}>
+      {/* SEDE DI */}
+      {content.sede_di?.length > 0 && (
+        <div className="mb-5">
+          <RelatedArticles
+            title_size={'h5'}
+            items={content.sede_di}
+            title={intl.formatMessage(messages.sede_di)}
+            noMargin
+          />
+        </div>
+      )}
+      {/* HELP BOX - ULTERIORI INFORMAZIONI */}
+      {richTextHasContent(content?.ulteriori_informazioni) && (
+        <HelpBox text={content?.ulteriori_informazioni} />
       )}
     </Metadata>
   );

diff --git a/src/components/ItaliaTheme/View/index.js b/src/components/ItaliaTheme/View/index.js
@@ -96,6 +96,7 @@ export EventoCosti from '@italia/components/ItaliaTheme/View/EventoView/EventoCo
 export EventoDocumenti from '@italia/components/ItaliaTheme/View/EventoView/EventoDocumenti';
 export EventoContatti from '@italia/components/ItaliaTheme/View/EventoView/EventoContatti';
 export EventoPadreEFigli from '@italia/components/ItaliaTheme/View/EventoView/EventoPadreEFigli';
+export EventoSponsors from '@italia/components/ItaliaTheme/View/EventoView/EventoSponsors';
 export EventoUlterioriInformazioni from '@italia/components/ItaliaTheme/View/EventoView/EventoUlterioriInformazioni';
 
 export FaqFolderPlaceholderAfterContent from '@italia/components/ItaliaTheme/View/FAQ/FaqFolder/Placeholder/AfterContent';