@eeacms/volto-cca-policy 0.2.1 → 0.2.3

package/src/components/manage/Blocks/TabsBlock/index.js

@@ -0,0 +1,13 @@
+import { DefaultEdit } from '@eeacms/volto-tabs-block/components';
+import Spotlight from './Spotlight';
+
+export default function applyConfig(config) {
+  config.blocks.blocksConfig.tabs_block.variations.push({
+    id: 'spotlight',
+    title: 'Spotlight',
+    isDefault: false,
+    edit: DefaultEdit,
+    view: Spotlight,
+  });
+  return config;
+}

package/src/components/manage/Blocks/TabsBlock/spotlight.less

@@ -0,0 +1,20 @@
+.spotlight-tabs {
+  // this is the container div
+}
+
+.ui.menu.menu-tabs-spotlight-variant {
+  // this is the menu
+  flex-wrap: wrap;
+  border: none;
+  box-shadow: none;
+  // background: #cc000033;
+
+  .item {
+    flex-grow: 2;
+
+    &:before {
+      // border: 0px !important;
+      background: none;
+    }
+  }
+}

package/src/components/manage/Blocks/index.js

@@ -1,6 +1,6 @@
 import { compose } from 'redux';
 
-import installMKHMap from './MKHMap';
+// import installMKHMap from './MKHMap';
 import installECDEIndicatorsBlock from './ECDEIndicators';
 import installCaseStudyExplorerBlock from './CaseStudyExplorer';
 import installSearchAceContent from './SearchAceContent';
@@ -18,6 +18,7 @@ import installC3SIndicatorsOverviewBlock from './C3SIndicatorsOverviewBlock';
 import installC3SIndicatorsGlossaryBlock from './C3SIndicatorsGlossaryBlock';
 import installReadMore from './ReadMore';
 import installCollectionStats from './CollectionStatistics';
