@plone/volto 18.4.0 → 18.5.0

package/src/components/theme/RelatedItems/RelatedItems.jsx

@@ -0,0 +1,70 @@
+/**
+ * RelatedItems component.
+ * @module components/theme/RelatedItems/RelatedItems
+ */
+
+import UniversalLink from '@plone/volto/components/manage/UniversalLink/UniversalLink';
+import { defineMessages, useIntl } from 'react-intl';
+import PropTypes from 'prop-types';
+import { Container } from 'semantic-ui-react';
+import config from '@plone/volto/registry';
+
+const messages = defineMessages({
+  relatedItems: {
+    id: 'Related Items',
+    defaultMessage: 'Related Items',
+  },
+});
+
+/**
+ * Related Items component.
+ * @function RelatedItems
+ * @param {array} relatedItems Array of related items.
+ * @returns {JSX.Element} Markup of the component.
+ */
+const RelatedItems = ({ content }) => {
+  const intl = useIntl();
+  const relatedItems = content?.relatedItems;
+  if (
+    !config.settings.showRelatedItems ||
+    !relatedItems ||
+    relatedItems.length === 0
+  ) {
+    return null;
+  }
+
+  return (
+    <Container className="related-items">
+      <h2>{intl.formatMessage(messages.relatedItems)}</h2>
+      <ul>
+        {relatedItems.map((relatedItem) =>
+          relatedItem ? (
+            <li key={relatedItem['@id']}>
+              <UniversalLink href={relatedItem['@id']}>
+                {relatedItem.title}
+              </UniversalLink>
+            </li>
+          ) : null,
+        )}
+      </ul>
+    </Container>
+  );
+};
+
+/**
+ * Property types.
+ * @property {Object} propTypes Property types.
+ * @static
+ */
+RelatedItems.propTypes = {
+  content: PropTypes.shape({
+    relatedItems: PropTypes.arrayOf(
+      PropTypes.shape({
+        '@id': PropTypes.string.isRequired,
+        title: PropTypes.string.isRequired,
+      }),
+    ),
+  }),
+};
+
+export default RelatedItems;

package/src/components/theme/RelatedItems/RelatedItems.test.jsx

@@ -0,0 +1,83 @@
+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();
+let store;
+
+describe('Related Items', () => {
+  beforeEach(() => {
+    store = mockStore({
+      intl: {
+        locale: 'en',
+        messages: {},
+      },
+    });
+  });
+
+  it('renders without related items', () => {
+    const content = {};
+    const component = renderer.create(
+      <Provider store={store}>
+        <MemoryRouter>
+          <RelatedItems content={content} />
+        </MemoryRouter>
+      </Provider>,
+    );
+    const json = component.toJSON();
+    expect(json).toMatchSnapshot();
+  });
+
+  it('renders with related items', () => {
+    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(
+      <Provider store={store}>
+        <MemoryRouter>
+          <RelatedItems content={content} />
+        </MemoryRouter>
+      </Provider>,
+    );
+    const json = component.toJSON();
+    expect(json).toMatchSnapshot();
+  });
+
+  it('renders with related items has null', () => {
+    const content = {
+      relatedItems: [
+        {
+          '@id': '/test-1',
+          title: 'Title 1',
+          description: 'Description 1',
+        },
+        null,
+      ],
+    };
+
+    const component = renderer.create(
+      <Provider store={store}>
+        <MemoryRouter>
+          <RelatedItems content={content} />
+        </MemoryRouter>
+      </Provider>,
+    );
+    const json = component.toJSON();
+    expect(json).toMatchSnapshot();
+  });
+});

package/src/config/index.js

@@ -141,6 +141,7 @@ let config = {
     serverConfig,
     storeExtenders: [],
     showTags: true,
+    showRelatedItems: false,
     controlpanels: [],
     controlPanelsIcons,
     filterControlPanels,

package/src/config/slots.js

@@ -1,3 +1,4 @@
+import RelatedItems from '@plone/volto/components/theme/RelatedItems/RelatedItems';
 import Tags from '@plone/volto/components/theme/Tags/Tags';
 
 const slots = {
@@ -6,6 +7,10 @@ const slots = {
       name: 'tags',
       component: Tags,
     },
+    {
+      name: 'relatedItems',
+      component: RelatedItems,
+    },
   ],
 };
 

package/src/constants/Languages.cjs

