From fe2aa90f4045cd2871c3ba7d8571cd98b346382b Mon Sep 17 00:00:00 2001 From: wesleybl Date: Wed, 8 Feb 2023 14:58:36 -0300 Subject: [PATCH 01/14] Show related items --- .../volto/locales/ca/LC_MESSAGES/volto.po | 5 + .../volto/locales/de/LC_MESSAGES/volto.po | 5 + .../volto/locales/en/LC_MESSAGES/volto.po | 5 + .../volto/locales/es/LC_MESSAGES/volto.po | 5 + .../volto/locales/eu/LC_MESSAGES/volto.po | 5 + .../volto/locales/fi/LC_MESSAGES/volto.po | 5 + .../volto/locales/fr/LC_MESSAGES/volto.po | 5 + .../volto/locales/hi/LC_MESSAGES/volto.po | 5 + .../volto/locales/it/LC_MESSAGES/volto.po | 5 + .../volto/locales/ja/LC_MESSAGES/volto.po | 5 + .../volto/locales/nl/LC_MESSAGES/volto.po | 5 + .../volto/locales/pt/LC_MESSAGES/volto.po | 5 + .../volto/locales/pt_BR/LC_MESSAGES/volto.po | 5 + .../volto/locales/ro/LC_MESSAGES/volto.po | 5 + packages/volto/locales/volto.pot | 5 + .../volto/locales/zh_CN/LC_MESSAGES/volto.po | 5 + packages/volto/news/3740.feature | 2 + packages/volto/src/components/index.js | 1 + .../theme/RelatedItems/RelatedItems.jsx | 74 ++++++++++++ .../theme/RelatedItems/RelatedItems.test.jsx | 85 ++++++++++++++ .../__snapshots__/RelatedItems.test.jsx.snap | 107 ++++++++++++++++++ .../volto/src/components/theme/View/View.jsx | 4 + packages/volto/src/config/index.js | 1 + 23 files changed, 354 insertions(+) create mode 100644 packages/volto/news/3740.feature create mode 100644 packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx create mode 100644 packages/volto/src/components/theme/RelatedItems/RelatedItems.test.jsx create mode 100644 packages/volto/src/components/theme/RelatedItems/__snapshots__/RelatedItems.test.jsx.snap diff --git a/packages/volto/locales/ca/LC_MESSAGES/volto.po b/packages/volto/locales/ca/LC_MESSAGES/volto.po index 69687ab2b8..ab6bb00462 100644 --- a/packages/volto/locales/ca/LC_MESSAGES/volto.po +++ b/packages/volto/locales/ca/LC_MESSAGES/volto.po @@ -2802,6 +2802,11 @@ msgstr "Registrar-se" msgid "Registration form" msgstr "Formulari d'inscripció" +#. Default: "Related Items" +#: components/theme/RelatedItems/RelatedItems +msgid "Related Items" +msgstr "" + #. Default: "Relation" #: components/manage/Controlpanels/Relations/RelationsMatrix #: helpers/MessageLabels/MessageLabels diff --git a/packages/volto/locales/de/LC_MESSAGES/volto.po b/packages/volto/locales/de/LC_MESSAGES/volto.po index d35ff24b4c..9181b468cb 100644 --- a/packages/volto/locales/de/LC_MESSAGES/volto.po +++ b/packages/volto/locales/de/LC_MESSAGES/volto.po @@ -2801,6 +2801,11 @@ msgstr "Registrieren" msgid "Registration form" msgstr "Registrierungsformular" +#. Default: "Related Items" +#: components/theme/RelatedItems/RelatedItems +msgid "Related Items" +msgstr "" + #. Default: "Relation" #: components/manage/Controlpanels/Relations/RelationsMatrix #: helpers/MessageLabels/MessageLabels diff --git a/packages/volto/locales/en/LC_MESSAGES/volto.po b/packages/volto/locales/en/LC_MESSAGES/volto.po index a5b40a7988..e89f4de242 100644 --- a/packages/volto/locales/en/LC_MESSAGES/volto.po +++ b/packages/volto/locales/en/LC_MESSAGES/volto.po @@ -2796,6 +2796,11 @@ msgstr "" msgid "Registration form" msgstr "" +#. Default: "Related Items" +#: components/theme/RelatedItems/RelatedItems +msgid "Related Items" +msgstr "" + #. Default: "Relation" #: components/manage/Controlpanels/Relations/RelationsMatrix #: helpers/MessageLabels/MessageLabels diff --git a/packages/volto/locales/es/LC_MESSAGES/volto.po b/packages/volto/locales/es/LC_MESSAGES/volto.po index 6e284bfd75..c8a5cd7972 100644 --- a/packages/volto/locales/es/LC_MESSAGES/volto.po +++ b/packages/volto/locales/es/LC_MESSAGES/volto.po @@ -2803,6 +2803,11 @@ msgstr "Registro" msgid "Registration form" msgstr "Formulario de registro" +#. Default: "Related Items" +#: components/theme/RelatedItems/RelatedItems +msgid "Related Items" +msgstr "" + #. Default: "Relation" #: components/manage/Controlpanels/Relations/RelationsMatrix #: helpers/MessageLabels/MessageLabels diff --git a/packages/volto/locales/eu/LC_MESSAGES/volto.po b/packages/volto/locales/eu/LC_MESSAGES/volto.po index b7c57b8ee1..4bf8198e26 100644 --- a/packages/volto/locales/eu/LC_MESSAGES/volto.po +++ b/packages/volto/locales/eu/LC_MESSAGES/volto.po @@ -2803,6 +2803,11 @@ msgstr "Izena eman" msgid "Registration form" msgstr "Erregistro formularioa" +#. Default: "Related Items" +#: components/theme/RelatedItems/RelatedItems +msgid "Related Items" +msgstr "" + #. Default: "Relation" #: components/manage/Controlpanels/Relations/RelationsMatrix #: helpers/MessageLabels/MessageLabels diff --git a/packages/volto/locales/fi/LC_MESSAGES/volto.po b/packages/volto/locales/fi/LC_MESSAGES/volto.po index 16a81a822c..81fbb6573f 100644 --- a/packages/volto/locales/fi/LC_MESSAGES/volto.po +++ b/packages/volto/locales/fi/LC_MESSAGES/volto.po @@ -2801,6 +2801,11 @@ msgstr "Rekisteröidy" msgid "Registration form" msgstr "Rekisteröitymislomake" +#. Default: "Related Items" +#: components/theme/RelatedItems/RelatedItems +msgid "Related Items" +msgstr "" + #. Default: "Relation" #: components/manage/Controlpanels/Relations/RelationsMatrix #: helpers/MessageLabels/MessageLabels diff --git a/packages/volto/locales/fr/LC_MESSAGES/volto.po b/packages/volto/locales/fr/LC_MESSAGES/volto.po index b405214240..824d3c1dd6 100644 --- a/packages/volto/locales/fr/LC_MESSAGES/volto.po +++ b/packages/volto/locales/fr/LC_MESSAGES/volto.po @@ -2803,6 +2803,11 @@ msgstr "S'enregistrer" msgid "Registration form" msgstr "Formulaire d'enregistrement" +#. Default: "Related Items" +#: components/theme/RelatedItems/RelatedItems +msgid "Related Items" +msgstr "" + #. Default: "Relation" #: components/manage/Controlpanels/Relations/RelationsMatrix #: helpers/MessageLabels/MessageLabels diff --git a/packages/volto/locales/hi/LC_MESSAGES/volto.po b/packages/volto/locales/hi/LC_MESSAGES/volto.po index c21aa3608f..cc43321970 100644 --- a/packages/volto/locales/hi/LC_MESSAGES/volto.po +++ b/packages/volto/locales/hi/LC_MESSAGES/volto.po @@ -2796,6 +2796,11 @@ msgstr "रजिस्टर करें" msgid "Registration form" msgstr "रजिस्ट्रेशन फ़ॉर्म" +#. Default: "Related Items" +#: components/theme/RelatedItems/RelatedItems +msgid "Related Items" +msgstr "" + #. Default: "Relation" #: components/manage/Controlpanels/Relations/RelationsMatrix #: helpers/MessageLabels/MessageLabels diff --git a/packages/volto/locales/it/LC_MESSAGES/volto.po b/packages/volto/locales/it/LC_MESSAGES/volto.po index fbdee8436e..7fe89775ca 100644 --- a/packages/volto/locales/it/LC_MESSAGES/volto.po +++ b/packages/volto/locales/it/LC_MESSAGES/volto.po @@ -2796,6 +2796,11 @@ msgstr "Registrati" msgid "Registration form" msgstr "Form di iscrizione" +#. Default: "Related Items" +#: components/theme/RelatedItems/RelatedItems +msgid "Related Items" +msgstr "" + #. Default: "Relation" #: components/manage/Controlpanels/Relations/RelationsMatrix #: helpers/MessageLabels/MessageLabels diff --git a/packages/volto/locales/ja/LC_MESSAGES/volto.po b/packages/volto/locales/ja/LC_MESSAGES/volto.po index 60d63a02e7..4394ab03e8 100644 --- a/packages/volto/locales/ja/LC_MESSAGES/volto.po +++ b/packages/volto/locales/ja/LC_MESSAGES/volto.po @@ -2801,6 +2801,11 @@ msgstr "登録" msgid "Registration form" msgstr "登録フォーム" +#. Default: "Related Items" +#: components/theme/RelatedItems/RelatedItems +msgid "Related Items" +msgstr "" + #. Default: "Relation" #: components/manage/Controlpanels/Relations/RelationsMatrix #: helpers/MessageLabels/MessageLabels diff --git a/packages/volto/locales/nl/LC_MESSAGES/volto.po b/packages/volto/locales/nl/LC_MESSAGES/volto.po index c6330673c2..3c7ad8fc48 100644 --- a/packages/volto/locales/nl/LC_MESSAGES/volto.po +++ b/packages/volto/locales/nl/LC_MESSAGES/volto.po @@ -2800,6 +2800,11 @@ msgstr "" msgid "Registration form" msgstr "" +#. Default: "Related Items" +#: components/theme/RelatedItems/RelatedItems +msgid "Related Items" +msgstr "" + #. Default: "Relation" #: components/manage/Controlpanels/Relations/RelationsMatrix #: helpers/MessageLabels/MessageLabels diff --git a/packages/volto/locales/pt/LC_MESSAGES/volto.po b/packages/volto/locales/pt/LC_MESSAGES/volto.po index f7350c0098..5bf47af549 100644 --- a/packages/volto/locales/pt/LC_MESSAGES/volto.po +++ b/packages/volto/locales/pt/LC_MESSAGES/volto.po @@ -2801,6 +2801,11 @@ msgstr "Registar" msgid "Registration form" msgstr "Formulário de registo" +#. Default: "Related Items" +#: components/theme/RelatedItems/RelatedItems +msgid "Related Items" +msgstr "" + #. Default: "Relation" #: components/manage/Controlpanels/Relations/RelationsMatrix #: helpers/MessageLabels/MessageLabels diff --git a/packages/volto/locales/pt_BR/LC_MESSAGES/volto.po b/packages/volto/locales/pt_BR/LC_MESSAGES/volto.po index 22e61c7f06..48964b4a04 100644 --- a/packages/volto/locales/pt_BR/LC_MESSAGES/volto.po +++ b/packages/volto/locales/pt_BR/LC_MESSAGES/volto.po @@ -2802,6 +2802,11 @@ msgstr "Cadastro" msgid "Registration form" msgstr "Formulário de cadastro" +#. Default: "Related Items" +#: components/theme/RelatedItems/RelatedItems +msgid "Related Items" +msgstr "Itens relacionados" + #. Default: "Relation" #: components/manage/Controlpanels/Relations/RelationsMatrix #: helpers/MessageLabels/MessageLabels diff --git a/packages/volto/locales/ro/LC_MESSAGES/volto.po b/packages/volto/locales/ro/LC_MESSAGES/volto.po index 4ccc25cc34..677d19e889 100644 --- a/packages/volto/locales/ro/LC_MESSAGES/volto.po +++ b/packages/volto/locales/ro/LC_MESSAGES/volto.po @@ -2796,6 +2796,11 @@ msgstr "Înregistrare" msgid "Registration form" msgstr "Formular de înregistrare" +#. Default: "Related Items" +#: components/theme/RelatedItems/RelatedItems +msgid "Related Items" +msgstr "" + #. Default: "Relation" #: components/manage/Controlpanels/Relations/RelationsMatrix #: helpers/MessageLabels/MessageLabels diff --git a/packages/volto/locales/volto.pot b/packages/volto/locales/volto.pot index 7e870490fc..359dacb63e 100644 --- a/packages/volto/locales/volto.pot +++ b/packages/volto/locales/volto.pot @@ -2798,6 +2798,11 @@ msgstr "" msgid "Registration form" msgstr "" +#. Default: "Related Items" +#: components/theme/RelatedItems/RelatedItems +msgid "Related Items" +msgstr "" + #. Default: "Relation" #: components/manage/Controlpanels/Relations/RelationsMatrix #: helpers/MessageLabels/MessageLabels diff --git a/packages/volto/locales/zh_CN/LC_MESSAGES/volto.po b/packages/volto/locales/zh_CN/LC_MESSAGES/volto.po index cddef470f6..577c66f85e 100644 --- a/packages/volto/locales/zh_CN/LC_MESSAGES/volto.po +++ b/packages/volto/locales/zh_CN/LC_MESSAGES/volto.po @@ -2802,6 +2802,11 @@ msgstr "注册" msgid "Registration form" msgstr "注册表单" +#. Default: "Related Items" +#: components/theme/RelatedItems/RelatedItems +msgid "Related Items" +msgstr "" + #. Default: "Relation" #: components/manage/Controlpanels/Relations/RelationsMatrix #: helpers/MessageLabels/MessageLabels diff --git a/packages/volto/news/3740.feature b/packages/volto/news/3740.feature new file mode 100644 index 0000000000..7635a0c4a8 --- /dev/null +++ b/packages/volto/news/3740.feature @@ -0,0 +1,2 @@ +- Show related items. + @wesleybl diff --git a/packages/volto/src/components/index.js b/packages/volto/src/components/index.js index 11444c6a1f..613eecc11d 100644 --- a/packages/volto/src/components/index.js +++ b/packages/volto/src/components/index.js @@ -22,6 +22,7 @@ export { default as Title } from '@plone/volto/components/theme/Title/Title'; export { default as DefaultView } from '@plone/volto/components/theme/View/DefaultView'; export { default as Pagination } from '@plone/volto/components/theme/Pagination/Pagination'; export { default as Tags } from '@plone/volto/components/theme/Tags/Tags'; +export { default as RelatedItems } from '@plone/volto/components/theme/RelatedItems/RelatedItems'; export { default as OutdatedBrowser } from '@plone/volto/components/theme/OutdatedBrowser/OutdatedBrowser'; export { default as LanguageSelector } from '@plone/volto/components/theme/LanguageSelector/LanguageSelector'; export { default as RenderBlocks } from '@plone/volto/components/theme/View/RenderBlocks'; diff --git a/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx b/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx new file mode 100644 index 0000000000..a6dd466cb4 --- /dev/null +++ b/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx @@ -0,0 +1,74 @@ +/** + * RelatedItems component. + * @module components/theme/RelatedItems/RelatedItems + */ + +import React from 'react'; +import { UniversalLink } from '@plone/volto/components'; +import { defineMessages, injectIntl } from 'react-intl'; +import PropTypes from 'prop-types'; +import { Container } from 'semantic-ui-react'; + +const messages = defineMessages({ + relatedItems: { + id: 'Related Items', + defaultMessage: 'Related Items', + }, +}); + +/** + * Related Items component. + * @function RelatedItems + * @param {array} tags Array of related items. + * @returns {string} Markup of the component. + */ + +const RelatedItems = ({ relatedItems, intl }) => + relatedItems && relatedItems.length > 0 ? ( + +

