From 23f1e3a49184738891e027d4fb95a0ff8d46f588 Mon Sep 17 00:00:00 2001 From: Jenny Bonsak Date: Fri, 8 Dec 2023 14:44:04 -0800 Subject: [PATCH 1/2] landing page: add blr related works section --- assets/less/zenodo-rdm/globals/site.overrides | 5 + .../src/blr-related-works/BlrSearch.js | 118 ++++++++++++++++ .../src/blr-related-works/api/config.js | 31 +++++ .../blr-related-works/components/Filter.js | 92 +++++++++++++ .../components/LayoutSwitchButtons.js | 51 +++++++ .../blr-related-works/components/NoResults.js | 53 ++++++++ .../components/RecordItem.js | 126 ++++++++++++++++++ .../components/ResultsLayout.js | 45 +++++++ .../zenodo_rdm/src/blr-related-works/index.js | 50 +++++++ site/zenodo_rdm/webpack.py | 1 + .../zenodo_rdm/records/detail.html | 21 ++- 11 files changed, 592 insertions(+), 1 deletion(-) create mode 100644 site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/blr-related-works/BlrSearch.js create mode 100644 site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/blr-related-works/api/config.js create mode 100644 site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/blr-related-works/components/Filter.js create mode 100644 site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/blr-related-works/components/LayoutSwitchButtons.js create mode 100644 site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/blr-related-works/components/NoResults.js create mode 100644 site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/blr-related-works/components/RecordItem.js create mode 100644 site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/blr-related-works/components/ResultsLayout.js create mode 100644 site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/blr-related-works/index.js diff --git a/assets/less/zenodo-rdm/globals/site.overrides b/assets/less/zenodo-rdm/globals/site.overrides index dc994d58..c7719de6 100644 --- a/assets/less/zenodo-rdm/globals/site.overrides +++ b/assets/less/zenodo-rdm/globals/site.overrides @@ -138,4 +138,9 @@ a.inverted { .ui.medium.header { font-size: 1.45rem; } +} + +.image.thumbnail-image { + height: 150px; + object-fit: cover; } \ No newline at end of file diff --git a/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/blr-related-works/BlrSearch.js b/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/blr-related-works/BlrSearch.js new file mode 100644 index 00000000..e454259f --- /dev/null +++ b/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/blr-related-works/BlrSearch.js @@ -0,0 +1,118 @@ +// This file is part of Zenodo. +// Copyright (C) 2023 CERN. +// +// Zenodo is free software; you can redistribute it +// and/or modify it under the terms of the GNU General Public License as +// published by the Free Software Foundation; either version 2 of the +// License, or (at your option) any later version. +// +// Zenodo is distributed in the hope that it will be +// useful, but WITHOUT ANY WARRANTY; without even the implied warranty of +// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU +// General Public License for more details. +// +// You should have received a copy of the GNU General Public License +// along with Zenodo; if not, write to the +// Free Software Foundation, Inc., 59 Temple Place, Suite 330, Boston, +// MA 02111-1307, USA. +// +// In applying this license, CERN does not +// waive the privileges and immunities granted to it by virtue of its status +// as an Intergovernmental Organization or submit itself to any jurisdiction. + +import React from "react"; +import PropTypes from "prop-types"; +import { + ReactSearchKit, + InvenioSearchApi, + ResultsLoader, + ResultsMultiLayout, + Error, + EmptyResults, + Pagination, + BucketAggregation, + LayoutSwitcher, +} from "react-searchkit"; +import { OverridableContext } from "react-overridable"; +import { apiConfig } from "./api/config"; +import { Segment, Container, Header } from "semantic-ui-react"; +import { ResultsGridLayout, ResultsListLayout } from "./components/ResultsLayout"; +import { RecordGridItem, RecordListItem } from "./components/RecordItem"; +import { FilterContainer, Filter, FilterValues } from "./components/Filter"; +import { LayoutSwitchButtons } from "./components/LayoutSwitchButtons"; +import { NoResults } from "./components/NoResults"; + +const blrSearchAppID = "blrSearch"; + +const overriddenComponents = { + [`${blrSearchAppID}.ResultsGrid.container`]: ResultsGridLayout, + [`${blrSearchAppID}.ResultsGrid.item`]: RecordGridItem, + [`${blrSearchAppID}.ResultsList.container`]: ResultsListLayout, + [`${blrSearchAppID}.ResultsList.item`]: RecordListItem, + [`${blrSearchAppID}.BucketAggregation.element`]: FilterContainer, + [`${blrSearchAppID}.BucketAggregationContainer.element`]: Filter, + [`${blrSearchAppID}.BucketAggregationValues.element`]: FilterValues, + [`${blrSearchAppID}.LayoutSwitcher.element`]: LayoutSwitchButtons, + [`${blrSearchAppID}.EmptyResults.element`]: NoResults, +}; + +export const BlrSearch = ({ endpoint, recordDOI, resourceType }) => { + const relationType = (resourceType) => + resourceType === "Journal article" || resourceType === "Book chapter" + ? "ispartof" + : "haspart"; + + const queryString = (relationType, identifier) => + `metadata.related_identifiers.relation_type.id:${relationType} AND metadata.related_identifiers.identifier:"${identifier}"`; + + const searchApi = new InvenioSearchApi(apiConfig(endpoint)); + + const initialState = { + queryString: queryString(relationType(resourceType), recordDOI), + sortBy: "bestmatch", + sortOrder: "asc", + page: 1, + size: 4, + layout: "list", + }; + + return ( + <> +
Linked records
+ + + <> +
+ + +
+ + + + + + + + + + + + + + + + ); +}; + +BlrSearch.propTypes = { + endpoint: PropTypes.string.isRequired, + recordDOI: PropTypes.string.isRequired, + resourceType: PropTypes.string.isRequired, +}; diff --git a/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/blr-related-works/api/config.js b/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/blr-related-works/api/config.js new file mode 100644 index 00000000..c94ff567 --- /dev/null +++ b/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/blr-related-works/api/config.js @@ -0,0 +1,31 @@ +// This file is part of Zenodo. +// Copyright (C) 2023 CERN. +// +// Zenodo is free software; you can redistribute it +// and/or modify it under the terms of the GNU General Public License as +// published by the Free Software Foundation; either version 2 of the +// License, or (at your option) any later version. +// +// Zenodo is distributed in the hope that it will be +// useful, but WITHOUT ANY WARRANTY; without even the implied warranty of +// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU +// General Public License for more details. +// +// You should have received a copy of the GNU General Public License +// along with Zenodo; if not, write to the +// Free Software Foundation, Inc., 59 Temple Place, Suite 330, Boston, +// MA 02111-1307, USA. +// +// In applying this license, CERN does not +// waive the privileges and immunities granted to it by virtue of its status +// as an Intergovernmental Organization or submit itself to any jurisdiction. + +export const apiConfig = (endpoint) => ({ + axios: { + url: endpoint, + timeout: 5000, + headers: { + Accept: "application/vnd.inveniordm.v1+json", + }, + }, +}); diff --git a/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/blr-related-works/components/Filter.js b/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/blr-related-works/components/Filter.js new file mode 100644 index 00000000..97b62204 --- /dev/null +++ b/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/blr-related-works/components/Filter.js @@ -0,0 +1,92 @@ +// This file is part of Zenodo. +// Copyright (C) 2023 CERN. +// +// Zenodo is free software; you can redistribute it +// and/or modify it under the terms of the GNU General Public License as +// published by the Free Software Foundation; either version 2 of the +// License, or (at your option) any later version. +// +// Zenodo is distributed in the hope that it will be +// useful, but WITHOUT ANY WARRANTY; without even the implied warranty of +// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU +// General Public License for more details. +// +// You should have received a copy of the GNU General Public License +// along with Zenodo; if not, write to the +// Free Software Foundation, Inc., 59 Temple Place, Suite 330, Boston, +// MA 02111-1307, USA. +// +// In applying this license, CERN does not +// waive the privileges and immunities granted to it by virtue of its status +// as an Intergovernmental Organization or submit itself to any jurisdiction. + +import React from "react"; +import { PropTypes } from "prop-types"; +import { Dropdown, Label, Button, Icon } from "semantic-ui-react"; +import { withState } from "react-searchkit"; + +export const FilterContainer = ({ agg, containerCmp, updateQueryFilters }) => { + const clearFacets = () => { + if (containerCmp.props.selectedFilters.length) { + updateQueryFilters([agg.aggName, ""], containerCmp.props.selectedFilters); + } + }; + + return ( +
+
{containerCmp}
+
+
+
+ ); +}; + +FilterContainer.propTypes = { + agg: PropTypes.object.isRequired, + updateQueryFilters: PropTypes.func.isRequired, + containerCmp: PropTypes.node.isRequired, +}; + +export const Filter = withState(({ currentQueryState, valuesCmp }) => { + const numSelectedFilters = currentQueryState.filters.length; + return ( + + {valuesCmp} + + ); +}); + +Filter.propTypes = { + valuesCmp: PropTypes.array.isRequired, +}; + +export const FilterValues = ({ bucket, isSelected, onFilterClicked, label }) => { + return ( + onFilterClicked(bucket.key)} + value={bucket.key} + className="flex align-items-center justify-space-between" + > + {isSelected && } + + {label} + + + ); +}; + +FilterValues.propTypes = { + bucket: PropTypes.object.isRequired, + isSelected: PropTypes.bool.isRequired, + onFilterClicked: PropTypes.func.isRequired, + label: PropTypes.string.isRequired, +}; diff --git a/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/blr-related-works/components/LayoutSwitchButtons.js b/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/blr-related-works/components/LayoutSwitchButtons.js new file mode 100644 index 00000000..7dcc2cf0 --- /dev/null +++ b/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/blr-related-works/components/LayoutSwitchButtons.js @@ -0,0 +1,51 @@ +// This file is part of Zenodo. +// Copyright (C) 2023 CERN. +// +// Zenodo is free software; you can redistribute it +// and/or modify it under the terms of the GNU General Public License as +// published by the Free Software Foundation; either version 2 of the +// License, or (at your option) any later version. +// +// Zenodo is distributed in the hope that it will be +// useful, but WITHOUT ANY WARRANTY; without even the implied warranty of +// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU +// General Public License for more details. +// +// You should have received a copy of the GNU General Public License +// along with Zenodo; if not, write to the +// Free Software Foundation, Inc., 59 Temple Place, Suite 330, Boston, +// MA 02111-1307, USA. +// +// In applying this license, CERN does not +// waive the privileges and immunities granted to it by virtue of its status +// as an Intergovernmental Organization or submit itself to any jurisdiction. + +import React from "react"; +import { PropTypes } from "prop-types"; +import { Button } from "semantic-ui-react"; + +export const LayoutSwitchButtons = ({ currentLayout, onLayoutChange }) => { + return ( + +