Skip to content

Commit

Permalink
feat: split VenueDescription component (#399)
Browse files Browse the repository at this point in the history
  • Loading branch information
giuliaghisini authored Nov 10, 2023
1 parent 9588073 commit 68c3ca5
Show file tree
Hide file tree
Showing 6 changed files with 128 additions and 65 deletions.
74 changes: 9 additions & 65 deletions src/components/ItaliaTheme/View/VenueView/VenueDescription.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,33 +2,18 @@ import React from 'react';
import { defineMessages, useIntl } from 'react-intl';
import {
RichTextSection,
Gallery,
richTextHasContent,
VenueTipologia,
VenueElementiDiInteresse,
VenueLuoghiCorrelati,
VenueMultimedia,
} from 'design-comuni-plone-theme/components/ItaliaTheme/View';
import { contentFolderHasItems } from 'design-comuni-plone-theme/helpers';
import LocationItem from 'design-comuni-plone-theme/components/ItaliaTheme/View/Commons/LocationItem';

const messages = defineMessages({
descrizione: {
id: 'descrizione',
defaultMessage: 'Descrizione',
},
elementi_di_interesse: {
id: 'elementi_di_interesse',
defaultMessage: 'Elementi di interesse',
},
video: {
id: 'Video',
defaultMessage: 'Video',
},
luoghi_correlati: {
id: 'luoghi_correlati',
defaultMessage: 'Luoghi correlati',
},
tipologia_luogo: {
id: 'tipologia_luogo',
defaultMessage: 'Tipo di luogo',
},
});

const VenueDescription = ({ content }) => {
Expand All @@ -43,52 +28,11 @@ const VenueDescription = ({ content }) => {
data={content.descrizione_completa}
/>
)}
{content?.tipologia_luogo?.length > 0 && (
<RichTextSection
tag_id="tipologia"
title={intl.formatMessage(messages.tipologia_luogo)}
>
{content.tipologia_luogo.map((tipologia) => (
<p key={tipologia.token} className="font-serif">
{tipologia.title}
</p>
))}
</RichTextSection>
)}
{richTextHasContent(content.elementi_di_interesse) && (
<RichTextSection
tag_id="elementi-di-interesse"
title={`${intl.formatMessage(messages.elementi_di_interesse)}`}
data={content.elementi_di_interesse}
/>
)}
{content?.luoghi_correlati?.length > 0 && (
<RichTextSection
tag_id={'luoghi_correlati'}
title={intl.formatMessage(messages.luoghi_correlati)}
>
<div className="card-wrapper card-teaser-wrapper mb-5">
{content.luoghi_correlati?.map((item, i) => (
<LocationItem
key={item['@id'] + i}
location={item}
show_icon={false}
show_title_link={true}
load={true}
details_link={false}
/>
))}
</div>
</RichTextSection>
)}
{contentFolderHasItems(content, 'multimedia') && (
<Gallery
content={content}
folder_name={'multimedia'}
title_video={intl.formatMessage(messages.video)}
title_type="h5"
/>
)}

<VenueTipologia content={content} />
<VenueElementiDiInteresse content={content} />
<VenueLuoghiCorrelati content={content} />
<VenueMultimedia content={content} />
</>
);
};
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
import React from 'react';
import { defineMessages, useIntl } from 'react-intl';
import {
RichTextSection,
richTextHasContent,
} from 'design-comuni-plone-theme/components/ItaliaTheme/View';

const messages = defineMessages({
elementi_di_interesse: {
id: 'elementi_di_interesse',
defaultMessage: 'Elementi di interesse',
},
});

const VenueElementiDiInteresse = ({ content }) => {
const intl = useIntl();
return richTextHasContent(content.elementi_di_interesse) ? (
<RichTextSection
tag_id="elementi-di-interesse"
title={`${intl.formatMessage(messages.elementi_di_interesse)}`}
data={content.elementi_di_interesse}
/>
) : null;
};

export default VenueElementiDiInteresse;
37 changes: 37 additions & 0 deletions src/components/ItaliaTheme/View/VenueView/VenueLuoghiCorrelati.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
import React from 'react';
import { defineMessages, useIntl } from 'react-intl';
import { RichTextSection } from 'design-comuni-plone-theme/components/ItaliaTheme/View';