{intl.formatMessage(messages.relatedItems)}

+
+ {relatedItems.map((relatedItem) => + relatedItem ? ( +
+
+ +
{relatedItem['title']}
+
+ {relatedItem['description']} +
+ +
+
+ ) : null, + )} +
+ + ) : ( + + ); + +/** + * Property types. + * @property {Object} propTypes Property types. + * @static + */ +RelatedItems.propTypes = { + relatedItems: PropTypes.arrayOf( + PropTypes.shape({ + '@id': PropTypes.string.isRequired, + title: PropTypes.string.isRequired, + }), + ), +}; + +/** + * Default properties. + * @property {Object} defaultProps Default properties. + * @static + */ +RelatedItems.defaultProps = { + RelatedItems: null, +}; + +export default injectIntl(RelatedItems); diff --git a/packages/volto/src/components/theme/RelatedItems/RelatedItems.test.jsx b/packages/volto/src/components/theme/RelatedItems/RelatedItems.test.jsx new file mode 100644 index 0000000000..be78fb1a42 --- /dev/null +++ b/packages/volto/src/components/theme/RelatedItems/RelatedItems.test.jsx @@ -0,0 +1,85 @@ +import React from 'react'; +import renderer from 'react-test-renderer'; +import configureStore from 'redux-mock-store'; +import { Provider } from 'react-intl-redux'; +import { MemoryRouter } from 'react-router-dom'; + +import RelatedItems from './RelatedItems'; + +const mockStore = configureStore(); + +describe('Related Items', () => { + it('renders without related items', () => { + const store = mockStore({ + intl: { + locale: 'en', + messages: {}, + }, + }); + const component = renderer.create( + + + + + , + ); + const json = component.toJSON(); + expect(json).toMatchSnapshot(); + }); + + it('renders with related items', () => { + const store = mockStore({ + intl: { + locale: 'en', + messages: {}, + }, + }); + const relatedItems = [ + { + '@id': '/test-1', + title: 'Title 1', + description: 'Description 1', + }, + { + '@id': '/test-2', + title: 'Title 2', + description: 'Description 2', + }, + ]; + const component = renderer.create( + + + + + , + ); + const json = component.toJSON(); + expect(json).toMatchSnapshot(); + }); + + it('renders with related items has null', () => { + const store = mockStore({ + intl: { + locale: 'en', + messages: {}, + }, + }); + const relatedItems = [ + { + '@id': '/test-1', + title: 'Title 1', + description: 'Description 1', + }, + null, + ]; + const component = renderer.create( + + + + + , + ); + const json = component.toJSON(); + expect(json).toMatchSnapshot(); + }); +}); diff --git a/packages/volto/src/components/theme/RelatedItems/__snapshots__/RelatedItems.test.jsx.snap b/packages/volto/src/components/theme/RelatedItems/__snapshots__/RelatedItems.test.jsx.snap new file mode 100644 index 0000000000..307a4e76b1 --- /dev/null +++ b/packages/volto/src/components/theme/RelatedItems/__snapshots__/RelatedItems.test.jsx.snap @@ -0,0 +1,107 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Related Items renders with related items 1`] = ` +
+