@@ -19,6 +19,7 @@ module.exports = {
   pt: 'Português',
   pt_BR: 'Português (Brasil)',
   zh_CN: '中文',
+  sv: 'Svenska',
 };
 
 // export default languages;

package/src/helpers/Robots/Robots.js

@@ -16,7 +16,9 @@ import { addHeadersFactory } from '@plone/volto/helpers/Proxy/Proxy';
 export const generateRobots = (req) =>
   new Promise((resolve) => {
     const internalUrl =
-      config.settings.internalApiPath ?? config.settings.apiPath;
+      config.settings.internalApiPath ??
+      config.settings.devProxyToApiPath ??
+      config.settings.apiPath;
     const request = superagent.get(`${internalUrl}/robots.txt`);
     request.set('Accept', 'text/plain');
     const authToken = req.universalCookies.get('auth_token');

package/test-setup-config.jsx

@@ -34,6 +34,7 @@ config.set('settings', {
   supportedLanguages: ['en'],
   defaultPageSize: 25,
   showTags: true,
+  showRelatedItems: true,
   isMultilingual: false,
   nonContentRoutes,
   nonContentRoutesPublic,

package/theme/themes/pastanaga/extras/main.less

@@ -651,6 +651,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';

package/types/components/theme/Navigation/ContextNavigation.d.ts

@@ -3,7 +3,7 @@
  * portlet. It uses the same API, so the options are similar to
  * INavigationPortlet
  */
-export function ContextNavigationComponent(props: any): import("react/jsx-runtime").JSX.Element | "";
+export function ContextNavigationComponent(props: any): "" | import("react/jsx-runtime").JSX.Element;
 export namespace ContextNavigationComponent {
     namespace propTypes {
         let navigation: any;

package/types/components/theme/RelatedItems/RelatedItems.d.ts

@@ -0,0 +1,13 @@
+export default RelatedItems;
+/**
+ * Related Items component.
+ * @function RelatedItems
+ * @param {array} relatedItems Array of related items.
+ * @returns {JSX.Element} Markup of the component.
+ */
+declare function RelatedItems({ content }: any[]): JSX.Element;
+declare namespace RelatedItems {
+    namespace propTypes {
+        let content: any;
+    }
+}

package/types/components/theme/RelatedItems/RelatedItems.test.d.ts

@@ -0,0 +1 @@
+export {};

package/types/components/theme/View/RenderBlocks.d.ts

@@ -1,2 +1,2 @@
 export default RenderBlocks;
-declare function RenderBlocks(props: any): import("react/jsx-runtime").JSX.Element | "";
+declare function RenderBlocks(props: any): "" | import("react/jsx-runtime").JSX.Element;

package/types/components/theme/Widgets/ArrayWidget.d.ts

@@ -3,4 +3,4 @@ declare function ArrayWidget({ value, children, className }: {
     value: any;
     children: any;
     className: any;
-}): import("react/jsx-runtime").JSX.Element | "";
+}): "" | import("react/jsx-runtime").JSX.Element;

package/types/components/theme/Widgets/DateWidget.d.ts

@@ -4,4 +4,4 @@ declare function DateWidget({ value, children, className, format }: {
     children: any;
     className: any;
     format?: string;
-}): import("react/jsx-runtime").JSX.Element | "";
+}): "" | import("react/jsx-runtime").JSX.Element;

package/types/components/theme/Widgets/DatetimeWidget.d.ts

@@ -4,4 +4,4 @@ declare function DatetimeWidget({ value, children, className, format }: {
     children: any;
     className: any;
     format?: string;
-}): import("react/jsx-runtime").JSX.Element | "";
+}): "" | import("react/jsx-runtime").JSX.Element;

package/types/components/theme/Widgets/DescriptionWidget.d.ts

@@ -3,4 +3,4 @@ declare function DescriptionWidget({ value, children, className }: {
     value: any;
     children: any;
     className: any;
-}): import("react/jsx-runtime").JSX.Element | "";
+}): "" | import("react/jsx-runtime").JSX.Element;

package/types/components/theme/Widgets/EmailWidget.d.ts

@@ -3,4 +3,4 @@ declare function EmailWidget({ value, children, className }: {
     value: any;
     children: any;
     className: any;
-}): import("react/jsx-runtime").JSX.Element | "";
+}): "" | import("react/jsx-runtime").JSX.Element;

