@eeacms/volto-cca-policy 0.2.98 → 0.2.100

package/locales/volto.pot

@@ -1,7 +1,7 @@
 msgid ""
 msgstr ""
 "Project-Id-Version: Plone\n"
-"POT-Creation-Date: 2025-01-21T10:42:44.543Z\n"
+"POT-Creation-Date: 2025-02-03T13:57:05.869Z\n"
 "Last-Translator: Plone i18n <plone-i18n@lists.sourceforge.net>\n"
 "Language-Team: Plone i18n <plone-i18n@lists.sourceforge.net>\n"
 "Content-Type: text/plain; charset=utf-8\n"
@@ -60,16 +60,6 @@ msgstr ""
 msgid "Agenda and supporting documents"
 msgstr ""
 
-#. Default: "Apr"
-#: components/manage/Blocks/Listing/EventCardsListingView
-msgid "Apr"
-msgstr ""
-
-#. Default: "Aug"
-#: components/manage/Blocks/Listing/EventCardsListingView
-msgid "Aug"
-msgstr ""
-
 #. Default: "Background information"
 #: components/theme/Views/C3SIndicatorView
 msgid "Background information"
@@ -110,6 +100,11 @@ msgstr ""
 msgid "Challenges"
 msgstr ""
 
+#. Default: "Choose a file"
+#: components/theme/Widgets/PromotionalImageWidget
+msgid "Choose a file"
+msgstr ""
+
 #. Default: "Choose a region"
 #: components/manage/Blocks/TransRegionSelect/TransRegionSelectView
 msgid "Choose a region"
@@ -193,11 +188,6 @@ msgstr ""
 msgid "Date of release:"
 msgstr ""
 
-#. Default: "Dec"
-#: components/manage/Blocks/Listing/EventCardsListingView
-msgid "Dec"
-msgstr ""
-
 #. Default: "Description"
 #: helpers/Utils
 msgid "Description"
@@ -228,6 +218,21 @@ msgstr ""
 msgid "Download this event in iCal format"
 msgstr ""
 
+#. Default: "Drop file here to replace the existing file"
+#: components/theme/Widgets/PromotionalImageWidget
+msgid "Drop file here to replace the existing file"
+msgstr ""
+
+#. Default: "Drop file here to upload a new file"
+#: components/theme/Widgets/PromotionalImageWidget
+msgid "Drop file here to upload a new file"
+msgstr ""
+
+#. Default: "Drop files here ..."
+#: components/theme/Widgets/PromotionalImageWidget
+msgid "Drop files here ..."
+msgstr ""
+
 #. Default: "Duration:"
 #: helpers/ContentMetadata
 msgid "Duration:"
@@ -243,21 +248,11 @@ msgstr ""
 msgid "Explore more on Climate-ADAPT"
 msgstr ""
 
-#. Default: "Feb"
-#: components/manage/Blocks/Listing/EventCardsListingView
-msgid "Feb"
-msgstr ""
-
 #. Default: "For more search options"
 #: index
 msgid "For more search options"
 msgstr ""
 
-#. Default: "Fr"
-#: components/manage/Blocks/Listing/EventCardsListingView
-msgid "Fr"
-msgstr ""
-
 #. Default: "Fullscreen"
 #: components/theme/Views/C3SIndicatorView
 msgid "Fullscreen"
@@ -344,21 +339,6 @@ msgstr ""
 msgid "Info"
 msgstr ""
 
-#. Default: "Jan"
-#: components/manage/Blocks/Listing/EventCardsListingView
-msgid "Jan"
-msgstr ""
-
-#. Default: "Jul"
-#: components/manage/Blocks/Listing/EventCardsListingView
-msgid "Jul"
-msgstr ""
-
-#. Default: "Jun"
-#: components/manage/Blocks/Listing/EventCardsListingView
-msgid "Jun"
-msgstr ""
-
 #. Default: "Key Type Measure"
 #: components/manage/Blocks/FilterAceContent/FilterAceContentView
 msgid "Key Type Measure"
@@ -389,11 +369,6 @@ msgstr ""
 msgid "Language of the conference"
 msgstr ""
 