+import installTabsBlock from './TabsBlock';
 
 export default function installBlocks(config) {
   config.blocks.blocksConfig.title.restricted = false;
@@ -32,7 +33,7 @@ export default function installBlocks(config) {
     installC3SIndicatorsOverviewBlock,
     installC3SIndicatorsListingBlock,
     installC3SIndicatorsGlossaryBlock,
-    installMKHMap,
+    // installMKHMap,
     installECDEIndicatorsBlock,
     installCaseStudyExplorerBlock,
     installCountryMapObservatory,
@@ -44,6 +45,7 @@ export default function installBlocks(config) {
     installFilterAceContent,
     installTransRegionSelect,
     installCollectionStats,
+    installTabsBlock,
     installListing,
   )(config);
 }

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

@@ -0,0 +1,190 @@
+import { HTMLField, BannerTitle } from '@eeacms/volto-cca-policy/helpers';
+import { Container, Grid } from 'semantic-ui-react';
+import { PortalMessage } from '@eeacms/volto-cca-policy/components';
+import './styles.less';
+
+function MissiongFundingCCAView(props) {
+  const { content } = props;
+
+  return (
+    <div className="mission-funding-cca-view">
+      <BannerTitle
+        content={{ ...content, image: '' }}
+        data={{
+          info: [{ description: '' }],
+          hideContentType: true,
+          hideCreationDate: true,
+          hideModificationDate: true,
+          hidePublishingDate: true,
+          hideDownloadButton: false,
+          hideShareButton: false,
+          subtitle: 'EU and National Funding of Climate Change Adaption',
+        }}
+      />
+
+      <Container>
+        <PortalMessage content={content} />
+        <Grid columns="12">
+          <div className="row">
+            <Grid.Column
+              mobile={12}
+              tablet={12}
+              computer={8}
+              className="col-left"
+            >
+              {!!content.objective && content.objective.data.length > 7 && (
+                <>
+                  <h3>Objective of the funding programme</h3>
+                  <HTMLField value={content.objective} />
+                </>
+              )}
+
+              {!!content.funding_type && (
+                <>
+                  <h3>Type of funding</h3>
+                  <HTMLField value={content.funding_type} />
+                </>
+              )}
+
+              {!!content.budget_range && (
+                <>
+                  <h3>Expected budget range of proposals</h3>
+                  <p>{content.budget_range}</p>
+                </>
+              )}
+
+              {!!content.funding_rate && (
+                <>
+                  <h3>Funding rate (percentage of covered costs)</h3>
+                  <p>{content.funding_rate}</p>
+                </>
+              )}
+              <h3>
+                Can the received funding be combined with other funding sources
+                (blended)?
+              </h3>
+              <p>{content.is_blended === true ? 'Yes' : 'No'}</p>
+              <h3>Is a Consortium required to apply for the funding?</h3>
+              <p>{content.is_consortium_required === true ? 'Yes' : 'No'}</p>
+              {!!content.authority && (
+                <>
+                  <h3>Administering authority</h3>
+                  <p>{content.authority}</p>
+                </>
+              )}
+              {!!content.publication_page && (
+                <>
+                  <h3>Publication page</h3>
+                  <a href={content.publication_page}>
+                    {content.publication_page}
+                  </a>
+                </>
+              )}
+              {!!content.general_info && (
+                <>
+                  <h3>General information</h3>
+                  <a href={content.general_info}>{content.general_info}</a>
+                </>
+              )}
+              {!!content.further_info && (
+                <>
+                  <h3>Further information</h3>
+                  <p>{content.further_info}</p>
+                </>
+              )}
+            </Grid.Column>
+            <Grid.Column
+              mobile={12}
+              tablet={12}
+              computer={4}
+              className="col-right"
+            >
+              <div className="metadata">
+                {!!content.country && content.country.length > 0 && (
+                  <>
+                    <h5>Countries where the funding opportunity is offered</h5>
+                    <p>
+                      {content.country
+                        .map((country) => country.title)
+                        .join(', ')}
+                    </p>
+                  </>
+                )}
+                {!!content.regions && content.regions.length > 0 && (
+                  <>
+                    <h5>Region where the funding is offered</h5>
+                    <p>{content.regions}</p>
+                  </>
+                )}
+                {!!content.rast_steps && content.rast_steps.length > 0 && (
+                  <>
+                    <h5>RAST step(s) of relevance</h5>
+                    <ul>
+                      {content.rast_steps.map((step) => (
+                        <li>{step.title}</li>
+                      ))}
+                    </ul>
+                  </>
+                )}
+                {!!content.eligible_entities &&
+                  content.eligible_entities.length > 0 && (
+                    <>
+                      <h5>Eligible to receive funding</h5>
+                      <ul>
+                        {content.eligible_entities.map((entity) => (
+                          <li>{entity.title}</li>
+                        ))}
+                      </ul>
+                    </>
+                  )}
+                {!!content.sectors && content.eligible_entities.length > 0 && (
+                  <>
+                    <h5>Adaptation Sectors</h5>
+                    <ul>
+                      {content.sectors.map((sector) => (
+                        <li>{sector.title}</li>
+                      ))}
+                    </ul>
+                  </>
+                )}
+              </div>
+            </Grid.Column>
+          </div>
+        </Grid>
+        <Grid columns="12">
+          <div className="row">
+            <Grid.Column
+              mobile={12}
+              tablet={12}
+              computer={12}
+              className="col-full"
+            >
+              <div className="styled-slate has--style_name--content-box-gray styled">
+                <div className="disclaimer content-box">
+                  <div className="content-box-inner">
+                    <p>
+                      <strong>Disclaimer</strong>
+                      <br />
+                      The contents and links to third-party items on this
+                      Mission webpage are developed by the MIP4Adapt team led by
+                      Ricardo, under contract CINEA/2022/OP/0013/SI2.884597
+                      funded by the European Union and do not necessarily
+                      reflect those of the European Union, CINEA, or those of
+                      the European Environment Agency (EEA) as host of the
+                      Climate-ADAPT Platform. Neither the European Union nor
+                      CINEA nor the EEA accepts responsibility or liability
+                      arising out of or in connection with the information on
+                      these pages.
+                    </p>
+                  </div>
+                </div>
+              </div>
+            </Grid.Column>
+          </div>
+        </Grid>
+      </Container>
+    </div>
+  );
+}
+
+export default MissiongFundingCCAView;

package/src/components/theme/Views/MissionFundingCCAView.test.jsx

@@ -0,0 +1,106 @@
+import React from 'react';
+import { MemoryRouter } from 'react-router-dom';
+import configureStore from 'redux-mock-store';
+import { render } from '@testing-library/react';
+import '@testing-library/jest-dom/extend-expect';
+import { Provider } from 'react-intl-redux';
+import MissiongFundingCCAView from './MissionFundingCCAView';
+import config from '@plone/volto/registry';
+
+config.blocks = {
+  blocksConfig: {
+    title: {
+      view: () => <div>Title Block Component</div>,
+    },
+  },
+};
+
+const mockStore = configureStore();
+
+describe('MissiongFundingCCAView', () => {
+  it('should render the component', () => {
+    const data = {
+      content: {
+        contributors: [],
+        country: [
+          {
+            title: 'Albania',
+            token: 'AL',
+          },
+          {
+            title: 'Armenia',
+            token: 'AM',
+          },
+        ],
+        description: 'Summary',
+        eligible_entities: [
+          {
+            title: 'Social, cultural, educational bodies',
+            token: 'B_SOCIAL_CULTURAL',
+          },
+          {
+            title: 'NGOs',
+            token: 'D_NGOS',
+          },
+        ],
+        funding_rate: 'funding rate',
+        funding_type: {
+          'content-type': 'text/html',
+          data: '<p>type of funding</p>',
+          encoding: 'utf8',
+        },
+        further_info: 'further info',
+        general_info: '/sandbox',
+        is_blended: true,
+        is_consortium_required: false,
+        objective: {
+          'content-type': 'text/html',
+          data: '<p></p>',
+          encoding: 'utf8',
+        },
+        publication_page: 'https://google.com',
+        rast_steps: [
+          {
+            title: 'Step 1. Preparing the ground for adaptation',
+            token: 'STEP_1',
+          },
+          {
+            title: 'Step 4. Assessing and selecting adaptation options',
+            token: 'STEP_4',
+          },
+        ],
+        regions: 'region here',
+        sectors: [
+          {
+            title: 'Biodiversity',
+            token: 'BIODIVERSITY',
+          },
+          {
+            title: 'Coastal areas',
+            token: 'COASTAL',
+          },
+        ],
+        title: 'Title here',
+      },
+    };
+
+    const store = mockStore({
+      userSession: { token: '1234' },
+      intl: {
+        locale: 'en',
+        messages: {},
+      },
+    });
+
+    const { container } = render(
+      <Provider store={store}>
+        <MemoryRouter>
+          <MissiongFundingCCAView {...data} />
+        </MemoryRouter>
+      </Provider>,
+    );
+    expect(
+      container.querySelector('.mission-funding-cca-view'),
+    ).toBeInTheDocument();
+  });
+});

package/src/components/theme/Views/styles.less

@@ -0,0 +1,7 @@
+// MissionFundingCCAView
+div.col-right {
+  div.metadata {
+    padding: 10px;
+    background: #e6e7e8;
+  }
+}

package/src/customizations/@plone/volto-slate/blocks/Table/TableBlockView.jsx

@@ -0,0 +1,146 @@
+/**
+ *
+ * Customization of https://github.com/plone/volto/blob/0630a6e7655637c0b811139a738353f682053b79/packages/volto-slate/src/blocks/Table/TableBlockView.jsx#L45
+ * to fix https://github.com/plone/volto/issues/5947
+ *
+ * Slate Table block's View component.
+ * @module volto-slate/blocks/Table/View
+ */
+
+import React, { useState, useMemo } from 'react';
+import PropTypes from 'prop-types';
+import { Table } from 'semantic-ui-react';
+import { map } from 'lodash';
+import {
+  serializeNodes,
+  serializeNodesToText,
+} from '@plone/volto-slate/editor/render';
+// import { Node } from 'slate';
+
+import '@plone/volto-slate/editor/plugins/Table/less/public.less';
+
+/**
+ * Slate Table block's View class.
+ * @class View
+ * @extends Component
+ * @param {object} data The table data to render as a table.
+ */
+const View = ({ data }) => {
+  const [state, setState] = useState({
+    column: null,
+    direction: null,
+  });
+
+  const headers = useMemo(() => {
+    return data.table.rows?.[0]?.cells;
+  }, [data.table.rows]);
+
+  const rows = useMemo(() => {
+    const items = [];
+    if (!data.table.rows) return [];
+    // Customization: we've removed the condition for Node.string(value)
+    data.table.rows.forEach((row, index) => {
+      if (index > 0) {
+        items[index] = [];
+        row.cells.forEach((cell, cellIndex) => {
+          items[index][cellIndex] = {
+            ...cell,
+            value: cell.value ? serializeNodes(cell.value) : '\u00A0',
+            valueText: cell.value ? serializeNodesToText(cell.value) : '\u00A0',
+          };
+        });
+      }
+    });
+    // end Customization
+    return items;
+  }, [data.table.rows]);
+
+  const sortedRows = useMemo(() => {
+    if (state.column === null) return Object.keys(rows);
+    return Object.keys(rows).sort((a, b) => {
+      const a_text = rows[a][state.column].valueText;
+      const b_text = rows[b][state.column].valueText;
+      if (state.direction === 'ascending' ? a_text < b_text : a_text > b_text) {
+        return -1;
+      }
+      if (state.direction === 'ascending' ? a_text > b_text : a_text < b_text) {
+        return 1;
+      }
+      return 0;
+    });
+  }, [state, rows]);
+
+  return (
+    <>
+      {data && data.table && (
+        <Table
+          fixed={data.table.fixed}
+          compact={data.table.compact}
+          basic={data.table.basic ? 'very' : false}
+          celled={data.table.celled}
+          inverted={data.table.inverted}
+          striped={data.table.striped}
+          sortable={data.table.sortable}
+          className="slate-table-block"
+        >
+          {!data.table.hideHeaders ? (
+            <Table.Header>
+              <Table.Row>
+                {headers.map((cell, index) => (
+                  <Table.HeaderCell
+                    key={cell.key}
+                    textAlign="left"
+                    verticalAlign="middle"
+                    sorted={state.column === index ? state.direction : null}
+                    onClick={() => {
+                      if (!data.table.sortable) return;
+                      setState({
+                        column: index,
+                        direction:
+                          state.column !== index
+                            ? 'ascending'
+                            : state.direction === 'ascending'
+                            ? 'descending'
+                            : 'ascending',
+                      });
+                    }}
+                  >
+                    {cell.value ? serializeNodes(cell.value) : '\u00A0'}
+                  </Table.HeaderCell>
+                ))}
+              </Table.Row>
+            </Table.Header>
+          ) : (
+            ''
+          )}
+          <Table.Body>
+            {map(sortedRows, (row) => (
+              <Table.Row key={row}>
+                {map(rows[row], (cell) => (
+                  <Table.Cell
+                    key={cell.key}
+                    textAlign="left"
+                    verticalAlign="middle"
+                  >
+                    {cell.value}
+                  </Table.Cell>
+                ))}
+              </Table.Row>
+            ))}
+          </Table.Body>
+        </Table>
+      )}
+    </>
+  );
+};
+
+/**
+ * Property types.
+ * @property {Object} propTypes Property types.
+ * @static
+ */
+View.propTypes = {
+  data: PropTypes.objectOf(PropTypes.any).isRequired,
+};
+
+export default View;

package/src/customizations/@plone/volto-slate/blocks/Table/index.js

@@ -1,5 +1,5 @@
 import TableBlockEdit from '@plone/volto-slate/blocks/Table/TableBlockEdit';
-import TableBlockView from '@plone/volto-slate/blocks/Table/TableBlockView';
+import TableBlockView from './TableBlockView';
 import { extractTables } from './deconstruct';
 import { normalizeTable } from '@plone/volto-slate/blocks/Table/extensions/normalizeTable';
 import { normalizeExternalData } from '@plone/volto-slate/blocks/Text/extensions';

package/src/index.js

@@ -9,6 +9,7 @@ import CaseStudyView from './components/theme/Views/CaseStudyView';
 import ProjectView from './components/theme/Views/ProjectView';
 import C3SIndicatorView from './components/theme/Views/C3SIndicatorView';
 import DatabaseItemView from './components/theme/Views/DatabaseItemView';
+import MissionFundingCCAView from './components/theme/Views/MissionFundingCCAView';
 
 import HealthHorizontalCardItem from './components/Result/HealthHorizontalCardItem';
 
@@ -285,6 +286,7 @@ const applyConfig = (config) => {
     'eea.climateadapt.c3sindicator': C3SIndicatorView,
     'eea.climateadapt.adaptationoption': AdaptationOptionView,
     'News Item': NewsItemView,
+    mission_funding_cca: MissionFundingCCAView,
   };
 
   config.views.layoutViewsNamesMapping.view_cca_event = 'CCA Event View';

package/src/search/health_observatory/config-health.js

@@ -18,51 +18,46 @@ export const clusters = {
       name: 'Case studies',
       icon: { name: 'file text' },
       values: ['Case study'],
-      defaultResultView: 'horizontalCard',
     },
     {
       name: 'Guidance',
       icon: { name: 'compass' },
       values: ['Guidance'],
-      defaultResultView: 'horizontalCard',
     },
     {
       name: 'Indicators',
       icon: { name: 'area chart' },
       values: ['Indicator'],
-      defaultResultView: 'horizontalCard',
     },
     {
       name: 'Information portals',
       icon: { name: 'info circle' },
       values: ['Information portal'],
-      defaultResultView: 'horizontalCard',
     },
     {
       name: 'Publications and reports',
       icon: { name: 'newspaper' },
       values: ['Publication reference'],
-      defaultResultView: 'horizontalCard',
     },
     {
       name: 'Research and knowledge projects',
       icon: { name: 'university' },
       values: ['Research and knowledge project'],
-      defaultResultView: 'horizontalCard',
     },
     {
       name: 'Tools',
       icon: { name: 'wrench' },
       values: ['Tool'],
-      defaultResultView: 'horizontalCard',
     },
     {
       name: 'Videos',
       icon: { name: 'video play' },
       values: ['Video'],
-      defaultResultView: 'horizontalCard',
     },
-  ],
+  ].map((cluster) => ({
+    ...cluster,
+    defaultResultView: 'horizontalCard',
+  })),
 };
 
 export default function installMainSearch(config) {