FEATURE: Allow grouping in DimensionSwitcher

Author: JamesAlias

Tests/IntegrationTests/Fixtures/1Dimension/SitePackage/Configuration/Settings.yaml

@@ -12,35 +12,42 @@ Neos:
             values:
               - en_US
             uriSegment: en
+            group: NON-EU
           en_UK:
             label: 'English (UK)'
             values:
               - en_UK
               - en_US
             uriSegment: uk
+            group: NON-EU
           de:
             label: German
             values:
               - de
             uriSegment: de
+            group: EU
           fr:
             label: French
             values:
               - fr
             uriSegment: fr
+            group: EU
           nl:
             label: Dutch
             values:
               - nl
               - de
             uriSegment: nl
+            group: EU
           da:
             label: Danish
             values:
               - da
             uriSegment: da
+            group: EU
           lv:
             label: Latvian
             values:
               - lv
             uriSegment: lv
+            group: EU

Tests/IntegrationTests/Fixtures/1Dimension/switchingDimensions.e2e.js

@@ -3,6 +3,7 @@ import {
     Page,
     DimensionSwitcher
 } from './../../pageModel';
+import {Selector} from 'testcafe';
 
 /* global fixture:true */
 
@@ -30,3 +31,9 @@ test('Switching dimensions', async t => {
         .expect(await Page.getReduxState(state => state.cr.contentDimensions.active.language[0])).eql('en_US', 'Dimension back to English')
         .expect(Page.treeNode.withText(otherPageName).exists).ok('Untranslated node back in the tree');
 });
+
+test('Grouping of dimensions', async t => {
+    await t
+        .click(DimensionSwitcher.dimensionSwitcher)
+        .expect(Selector('div[class*="selectBox__groupHeader"]').withExactText('EU').exists).ok('Languages group exists');
+});

packages/neos-ui/src/Containers/PrimaryToolbar/DimensionSwitcher/DimensionSelector.js

@@ -2,7 +2,6 @@ import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
 import SelectBox from '@neos-project/react-ui-components/src/SelectBox/';
 import style from './style.module.css';
-import {$get, $transform} from 'plow-js';
 import mapValues from 'lodash.mapvalues';
 import sortBy from 'lodash.sortby';
 import {neos} from '@neos-project/neos-ui-decorators';
@@ -46,14 +45,12 @@ export default class DimensionSelector extends PureComponent {
         const presetOptions = mapValues(
             presets,
             (presetConfiguration, presetName) => {
-                return $transform(
-                    {
-                        label: $get('label'),
-                        value: presetName,
-                        disallowed: $get('disallowed')
-                    },
-                    presetConfiguration
-                );
+                return {
+                    label: presetConfiguration?.label,
+                    value: presetName,
+                    disallowed: presetConfiguration?.disallowed,
+                    group: presetConfiguration?.group
+                };
             }
         );