-#. Default: "Last Modified in Climate-ADAPT"
-#: helpers/Utils
-msgid "Last Modified in Climate-ADAPT"
-msgstr ""
-
 #. Default: "Lead"
 #: components/theme/Views/ProjectView
 msgid "Lead"
@@ -426,21 +401,6 @@ msgstr ""
 msgid "Macro-Transnational region:"
 msgstr ""
 
-#. Default: "Mar"
-#: components/manage/Blocks/Listing/EventCardsListingView
-msgid "Mar"
-msgstr ""
-
-#. Default: "May"
-#: components/manage/Blocks/Listing/EventCardsListingView
-msgid "May"
-msgstr ""
-
-#. Default: "Mo"
-#: components/manage/Blocks/Listing/EventCardsListingView
-msgid "Mo"
-msgstr ""
-
 #. Default: "National HHAP"
 #: components/manage/Blocks/CountryMapHeatIndex/Filter
 msgid "National HHAP"
@@ -461,11 +421,6 @@ msgstr ""
 msgid "No results"
 msgstr ""
 
-#. Default: "Nov"
-#: components/manage/Blocks/Listing/EventCardsListingView
-msgid "Nov"
-msgstr ""
-
 #. Default: "Objectives of the adaptation measure"
 #: components/theme/Views/CaseStudyView
 msgid "Objectives of the adaptation measure"
@@ -481,16 +436,16 @@ msgstr ""
 msgid "Observatory contributions"
 msgstr ""
 
-#. Default: "Oct"
-#: components/manage/Blocks/Listing/EventCardsListingView
-msgid "Oct"
-msgstr ""
-
 #. Default: "Organisation Documents"
 #: helpers/Utils
 msgid "Organisation Documents"
 msgstr ""
 
+#. Default: "Organised by EEA"
+#: components/manage/Blocks/Listing/EventCardsListingView
+msgid "Organised by EEA"
+msgstr ""
+
 #. Default: "Other regions"
 #: components/manage/Blocks/TransRegionSelect/TransRegionSelectView
 msgid "Other regions"
@@ -511,6 +466,11 @@ msgstr ""
 msgid "Policy and legal background"
 msgstr ""
 
+#. Default: "Policy context of the adaptation measure"
+#: components/theme/Views/CaseStudyView
+msgid "Policy context of the adaptation measure"
+msgstr ""
+
 #. Default: "Practical information"
 #: components/theme/Views/CcaEventView
 msgid "Practical information"
@@ -568,14 +528,9 @@ msgstr ""
 msgid "Related documents and presentations"
 msgstr ""
 
-#. Default: "Relevance"
-#: components/theme/Views/CaseStudyView
-msgid "Relevance"
-msgstr ""
-
-#. Default: "Sa"
-#: components/manage/Blocks/Listing/EventCardsListingView
-msgid "Sa"
+#. Default: "Replace existing file"
+#: components/theme/Widgets/PromotionalImageWidget
+msgid "Replace existing file"
 msgstr ""
 
 #. Default: "Search the Climate-ADAPT database"
@@ -624,11 +579,6 @@ msgstr ""
 msgid "Select"
 msgstr ""
 
-#. Default: "Sep"
-#: components/manage/Blocks/Listing/EventCardsListingView
-msgid "Sep"
-msgstr ""
-
 #. Default: "Share your information"
 #: components/manage/Blocks/SearchAceContent/SearchAceContentView
 #: components/theme/ShareInfoButton/ShareInfoButton
@@ -658,11 +608,6 @@ msgstr ""
 msgid "Stakeholder participation"
 msgstr ""
 
-#. Default: "Su"
-#: components/manage/Blocks/Listing/EventCardsListingView
-msgid "Su"
-msgstr ""
-
 #. Default: "Sub Nationals:"
 #: helpers/ContentMetadata
 msgid "Sub Nationals:"
@@ -679,11 +624,6 @@ msgstr ""
 msgid "Success and limiting factors"
 msgstr ""
 