+ Related Items +

+
+
+ +
+
+ +
+
+
+`; + +exports[`Related Items renders with related items has null 1`] = ` +
+

+ Related Items +

+
+
+ +
+
+
+`; + +exports[`Related Items renders without related items 1`] = ``; diff --git a/packages/volto/src/components/theme/View/View.jsx b/packages/volto/src/components/theme/View/View.jsx index 6f4ff0f5e7..46e44dece4 100644 --- a/packages/volto/src/components/theme/View/View.jsx +++ b/packages/volto/src/components/theme/View/View.jsx @@ -15,6 +15,7 @@ import qs from 'query-string'; import { ContentMetadataTags, Comments, + RelatedItems, Toolbar, } from '@plone/volto/components'; import { listActions, getContent } from '@plone/volto/actions'; @@ -255,6 +256,9 @@ class View extends Component { history={this.props.history} /> + {config.settings.showRelatedItems && ( + + )} {this.props.content.allow_discussion && ( )} diff --git a/packages/volto/src/config/index.js b/packages/volto/src/config/index.js index 5dea078810..38c919c472 100644 --- a/packages/volto/src/config/index.js +++ b/packages/volto/src/config/index.js @@ -151,6 +151,7 @@ let config = { serverConfig, storeExtenders: [], showTags: true, + showRelatedItems: true, controlpanels: [], controlPanelsIcons, filterControlPanels, From 5129967f116965750900f6a8c2e3a3648d613a4b Mon Sep 17 00:00:00 2001 From: wesleybl Date: Wed, 31 Jul 2024 17:38:21 -0300 Subject: [PATCH 02/14] Use h2 instead of h4 Also use ul instead of div to list related items. --- .../theme/RelatedItems/RelatedItems.jsx | 41 +++--- .../__snapshots__/RelatedItems.test.jsx.snap | 135 +++++++----------- 2 files changed, 68 insertions(+), 108 deletions(-) diff --git a/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx b/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx index a6dd466cb4..249b0d1707 100644 --- a/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx +++ b/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx @@ -3,7 +3,6 @@ * @module components/theme/RelatedItems/RelatedItems */ -import React from 'react'; import { UniversalLink } from '@plone/volto/components'; import { defineMessages, injectIntl } from 'react-intl'; import PropTypes from 'prop-types'; @@ -19,34 +18,31 @@ const messages = defineMessages({ /** * Related Items component. * @function RelatedItems - * @param {array} tags Array of related items. - * @returns {string} Markup of the component. + * @param {array} relatedItems Array of related items. + * @returns {JSX.Element} Markup of the component. */ +const RelatedItems = ({ relatedItems, intl }) => { + if (!relatedItems || relatedItems.length === 0) { + return null; + } -const RelatedItems = ({ relatedItems, intl }) => - relatedItems && relatedItems.length > 0 ? ( - -

{intl.formatMessage(messages.relatedItems)}

-
+ return ( + +

{intl.formatMessage(messages.relatedItems)}

+
    {relatedItems.map((relatedItem) => relatedItem ? ( -
    -
    - -
    {relatedItem['title']}
    -
    - {relatedItem['description']} -
    -     -
    -
    +
  • + + {relatedItem.title} + +
    • ) : null, )} -
+ - ) : ( - ); +}; /** * Property types. @@ -60,6 +56,7 @@ RelatedItems.propTypes = { title: PropTypes.string.isRequired, }), ), + intl: PropTypes.object.isRequired, }; /** @@ -68,7 +65,7 @@ RelatedItems.propTypes = { * @static */ RelatedItems.defaultProps = { - RelatedItems: null, + relatedItems: [], }; export default injectIntl(RelatedItems); diff --git a/packages/volto/src/components/theme/RelatedItems/__snapshots__/RelatedItems.test.jsx.snap b/packages/volto/src/components/theme/RelatedItems/__snapshots__/RelatedItems.test.jsx.snap index 307a4e76b1..10d2d92f14 100644 --- a/packages/volto/src/components/theme/RelatedItems/__snapshots__/RelatedItems.test.jsx.snap +++ b/packages/volto/src/components/theme/RelatedItems/__snapshots__/RelatedItems.test.jsx.snap @@ -3,105 +3,68 @@ exports[`Related Items renders with related items 1`] = `
-

