design-comuni-plone-theme 11.1.0 → 11.1.1

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 
 
+## [11.1.1](https://github.com/redturtle/design-comuni-plone-theme/compare/v11.1.0...v11.1.1) (2023-12-22)
+
+
+### Bug Fixes
+
+* image sizes too small ([b83e3da](https://github.com/redturtle/design-comuni-plone-theme/commit/b83e3da3dffdac76ec8b67f9b9333d840e380762))
+* recurrence widget ([#445](https://github.com/redturtle/design-comuni-plone-theme/issues/445)) ([201a3ac](https://github.com/redturtle/design-comuni-plone-theme/commit/201a3acf5934ff727bcef9053e46c478e339b8f1))
+
+
+### Maintenance
+
+* update customizations ([bf8c37f](https://github.com/redturtle/design-comuni-plone-theme/commit/bf8c37fec68811eab25c7777f04320be1bee046a))
+
+
+### Documentation
+
+* updated publiccode ([5f7a4eb](https://github.com/redturtle/design-comuni-plone-theme/commit/5f7a4eb48a26f96a6653f7cd755ac486782277f8))
+
 ## [11.1.0](https://github.com/redturtle/design-comuni-plone-theme/compare/v11.0.2...v11.1.0) (2023-12-20)
 
 

package/RELEASE.md

@@ -41,6 +41,12 @@
 - ...
 -->
 
+## Versione 11.1.1 (22/12/2023)
+
+### Fix
+
+- Risolto un problema con la dimensione delle immagini, che risultava in alcuni casi troppo piccola causando immagini sgranate
+
 ## Versione 11.0.1 (19/12/2023)
 
 ### Fix

package/package.json

@@ -2,7 +2,7 @@
   "name": "design-comuni-plone-theme",
   "description": "Volto Theme for Italia design guidelines",
   "license": "GPL-v3",
-  "version": "11.1.0",
+  "version": "11.1.1",
   "main": "src/index.js",
   "keywords": [
     "volto-addon",

package/publiccode.yml

@@ -227,9 +227,9 @@ maintenance:
 name: io-Comune - Il sito AgID per Comuni ed Enti Pubblici
 platforms:
   - web
-releaseDate: '2023-12-20'
+releaseDate: '2023-12-22'
 softwareType: standalone/web
-softwareVersion: 11.1.0
+softwareVersion: 11.1.1
 url: 'https://github.com/italia/design-comuni-plone-theme'
 usedBy:
   - ASP Comuni Modenesi Area Nord

package/src/components/ItaliaTheme/Blocks/Listing/Commons/ListingImage.jsx

@@ -8,25 +8,27 @@ const ListingImage = ({
   showDefault = false,
   className = 'listing-image',
   responsive = true,
-  sizes = '(max-width:320px) 200px, (max-width:425px) 300px, (max-width:768px) 400px, 300px',
+  sizes = '(max-width:320px) 200px, (max-width:425px) 300px, (max-width:767px) 500px, 410px',
   ...imageProps
 }) => {
   const Image = config.getComponent({ name: 'Image' }).component;
   // photogallery needs to check for null image
   // https://stackoverflow.com/questions/33136399/is-there-a-way-to-tell-if-reactelement-renders-null
-  const image = Image({ 
-    item, 
-    'aria-hidden': true, 
-    alt: '', 
-    role: 'presentation', 
-    className, 
-    loading, 
-    title: item.title, 
-    responsive, 
-    sizes, 
-    ...imageProps });
+  const image = Image({
+    item,
+    'aria-hidden': true,
+    alt: '',
+    role: 'presentation',
+    className,
+    loading,
+    title: item.title,
+    responsive,
+    sizes,
+    ...imageProps,
+  });
 
-  if (image === null) return showDefault ? <img src={DefaultImageSVG} alt="" /> : null;
+  if (image === null)
+    return showDefault ? <img src={DefaultImageSVG} alt="" /> : null;
 
   return image;
 };

package/src/components/ItaliaTheme/Blocks/Listing/ContentInEvidenceTemplate.jsx

@@ -65,7 +65,12 @@ const ContentInEvidenceTemplate = (props) => {
           const date = getCalendarDate(item, rrule.rrulestr);
           const eventRecurrenceMore = getEventRecurrenceMore(item, isEditMode);
           const listingText = <ListingText item={item} />;
-          const image = ListingImage({ item, className: 'item-image' });
+          const image = ListingImage({
+            item,
+            className: 'item-image',
+            loading: 'eager',
+            sizes: '(max-width:425px) 400px, (max-width:767px) 520px, 650px',
+          });
           const icon = getItemIcon(item);
           const BlockExtraTags = getComponentWithFallback({
             name: 'BlockExtraTags',

package/src/components/ItaliaTheme/Blocks/Listing/PhotogalleryTemplate.jsx

@@ -165,7 +165,18 @@ const PhotogalleryTemplate = ({
           <div className="it-carousel-all it-card-bg">
             <Slider {...settings} ref={slider}>
               {items.map((item, i) => {
-                const image = ListingImage({ item });
+                const image = ListingImage({
+                  item,
+                  sizes: `(max-width:600px) 450px, (max-width:1024px) ${
+                    items.length < 2 ? '1000' : '500'
+                  }px, ${
+                    items.length === 1
+                      ? '1300'
+                      : items.length === 2
+                        ? '650'
+                        : '450'
+                  }px`,
+                });
                 return (
                   <div
                     className={cx('it-single-slide-wrapper', {

package/src/components/ItaliaTheme/Blocks/Listing/SliderTemplate.jsx

@@ -353,7 +353,7 @@ const SliderTemplate = ({
                 const image = ListingImage({
                   item,
                   loading: index === 0 ? 'eager' : 'lazy',
-                  sizes: `max-width(980px) 600px, ${1200 / nSlidesToShow}px`,
+                  sizes: `max-width(991px) 620px, ${1300 / nSlidesToShow}px`,
                   critical: true,
                 });
                 return (

package/src/components/ItaliaTheme/Blocks/Listing/SmallBlockLinksTemplate.jsx

@@ -38,7 +38,11 @@ const SmallBlockLinksTemplate = ({
         )}
         <Row className="items">
           {items.map((item, index) => {
-            const image = ListingImage({ item, sizes: '200px', style: {} });
+            const image = ListingImage({
+              item,
+              sizes: '(max-width:575px) 520px, 200px',
+              style: {},
+            });
 
             return (
               <Col

package/src/components/ItaliaTheme/Cards/CardPersona.jsx

@@ -22,8 +22,7 @@ export const CardPersona = ({
 }) => {
   const image = ListingImage({
     item,
-    maxSize: 300,
-    useOriginal: false,
+    sizes: '130px',
   });
 
   const hasImage = image !== null && showImage;

package/src/customizations/volto/components/manage/Widgets/RecurrenceWidget/EndField.jsx

@@ -0,0 +1,133 @@
+/**
+ * EndField component.
+ * @module components/manage/Widgets/RecurrenceWidget/EndField
+ *
+ *
+ *  * CUSTOMIZATIONS:
+ * - added customization to have this changes https://github.com/plone/volto/pull/5555/files
+ */
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import { defineMessages, injectIntl } from 'react-intl';
+import { Form, Grid, Input, Radio } from 'semantic-ui-react';
+import DatetimeWidget from '../DatetimeWidget';
+
+const messages = defineMessages({
+  recurrenceEnds: { id: 'Recurrence ends', defaultMessage: 'Ends' },
+  recurrenceEndsCount: { id: 'Recurrence ends after', defaultMessage: 'after' },
+  recurrenceEndsUntil: { id: 'Recurrence ends on', defaultMessage: 'on' },
+  occurrences: { id: 'Occurences', defaultMessage: 'occurrence(s)' },
+});
+/**
+ * EndField component class.
+ * @function EndField
+ * @returns {string} Markup of the component.
+ */
+const EndField = ({ value, count, until, onChange, intl }) => {
+  return (
+    <Form.Field inline className="text">
+      <Grid>
+        <Grid.Row stretched>
+          <Grid.Column width="4">
+            <div className="wrapper">
+              <label htmlFor="recurrenceEnds">
+                {intl.formatMessage(messages.recurrenceEnds)}
+              </label>
+            </div>
+          </Grid.Column>
+          <Grid.Column width="8">
+            <Form.Group inline>
+              <Form.Field>
+                <Radio
+                  label=""
+                  name="recurrenceEnds"
+                  id="recurrenceEndsCount"
+                  value="count"
+                  checked={value === 'count'}
+                  onChange={(e, { value }) => onChange('recurrenceEnds', value)}
+                />
+              </Form.Field>
+              <Form.Field disabled={value !== 'count'}>
+                {intl.formatMessage(messages.recurrenceEndsCount)}
+              </Form.Field>
+              <Form.Field disabled={value !== 'count'}>
+                <Input
+                  id="count"
+                  name="count"
+                  value={count || ''}
+                  onChange={({ target }) => {
+                    onChange(
+                      target.id,
+                      target.value === '' ? undefined : target.value,
+                    );
+                  }}
+                />
+              </Form.Field>
+              <Form.Field disabled={value !== 'count'}>
+                {intl.formatMessage(messages.occurrences)}
+              </Form.Field>
+            </Form.Group>
+            <Form.Group inline>
+              <Form.Field>
+                <Radio
+                  id="recurrenceEndsUntil"
+                  label=""
+                  name="recurrenceEnds"
+                  value="until"
+                  checked={value === 'until'}
+                  onChange={(e, { value }) => onChange('recurrenceEnds', value)}
+                />
+              </Form.Field>
+
+              <Form.Field disabled={value !== 'until'}>
+                <DatetimeWidget
+                  id="until"
+                  title={intl.formatMessage(messages.recurrenceEndsUntil)}
+                  dateOnly={true}
+                  value={
+                    until
+                      ? typeof until === 'string'
+                        ? until
+                        : until?.toISOString()
+                      : ''
+                  }
+                  resettable={false}
+                  onChange={(id, value) => {
+                    onChange(id, value === '' ? undefined : value);
+                  }}
+                />
+              </Form.Field>
+            </Form.Group>
+          </Grid.Column>
+        </Grid.Row>
+      </Grid>
+    </Form.Field>
+  );
+};
+
+/**
+ * Property types.
+ * @property {Object} propTypes Property types.
+ * @static
+ */
+EndField.propTypes = {
+  value: PropTypes.string,
+  count: PropTypes.any,
+  until: PropTypes.any,
+  onChange: PropTypes.func,
+};
+
+/**
+ * Default properties.
+ * @property {Object} defaultProps Default properties.
+ * @static
+ */
+EndField.defaultProps = {
+  value: null,
+  count: null,
+  until: null,
+  onChange: null,
+};
+
+export default injectIntl(EndField);

package/src/customizations/volto/components/manage/Widgets/RecurrenceWidget/RecurrenceWidget.jsx

@@ -4,6 +4,7 @@
  * CUSTOMIZATIONS:
  * - add date field open calendar on top
  * - fix all imports and rrulei18n use
+ * - added customization to have this changes https://github.com/plone/volto/pull/5555/files
  */
 
 import React, { Component } from 'react';
@@ -216,26 +217,41 @@ class RecurrenceWidget extends Component {
 
   componentDidUpdate(prevProps) {
     if (this.props.value) {
-      if (prevProps.formData?.start !== this.props.formData?.start) {
-        let start = this.getUTCDate(this.props.formData?.start)
-          .startOf('day')
-          .toDate();
-
-        this.setState((prevState) => {
-          let rruleSet = prevState.rruleSet;
-
-          rruleSet = this.updateRruleSet(
-            rruleSet,
-            prevState.formValues,
-            'dtstart',
-            start,
-          );
-
-          return {
-            ...prevState,
-            rruleSet,
-          };
-        });
+      const changedStart =
+        prevProps.formData?.start !== this.props.formData?.start;
+      const changedEnd = prevProps.formData?.end !== this.props.formData?.end;
+
+      if (changedStart || changedEnd) {
+        let start = this.getUTCDate(this.props.formData?.start).toDate();
+        // let end = this.getUTCDate(this.props.formData?.end).toDate();
+
+        let changeFormValues = {};
+        if (changedEnd) {
+          changeFormValues.until = this.getUTCDate(
+            this.props.formData?.end,
+          ).toDate();
+        }
+        this.setState(
+          (prevState) => {
+            let rruleSet = prevState.rruleSet;
+
+            rruleSet = this.updateRruleSet(
+              rruleSet,
+              { ...prevState.formValues, ...changeFormValues },
+              'dtstart',
+              start,
+            );
+
+            return {
+              ...prevState,
+              rruleSet,
+            };
+          },
+          () => {
+            //then, after set state, set recurrence rrule value
+            this.saveRrule();
+          },
+        );
       }
     }
   }
@@ -247,7 +263,7 @@ class RecurrenceWidget extends Component {
   setRecurrenceStartEnd = () => {
     const start = this.props.formData?.start;
 
-    let _start = this.getUTCDate(start).startOf('day').toDate();
+    const _start = new Date(start); //The date is already in utc from plone, so this is not necessary: this.getUTCDate(start).startOf('day').toDate();
 
     this.setState((prevState) => {
       let rruleSet = prevState.rruleSet;
@@ -336,7 +352,7 @@ class RecurrenceWidget extends Component {
           case 'until':
             if (value != null) {
               formValues['recurrenceEnds'] = option;
-              formValues[option] = toISOString(value);
+              formValues[option] = value;
             }
             break;
           case 'byweekday':
@@ -419,7 +435,24 @@ class RecurrenceWidget extends Component {
           }
           break;
         case 'until':
-          value = value ? moment(new Date(value)).utc().toDate() : null;
+          let mDate = null;
+          if (value) {
+            mDate = this.moment(new Date(value));
+            if (typeof value === 'string') {
+              mDate = this.moment(new Date(value));
+            } else {
+              //object-->Date()
+              mDate = this.moment(value);
+            }
+
+            if (this.props.formData.end) {
+              //set time from formData.end
+              const mEnd = this.moment(new Date(this.props.formData.end));
+              mDate.set('hour', mEnd.get('hour'));
+              mDate.set('minute', mEnd.get('minute'));
+            }
+          }
+          value = value ? mDate.toDate() : null;
           break;
         default:
           break;
@@ -443,8 +476,8 @@ class RecurrenceWidget extends Component {
       field === 'dtstart'
         ? value
         : rruleSet.dtstart()
-          ? rruleSet.dtstart()
-          : moment().utc().toDate();
+        ? rruleSet.dtstart()
+        : new Date();
     var exdates =
       field === 'exdates' ? value : Object.assign([], rruleSet.exdates());
 
@@ -465,12 +498,12 @@ class RecurrenceWidget extends Component {
 
   getDefaultUntil = (freq) => {
     var end = this.props.formData?.end
-      ? toISOString(this.getUTCDate(this.props.formData.end).toDate())
+      ? moment(new Date(this.props.formData.end))
       : null;
-    var tomorrow = toISOString(moment().add(1, 'days').utc().toDate());
-    var nextWeek = toISOString(moment().add(7, 'days').utc().toDate());
-    var nextMonth = toISOString(moment().add(1, 'months').utc().toDate());
-    var nextYear = toISOString(moment().add(1, 'years').utc().toDate());
+    var tomorrow = moment().add(1, 'days');
+    var nextWeek = moment().add(7, 'days');
+    var nextMonth = moment().add(1, 'months');
+    var nextYear = moment().add(1, 'years');
 
     var until = end;
     switch (freq) {
@@ -495,6 +528,19 @@ class RecurrenceWidget extends Component {
       default:
         break;
     }
+    if (this.props.formData.end) {
+      //set default end time
+      until.set('hour', end.get('hour'));
+      until.set('minute', end.get('minute'));
+    }
+
+    until = new Date(
+      until.get('year'),
+      until.get('month'),
+      until.get('date'),
+      until.get('hour'),
+      until.get('minute'),
+    );
 
     return until;
   };
@@ -708,9 +754,13 @@ class RecurrenceWidget extends Component {
     }
   };
 
-  save = () => {
+  saveRrule = () => {
     var value = this.state.rruleSet.toString();
     this.props.onChange(this.props.id, value);
+  };
+
+  save = () => {
+    this.saveRrule();
     this.close();
   };
 

package/src/customizations/volto/reducers/navigation/navigation.js

@@ -9,9 +9,16 @@
  */
 
 import { map } from 'lodash';
-import { flattenToAppURL } from '@plone/volto/helpers';
+import {
+  flattenToAppURL,
+  getBaseUrl,
+  hasApiExpander,
+} from '@plone/volto/helpers';
 
-import { GET_NAVIGATION } from '@plone/volto/constants/ActionTypes';
+import {
+  GET_CONTENT,
+  GET_NAVIGATION,
+} from '@plone/volto/constants/ActionTypes';
 
 const initialState = {
   error: null,
@@ -30,6 +37,7 @@ const initialState = {
 function getRecursiveItems(items) {
   return map(items, (item) => ({
     title: item.title,
+    description: item.description,
     url: item.remoteUrl ?? flattenToAppURL(item['@id']),
     ...(item.items && { items: getRecursiveItems(item.items) }),
   }));
@@ -43,6 +51,7 @@ function getRecursiveItems(items) {
  * @returns {Object} New state.
  */
 export default function navigation(state = initialState, action = {}) {
+  let hasExpander;
   switch (action.type) {
     case `${GET_NAVIGATION}_PENDING`:
       return {
@@ -51,14 +60,38 @@ export default function navigation(state = initialState, action = {}) {
         loaded: false,
         loading: true,
       };
+    case `${GET_CONTENT}_SUCCESS`:
+      hasExpander = hasApiExpander(
+        'navigation',
+        getBaseUrl(flattenToAppURL(action.result['@id'])),
+      );
+      if (hasExpander && !action.subrequest) {
+        return {
+          ...state,
+          error: null,
+          items: getRecursiveItems(
+            action.result['@components'].navigation.items,
+          ),
+          loaded: true,
+          loading: false,
+        };
+      }
+      return state;
     case `${GET_NAVIGATION}_SUCCESS`:
-      return {
-        ...state,
-        error: null,
-        items: getRecursiveItems(action.result.items),
-        loaded: true,
-        loading: false,
-      };
+      // Even if the expander is set or not, if the GET_NAVIGATION is
+      // called, we want it to store the data if the actions data is
+      // not set in the expander data (['@components']) but in the "normal"
+      // action result (we look for the object property returned by the endpoint)
+      if (!action.result?.['@components'] && action.result?.items) {
+        return {
+          ...state,
+          error: null,
+          items: getRecursiveItems(action.result.items),
+          loaded: true,
+          loading: false,
+        };
+      }
+      return state;
     case `${GET_NAVIGATION}_FAIL`:
       return {
         ...state,

package/src/customizations/volto/middleware/api.js

@@ -1,366 +0,0 @@
-/**
- * backport parziale/temporaneo di https://github.com/plone/volto/pull/5069
- * rimuovere dopo l'aggiornamento a Volto >= 17.0.0-alpha.24
- *
- * Api middleware.
- * @module middleware/api
- */
-
-import Cookies from 'universal-cookie';
-import jwtDecode from 'jwt-decode';
-import { compact, flatten, union } from 'lodash';
-import { matchPath } from 'react-router';
-import qs from 'query-string';
-
-import config from '@plone/volto/registry';
-
-import {
-  GET_CONTENT,
-  LOGIN,
-  RESET_APIERROR,
-  SET_APIERROR,
-} from '@plone/volto/constants/ActionTypes';
-import { changeLanguage } from '@plone/volto/actions';
-import {
-  toGettextLang,
-  toReactIntlLang,
-  getCookieOptions,
-} from '@plone/volto/helpers';
-let socket = null;
-
-/**
- *
- * Add configured expanders to an api call for an action
- * Requirements:
- *
- * - It should add the expanders set in the config settings
- * - It should preserve any query if present
- * - It should preserve (and add) any expand parameter (if present) e.g. translations
- * - It should take use the correct codification for arrays in querystring (repeated parameter for each member of the array)
- *
- * @function addExpandersToPath
- * @param {string} path The url/path including the querystring
- * @param {*} type The action type
- * @returns {string} The url/path with the configured expanders added to the query string
- */
-export function addExpandersToPath(path, type, isAnonymous) {
-  const { settings } = config;
-  const { apiExpanders = [] } = settings;
-
-  const {
-    url,
-    query: { expand, ...query },
-  } = qs.parseUrl(path, { decode: false });
-
-  const expandersFromConfig = apiExpanders
-    .filter((expand) => matchPath(url, expand.match) && expand[type])
-    .map((expand) => expand[type]);
-
-  const expandMerge = compact(
-    union([expand, ...flatten(expandersFromConfig)]),
-  ).filter((item) => !(item === 'types' && isAnonymous)); // Remove types expander if isAnonymous
-
-  const stringifiedExpand = qs.stringify(
-    { expand: expandMerge },
-    {
-      arrayFormat: 'comma',
-      encode: false,
-    },
-  );
-
-  const querystringFromConfig = apiExpanders
-    .filter((expand) => matchPath(url, expand.match) && expand[type])
-    .reduce((acc, expand) => {
-      let querystring = expand?.['querystring'];
-      // The querystring accepts being a function to be able to take other
-      // config parameters
-      if (typeof querystring === 'function') {
-        querystring = querystring(config);
-      }
-      return { ...acc, ...querystring };
-    }, {});
-
-  const queryMerge = { ...query, ...querystringFromConfig };
-
-  const stringifiedQuery = qs.stringify(queryMerge, {
-    encode: false,
-  });
-
-  if (stringifiedQuery && stringifiedExpand) {
-    return `${url}?${stringifiedExpand}&${stringifiedQuery}`;
-  } else if (!stringifiedQuery && stringifiedExpand) {
-    return `${url}?${stringifiedExpand}`;
-  } else if (stringifiedQuery && !stringifiedExpand) {
-    return `${url}?${stringifiedQuery}`;
-  } else {
-    return url;
-  }
-}
-
-/**
- * Send a message on a websocket.
- * @function sendOnSocket
- * @param {Object} request Request object.
- * @returns {Promise} message is send
- */
-function sendOnSocket(request) {
-  return new Promise((resolve, reject) => {
-    switch (socket.readyState) {
-      case socket.CONNECTING:
-        socket.addEventListener('open', () => resolve(socket));
-        socket.addEventListener('error', reject);
-        break;
-      case socket.OPEN:
-        resolve(socket);
-        break;
-      default:
-        reject();
-        break;
-    }
-  }).then(() => {
-    socket.send(JSON.stringify(request));
-  });
-}
-
-/**
- * Api middleware.
- * @function
- * @param {Object} api Api object.
- * @returns {Promise} Action promise.
- */
-const apiMiddlewareFactory =
-  (api) =>
-  ({ dispatch, getState }) =>
-  (next) =>
-  (action) => {
-    const { settings } = config;
-
-    const token = getState().userSession.token;
-    let isAnonymous = true;
-    if (token) {
-      const tokenExpiration = jwtDecode(token).exp;
-      const currentTime = new Date().getTime() / 1000;
-      isAnonymous = !token || currentTime > tokenExpiration;
-    }
-
-    if (typeof action === 'function') {
-      return action(dispatch, getState);
-    }
-
-    const { request, type, mode = 'parallel', ...rest } = action;
-    const { subrequest } = action; // We want subrequest remains in `...rest` above
-
-    let actionPromise;
-
-    if (!request) {
-      return next(action);
-    }
-
-    next({ ...rest, type: `${type}_PENDING` });
-
-    if (socket) {
-      actionPromise = Array.isArray(request)
-        ? Promise.all(
-            request.map((item) =>
-              sendOnSocket({
-                ...item,
-                path: addExpandersToPath(item.path, type, isAnonymous),
-                id: type,
-              }),
-            ),
-          )
-        : sendOnSocket({
-            ...request,
-            path: addExpandersToPath(request.path, type, isAnonymous),
-            id: type,
-          });
-    } else {
-      actionPromise = Array.isArray(request)
-        ? mode === 'serial'
-          ? request.reduce((prevPromise, item) => {
-              return prevPromise.then((acc) => {
-                return api[item.op](
-                  addExpandersToPath(item.path, type, isAnonymous),
-                  {
-                    data: item.data,
-                    type: item.type,
-                    headers: item.headers,
-                    params: request.params,
-                    checkUrl: settings.actions_raising_api_errors.includes(
-                      action.type,
-                    ),
-                  },
-                ).then((reqres) => {
-                  return [...acc, reqres];
-                });
-              });
-            }, Promise.resolve([]))
-          : Promise.all(
-              request.map((item) =>
-                api[item.op](addExpandersToPath(item.path, type, isAnonymous), {
-                  data: item.data,
-                  type: item.type,
-                  headers: item.headers,
-                  params: request.params,
-                  checkUrl: settings.actions_raising_api_errors.includes(
-                    action.type,
-                  ),
-                }),
-              ),
-            )
-        : api[request.op](addExpandersToPath(request.path, type, isAnonymous), {
-            data: request.data,
-            type: request.type,
-            headers: request.headers,
-            params: request.params,
-            checkUrl: settings.actions_raising_api_errors.includes(action.type),
-          });
-      actionPromise.then(
-        (result) => {
-          const { settings } = config;
-          if (getState().apierror.connectionRefused) {
-            next({
-              ...rest,
-              type: RESET_APIERROR,
-            });
-          }
-          if (type === GET_CONTENT) {
-            const lang = result?.language?.token;
-            if (
-              lang &&
-              getState().intl.locale !== toReactIntlLang(lang) &&
-              !subrequest &&
-              config.settings.supportedLanguages.includes(lang)
-            ) {
-              const langFileName = toGettextLang(lang);
-              import('~/../locales/' + langFileName + '.json').then(
-                (locale) => {
-                  dispatch(changeLanguage(lang, locale.default));
-                },
-              );
-            }
-          }
-          if (type === LOGIN && settings.websockets) {
-            const cookies = new Cookies();
-            cookies.set(
-              'auth_token',
-              result.token,
-              getCookieOptions({
-                expires: new Date(jwtDecode(result.token).exp * 1000),
-              }),
-            );
-            api.get('/@wstoken').then((res) => {
-              socket = new WebSocket(
-                `${settings.apiPath.replace('http', 'ws')}/@ws?ws_token=${
-                  res.token
-                }`,
-              );
-              socket.onmessage = (message) => {
-                const packet = JSON.parse(message.data);
-                if (packet.error) {
-                  dispatch({
-                    type: `${packet.id}_FAIL`,
-                    error: packet.error,
-                  });
-                } else {
-                  dispatch({
-                    type: `${packet.id}_SUCCESS`,
-                    result: JSON.parse(packet.data),
-                  });
-                }
-              };
-            });
-          }
-          try {
-            return next({ ...rest, result, type: `${type}_SUCCESS` });
-          } catch (error) {
-            // There was an exception while processing reducers or downstream middleware.
-            next({
-              ...rest,
-              error: { status: 500, error },
-              type: `${type}_FAIL`,
-            });
-            // Rethrow the original exception on the client side only,
-            // so it doesn't fall through to express on the server.
-            if (__CLIENT__) throw error;
-          }
-        },
-        (error) => {
-          // Only SSR can set ECONNREFUSED
-          if (error.code === 'ECONNREFUSED') {
-            next({
-              ...rest,
-              error,
-              statusCode: error.code,
-              connectionRefused: true,
-              type: SET_APIERROR,
-            });
-          }
-
-          // Response error is marked crossDomain if CORS error happen
-          else if (error.crossDomain) {
-            next({
-              ...rest,
-              error,
-              statusCode: 'CORSERROR',
-              connectionRefused: false,
-              type: SET_APIERROR,
-            });
-          }
-
-          // Check for actions who can raise api errors
-          if (settings.actions_raising_api_errors.includes(action.type)) {
-            // Gateway timeout
-            if (error?.response?.statusCode === 504) {
-              next({
-                ...rest,
-                error,
-                statusCode: error.code,
-                connectionRefused: true,
-                type: SET_APIERROR,
-              });
-            }
-
-            // Redirect
-            else if (error?.code === 301) {
-              next({
-                ...rest,
-                error,
-                statusCode: error.code,
-                connectionRefused: false,
-                type: SET_APIERROR,
-              });
-            }
-
-            // Redirect
-            else if (error?.code === 408) {
-              next({
-                ...rest,
-                error,
-                statusCode: error.code,
-                connectionRefused: false,
-                type: SET_APIERROR,
-              });
-            }
-
-            // Unauthorized
-            else if (error?.response?.statusCode === 401) {
-              next({
-                ...rest,
-                error,
-                statusCode: error.response,
-                message: error.response.body.message,
-                connectionRefused: false,
-                type: SET_APIERROR,
-              });
-            }
-          }
-          return next({ ...rest, error, type: `${type}_FAIL` });
-        },
-      );
-    }
-
-    return actionPromise;
-  };
-
-export default apiMiddlewareFactory;