-#. Default: "Th"
-#: components/manage/Blocks/Listing/EventCardsListingView
-msgid "Th"
-msgstr ""
-
 #. Default: "The Adaptation Support Tool - Getting started"
 #: components/theme/ASTNavigation/ASTAccordion
 msgid "The Adaptation Support Tool - Getting started"
@@ -704,11 +644,6 @@ msgstr ""
 msgid "The date refers to the moment in which the item has been prepared or updated by contributing experts to be submitted for the publication in Climate ADAPT"
 msgstr ""
 
-#. Default: "Tu"
-#: components/manage/Blocks/Listing/EventCardsListingView
-msgid "Tu"
-msgstr ""
-
 #. Default: "Updating notes"
 #: components/theme/Views/CaseStudyView
 msgid "Updating notes"
@@ -724,11 +659,6 @@ msgstr ""
 msgid "Visit external website"
 msgstr ""
 
-#. Default: "We"
-#: components/manage/Blocks/Listing/EventCardsListingView
-msgid "We"
-msgstr ""
-
 #. Default: "Web"
 #: helpers/Utils
 msgid "Web"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-cca-policy",
-  "version": "0.2.98",
+  "version": "0.2.100",
   "description": "@eeacms/volto-cca-policy: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",

package/src/components/manage/Blocks/Listing/EventCardsListingView.jsx

@@ -1,186 +1,161 @@
 import React from 'react';
-import PropTypes from 'prop-types';
 import { compose } from 'redux';
-import { connect } from 'react-redux';
-import { Card, Grid, Icon, Label } from 'semantic-ui-react';
-import { useIntl, defineMessages, FormattedMessage } from 'react-intl';
+import PropTypes from 'prop-types';
+import { FormattedMessage } from 'react-intl';
+import { connect, useSelector } from 'react-redux';
+import { Card, Grid, Icon, Label, Image } from 'semantic-ui-react';
 import { ConditionalLink, UniversalLink } from '@plone/volto/components';
 import { When } from '@plone/volto/components/theme/View/EventDatesInfo';
+import eeaLogo from '@eeacms/volto-cca-policy/../theme/assets/images/eea-logo.svg';
+import { capitalizeFirstLetter } from '@eeacms/volto-cca-policy/helpers';
+import config from '@plone/volto/registry';
 import './styles.less';
 
-const Separator = () => {
-  return <div className="sep">&nbsp;&nbsp;⎯&nbsp;&nbsp;</div>;
-};
-
-const messages = defineMessages({
-  jan: { id: 'Jan', defaultMessage: 'Jan' },
-  feb: { id: 'Feb', defaultMessage: 'Feb' },
-  mar: { id: 'Mar', defaultMessage: 'Mar' },
-  apr: { id: 'Apr', defaultMessage: 'Apr' },
-  may: { id: 'May', defaultMessage: 'May' },
-  jun: { id: 'Jun', defaultMessage: 'Jun' },
-  jul: { id: 'Jul', defaultMessage: 'Jul' },
-  aug: { id: 'Aug', defaultMessage: 'Aug' },
-  sep: { id: 'Sep', defaultMessage: 'Sep' },
-  oct: { id: 'Oct', defaultMessage: 'Oct' },
-  nov: { id: 'Nov', defaultMessage: 'Nov' },
-  dec: { id: 'Dec', defaultMessage: 'Dec' },
-
-  mo: { id: 'Mo', defaultMessage: 'Mo' },
-  tu: { id: 'Tu', defaultMessage: 'Tu' },
-  we: { id: 'We', defaultMessage: 'We' },
-  th: { id: 'Th', defaultMessage: 'Th' },
-  fr: { id: 'Fr', defaultMessage: 'Fr' },
-  sa: { id: 'Sa', defaultMessage: 'Sa' },
-  su: { id: 'Su', defaultMessage: 'Su' },
-});
+const goToContact = (contactInfo) =>
+  contactInfo.includes('@') ? `mailto:${contactInfo}` : contactInfo;
 