+

Related Items -

- + Title 2 + + +
`; exports[`Related Items renders with related items has null 1`] = `
-

+

Related Items -

- + Title 1 + + +
`; -exports[`Related Items renders without related items 1`] = ``; +exports[`Related Items renders without related items 1`] = `null`; From 186f23ee44e8dd409dfdecd48fcd01becbd5de1f Mon Sep 17 00:00:00 2001 From: wesleybl Date: Wed, 31 Jul 2024 17:43:13 -0300 Subject: [PATCH 03/14] Changes default setting of showRelatedItems to false --- packages/volto/src/config/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/volto/src/config/index.js b/packages/volto/src/config/index.js index 38c919c472..e051dfde5c 100644 --- a/packages/volto/src/config/index.js +++ b/packages/volto/src/config/index.js @@ -151,7 +151,7 @@ let config = { serverConfig, storeExtenders: [], showTags: true, - showRelatedItems: true, + showRelatedItems: false, controlpanels: [], controlPanelsIcons, filterControlPanels, From 8e20f976f64fabebf50f8d9c2118ae02a67701bd Mon Sep 17 00:00:00 2001 From: wesleybl Date: Tue, 6 Aug 2024 10:06:35 -0300 Subject: [PATCH 04/14] Remove inline CSS --- .../components/theme/RelatedItems/RelatedItems.jsx | 2 +- .../__snapshots__/RelatedItems.test.jsx.snap | 14 ++------------ .../volto/theme/themes/pastanaga/extras/main.less | 5 +++++ 3 files changed, 8 insertions(+), 13 deletions(-) diff --git a/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx b/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx index 249b0d1707..055f8d425f 100644 --- a/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx +++ b/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx @@ -27,7 +27,7 @@ const RelatedItems = ({ relatedItems, intl }) => { } return ( - +

{intl.formatMessage(messages.relatedItems)}

    {relatedItems.map((relatedItem) => diff --git a/packages/volto/src/components/theme/RelatedItems/__snapshots__/RelatedItems.test.jsx.snap b/packages/volto/src/components/theme/RelatedItems/__snapshots__/RelatedItems.test.jsx.snap index 10d2d92f14..1eef151979 100644 --- a/packages/volto/src/components/theme/RelatedItems/__snapshots__/RelatedItems.test.jsx.snap +++ b/packages/volto/src/components/theme/RelatedItems/__snapshots__/RelatedItems.test.jsx.snap @@ -2,12 +2,7 @@ exports[`Related Items renders with related items 1`] = `

    Related Items @@ -41,12 +36,7 @@ exports[`Related Items renders with related items 1`] = ` exports[`Related Items renders with related items has null 1`] = `

    Related Items diff --git a/packages/volto/theme/themes/pastanaga/extras/main.less b/packages/volto/theme/themes/pastanaga/extras/main.less index 6b1bb30d5b..aa26c6e6dc 100644 --- a/packages/volto/theme/themes/pastanaga/extras/main.less +++ b/packages/volto/theme/themes/pastanaga/extras/main.less @@ -650,6 +650,11 @@ img.responsive { height: auto; } +// Related Items +.related-items { + margin-top: 20px; +} + // Deprecated as per https://github.com/plone/volto/issues/1265 // @import 'utils'; @import (multiple) '../extras/fonts'; From a6e788f535704671943e532e461268144fdf2832 Mon Sep 17 00:00:00 2001 From: wesleybl Date: Mon, 26 Aug 2024 18:38:13 -0300 Subject: [PATCH 05/14] Related Items in slot --- .../theme/RelatedItems/RelatedItems.jsx | 10 ++- .../theme/RelatedItems/RelatedItems.test.jsx | 74 +++++++++---------- .../volto/src/components/theme/View/View.jsx | 4 - packages/volto/src/config/slots.js | 6 +- packages/volto/test-setup-config.jsx | 1 + 5 files changed, 50 insertions(+), 45 deletions(-) diff --git a/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx b/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx index 055f8d425f..0ea6e1f49c 100644 --- a/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx +++ b/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx @@ -7,6 +7,7 @@ import { UniversalLink } from '@plone/volto/components'; import { defineMessages, injectIntl } from 'react-intl'; import PropTypes from 'prop-types'; import { Container } from 'semantic-ui-react'; +import config from '@plone/registry'; const messages = defineMessages({ relatedItems: { @@ -21,8 +22,13 @@ const messages = defineMessages({ * @param {array} relatedItems Array of related items. * @returns {JSX.Element} Markup of the component. */ -const RelatedItems = ({ relatedItems, intl }) => { - if (!relatedItems || relatedItems.length === 0) { +const RelatedItems = ({ content, intl }) => { + const relatedItems = content?.relatedItems; + if ( + !config.settings.showRelatedItems || + !relatedItems || + relatedItems.length === 0 + ) { return null; } diff --git a/packages/volto/src/components/theme/RelatedItems/RelatedItems.test.jsx b/packages/volto/src/components/theme/RelatedItems/RelatedItems.test.jsx index be78fb1a42..42647e24e2 100644 --- a/packages/volto/src/components/theme/RelatedItems/RelatedItems.test.jsx +++ b/packages/volto/src/components/theme/RelatedItems/RelatedItems.test.jsx @@ -1,4 +1,3 @@ -import React from 'react'; import renderer from 'react-test-renderer'; import configureStore from 'redux-mock-store'; import { Provider } from 'react-intl-redux'; @@ -7,19 +6,24 @@ import { MemoryRouter } from 'react-router-dom'; import RelatedItems from './RelatedItems'; const mockStore = configureStore(); +let store; describe('Related Items', () => { - it('renders without related items', () => { - const store = mockStore({ + beforeEach(() => { + store = mockStore({ intl: { locale: 'en', messages: {}, }, }); + }); + + it('renders without related items', () => { + const content = {}; const component = renderer.create( - + , ); @@ -28,28 +32,25 @@ describe('Related Items', () => { }); it('renders with related items', () => { - const store = mockStore({ - intl: { - locale: 'en', - messages: {}, - }, - }); - const relatedItems = [ - { - '@id': '/test-1', - title: 'Title 1', - description: 'Description 1', - }, - { - '@id': '/test-2', - title: 'Title 2', - description: 'Description 2', - }, - ]; + const content = { + relatedItems: [ + { + '@id': '/test-1', + title: 'Title 1', + description: 'Description 1', + }, + { + '@id': '/test-2', + title: 'Title 2', + description: 'Description 2', + }, + ], + }; + const component = renderer.create( - + , ); @@ -58,24 +59,21 @@ describe('Related Items', () => { }); it('renders with related items has null', () => { - const store = mockStore({ - intl: { - locale: 'en', - messages: {}, - }, - }); - const relatedItems = [ - { - '@id': '/test-1', - title: 'Title 1', - description: 'Description 1', - }, - null, - ]; + const content = { + relatedItems: [ + { + '@id': '/test-1', + title: 'Title 1', + description: 'Description 1', + }, + null, + ], + }; + const component = renderer.create( - + , ); diff --git a/packages/volto/src/components/theme/View/View.jsx b/packages/volto/src/components/theme/View/View.jsx index 46e44dece4..6f4ff0f5e7 100644 --- a/packages/volto/src/components/theme/View/View.jsx +++ b/packages/volto/src/components/theme/View/View.jsx @@ -15,7 +15,6 @@ import qs from 'query-string'; import { ContentMetadataTags, Comments, - RelatedItems, Toolbar, } from '@plone/volto/components'; import { listActions, getContent } from '@plone/volto/actions'; @@ -256,9 +255,6 @@ class View extends Component { history={this.props.history} /> - {config.settings.showRelatedItems && ( - - )} {this.props.content.allow_discussion && ( )} diff --git a/packages/volto/src/config/slots.js b/packages/volto/src/config/slots.js index 3e2411c08d..c0ac46929d 100644 --- a/packages/volto/src/config/slots.js +++ b/packages/volto/src/config/slots.js @@ -1,4 +1,4 @@ -import { Tags } from '@plone/volto/components'; +import { Tags, RelatedItems } from '@plone/volto/components'; const slots = { belowContent: [ @@ -6,6 +6,10 @@ const slots = { name: 'tags', component: Tags, }, + { + name: 'relatedItems', + component: RelatedItems, + }, ], }; diff --git a/packages/volto/test-setup-config.jsx b/packages/volto/test-setup-config.jsx index 59cb64257f..3c67ef064c 100644 --- a/packages/volto/test-setup-config.jsx +++ b/packages/volto/test-setup-config.jsx @@ -33,6 +33,7 @@ config.set('settings', { supportedLanguages: ['en'], defaultPageSize: 25, showTags: true, + showRelatedItems: true, isMultilingual: false, nonContentRoutes, contentIcons: contentIcons, From 2494812b12bed141b5230d8d8f783ae9131c4c68 Mon Sep 17 00:00:00 2001 From: wesleybl Date: Tue, 27 Aug 2024 09:47:02 -0300 Subject: [PATCH 06/14] Fix news --- packages/volto/news/3740.feature | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/packages/volto/news/3740.feature b/packages/volto/news/3740.feature index 7635a0c4a8..e1e1de2d45 100644 --- a/packages/volto/news/3740.feature +++ b/packages/volto/news/3740.feature @@ -1,2 +1 @@ -- Show related items. - @wesleybl +Show related items. @wesleybl From 85d0e8b0caea1b4e57c5375f2220d9045131e6a3 Mon Sep 17 00:00:00 2001 From: wesleybl Date: Thu, 29 Aug 2024 09:40:52 -0300 Subject: [PATCH 07/14] Setting `showRelatedItems` `true` by default --- packages/volto/src/config/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/volto/src/config/index.js b/packages/volto/src/config/index.js index e051dfde5c..38c919c472 100644 --- a/packages/volto/src/config/index.js +++ b/packages/volto/src/config/index.js @@ -151,7 +151,7 @@ let config = { serverConfig, storeExtenders: [], showTags: true, - showRelatedItems: false, + showRelatedItems: true, controlpanels: [], controlPanelsIcons, filterControlPanels, From 850432677ce0476af04adc708d3ca5b0894f7d64 Mon Sep 17 00:00:00 2001 From: Ichim David Date: Tue, 10 Dec 2024 12:45:27 +0200 Subject: [PATCH 08/14] Fix imports for non barrel paths in RelatedItems.jsx --- .../volto/src/components/theme/RelatedItems/RelatedItems.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx b/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx index 0ea6e1f49c..f234fd85c6 100644 --- a/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx +++ b/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx @@ -3,11 +3,11 @@ * @module components/theme/RelatedItems/RelatedItems */ -import { UniversalLink } from '@plone/volto/components'; +import UniversalLink from '@plone/volto/components/manage/UniversalLink/UniversalLink'; import { defineMessages, injectIntl } from 'react-intl'; import PropTypes from 'prop-types'; import { Container } from 'semantic-ui-react'; -import config from '@plone/registry'; +import config from '@plone/volto/registry';; const messages = defineMessages({ relatedItems: { From fd2a660cd20f52958220f8e552647ec266aee2aa Mon Sep 17 00:00:00 2001 From: Ichim David Date: Tue, 10 Dec 2024 12:49:49 +0200 Subject: [PATCH 09/14] Lint fix RelatedItems.jsx --- .../volto/src/components/theme/RelatedItems/RelatedItems.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx b/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx index f234fd85c6..e854d5d7c9 100644 --- a/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx +++ b/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx @@ -7,7 +7,7 @@ import UniversalLink from '@plone/volto/components/manage/UniversalLink/Universa import { defineMessages, injectIntl } from 'react-intl'; import PropTypes from 'prop-types'; import { Container } from 'semantic-ui-react'; -import config from '@plone/volto/registry';; +import config from '@plone/volto/registry'; const messages = defineMessages({ relatedItems: { From 7db860812ae2548852d9d85a3e91f9cc8d8f00c3 Mon Sep 17 00:00:00 2001 From: wesleybl Date: Wed, 18 Dec 2024 16:41:44 -0300 Subject: [PATCH 10/14] Setting `showRelatedItems` `false` by default --- packages/volto/src/config/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/volto/src/config/index.js b/packages/volto/src/config/index.js index 57913599e3..0c8f57d0b6 100644 --- a/packages/volto/src/config/index.js +++ b/packages/volto/src/config/index.js @@ -141,7 +141,7 @@ let config = { serverConfig, storeExtenders: [], showTags: true, - showRelatedItems: true, + showRelatedItems: false, controlpanels: [], controlPanelsIcons, filterControlPanels, From af46905096f81baf881e5def2a0b8697203f3a01 Mon Sep 17 00:00:00 2001 From: David Glick Date: Wed, 18 Dec 2024 14:30:39 -0800 Subject: [PATCH 11/14] Update packages/volto/news/3740.feature --- packages/volto/news/3740.feature | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/volto/news/3740.feature b/packages/volto/news/3740.feature index e1e1de2d45..ed0c1b9313 100644 --- a/packages/volto/news/3740.feature +++ b/packages/volto/news/3740.feature @@ -1 +1 @@ -Show related items. @wesleybl +Add component to show related items, which can be enabled using the `showRelatedItems` setting. @wesleybl From d5ecf7b5aac1bad203ae746661ac163074f496ba Mon Sep 17 00:00:00 2001 From: David Glick Date: Wed, 18 Dec 2024 14:32:00 -0800 Subject: [PATCH 12/14] Update packages/volto/src/components/index.js --- packages/volto/src/components/index.js | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/volto/src/components/index.js b/packages/volto/src/components/index.js index 613eecc11d..11444c6a1f 100644 --- a/packages/volto/src/components/index.js +++ b/packages/volto/src/components/index.js @@ -22,7 +22,6 @@ export { default as Title } from '@plone/volto/components/theme/Title/Title'; export { default as DefaultView } from '@plone/volto/components/theme/View/DefaultView'; export { default as Pagination } from '@plone/volto/components/theme/Pagination/Pagination'; export { default as Tags } from '@plone/volto/components/theme/Tags/Tags'; -export { default as RelatedItems } from '@plone/volto/components/theme/RelatedItems/RelatedItems'; export { default as OutdatedBrowser } from '@plone/volto/components/theme/OutdatedBrowser/OutdatedBrowser'; export { default as LanguageSelector } from '@plone/volto/components/theme/LanguageSelector/LanguageSelector'; export { default as RenderBlocks } from '@plone/volto/components/theme/View/RenderBlocks'; From fe6e61be0b1cc03b2b3cb7e16bbc1441e9259628 Mon Sep 17 00:00:00 2001 From: David Glick Date: Wed, 18 Dec 2024 14:35:03 -0800 Subject: [PATCH 13/14] Use useIntl instead of injectIntl --- .../theme/RelatedItems/RelatedItems.jsx | 31 +++++++------------ 1 file changed, 12 insertions(+), 19 deletions(-) diff --git a/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx b/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx index e854d5d7c9..e0e121c377 100644 --- a/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx +++ b/packages/volto/src/components/theme/RelatedItems/RelatedItems.jsx @@ -4,7 +4,7 @@ */ import UniversalLink from '@plone/volto/components/manage/UniversalLink/UniversalLink'; -import { defineMessages, injectIntl } from 'react-intl'; +import { defineMessages, useIntl } from 'react-intl'; import PropTypes from 'prop-types'; import { Container } from 'semantic-ui-react'; import config from '@plone/volto/registry'; @@ -22,7 +22,8 @@ const messages = defineMessages({ * @param {array} relatedItems Array of related items. * @returns {JSX.Element} Markup of the component. */ -const RelatedItems = ({ content, intl }) => { +const RelatedItems = ({ content }) => { + const intl = useIntl(); const relatedItems = content?.relatedItems; if ( !config.settings.showRelatedItems || @@ -56,22 +57,14 @@ const RelatedItems = ({ content, intl }) => { * @static */ RelatedItems.propTypes = { - relatedItems: PropTypes.arrayOf( - PropTypes.shape({ - '@id': PropTypes.string.isRequired, - title: PropTypes.string.isRequired, - }), - ), - intl: PropTypes.object.isRequired, + content: PropTypes.shape({ + relatedItems: PropTypes.arrayOf( + PropTypes.shape({ + '@id': PropTypes.string.isRequired, + title: PropTypes.string.isRequired, + }), + ), + }), }; -/** - * Default properties. - * @property {Object} defaultProps Default properties. - * @static - */ -RelatedItems.defaultProps = { - relatedItems: [], -}; - -export default injectIntl(RelatedItems); +export default RelatedItems; From 51b43cc4b737c4f6921329854111b58a7e34ee88 Mon Sep 17 00:00:00 2001 From: David Glick Date: Wed, 18 Dec 2024 14:41:07 -0800 Subject: [PATCH 14/14] Add the new setting to the settings reference --- docs/source/configuration/settings-reference.md | 12 +++++++++++- packages/types/src/config/Settings.d.ts | 1 + 2 files changed, 12 insertions(+), 1 deletion(-) diff --git a/docs/source/configuration/settings-reference.md b/docs/source/configuration/settings-reference.md index 0f156cf8a9..b8601cffef 100644 --- a/docs/source/configuration/settings-reference.md +++ b/docs/source/configuration/settings-reference.md @@ -464,12 +464,22 @@ querystringSearchGet Please test this setting properly before enabling in a production site. cssLayers - To use CSS layers when styling Volto, you can define and apply them at the very top level of the page, where they appear in the `` tag. + To use CSS layers when styling Volto, you can define and apply them at the very top level of the page, where they appear in the `` tag. By using this configuration, you can pass the layer list definition as an array: ```js config.settings.cssLayers = ['reset', 'plone-components', 'layout', 'addons', 'theme']; ``` + +showRelatedItems + If true, the `RelatedItems` component will show items from the `relatedItems` field. Default: false. + + ```{versionadded} 18.5.0 + ``` + + +showTags + If true, the `Tags` component will show tags from the `subjects` field. Default: true. ``` ## Views settings diff --git a/packages/types/src/config/Settings.d.ts b/packages/types/src/config/Settings.d.ts index 61e87a8955..2053fde0f5 100644 --- a/packages/types/src/config/Settings.d.ts +++ b/packages/types/src/config/Settings.d.ts @@ -76,6 +76,7 @@ export interface SettingsConfig { serverConfig: unknown; storeExtenders: unknown[]; showTags: boolean; + showRelatedItems: boolean; controlpanels: unknown[]; controlPanelsIcons: Record; filterControlPanels: unknown;