@eeacms/volto-cca-policy 0.2.84 → 0.2.86

package/CHANGELOG.md

@@ -4,6 +4,19 @@ All notable changes to this project will be documented in this file. Dates are d
 
 Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
+### [0.2.86](https://github.com/eea/volto-cca-policy/compare/0.2.85...0.2.86) - 18 December 2024
+
+#### :rocket: Dependency updates
+
+- Release @eeacms/volto-searchlib@2.0.6 [EEA Jenkins - [`05e0fe3`](https://github.com/eea/volto-cca-policy/commit/05e0fe3792bc2406b89c4e0a8c17941a661276ba)]
+
+### [0.2.85](https://github.com/eea/volto-cca-policy/compare/0.2.84...0.2.85) - 18 December 2024
+
+#### :nail_care: Enhancements
+
+- change(view): update Events view - refs #281788 [kreafox - [`f1b8278`](https://github.com/eea/volto-cca-policy/commit/f1b8278b265d50b99f59cbeab9ad9298b0d06d44)]
+- change(view): update News Item view - refs #281788 [kreafox - [`16e1ad7`](https://github.com/eea/volto-cca-policy/commit/16e1ad7763ecea115b611d1538d033b8241fc525)]
+
 ### [0.2.84](https://github.com/eea/volto-cca-policy/compare/0.2.83...0.2.84) - 17 December 2024
 
 #### :hammer_and_wrench: Others

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-cca-policy",
-  "version": "0.2.84",
+  "version": "0.2.86",
   "description": "@eeacms/volto-cca-policy: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",
@@ -35,7 +35,7 @@
     "@eeacms/volto-globalsearch": "^1.1.0",
     "@eeacms/volto-hero-block": "^7.1.0",
     "@eeacms/volto-openlayers-map": "*",
-    "@eeacms/volto-searchlib": "2.0.5",
+    "@eeacms/volto-searchlib": "2.0.6",
     "@eeacms/volto-slate-label": "^0.6.0",
     "@eeacms/volto-tabs-block": "^7.5.1",
     "@elastic/search-ui": "1.21.2",

package/src/components/theme/BannerTitle/BannerTitle.jsx

@@ -11,8 +11,8 @@ const BannerTitle = (props) => {
   } = config;
   const contentTypes = ['Subsite', 'LRF', 'Plone Site'];
   const TitleBlockView = blocksConfig?.title?.view;
-  const hasTitleBlock = hasTypeOfBlock(blocks, '@type', 'title');
-  const hasCountryFlagBlock = hasTypeOfBlock(blocks, '@type', 'countryFlag');
+  const hasTitleBlock = hasTypeOfBlock(blocks, 'title');
+  const hasCountryFlagBlock = hasTypeOfBlock(blocks, 'countryFlag');
   const [hasBodyClass, setHasBodyClass] = React.useState(false);
   const isHomePage = contentTypes.indexOf(type) > -1 || hasBodyClass;
 

package/src/components/theme/Views/CcaEventView.jsx

@@ -48,10 +48,11 @@ function CcaEventView(props) {
   } = content;
 
   const {
-    blocks: filtered_blocks,
-    blocks_layout: filtered_blocks_layout,
-  } = filterBlocks(content, 'tabs_block');
-  const titleBlock = Object.values(filtered_blocks).find(
+    blocks: filteredBlocks,
+    blocks_layout: filteredBlocksLayout,
+  } = filterBlocks(content, ['tabs_block', 'metadataSection']);
+
+  const titleBlock = Object.values(filteredBlocks).find(
     (block) => block['@type'] === 'title',
   );
   if (titleBlock && !titleBlock.subtitle && content.subtitle) {
@@ -60,16 +61,6 @@ function CcaEventView(props) {
 
   return (
     <div className="cca-event-view">
-      <RenderBlocks
-        {...props}
-        content={{
-          ...content,
-          '@type': 'climate-adapt-event',
-          blocks: filtered_blocks,
-          blocks_layout: filtered_blocks_layout,
-        }}
-      />
-
       <Container>
         <PortalMessage content={content} />
         <Grid columns="12">
@@ -143,6 +134,16 @@ function CcaEventView(props) {
                   <p>{event_language.title}</p>
                 </>
               )}
+
+              <RenderBlocks
+                {...props}
+                content={{
+                  ...content,
+                  '@type': 'climate-adapt-event',
+                  blocks: filteredBlocks,
+                  blocks_layout: filteredBlocksLayout,
+                }}
+              />
             </Grid.Column>
             <Grid.Column
               mobile={12}

package/src/components/theme/Views/EventView.jsx

@@ -11,11 +11,13 @@ import { PortalMessage } from '@eeacms/volto-cca-policy/components';
 
 function EventView(props) {
   const { content } = props;
+  // These blocks are used in the Edit View for dexterity layout.
+  // We don't want to display them in the View mode.
   const {
-    blocks: filtered_blocks,
-    blocks_layout: filtered_blocks_layout,
-    hasBlockType,
-  } = filterBlocks(content, 'tabs_block');
+    blocks: filteredBlocks,
+    blocks_layout: filteredBlocksLayout,
+    hasBlockTypes,
+  } = filterBlocks(content, ['tabs_block', 'metadataSection']);
 
   return (
     <div className="cca-event-view">
@@ -25,7 +27,7 @@ function EventView(props) {
         <Grid columns="12">
           <Grid.Row>
             <Grid.Column mobile={12} tablet={12} computer={8}>
-              {hasBlockType && (
+              {hasBlockTypes && (
                 <>
                   <p className="documentDescription">{content.description}</p>
                   <HTMLField value={content.text} className="content-text" />
@@ -36,8 +38,8 @@ function EventView(props) {
                 {...props}
                 content={{
                   ...content,
-                  blocks: filtered_blocks,
-                  blocks_layout: filtered_blocks_layout,
+                  blocks: filteredBlocks,
+                  blocks_layout: filteredBlocksLayout,
                 }}
               />
 

package/src/components/theme/Views/NewsItemView.jsx

@@ -4,48 +4,56 @@ import { filterBlocks } from '@eeacms/volto-cca-policy/utils';
 import { PortalMessage } from '@eeacms/volto-cca-policy/components';
 import { HTMLField, SubjectTags } from '@eeacms/volto-cca-policy/helpers';
 import RenderBlocks from '@plone/volto/components/theme/View/RenderBlocks';
-import { When } from '@plone/volto/components/theme/View/EventDatesInfo';
 
-const PublicationDate = (props) => {
-  const date = props.content?.effective;
-  return date ? (
-    <div className="news-date-info">
-      Date:
-      <When start={date} end={date} whole_day={true} open_end={false} />
-    </div>
-  ) : null;
+const DescriptionText = ({ content }) => {
+  return (
+    <>
+      <p className="documentDescription">{content.description}</p>
+      <HTMLField value={content.text} className="content-text" />
+    </>
+  );
 };
 
 function NewsItemView(props) {
   const { content } = props;
+
+  // if (content.image_caption) {
+  //   Object.values(content.blocks).forEach((block) => {
+  //     if (block['@type'] === 'title' && !block.copyright?.trim()) {
+  //       block.copyright = content.image_caption;
+  //     }
+  //   });
+  // }
+
+  // These blocks are used in the Edit View for dexterity layout.
+  // We don't want to display them in the View mode.
   const {
-    blocks: filtered_blocks,
-    blocks_layout: filtered_blocks_layout,
-    hasBlockType,
-  } = filterBlocks(content, 'tabs_block');
+    blocks: filteredBlocks,
+    blocks_layout: filteredBlocksLayout,
+    hasBlockTypes,
+  } = filterBlocks(content, ['tabs_block', 'metadataSection']);
 
   return (
     <div className="cca-newsitem-view">
-      <PortalMessage content={content} />
-
       <Container>
-        {hasBlockType && (
+        <PortalMessage content={content} />
+        {hasBlockTypes ? (
+          <>
+            <DescriptionText content={content} />
+            <RenderBlocks
+              {...props}
+              content={{
+                ...content,
+                blocks: filteredBlocks,
+                blocks_layout: filteredBlocksLayout,
+              }}
+            />
+          </>
+        ) : (
           <>
-            <p className="documentDescription">{content.description}</p>
-            <HTMLField value={content.text} className="content-text" />
+            <RenderBlocks {...props} content={content} />
           </>
         )}
-
-        <RenderBlocks
-          {...props}
-          content={{
-            ...content,
-            blocks: filtered_blocks,
-            blocks_layout: filtered_blocks_layout,
-          }}
-        />
-
-        <PublicationDate {...props} />
         <SubjectTags {...props} />
       </Container>
     </div>

package/src/helpers/Constants.jsx

@@ -520,6 +520,7 @@ export const EU_COUNTRIES = [
   'HU',
   'IE',
   'IT',
+  'LI',
   'LT',
   'LU',
   'LV',

package/src/utils.js

@@ -32,16 +32,16 @@ export function getBaseUrl(props) {
   return path;
 }
 
-export const hasTypeOfBlock = (obj, type, name) => {
+export const hasTypeOfBlock = (obj, name) => {
   for (const key in obj) {
     if (obj.hasOwnProperty(key)) {
-      if (key === type && obj[key] === name) {
+      if (key === '@type' && obj[key] === name) {
         // console.log(`Key "${type}" with value "${name}" found`);
         return true;
       }
 
       if (typeof obj[key] === 'object' && obj[key] !== null) {
-        if (hasTypeOfBlock(obj[key], type, name)) {
+        if (hasTypeOfBlock(obj[key], name)) {
           return true;
         }
       }
@@ -51,22 +51,29 @@ export const hasTypeOfBlock = (obj, type, name) => {
   return false;
 };
 
-export const filterBlocks = (content, block_type) => {
-  const filteredBlocks = { ...content.blocks };
-  const filteredBlocksLayout = { ...content.blocks_layout };
+export const filterBlocks = (content, blockTypes = []) => {
+  const allBlocks = content.blocks || {};
+  const allBlockKeys = Object.keys(allBlocks);
 
-  const filteredBlockUID = Object.keys(filteredBlocks)?.filter(
-    (key) => filteredBlocks[key]['@type'] === block_type,
-  );
-  filteredBlockUID.forEach((key) => delete filteredBlocks[key]);
-  filteredBlocksLayout.items = filteredBlocksLayout?.items?.filter(
-    (item) => !filteredBlockUID.includes(item),
+  const filteredBlocks = { ...allBlocks };
+  const filteredLayoutItems = [...(content.blocks_layout?.items || [])];
+
+  const excludedBlockKeys = allBlockKeys.filter((key) =>
+    blockTypes.includes(allBlocks[key]['@type']),
   );
-  const hasBlockType = filteredBlockUID.length > 0;
+
+  excludedBlockKeys.forEach((key) => {
+    delete filteredBlocks[key];
+  });
 
   return {
     blocks: filteredBlocks,
-    blocks_layout: filteredBlocksLayout,
-    hasBlockType,
+    blocks_layout: {
+      ...content.blocks_layout,
+      items: filteredLayoutItems.filter(
+        (item) => !excludedBlockKeys.includes(item),
+      ),
+    },
+    hasBlockTypes: excludedBlockKeys.length > 0,
   };
 };

package/theme/globals/views.less

@@ -310,15 +310,8 @@ hr {
 
 .cca-newsitem-view,
 .cca-event-view {
-  .news-date-info {
-    display: flex;
-    gap: 3px;
-    justify-content: flex-end;
-  }
-
   .content-text p {
     margin: 0em 0em 1em;
-    line-height: 1.5;
   }
 }