-const StartDate = (start) => {
-  const start_date = new Date(start);
+const getEventUrl = (item) => item?.event_url || item['@id'];
 
-  const day = start_date.getDate();
-  const monthIndex = start_date.getMonth();
+const StartDate = ({ start }) => {
+  const startDate = new Date(start);
+  const day = startDate.getDate();
+  const currentLang = useSelector((state) => state.intl.locale);
 
-  const intl = useIntl();
-  const monthNames = [
-    intl.formatMessage(messages.jan),
-    intl.formatMessage(messages.feb),
-    intl.formatMessage(messages.mar),
-    intl.formatMessage(messages.apr),
-    intl.formatMessage(messages.may),
-    intl.formatMessage(messages.jun),
-    intl.formatMessage(messages.jul),
-    intl.formatMessage(messages.aug),
-    intl.formatMessage(messages.sep),
-    intl.formatMessage(messages.oct),
-    intl.formatMessage(messages.nov),
-    intl.formatMessage(messages.dec),
-  ];
-
-  const dayNames = {
-    Mo: intl.formatMessage(messages.mo),
-    Tu: intl.formatMessage(messages.tu),
-    We: intl.formatMessage(messages.we),
-    Th: intl.formatMessage(messages.th),
-    Fr: intl.formatMessage(messages.fr),
-    Sa: intl.formatMessage(messages.sa),
-    Su: intl.formatMessage(messages.su),
-  };
-
-  const monthName = monthNames[monthIndex];
+  const monthName = capitalizeFirstLetter(
+    startDate.toLocaleDateString(currentLang, { month: 'short' }),
+  );
 
-  const dayOfWeek =
-    dayNames[
-      start_date.toLocaleDateString('en', { weekday: 'short' }).substring(0, 2)
-    ];
+  const dayOfWeek = capitalizeFirstLetter(
+    startDate.toLocaleDateString(currentLang, { weekday: 'short' }),
+  );
 
   return (
     <div className="start-date">
       <p className="day">{dayOfWeek}</p>
-      <p className="date">
-        {day} {monthName}
-      </p>
+      <p className="date">{`${day} ${monthName}`}</p>
     </div>
   );
 };
 
-const EventCardsListingView = ({ items, isEditMode, token }) => {
-  const goToContact = (contactInfo) =>
-    contactInfo.includes('@') ? `mailto:${contactInfo}` : contactInfo;
-
-  const getEventUrl = (item) => item.event_url || item['@id'];
+const EventCard = ({ item, isEditMode }) => (
+  <div className="u-item listing-item simple-listing-item" key={item.UID}>
+    <div className="wrapper">
+      <Card fluid>
+        <Card.Content>
+          <Grid stackable columns={12}>
+            <Grid.Column width={2}>
+              {item?.start && <StartDate start={item.start} />}
+            </Grid.Column>
+            <Grid.Column width={10}>
+              <div className="event-details">
+                <h3 className="listing-header">
+                  <UniversalLink href={getEventUrl(item)}>
+                    {item.title}
+                  </UniversalLink>
+                </h3>
+                <EventDetails item={item} isEditMode={isEditMode} />
+              </div>
+            </Grid.Column>
+          </Grid>
+        </Card.Content>
+      </Card>
+    </div>
+  </div>
+);
+
+const EventDetails = ({ item, isEditMode }) => (
+  <>
+    {item?.start && (
+      <div className="listing-body-dates">
+        <span className="event-date">
+          <Icon className="ri-calendar-line" />
+          <When
+            whole_day
+            start={item.start}
+            end={item.end}
+            open_end={item.open_end}
+          />
+        </span>
+      </div>
+    )}
+    {item?.location && (
+      <div className="listing-body-dates">
+        <span className="event-date">
+          <Icon className="map marker alternate" />
+          {item.location}
+        </span>
+      </div>
+    )}
+    {item?.description && (
+      <p className="listing-description">{item.description}</p>
+    )}
+    <BottomInfo item={item} isEditMode={isEditMode} />
+  </>
+);
+
+const BottomInfo = ({ item, isEditMode }) => {
+  const { '@type': itemType, event_url, subjects, contact_email } = item || {};
+  const isCcaEventType = itemType === 'cca-event';
+  const isExternal = event_url && !event_url.includes(config.settings.apiPath);
 
   return (
-    <div className="ui fluid eventCards">
-      {items.map((item, index) => (
-        <div className="u-item listing-item simple-listing-item" key={item.UID}>
-          <div className="wrapper">
-            <Card fluid>
-              <Card.Content>
-                <Grid stackable columns={12}>
-                  <Grid.Column width={2}>
-                    {!!item.start && StartDate(item.start)}
-                  </Grid.Column>
-                  <Grid.Column width={10}>
-                    <div className="event-details">
-                      <h3 className="listing-header">
-                        <UniversalLink href={getEventUrl(item)}>
-                          {item.title}
-                        </UniversalLink>
-                      </h3>
-                      {!!item.start && (
-                        <div className="listing-body-dates">
-                          <span className="event-date">
-                            <Icon className="ri-calendar-line" />
-                            <When
-                              start={item.start}
-                              end={item.end}
-                              whole_day={true}
-                              open_end={item.open_end}
-                            />
-                          </span>
-                        </div>
-                      )}
-                      {!!item.location && (
-                        <div className="listing-body-dates">
-                          <span className="event-date">
-                            <Icon className="map marker alternate" />
-                            {item.location}
-                          </span>
-                        </div>
-                      )}
-                      {item.description && (
-                        <p className="listing-description">
-                          {item.description}
-                        </p>
-                      )}
-                      <div className="bottom-info">
-                        {!!item.subjects && item.subjects.length > 0 && (
-                          <>
-                            <div className="subjects">
-                              {item.subjects.map((tag) => (
-                                <Label key={tag} size="small">
-                                  {tag}
-                                </Label>
-                              ))}
-                            </div>
-
-                            <Separator />
-                          </>
-                        )}
-                        <div className="source">
-                          <ConditionalLink item={item} condition={!isEditMode}>
-                            <FormattedMessage
-                              id="Climate-ADAPT page for this event"
-                              defaultMessage="Climate-ADAPT page for this event"
-                            />
-                          </ConditionalLink>
-                        </div>
-                        {!!item.contact_email && (
-                          <>
-                            <Separator />
-                            <div className="email-info">
-                              <Icon className="mail" />
-                              <a
-                                className="contact_email"
-                                title=""
-                                href={goToContact(item.contact_email)}
-                                target="_blank"
-                                rel="noreferrer"
-                              >
-                                {item.contact_email}
-                              </a>
-                            </div>
-                          </>
-                        )}
-                      </div>
-                    </div>
-                  </Grid.Column>
-                </Grid>
-              </Card.Content>
-            </Card>
+    <>
+      {(!isExternal || isCcaEventType) && (
+        <div className="event-organisation">
+          <FormattedMessage
+            id="Organised by EEA"
+            defaultMessage="Organised by EEA"
+          />
+          <Image
+            className="eea-logo"
+            src={eeaLogo}
+            alt="European Environment Agency"
+            title="European Environment Agency"
+          />
+        </div>
+      )}
+      <div className="bottom-info">
+        {subjects && subjects.length > 0 && (
+          <div className="subjects">
+            {subjects.map((tag) => (
+              <Label key={tag} size="small">
+                {tag}
+              </Label>
+            ))}
           </div>
+        )}
+
+        <div className="source">
+          <ConditionalLink item={item} condition={!isEditMode}>
+            <FormattedMessage
+              id="Climate-ADAPT page for this event"
+              defaultMessage="Climate-ADAPT page for this event"
+            />
+          </ConditionalLink>
         </div>
+        {contact_email && (
+          <div className="email-info">
+            <Icon name="mail" />
+            <a
+              className="contact_email"
+              href={goToContact(contact_email)}
+              target="_blank"
+              rel="noreferrer"
+            >
+              {contact_email}
+            </a>
+          </div>
+        )}
+      </div>
+    </>
+  );
+};
+
+const EventCardsListingView = ({ items, isEditMode }) => {
+  return (
+    <div className="ui fluid eventCards">
+      {items.map((item) => (
+        <EventCard key={item.UID} item={item} isEditMode={isEditMode} />
       ))}
     </div>
   );