import LocationItem from 'design-comuni-plone-theme/components/ItaliaTheme/View/Commons/LocationItem';

const messages = defineMessages({
luoghi_correlati: {
id: 'luoghi_correlati',
defaultMessage: 'Luoghi correlati',
},
});

const VenueLuoghiCorrelati = ({ content }) => {
const intl = useIntl();
return content?.luoghi_correlati?.length > 0 ? (
<RichTextSection
tag_id={'luoghi_correlati'}
title={intl.formatMessage(messages.luoghi_correlati)}
>
<div className="card-wrapper card-teaser-wrapper mb-5">
{content.luoghi_correlati?.map((item, i) => (
<LocationItem
key={item['@id'] + i}
location={item}
show_icon={false}
show_title_link={true}
load={true}
details_link={false}
/>
))}
</div>
</RichTextSection>
) : null;
};

export default VenueLuoghiCorrelati;
25 changes: 25 additions & 0 deletions src/components/ItaliaTheme/View/VenueView/VenueMultimedia.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
import React from 'react';
import { defineMessages, useIntl } from 'react-intl';
import { Gallery } from 'design-comuni-plone-theme/components/ItaliaTheme/View';
import { contentFolderHasItems } from 'design-comuni-plone-theme/helpers';

const messages = defineMessages({
video: {
id: 'Video',
defaultMessage: 'Video',
},
});

const VenueMultimedia = ({ content }) => {
const intl = useIntl();
return contentFolderHasItems(content, 'multimedia') ? (
<Gallery
content={content}
folder_name={'multimedia'}
title_video={intl.formatMessage(messages.video)}
title_type="h5"
/>
) : null;
};

export default VenueMultimedia;
27 changes: 27 additions & 0 deletions src/components/ItaliaTheme/View/VenueView/VenueTipologia.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
import React from 'react';
import { defineMessages, useIntl } from 'react-intl';
import { RichTextSection } from 'design-comuni-plone-theme/components/ItaliaTheme/View';
const messages = defineMessages({
tipologia_luogo: {
id: 'tipologia_luogo',
defaultMessage: 'Tipo di luogo',
},
});

const VenueTipologia = ({ content }) => {
const intl = useIntl();
return content?.tipologia_luogo?.length > 0 ? (
<RichTextSection
tag_id="tipologia"
title={intl.formatMessage(messages.tipologia_luogo)}
>
{content.tipologia_luogo.map((tipologia) => (
<p key={tipologia.token} className="font-serif">
{tipologia.title}
</p>
))}
</RichTextSection>
) : null;
};

export default VenueTipologia;
4 changes: 4 additions & 0 deletions src/components/ItaliaTheme/View/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -195,6 +195,10 @@ export VenueWhere from 'design-comuni-plone-theme/components/ItaliaTheme/View/Ve
export VenuePublicTimetable from 'design-comuni-plone-theme/components/ItaliaTheme/View/VenueView/VenuePublicTimetable';
export VenueContacts from 'design-comuni-plone-theme/components/ItaliaTheme/View/VenueView/VenueContacts';
export VenueMoreInfos from 'design-comuni-plone-theme/components/ItaliaTheme/View/VenueView/VenueMoreInfos';
export VenueTipologia from 'design-comuni-plone-theme/components/ItaliaTheme/View/VenueView/VenueTipologia';
export VenueElementiDiInteresse from 'design-comuni-plone-theme/components/ItaliaTheme/View/VenueView/VenueElementiDiInteresse';
export VenueLuoghiCorrelati from 'design-comuni-plone-theme/components/ItaliaTheme/View/VenueView/VenueLuoghiCorrelati';
export VenueMultimedia from 'design-comuni-plone-theme/components/ItaliaTheme/View/VenueView/VenueMultimedia';

export PuntoDiContattoView from 'design-comuni-plone-theme/components/ItaliaTheme/View/PuntoDiContattoView/PuntoDiContattoView';
export PuntoDiContattoPlaceholderAfterContent from 'design-comuni-plone-theme/components/ItaliaTheme/View/PuntoDiContattoView/Placeholder/AfterContent';
Expand Down

0 comments on commit 68c3ca5

Please sign in to comment.