io-sanita-theme 2.19.0 → 2.20.0

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # Changelog
 
+## [2.20.0](https://github.com/RedTurtle/io-sanita-theme/compare/2.19.0...2.20.0) (2025-08-20)
+
+### Features
+
+* search table layout: sort / export csv+pdf ([#102](https://github.com/RedTurtle/io-sanita-theme/issues/102)) ([c0095b8](https://github.com/RedTurtle/io-sanita-theme/commit/c0095b8c416c9b00433d25b69a71080ba2046e22))
+* Site Search bar into page 404 ([#103](https://github.com/RedTurtle/io-sanita-theme/issues/103)) ([b07b3e0](https://github.com/RedTurtle/io-sanita-theme/commit/b07b3e02f085eb0854f938a987465a1b7f9dd9ea))
+
+### Bug Fixes
+
+* 404 on mobile ([3525b85](https://github.com/RedTurtle/io-sanita-theme/commit/3525b8520b6827634a2e9bf1b327d44c135827fd))
+* added space before total results number in search results ([#101](https://github.com/RedTurtle/io-sanita-theme/issues/101)) ([ee9f384](https://github.com/RedTurtle/io-sanita-theme/commit/ee9f384439cfcf9598128cd3de1c0225cbf9f634))
+* missing showDownloadActions option ([12aa80a](https://github.com/RedTurtle/io-sanita-theme/commit/12aa80a024bc2a910a8356f6b2774c21efd3c905))
+* use SelectInput from iosanita-theme in Search SelectFacet component, instead of the one from design-react-kit ([#100](https://github.com/RedTurtle/io-sanita-theme/issues/100)) ([7c4b533](https://github.com/RedTurtle/io-sanita-theme/commit/7c4b5331ae09f662e7ed0fd38ea107cf308340c8))
+
+### Maintenance
+
+* fix datatable schema ([1b63442](https://github.com/RedTurtle/io-sanita-theme/commit/1b63442cd8d5a18cda8cd7f21a6ce2172e158675))
+
 ## [2.19.0](https://github.com/RedTurtle/io-sanita-theme/compare/2.18.2...2.19.0) (2025-07-08)
 
 ### Features

package/locales/de/LC_MESSAGES/volto.po

@@ -896,6 +896,11 @@ msgstr ""
 msgid "Visible only in view mode"
 msgstr ""
 
+#. Default: "We apologize for the inconvenience, but the page you were trying to access is not at this address. You can use the search below to help you find what you are looking for:"
+#: overrideTranslations
+msgid "We apologize for the inconvenience, but the page you were trying to access is not at this address. You can use the search below to help you find what you are looking for:"
+msgstr ""
+
 #. Default: "You are trying to access a protected resource, please {login} first."
 #: components/Unauthorized/Unauthorized
 msgid "You are trying to access a protected resource, please {login} first."
@@ -2359,6 +2364,11 @@ msgstr ""
 msgid "open_end"
 msgstr ""
 
+#. Default: "or you can go to the"
+#: overrideTranslations
+msgid "or you can go to the "
+msgstr ""
+
 #. Default: "Ordina per"
 #: components/Search/Search
 msgid "order_by"

package/locales/en/LC_MESSAGES/volto.po

@@ -891,6 +891,11 @@ msgstr "View all"
 msgid "Visible only in view mode"
 msgstr ""
 
+#. Default: "We apologize for the inconvenience, but the page you were trying to access is not at this address. You can use the search below to help you find what you are looking for:"
+#: overrideTranslations
+msgid "We apologize for the inconvenience, but the page you were trying to access is not at this address. You can use the search below to help you find what you are looking for:"
+msgstr ""
+
 #. Default: "You are trying to access a protected resource, please {login} first."
 #: components/Unauthorized/Unauthorized
 msgid "You are trying to access a protected resource, please {login} first."
@@ -2354,6 +2359,11 @@ msgstr "Open link in a new tab"
 msgid "open_end"
 msgstr "This event has an open/variable end date."
 
+#. Default: "or you can go to the"
+#: overrideTranslations
+msgid "or you can go to the "
+msgstr ""
+
 #. Default: "Ordina per"
 #: components/Search/Search
 msgid "order_by"

package/locales/es/LC_MESSAGES/volto.po

@@ -898,6 +898,11 @@ msgstr "Ver todo"
 msgid "Visible only in view mode"
 msgstr ""
 
+#. Default: "We apologize for the inconvenience, but the page you were trying to access is not at this address. You can use the search below to help you find what you are looking for:"
+#: overrideTranslations
+msgid "We apologize for the inconvenience, but the page you were trying to access is not at this address. You can use the search below to help you find what you are looking for:"
+msgstr ""
+
 #. Default: "You are trying to access a protected resource, please {login} first."
 #: components/Unauthorized/Unauthorized
 msgid "You are trying to access a protected resource, please {login} first."
@@ -2361,6 +2366,11 @@ msgstr ""
 msgid "open_end"
 msgstr ""
 
+#. Default: "or you can go to the"
+#: overrideTranslations
+msgid "or you can go to the "
+msgstr ""
+
 #. Default: "Ordina per"
 #: components/Search/Search
 msgid "order_by"

package/locales/fr/LC_MESSAGES/volto.po

@@ -898,6 +898,11 @@ msgstr "Voir tout"
 msgid "Visible only in view mode"
 msgstr ""
 
+#. Default: "We apologize for the inconvenience, but the page you were trying to access is not at this address. You can use the search below to help you find what you are looking for:"
+#: overrideTranslations
+msgid "We apologize for the inconvenience, but the page you were trying to access is not at this address. You can use the search below to help you find what you are looking for:"
+msgstr ""
+
 #. Default: "You are trying to access a protected resource, please {login} first."
 #: components/Unauthorized/Unauthorized
 msgid "You are trying to access a protected resource, please {login} first."
@@ -2361,6 +2366,11 @@ msgstr ""
 msgid "open_end"
 msgstr ""
 
+#. Default: "or you can go to the"
+#: overrideTranslations
+msgid "or you can go to the "
+msgstr ""
+
 #. Default: "Ordina per"
 #: components/Search/Search
 msgid "order_by"

package/locales/it/LC_MESSAGES/volto.po

@@ -891,6 +891,11 @@ msgstr "Vedi tutto"
 msgid "Visible only in view mode"
 msgstr "Visibile solo in modalità di view"
 
+#. Default: "We apologize for the inconvenience, but the page you were trying to access is not at this address. You can use the search below to help you find what you are looking for:"
+#: overrideTranslations
+msgid "We apologize for the inconvenience, but the page you were trying to access is not at this address. You can use the search below to help you find what you are looking for:"
+msgstr "Ci scusiamo per l'inconveniente, la pagina cui stai provando ad accedere non esiste a questo indirizzo. Puoi usare la barra di ricerca qui sotto per trovare quello che stavi cercando:"
+
 #. Default: "You are trying to access a protected resource, please {login} first."
 #: components/Unauthorized/Unauthorized
 msgid "You are trying to access a protected resource, please {login} first."
@@ -2354,6 +2359,11 @@ msgstr ""
 msgid "open_end"
 msgstr ""
 
+#. Default: "or you can go to the"
+#: overrideTranslations
+msgid "or you can go to the "
+msgstr "oppure vai alla "
+
 #. Default: "Ordina per"
 #: components/Search/Search
 msgid "order_by"

package/locales/volto.pot

@@ -1,7 +1,7 @@
 msgid ""
 msgstr ""
 "Project-Id-Version: Plone\n"
-"POT-Creation-Date: 2025-06-24T13:43:29.010Z\n"
+"POT-Creation-Date: 2025-08-13T12:41:17.004Z\n"
 "Last-Translator: Plone i18n <plone-i18n@lists.sourceforge.net>\n"
 "Language-Team: Plone i18n <plone-i18n@lists.sourceforge.net>\n"
 "Content-Type: text/plain; charset=utf-8\n"
@@ -893,6 +893,11 @@ msgstr ""
 msgid "Visible only in view mode"
 msgstr ""
 
+#. Default: "We apologize for the inconvenience, but the page you were trying to access is not at this address. You can use the search below to help you find what you are looking for:"
+#: overrideTranslations
+msgid "We apologize for the inconvenience, but the page you were trying to access is not at this address. You can use the search below to help you find what you are looking for:"
+msgstr ""
+
 #. Default: "You are trying to access a protected resource, please {login} first."
 #: components/Unauthorized/Unauthorized
 msgid "You are trying to access a protected resource, please {login} first."
@@ -2356,6 +2361,11 @@ msgstr ""
 msgid "open_end"
 msgstr ""
 
+#. Default: "or you can go to the"
+#: overrideTranslations
+msgid "or you can go to the "
+msgstr ""
+
 #. Default: "Ordina per"
 #: components/Search/Search
 msgid "order_by"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "io-sanita-theme",
-  "version": "2.19.0",
+  "version": "2.20.0",
   "description": "io-sanita-theme: Volto add-on",
   "main": "src/index.js",
   "license": "MIT",

package/src/components/Blocks/Listing/Table/TableTemplate.jsx

@@ -95,12 +95,16 @@ const TableTemplate = (props) => {
                     const widget_props = {
                       behavior: field_properties.behavior,
                     };
+                    if (field_properties.widget === 'datetime') {
+                      widget_props.format = 'DD/MM/yyyy HH:MM';
+                    }
+                    // per questi campi si è deciso dii non pubblicare ora:minuti
                     switch (c.field) {
                       case 'apertura_bando':
                       case 'chiusura_procedimento_bando':
                       case 'scadenza_domande_bando':
                       case 'scadenza_bando':
-                        widget_props.format = 'DD MMM yyyy';
+                        widget_props.format = 'DD/MM/yyyy';
                         break;
                       default:
                         break;
@@ -110,7 +114,7 @@ const TableTemplate = (props) => {
                       field_properties.widget === 'datetime' &&
                       item[c.field]?.indexOf('T00:00') > 0
                     ) {
-                      widget_props.format = 'DD MMM yyyy';
+                      widget_props.format = 'DD/MM/yyyy';
                     }
                     if (field_properties.vocabulary) {
                       widget_props.vocabulary =

package/src/components/Blocks/Listing/Table/table-templates.scss

@@ -1,3 +1,8 @@
+// XXX: workaround per template search con tabella e fltri con faccette laterali in edit
+// body.cms-ui.has-toolbar.has-sidebar .public-ui .table-template .px-0.container {
+//   width: 100% !important;
+// }
+
 .table-template {
   table.table {
     th {

package/src/components/Blocks/QuickSearch/Body.jsx

@@ -3,7 +3,11 @@ import cx from 'classnames';
 import { useIntl, defineMessages } from 'react-intl';
 import { useSelector } from 'react-redux';
 import { Container, Row, Col, Button } from 'design-react-kit';
-import { SearchBar, QuickSearch } from 'io-sanita-theme/components';
+import {
+  SearchBar,
+  QuickSearch,
+  OverlayLoading,
+} from 'io-sanita-theme/components';
 import { SearchUtils } from 'io-sanita-theme/helpers';
 import UniversalLink from '@plone/volto/components/manage/UniversalLink/UniversalLink';
 import './quickSearchBlock.scss';
@@ -19,9 +23,11 @@ const Body = ({ data, id, isEditMode }) => {
   const intl = useIntl();
   const [searchableText, setSearchableText] = useState();
   const subsite = useSelector((state) => state.subsite?.data);
+  const [redirectingToResults, setRedirectingToResults] = useState(false);
 
   useEffect(() => {
     if (searchableText?.length > 0) {
+      setRedirectingToResults(true);
       window.location.href =
         window.location.origin +
         SearchUtils.getSearchParamsURL({
@@ -86,6 +92,7 @@ const Body = ({ data, id, isEditMode }) => {
           </div>
         )}
       </Container>
+      <OverlayLoading loading={redirectingToResults} />
     </div>
   );
 };

package/src/components/OverlayLoading/OverlayLoading.jsx

@@ -0,0 +1,18 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+import React from 'react';
+
+import { Spinner } from 'design-react-kit';
+
+import './overlayLoading.scss';
+
+const OverlayLoading = ({ loading }) => {
+  return loading ? (
+    <div className="overlay loading-results">
+      <Spinner active />
+    </div>
+  ) : (
+    <></>
+  );
+};
+
+export default OverlayLoading;

package/src/components/OverlayLoading/overlayLoading.scss

@@ -0,0 +1,12 @@
+.overlay.loading-results {
+  width: 100%;
+  height: 100%;
+  position: fixed;
+  z-index: 9999;
+  top: 0;
+  left: 0;
+  background-color: hsl(0deg 0% 100% / 64%);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}

package/src/components/index.js

@@ -1,4 +1,5 @@
 import loadable from '@loadable/component';
+import OverlayLoading from './OverlayLoading/OverlayLoading';
 
 export Icon from 'io-sanita-theme/components/Icon/Icon';
 export FontAwesomeIcon from 'io-sanita-theme/components/Icon/FontAwesomeIcon';
@@ -30,6 +31,7 @@ export HeaderSlim from 'io-sanita-theme/components/layout/Header/HeaderSlim/Head
 export HeaderContacts from 'io-sanita-theme/components/layout/Header/HeaderContacts/HeaderContacts';
 export HeaderCenter from 'io-sanita-theme/components/layout/Header/HeaderCenter';
 export SubsiteHeader from 'io-sanita-theme/components/layout/Header/SubsiteHeader/SubsiteHeader';
+export OverlayLoading from 'io-sanita-theme/components/OverlayLoading/OverlayLoading';
 export SearchModal from 'io-sanita-theme/components/layout/Header/HeaderSearch/SearchModal';
 export UserLoggedMenu from 'io-sanita-theme/components/layout/Header/HeaderSlim/UserLoggedMenu';
 export LoginButton from 'io-sanita-theme/components/layout/Header/HeaderSlim/LoginButton';

package/src/components/layout/Header/HeaderSearch/SearchModal.jsx

@@ -15,7 +15,12 @@ import {
   Spinner,
 } from 'design-react-kit';
 
-import { SearchBar, QuickSearch, Icon } from 'io-sanita-theme/components';
+import {
+  SearchBar,
+  QuickSearch,
+  Icon,
+  OverlayLoading,
+} from 'io-sanita-theme/components';
 import { SearchUtils } from 'io-sanita-theme/helpers';
 
 import './searchModal.scss';
@@ -141,11 +146,7 @@ const SearchModal = ({ closeModal, show }) => {
             />
           </div>
         </Container>
-        {redirectingToResults && (
-          <div className="overlay loading-results">
-            <Spinner active />
-          </div>
-        )}
+        <OverlayLoading loading={redirectingToResults} />
       </ModalBody>
     </Modal>
   );

package/src/components/layout/Header/HeaderSearch/searchModal.scss

@@ -43,19 +43,6 @@ body.search-modal-opened {
     margin-left: auto;
   }
 
-  .overlay.loading-results {
-    width: 100%;
-    height: 100%;
-    position: fixed;
-    z-index: 9999;
-    top: 0;
-    left: 0;
-    background-color: hsl(0deg 0% 100% / 64%);
-    display: flex;
-    align-items: center;
-    justify-content: center;
-  }
-
   @media (max-width: #{map-get($grid-breakpoints, lg)}) {
     .quick-search {
       h2.h6,

package/src/config/blocks/index.js

@@ -287,6 +287,8 @@ export const applyIoSanitaBlocksConfig = (config) => {
     },
     search: {
       ...config.blocks.blocksConfig.search,
+      // filtro top non personalizzato / non funzionante con layout agid
+      variations: config.blocks.blocksConfig.search.variations.filter((v) => v.id !== 'facetsTopSide'), 
       templates: [
         ...listingVariations.map((v) => v.id).filter((v) => v !== 'carousel'),
       ],

package/src/customizations/volto/components/manage/Blocks/Search/SearchBlockView.jsx

@@ -4,7 +4,7 @@
     existing listing template styles
 */
 
-import React from 'react';
+import React, { useState, useEffect } from 'react';
 
 import ListingBody from '@plone/volto/components/manage/Blocks/Listing/ListingBody';
 import { withBlockExtensions } from '@plone/volto/helpers/Extensions';
@@ -19,6 +19,14 @@ import { compose } from 'redux';
 import { useSelector } from 'react-redux';
 import isEqual from 'lodash/isEqual';
 import isFunction from 'lodash/isFunction';
+import { useIntl, defineMessages } from 'react-intl';
+
+const messages = defineMessages({
+  downloadInFormat: {
+    id: 'downloadInFormat',
+    defaultMessage: 'download in formato',
+  },
+});
 
 const getListingBodyVariation = (data) => {
   const { variations } = config.blocks.blocksConfig.listing;
@@ -67,8 +75,10 @@ const applyDefaults = (data, root) => {
 };
 
 const SearchBlockView = (props) => {
-  const { data, searchData, mode = 'view', variation } = props;
+  // console.log(props);
+  const { data, searchData, mode = 'view', variation, path, id } = props;
 
+  const intl = useIntl();
   const Layout =
     variation?.view ||
     config.blocks.blocksConfig.search.variations.find(
@@ -93,6 +103,22 @@ const SearchBlockView = (props) => {
 
   const { variations } = config.blocks.blocksConfig.listing;
   const listingBodyVariation = variations.find(({ id }) => id === selectedView);
+
+  const [downloadUrl, setDownloadUrl] = useState('');
+
+  useEffect(
+    () =>
+      setDownloadUrl(
+        `${path}/searchblock/@@download/${id}.__FORMAT__?${new URLSearchParams({
+          ...props.facets,
+          search: props.searchText,
+          sort_on: props.sortOn,
+          sort_order: props.sortOrder,
+        })}`,
+      ),
+    [props.facets, props.sortOn, props.sortOrder, props.searchText],
+  );
+
   if (!Layout) return null;
 
   return (
@@ -111,6 +137,28 @@ const SearchBlockView = (props) => {
             path={props.path}
             isEditMode={mode === 'edit'}
           />
+          {downloadUrl && data?.showDownloadActions && (
+            <div class="text-right" style={{textAlign: 'right'}}>
+              {intl.formatMessage(messages.downloadInFormat)}:{' '}
+              <a
+                href={downloadUrl.replace('__FORMAT__', 'csv')}
+                download
+                className="btn btn-xs btn-primary inline-link"
+                disabled={!downloadUrl}
+              >
+                CSV
+              </a>{' '}
+              <a
+                href={downloadUrl.replace('__FORMAT__', 'pdf')}
+                download
+                className="btn btn-xs btn-primary inline-link"
+                disabled={!downloadUrl}
+              >
+                PDF
+              </a>
+              {/* <a href={downloadUrl.replace('__FORMAT__', 'html')} className="btn btn-xs btn-primary inline-link">HTML</a> */}
+            </div>
+          )}
         </div>
       </Layout>
     </div>

package/src/customizations/volto/components/manage/Blocks/Search/components/SearchDetails.jsx

@@ -24,7 +24,7 @@ const SearchDetails = ({ total, text, as = 'p', data }) => {
             {intl.formatMessage(commonSearchBlockMessages.searchedFor, {
               em: (...chunks) => <em>{chunks}</em>,
               searchedtext: text,
-            })}
+            })}{' '}
           </>
         )}
         {data.showTotalResults && (

package/src/customizations/volto/components/manage/Blocks/Search/components/SelectFacet.jsx

@@ -7,7 +7,7 @@ import {
   selectFacetStateToValue,
   selectFacetValueToQuery,
 } from '@plone/volto/components/manage/Blocks/Search/components/base';
-import { Select } from 'design-react-kit';
+import { SelectInput } from 'io-sanita-theme/components';
 
 const SelectFacet = (props) => {
   const { facet, choices, isMulti, onChange, value, isEditMode } = props;
@@ -23,7 +23,7 @@ const SelectFacet = (props) => {
           {facet?.title || facet?.field?.label || ''}
         </label> */}
         {/* Cannot style with props because the kit is... the kit. Resorting to div[class*='-ValueContainer'] */}
-        <Select
+        <SelectInput
           placeholder={facet?.title ?? (facet?.field?.label || 'select...')}
           aria-label={facet?.title ?? (facet?.field?.label || 'select...')}
           id={facet['@id']}

package/src/customizations/volto/components/manage/Blocks/Search/components/SortOn.jsx

@@ -0,0 +1,85 @@
+/* CUSTOMIZATIONS:
+  - Agid styling
+*/
+import { defineMessages, useIntl } from 'react-intl';
+// import upSVG from '@plone/volto/icons/sort-up.svg';
+// import downSVG from '@plone/volto/icons/sort-down.svg';
+// import { Container, Row, Col, Icon } from 'design-react-kit';
+import { SelectInput } from 'io-sanita-theme/components';
+
+const messages = defineMessages({
+  noSelection: {
+    id: 'No selection',
+    defaultMessage: 'No selection',
+  },
+  sortOn: {
+    id: 'Sort on',
+    defaultMessage: 'Sort on',
+  },
+  ascending: {
+    id: 'Ascending',
+    defaultMessage: 'Ascending',
+  },
+  descending: {
+    id: 'Descending',
+    defaultMessage: 'Descending',
+  },
+  sortedOn: {
+    id: 'Sorted on',
+    defaultMessage: 'Sorted on',
+  },
+});
+
+const SortOn = (props) => {
+  const {
+    data = {},
+    sortOn = null,
+    sortOrder = null,
+    setSortOn,
+    setSortOrder,
+    isEditMode,
+    querystring = {},
+  } = props;
+
+  const intl = useIntl();
+  const sortableOptions = data?.columns
+    ? [
+        { value: 'sortable_title', label: 'Titolo' },
+        ...data?.columns?.map((f) => {
+          return { value: f.field, label: f.title };
+        }),
+      ].filter((o) => querystring?.['indexes']?.[o.value]?.sortable)
+    : [{ value: 'sortable_title', label: 'Titolo' }];
+
+  const sortOrderOptions = [
+    { value: 'ascending', label: intl.formatMessage(messages.ascending) },
+    { value: 'descending', label: intl.formatMessage(messages.descending) },
+  ];
+
+  return (
+    <div className="pt-4">
+      <h6>{intl.formatMessage(messages.sortOn)}</h6>
+      {/* <pre>{JSON.stringify(searchData, null,2)}</pre> */}
+      {/* <pre>{JSON.stringify(data.columns, null,2)}</pre> */}
+      {/* <pre>{sortOn} {sortOrder}</pre> */}
+      <div className="pt-2">
+        <SelectInput
+          id="sortOn"
+          value={sortableOptions.find((o) => o.value === sortOn)}
+          onChange={(opt) => setSortOn(opt.value)}
+          options={sortableOptions}
+        />
+      </div>
+      <div className="pt-2">
+        <SelectInput
+          id="sortOrder"
+          value={sortOrderOptions.find((o) => o.value === sortOrder)}
+          onChange={(opt) => setSortOrder(opt.value)}
+          options={sortOrderOptions}
+        />
+      </div>
+    </div>
+  );
+};
+
+export default SortOn;

package/src/customizations/volto/components/manage/Blocks/Search/layout/LeftColumnFacets.jsx

@@ -7,6 +7,7 @@ import {
   SearchDetails,
   Facets,
   FilterList,
+  SortOn,
 } from '@plone/volto/components/manage/Blocks/Search/components';
 import UniversalLink from '@plone/volto/components/manage/UniversalLink/UniversalLink';
 import { Container, Row, Col, Icon } from 'design-react-kit';
@@ -25,6 +26,8 @@ const LeftColumnFacets = (props) => {
     totalItems,
     facets,
     setFacets,
+    sortOn,
+    sortOrder,
     onTriggerSearch,
     searchedText, // search text for previous search
     isEditMode,
@@ -35,10 +38,10 @@ const LeftColumnFacets = (props) => {
   } = props;
   const { showSearchButton } = data;
   const isLive = !showSearchButton;
-  const showColumn =
+  const showColumn = !isEditMode && (
     data.columnTextTitle ||
     richTextHasContent(data.columnText) ||
-    data?.facets?.length > 0;
+    data?.facets?.length > 0);
   return (
     <div className="full-width bg-primary-lightest">
       <Container
@@ -95,6 +98,34 @@ const LeftColumnFacets = (props) => {
                   />
                 </div>
               )}
+              <div className="sort-views-wrapper">
+                {data.showSortOn && (
+                  <SortOn
+                    data={data}
+                    querystring={querystring}
+                    isEditMode={isEditMode}
+                    sortOrder={sortOrder}
+                    sortOn={sortOn}
+                    setSortOn={(sortOn) => {
+                      flushSync(() => {
+                        // setSortOn(sortOn);
+                        onTriggerSearch(searchedText || '', facets, sortOn);
+                      });
+                    }}
+                    setSortOrder={(sortOrder) => {
+                      flushSync(() => {
+                        // setSortOrder(sortOrder);
+                        onTriggerSearch(
+                          searchedText || '',
+                          facets,
+                          sortOn,
+                          sortOrder,
+                        );
+                      });
+                    }}
+                  />
+                )}
+              </div>
             </div>
           )}
 

package/src/customizations/volto/components/manage/Blocks/Search/layout/RightColumnFacets.jsx

@@ -1,12 +1,12 @@
 /* CUSTOMIZATIONS:
   - Agid styling
 */
-import React from 'react';
 import {
   SearchInput,
   SearchDetails,
   Facets,
   FilterList,
+  SortOn,
 } from '@plone/volto/components/manage/Blocks/Search/components';
 import UniversalLink from '@plone/volto/components/manage/UniversalLink/UniversalLink';
 import { Container, Row, Col, Icon } from 'design-react-kit';
@@ -26,6 +26,8 @@ const RightColumnFacets = (props) => {
     totalItems,
     facets,
     setFacets,
+    sortOn,
+    sortOrder,
     onTriggerSearch,
     searchedText, // search text for previous search
     isEditMode,
@@ -36,10 +38,13 @@ const RightColumnFacets = (props) => {
   } = props;
   const { showSearchButton } = data;
   const isLive = !showSearchButton;
-  const showColumn =
+
+  const showColumn = !isEditMode && (
     data.columnTextTitle ||
     richTextHasContent(data.columnText) ||
-    data?.facets?.length > 0;
+    data?.facets?.length > 0 ||
+    data?.showOrderOptions);
+
   return (
     <div className="full-width bg-primary-lightest">
       <Container className="searchBlock-facets right-column-facets" stackable>
@@ -125,6 +130,35 @@ const RightColumnFacets = (props) => {
                   />
                 </div>
               )}
+
+              <div className="sort-views-wrapper">
+                {data.showSortOn && (
+                  <SortOn
+                    data={data}
+                    querystring={querystring}
+                    isEditMode={isEditMode}
+                    sortOrder={sortOrder}
+                    sortOn={sortOn}
+                    setSortOn={(sortOn) => {
+                      flushSync(() => {
+                        // setSortOn(sortOn);
+                        onTriggerSearch(searchedText || '', facets, sortOn);
+                      });
+                    }}
+                    setSortOrder={(sortOrder) => {
+                      flushSync(() => {
+                        // setSortOrder(sortOrder);
+                        onTriggerSearch(
+                          searchedText || '',
+                          facets,
+                          sortOn,
+                          sortOrder,
+                        );
+                      });
+                    }}
+                  />
+                )}
+              </div>
             </div>
           )}
         </Row>

package/src/customizations/volto/components/manage/Blocks/Search/schema.js

@@ -123,6 +123,14 @@ const messages = defineMessages({
     id: 'Show total results',
     defaultMessage: 'Show total results',
   },
+  showSortOn: {
+    id: 'Show sorting?',
+    defaultMessage: 'Show sorting?',
+  },
+  showDownloadActions: {
+    id: 'showDownloadActions',
+    defaultMessage: 'Mostra azioni downlad CSV/PDF',
+  },
   columnTextTitle: {
     id: 'columnTextTitle',
     defaultMessage: 'Intestazione della colonna',
@@ -282,6 +290,8 @@ const SearchSchema = ({ data = {}, intl }) => {
           // ...(data.showSearchInput ? ['searchInputPrompt'] : []),
           // ...(data.showSearchButton ? ['searchButtonLabel'] : []),
           'showTotalResults',
+          'showSortOn',
+          'showDownloadActions',
         ],
       },
     ],
@@ -307,6 +317,16 @@ const SearchSchema = ({ data = {}, intl }) => {
         title: intl.formatMessage(messages.showTotalResults),
         default: true,
       },
+      showSortOn: {
+        type: 'boolean',
+        title: intl.formatMessage(messages.showSortOn),
+        default: false,
+      },
+      showDownloadActions: {
+        type: 'boolean',
+        title: intl.formatMessage(messages.showDownloadActions),
+        default: true,
+      },
       searchButtonLabel: {
         title: intl.formatMessage(messages.searchButtonLabel),
         placeholder: intl.formatMessage(messages.searchButtonPlaceholder),

package/src/customizations/volto/components/theme/NotFound/NotFound.jsx

@@ -1,12 +1,16 @@
 /*
 CUSTOMIZATIONS:
 - Removed the "Site Administration" link, added a link to the home page
+- Added a Search in site bar
 */
 
-import { useEffect } from 'react';
+import { useEffect, useState, useRef } from 'react';
 
 import BodyClass from '@plone/volto/helpers/BodyClass/BodyClass';
 import { FormattedMessage } from 'react-intl';
+import { defineMessages, useIntl } from 'react-intl';
+import { useLocation } from 'react-router-dom';
+import qs from 'query-string';
 import { Link } from 'react-router-dom';
 import { Container } from 'semantic-ui-react';
 import {
@@ -16,15 +20,55 @@ import {
 import { useDispatch, useSelector } from 'react-redux';
 import { getNavigation } from '@plone/volto/actions/navigation/navigation';
 import config from '@plone/volto/registry';
+import { SearchBar, OverlayLoading } from 'io-sanita-theme/components';
+import { SearchUtils } from 'io-sanita-theme/helpers';
+
+import { Spinner } from 'design-react-kit';
 
 /**
  * Not found function.
  * @function NotFound
  * @returns {string} Markup of the not found page.
  */
+
+const { getSearchParamsURL } = SearchUtils;
+
+const messages = defineMessages({
+  closeSearch: {
+    id: 'closeSearch',
+    defaultMessage: 'Chiudi cerca',
+  },
+  closeSearchBack: {
+    id: 'closeSearchBack',
+    defaultMessage: 'Indietro',
+  },
+  search: {
+    id: 'search',
+    defaultMessage: 'Cerca',
+  },
+  searchLabel: {
+    id: 'searchLabel',
+    defaultMessage: 'Cerca nel sito',
+  },
+  error404maintext: {
+    id: 'We apologize for the inconvenience, but the page you were trying to access is not at this address. You can use the search below to help you find what you are looking for:',
+    defaultMessage:
+      'We apologize for the inconvenience, but the page you were trying to access is not at this address. You can use the search below to help you find what you are looking for:',
+  },
+  error404hplink: {
+    id: 'or you can go to the ',
+    defaultMessage: 'or you can go to the ',
+  },
+});
+
 const NotFound = () => {
   const dispatch = useDispatch();
   const lang = useSelector((state) => state.intl.locale);
+  const intl = useIntl();
+  const location = useLocation();
+  const inputRef = useRef(null);
+  const [redirectingToResults, setRedirectingToResults] = useState(false);
+  const subsite = useSelector((state) => state.subsite?.data);
 
   const navigationRootPath = config.settings.isMultilingual
     ? `/${toBackendLang(lang)}`
@@ -34,8 +78,25 @@ const NotFound = () => {
     dispatch(getNavigation(navigationRootPath, config.settings.navDepth));
   }, [dispatch, lang, navigationRootPath]);
 
+  const [searchableText, setSearchableText] = useState(
+    qs.parse(location.search)?.SearchableText ?? '',
+  );
+
+  const submitSearch = (_searchableText) => {
+    if (__CLIENT__) {
+      setRedirectingToResults(true);
+      window.location.href =
+        window.location.origin +
+        getSearchParamsURL({
+          searchableText: _searchableText ?? searchableText,
+          subsite,
+          currentLang: intl.locale,
+        });
+    }
+  };
+
   return (
-    <Container className="view-wrapper">
+    <Container className="view-wrapper px-5 text-center py-3">
       <BodyClass className="page-not-found" />
       <h1>
         <FormattedMessage
@@ -43,16 +104,37 @@ const NotFound = () => {
           defaultMessage="This page does not seem to exist…"
         />
       </h1>
-      <p className="description">
-        <FormattedMessage
-          id="We apologize for the inconvenience, but the page you were trying to access is not at this address. You can use the links below to help you find what you are looking for."
-          defaultMessage="We apologize for the inconvenience, but the page you were trying to access is not at this address. You can use the links below to help you find what you are looking for."
-        />
+      <p className="description text-center mt-3">
+        {intl.formatMessage(messages.error404maintext)}
       </p>
+      <Container className="search-bar-container my-5">
+        <div
+          className="search-filters"
+          role="search"
+          aria-label={intl.formatMessage(messages.searchLabel)}
+        >
+          <div className="mb-4">
+            <SearchBar
+              id="search-site-modal"
+              value={searchableText}
+              onChange={(v) => {
+                setSearchableText(v);
+                submitSearch(v);
+              }}
+              showSubmit={true}
+              ref={inputRef}
+            />
+          </div>
+        </div>
+        <OverlayLoading loading={redirectingToResults} />
+      </Container>
+
       <p>
+        {intl.formatMessage(messages.error404hplink)}
         <Link to={navigationRootPath}>
           <FormattedMessage id="Home page" defaultMessage="Home page" />
         </Link>
+        .
       </p>
       {/* <p>
         <FormattedMessage

package/src/customizations/volto/helpers/Api/APIResourceWithAuth.js

@@ -0,0 +1,43 @@
+/**
+CUSTOMIZATIONS: 
+ * Original from @plone/volto 18.9.1
+ * 
+ * - querystring parameters are passed to the backend
+ * 
+ */
+
+import superagent from 'superagent';
+import config from '@plone/volto/registry';
+import { addHeadersFactory } from '@plone/volto/helpers/Proxy/Proxy';
+
+/**
+ * Get a resource image/file with authenticated (if token exist) API headers
+ * @function getAPIResourceWithAuth
+ * @param {Object} req Request object
+ * @return {string} The response with the image
+ */
+export const getAPIResourceWithAuth = (req) =>
+  new Promise((resolve, reject) => {
+    const { settings } = config;
+    const APISUFIX = settings.legacyTraverse ? '' : '/++api++';
+
+    let apiPath = '';
+    if (settings.internalApiPath && __SERVER__) {
+      apiPath = settings.internalApiPath;
+    } else if (__DEVELOPMENT__ && settings.devProxyToApiPath) {
+      apiPath = settings.devProxyToApiPath;
+    } else {
+      apiPath = settings.apiPath;
+    }
+    const request = superagent
+      .get(`${apiPath}${__DEVELOPMENT__ ? '' : APISUFIX}${req.path}`)
+      .query(req.query)
+      .maxResponseSize(settings.maxResponseSize)
+      .responseType('blob');
+    const authToken = req.universalCookies.get('auth_token');
+    if (authToken) {
+      request.set('Authorization', `Bearer ${authToken}`);
+    }
+    request.use(addHeadersFactory(req));
+    request.then(resolve).catch(reject);
+  });

package/src/overrideTranslations.jsx

@@ -178,4 +178,13 @@ defineMessages({
     id: 'descendingTableSort',
     defaultMessage: 'descending',
   },
+  error404maintext: {
+    id: 'We apologize for the inconvenience, but the page you were trying to access is not at this address. You can use the search below to help you find what you are looking for:',
+    defaultMessage:
+      'We apologize for the inconvenience, but the page you were trying to access is not at this address. You can use the search below to help you find what you are looking for:',
+  },
+  error404hplink: {
+    id: 'or you can go to the ',
+    defaultMessage: 'or you can go to the ',
+  },
 });

package/src/theme/io-sanita/_main.scss

@@ -301,3 +301,20 @@ picture.volto-image.responsive img.full-width,
   margin: 0;
   box-shadow: none;
 }
+
+//error 404
+body.page-not-found {
+  .search-bar-container {
+    position: relative;
+  }
+
+  #customer-satisfaction-form {
+    display: none;
+  }
+
+  @media (min-width: #{map-get($grid-breakpoints, lg)}) {
+    .view-wrapper {
+      max-width: 50vw;
+    }
+  }
+}