package/types/components/theme/Widgets/FileWidget.d.ts

@@ -3,4 +3,4 @@ declare function FileWidget({ value, children, className }: {
     value: any;
     children: any;
     className: any;
-}): import("react/jsx-runtime").JSX.Element | "";
+}): "" | import("react/jsx-runtime").JSX.Element;

package/types/components/theme/Widgets/ImageWidget.d.ts

@@ -2,4 +2,4 @@ export default ImageWidget;
 declare function ImageWidget({ value, className }: {
     value: any;
     className: any;
-}): import("react/jsx-runtime").JSX.Element | "";
+}): "" | import("react/jsx-runtime").JSX.Element;

package/types/components/theme/Widgets/PasswordWidget.d.ts

@@ -3,4 +3,4 @@ declare function PasswordWidget({ value, children, className }: {
     value: any;
     children: any;
     className: any;
-}): import("react/jsx-runtime").JSX.Element | "";
+}): "" | import("react/jsx-runtime").JSX.Element;

package/types/components/theme/Widgets/RelationWidget.d.ts

@@ -3,4 +3,4 @@ declare function RelationWidget({ value, children, className }: {
     value: any;
     children: any;
     className: any;
-}): import("react/jsx-runtime").JSX.Element | "";
+}): "" | import("react/jsx-runtime").JSX.Element;

package/types/components/theme/Widgets/RelationsWidget.d.ts

@@ -3,4 +3,4 @@ declare function RelationsWidget({ value, children, className }: {
     value: any;
     children: any;
     className: any;
-}): import("react/jsx-runtime").JSX.Element | "";
+}): "" | import("react/jsx-runtime").JSX.Element;

package/types/components/theme/Widgets/RichTextWidget.d.ts

@@ -2,4 +2,4 @@ export default RichTextWidget;
 declare function RichTextWidget({ value, className }: {
     value: any;
     className: any;
-}): import("react/jsx-runtime").JSX.Element | "";
+}): "" | import("react/jsx-runtime").JSX.Element;

package/types/components/theme/Widgets/SelectWidget.d.ts

@@ -3,4 +3,4 @@ declare function SelectWidget({ value, children, className }: {
     value: any;
     children: any;
     className: any;
-}): import("react/jsx-runtime").JSX.Element | "";
+}): "" | import("react/jsx-runtime").JSX.Element;

package/types/components/theme/Widgets/TextWidget.d.ts

@@ -3,4 +3,4 @@ declare function TextWidget({ value, children, className }: {
     value: any;
     children: any;
     className: any;
-}): import("react/jsx-runtime").JSX.Element | "";
+}): "" | import("react/jsx-runtime").JSX.Element;

package/types/components/theme/Widgets/TitleWidget.d.ts

@@ -3,4 +3,4 @@ declare function TitleWidget({ value, children, className }: {
     value: any;
     children: any;
     className: any;
-}): import("react/jsx-runtime").JSX.Element | "";
+}): "" | import("react/jsx-runtime").JSX.Element;

package/types/components/theme/Widgets/TokenWidget.d.ts

@@ -3,4 +3,4 @@ declare function TokenWidget({ value, children, className }: {
     value: any;
     children: any;
     className: any;
-}): import("react/jsx-runtime").JSX.Element | "";
+}): "" | import("react/jsx-runtime").JSX.Element;

package/types/components/theme/Widgets/UrlWidget.d.ts

@@ -3,4 +3,4 @@ declare function UrlWidget({ value, children, className }: {
     value: any;
     children: any;
     className: any;
-}): import("react/jsx-runtime").JSX.Element | "";
+}): "" | import("react/jsx-runtime").JSX.Element;

package/types/config/slots.d.ts

@@ -1,6 +1,6 @@
 export default slots;
 declare namespace slots {
-    let belowContent: {
+    let belowContent: ({
         name: string;
         component: {
             ({ content }: {
@@ -17,5 +17,13 @@ declare namespace slots {
                 };
             };
         };
-    }[];
+    } | {
+        name: string;
+        component: {
+            ({ content }: any[]): JSX.Element;
+            propTypes: {
+                content: any;
+            };
+        };
+    })[];
 }

package/types/constants/Languages.d.cts

@@ -13,3 +13,4 @@ export let ja: string;
 export let pt: string;
 export let pt_BR: string;
 export let zh_CN: string;
+export let sv: string;