diff --git a/package.json b/package.json
index 96cb13ba..edca89db 100644
--- a/package.json
+++ b/package.json
@@ -23,6 +23,7 @@
"@eeacms/volto-columns-block",
"@eeacms/volto-corsproxy",
"@eeacms/volto-block-style",
+ "@eeacms/volto-collection-block",
"@eeacms/volto-sentry-rancher-config"
],
"jest": {
@@ -102,6 +103,7 @@
},
"dependencies": {
"@eeacms/volto-corsproxy": "2.1.0",
+ "@eeacms/volto-collection-block": "github:eea/volto-collection-block",
"@eeacms/volto-block-style": "2.2.0",
"@eeacms/volto-columns-block": "^3.0.0",
"@eeacms/volto-sentry-rancher-config": "^2.0.0",
diff --git a/src/actions/index.js b/src/actions/index.js
index 8822138c..315f1dc8 100644
--- a/src/actions/index.js
+++ b/src/actions/index.js
@@ -12,7 +12,6 @@
*/
import {
- GET_INDEX_VALUES,
SET_FOLDER_HEADER,
SET_FOLDER_TABS,
GET_PARENT_FOLDER_DATA,
@@ -82,13 +81,13 @@ export function quickSearchContent(url, options, subrequest = null) {
console.log('in action - quicksearch');
let queryArray = [];
- const arrayOptions = pickBy(options, item => isArray(item));
+ const arrayOptions = pickBy(options, (item) => isArray(item));
queryArray = concat(
queryArray,
options
? join(
- map(toPairs(pickBy(options, item => !isArray(item))), item => {
+ map(toPairs(pickBy(options, (item) => !isArray(item))), (item) => {
if (item[0] === 'SearchableText') {
// Adds the wildcard to the SearchableText param
item[1] = `${item[1]}*`;
@@ -105,7 +104,10 @@ export function quickSearchContent(url, options, subrequest = null) {
arrayOptions
? join(
map(pickBy(arrayOptions), (item, key) =>
- join(item.map(value => `${key}:list=${value}`), '&'),
+ join(
+ item.map((value) => `${key}:list=${value}`),
+ '&',
+ ),
),
'&',
)
@@ -130,14 +132,3 @@ export function quickResetSearchContent(subrequest = null) {
subrequest,
};
}
-
-export function getIndexValues(name) {
- return {
- type: GET_INDEX_VALUES,
- request: {
- op: 'post',
- path: '/@index-values',
- data: { name },
- },
- };
-}
diff --git a/src/components/theme/Collection/BlockEdit.jsx b/src/components/theme/Collection/BlockEdit.jsx
deleted file mode 100644
index 6004f0c2..00000000
--- a/src/components/theme/Collection/BlockEdit.jsx
+++ /dev/null
@@ -1,158 +0,0 @@
-import navTreeSVG from '@plone/volto/icons/nav.svg';
-import clearSVG from '@plone/volto/icons/clear.svg';
-import { Segment } from 'semantic-ui-react';
-import PropTypes from 'prop-types';
-import React, { Component } from 'react';
-import { SidebarPortal } from '@plone/volto/components';
-import { TextWidget } from '@plone/volto/components';
-import { connect } from 'react-redux';
-import { getBaseUrl } from '@plone/volto/helpers';
-import { getContent, getVocabulary } from '@plone/volto/actions';
-import SelectListingType from './SelectListingType';
-import { SelectWidget } from '@plone/volto/components';
-import BlockView from './BlockView';
-
-const vocabulary = 'plone.app.contenttypes.metadatafields';
-
-class Edit extends Component {
- constructor(props) {
- super(props);
-
- this.state = {
- items: [],
- // index_name: this.props.data.index_name || '',
- };
-
- this.updateContent = this.updateContent.bind(this);
- this.getRequestKey = this.getRequestKey.bind(this);
- this.handleChange = this.handleChange.bind(this);
- }
-
- handleChange(id, value) {
- const data = this.props.data;
-
- this.props.onChangeBlock(this.props.block, {
- ...data,
- [id]: value,
- });
- }
-
- getRequestKey() {
- return `col-content:${this.props.block}`;
- }
-
- updateContent() {
- const path = this.props.data.collection_url;
- if (!path) return;
-
- const url = `${getBaseUrl(path)}`;
- this.props.getContent(url, null, this.getRequestKey());
- }
-
- componentDidUpdate(prevProps) {
- // console.log('metadata', this.props.metadataFields);
- if (prevProps.data.collection_url !== this.props.data.collection_url) {
- return this.updateContent();
- }
- const key = this.getRequestKey();
- if (!prevProps.contentSubrequests[key]) {
- return;
- }
-
- const prev = prevProps.contentSubrequests[key];
- const now = this.props.contentSubrequests[key];
-
- if (prev.loading && now.loaded) {
- this.setState({ items: now.data.items });
- }
- }
-
- componentDidMount() {
- this.props.getVocabulary(vocabulary);
- this.updateContent();
- }
-
- render() {
- const data = {
- ...this.props.data,
- collection_url: this.props.data.collection_url || '',
- };
-
- return (
-
- {data.collection_url ? : ''}
-
-
-
-
-
- {
- this.props.onChangeBlock(this.props.block, {
- ...data,
- collection_url: data.href,
- });
- }
- : () =>
- this.props.openObjectBrowser({
- dataName: 'collection_url',
- mode: 'link',
- })
- }
- onChange={this.handleChange}
- />
-
-
-
-
-
-
-
-
- );
- }
-}
-
-/**
- * Property types.
- * @property {Object} propTypes Property types.
- * @static
- */
-Edit.propTypes = {
- data: PropTypes.objectOf(PropTypes.any).isRequired,
-};
-
-export default connect(
- (state, props) => {
- // console.log('vocabs', state.vocabularies);
- return {
- contentSubrequests: state.content.subrequests,
- metadataFields:
- state.vocabularies[vocabulary] && state.vocabularies[vocabulary].items
- ? state.vocabularies[vocabulary].items.map(o => [o.value, o.label])
- : [],
- };
- },
- {
- getVocabulary,
- getContent,
- },
-)(Edit);
diff --git a/src/components/theme/Collection/BlockView.jsx b/src/components/theme/Collection/BlockView.jsx
deleted file mode 100644
index d0eb96f0..00000000
--- a/src/components/theme/Collection/BlockView.jsx
+++ /dev/null
@@ -1,194 +0,0 @@
-import { connect } from 'react-redux';
-import PropTypes from 'prop-types';
-import React, { Component } from 'react';
-import TilesListing from './TilesListing';
-import { getBaseUrl } from '@plone/volto/helpers';
-import { Pagination } from '@plone/volto/components';
-//import { getContentWithData } from 'volto-addons/actions';
-import { searchContent } from '@plone/volto/actions';
-import Filter from './Filter';
-
-import './style.css';
-
-function filterResults(results = [], filterValue, facetFilter) {
- if (!(filterValue && facetFilter)) return results;
-
- return results.filter(obj =>
- (obj[facetFilter.token] || []).indexOf(filterValue) > -1 ? true : false,
- );
-}
-
-class BlockView extends Component {
- constructor(props) {
- super(props);
-
- this.state = {
- results: [],
- all_items: [],
- filteredResults: [],
- activeFilter: null,
- currentPage: 0,
- pageSize: 15,
- pageSizes: [15, 30, 50],
- totalPages: 0,
- };
-
- this.getRequestKey = this.getRequestKey.bind(this);
- this.handleSelectFilter = this.handleSelectFilter.bind(this);
- this.loadContent = this.loadContent.bind(this);
- this.onChangePage = this.onChangePage.bind(this);
- this.onChangePageSize = this.onChangePageSize.bind(this);
- }
-
- handleSelectFilter(ev, { name }) {
- const filteredResults = filterResults(
- this.state.all_items,
- name,
- this.props.data.facetFilter,
- );
-
- this.setState({
- activeFilter: name,
- filteredResults,
- currentPage: 0,
- results: filteredResults.slice(0, this.state.pageSize),
- totalPages: Math.ceil(filteredResults.length / this.state.pageSize),
- });
- }
-
- onChangePage(ev, { value }) {
- const b_size = this.state.pageSize;
- const b_start = value * b_size;
- const end = b_start + b_size;
-
- this.setState({
- currentPage: value,
- results: this.state.filteredResults.slice(b_start, end),
- });
- }
-
- onChangePageSize(ev, { value }) {
- const b_size = value;
- const b_start = 0;
- const end = b_start + b_size;
- this.setState({
- pageSize: value,
- currentPage: 0,
- results: this.state.filteredResults.slice(b_start, end),
- totalPages: Math.ceil(this.state.filteredResults.length / value),
- });
- }
-
- getRequestKey() {
- return `col-content:${this.props.block}`;
- }
-
- loadContent() {
- const path = this.props.data.collection_url;
- if (!path) return;
-
- // NOTE: while this works, we needed a ton of overrides: override for
- // Collection behavior in eea.restapi and a new action, the
- // getContentWithData. I think this can be achieved by using the @search
- // endpoint, reading the collection query property and changing that, to
- // pass a custom query to the endpoint
- const url = `${getBaseUrl(path)}`;
- const options = {
- metadata_fields: '_all',
- is_search: 1,
- // b_start: this.state.currentPage * this.state.pageSize,
- // b_size: this.state.pageSize,
- // custom_query: this.state.activeFilter
- // ? [
- // {
- // i: this.props.facetFilter,
- // o: 'plone.app.querystring.operation.any',
- // v: this.state.activeFilter,
- // },
- // ]
- // : [],
- };
- this.props.getContentWithData(url, null, this.getRequestKey(), options);
- }
-
- componentDidUpdate(prevProps) {
- if (prevProps.data.collection_url !== this.props.data.collection_url) {
- return this.loadContent();
- }
- const key = this.getRequestKey();
- if (!prevProps.contentSubrequests[key]) {
- return;
- }
-
- const prev = prevProps.contentSubrequests[key];
- const now = this.props.contentSubrequests[key];
-
- if (prev.loading && now.loaded) {
- // now.data.items_total
- const filteredResults = filterResults(
- now.data.items,
- this.state.activeFilter,
- this.props.data.facetFilter,
- );
- const b_size = this.state.pageSize;
- const b_start = this.state.currentPage * b_size;
- const end = b_start + b_size;
- this.setState({
- all_items: now.data.items,
- filteredResults,
- results: filteredResults.slice(b_start, end),
- totalPages: Math.ceil(filteredResults.length / this.state.pageSize),
- });
- return;
- }
- }
-
- componentDidMount() {
- this.loadContent();
- }
-
- render() {
- return this.state.results ? (
-
-
- {this.state.totalPages > 1 && (
-
- )}
- {this.props.data.facetFilter ? (
-
- ) : (
- ''
- )}
-
-
- Filter by {this.props.facetFilter.title}
-
-
- {this.props.selectedValue ? (
-
- ) : (
- <>
- )}
-
-
- ) : (
- ''
- );
- }
-}
-
-export default connect(
- (state, props) => {
- return {
- filters: (state.index_values && state.index_values.items) || [],
- };
- },
- {
- getIndexValues,
- },
-)(Filter);
diff --git a/src/components/theme/Collection/SelectListingType.jsx b/src/components/theme/Collection/SelectListingType.jsx
deleted file mode 100644
index 6e9c7dc5..00000000
--- a/src/components/theme/Collection/SelectListingType.jsx
+++ /dev/null
@@ -1,44 +0,0 @@
-import appsSVG from '@plone/volto/icons/apps.svg';
-import contentListingSVG from '@plone/volto/icons/content-listing.svg';
-import tableSVG from '@plone/volto/icons/table.svg';
-import { Button, Segment, Form, Grid } from 'semantic-ui-react';
-import PropTypes from 'prop-types';
-import React, { Component } from 'react';
-import { SidebarPortal } from '@plone/volto/components';
-import { TextWidget, Icon } from '@plone/volto/components';
-
-class SelectListingType extends Component {
- render() {
- return (
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- );
- }
-}
-export default SelectListingType;
diff --git a/src/components/theme/Collection/TilesListing.jsx b/src/components/theme/Collection/TilesListing.jsx
deleted file mode 100644
index 196092ff..00000000
--- a/src/components/theme/Collection/TilesListing.jsx
+++ /dev/null
@@ -1,107 +0,0 @@
-import React, { Component } from 'react';
-import { FormattedDate } from 'react-intl';
-import { Item } from 'semantic-ui-react';
-import { Breadcrumb, Placeholder } from 'semantic-ui-react';
-import { Link } from 'react-router-dom';
-import { settings } from '~/config';
-
-class TilesListing extends Component {
- getPath(url) {
- return url
- .replace(settings.apiPath, '')
- .replace(settings.internalApiPath, '');
- }
-
- render() {
- // const { items } = this.props;
- const searchItems = this.props.items?.sort(
- (a, b) => new Date(b.ModificationDate) - new Date(a.ModificationDate),
- );
- console.log('lalalalalalala tiles listing');
- return searchItems.length ? (
- searchItems.map(item => (
- -
-
- {/*
-
- */}
-
-
-
-
-
- {item.description || (item.title || item.Title)}
-
-
-
-
- {item.topics && (
-
- Topic:{' '}
- {item.topics?.join(', ')}
-
- )}
-
- Updated:{' '}
-
-
-
- Location:{' '}
- {item['@components'] && item['@components'].breadcrumbs && (
-
- {item['@components'].breadcrumbs.items
- .slice(0, -1)
- .map((item, index, items) => [
- index < items.length - 1 ? (
-
-
- {item.title}
-
-
-
- ) : (
-
-
- {item.title}
-
-
- ),
- ])}
-
- )}
-
-
- ))
- ) : (
-
-
No results.
-
-
-
-
-
-
-
-
-
-
-
-
-
- {content.title}
- {content.subtitle && ` - ${content.subtitle}`}
-
- {content.description && (
-
- {content.description}
-
- )}
-
-
-