@sapui5/sap.ushell 1.132.1 → 1.134.0

package/src/main/js/sap/ushell/User.js

@@ -1,4 +1,4 @@
-// Copyright (c) 2009-2023 SAP SE, All Rights Reserved
+// Copyright (c) 2009-2025 SAP SE, All Rights Reserved
 
 /**
  * @fileOverview The <code>sap.ushell.User</code> object with related functions.
@@ -11,7 +11,9 @@ sap.ui.define([
     "sap/ui/core/Core",
     "sap/ui/core/Locale",
     "sap/ui/core/LocaleData",
-    "sap/ui/thirdparty/URI"
+    "sap/ui/thirdparty/URI",
+    "sap/ushell/Config",
+    "sap/ushell/utils"
 ], function (
     Log,
     Localization,
@@ -20,7 +22,9 @@ sap.ui.define([
     Core,
     Locale,
     LocaleData,
-    URI
+    URI,
+    Config,
+    ushellUtils
 ) {
     "use strict";
 
@@ -71,7 +75,7 @@ sap.ui.define([
      * @param {object} oSettings the result provided by the ContainerAdapter
      * @since 1.15.0
      */
-    var User = function (oSettings) {
+    var User = function (oSettings = {}) {
         // actually the parameter contains the container adapter config
         var aChangedProperties = [];
         var oBootTheme;
@@ -83,11 +87,15 @@ sap.ui.define([
         // todo: ABAP specific code should be moved to ushell_abap
         // User profile and edit states are only available on ABAP platform
         const oEditStates = {};
-        oSettings.userProfile?.forEach((entry) => {
+        oSettings.userProfile?.forEach?.((entry) => {
             if (entry.id && entry.editState) {
                 oEditStates[entry.id] = entry.editState;
             }
         });
+
+        // The THEME_SET parameter from the user profile
+        let sCurrentThemeSet = oSettings.userProfile?.find?.((entry) => entry.id === "THEME_SET")?.value || "";
+
         // constructor code below
 
         /**
@@ -147,6 +155,21 @@ sap.ui.define([
             return oSettings.timeZone;
         };
 
+        /**
+         * Returns the type of the language and settings entry.
+         * @returns {Promise<object>} A promise that resolves with the language and region settings entry.
+         * @since 1.134.0
+         */
+        this.getLanguageAndRegionSettingsEntry = async () => {
+            if (oSettings.getLanguageAndRegionSettingsEntry) {
+                const oEntry = await oSettings.getLanguageAndRegionSettingsEntry();
+                return oEntry;
+            }
+
+            const [oDefaultEntry] = await ushellUtils.requireAsync(["sap/ushell/components/shell/Settings/userLanguageRegion/UserLanguageRegionEntry"]);
+            return oDefaultEntry;
+        };
+
         /**
          * Returns this user's initials.
          *
@@ -323,6 +346,18 @@ sap.ui.define([
             return oCurrentTheme.theme; // to stay compatible
         };
 
+        /**
+         * Returns this user's current theme set.
+         *
+         * @returns {string} this user's selected theme set
+         * @since 1.133.0
+         *
+         * @private
+         */
+        this.getThemeSet = function () {
+            return sCurrentThemeSet;
+        };
+
         /** Returns for this user's and the theme sTheme its theme root
          *
          * @param {string} [sTheme] for compatibility reason an empty object is returned if no theme range is defined
@@ -382,6 +417,28 @@ sap.ui.define([
             this.applyTheme(sNewTheme);
         };
 
+        /**
+         * Mark the new theme set for saving.
+         *
+         * @param {string} sNewThemeSet The new selected theme set
+         * @since 1.133
+         */
+        this.setThemeSet = function (sNewThemeSet) {
+            if (this.isSetThemePermitted() === false) {
+                const sErrorMsg = "setThemeSet is not permitted";
+                Log.error(sErrorMsg);
+                throw new Error(sErrorMsg);
+            }
+
+            if (sNewThemeSet !== sCurrentThemeSet) {
+                this.setChangedProperties({
+                    propertyName: "themeSet",
+                    name: "THEME_SET"
+                }, sCurrentThemeSet, sNewThemeSet);
+                sCurrentThemeSet = sNewThemeSet;
+            }
+        };
+
         /**
          * Applies the given theme temporarily, without changing the
          * current preference of the user.
@@ -400,7 +457,7 @@ sap.ui.define([
             // change current display theme
             oCurrentTheme = oTheme;
 
-            const _applyTheme = Core["applyTheme"];
+            const _applyTheme = Core.applyTheme;
             if (!_applyTheme) { // ui5 v.2
                 sap.ui.require("sap/ui/core/Theming").setTheme(oTheme.theme);
             } else if (oTheme.suppliedRoot) { // Keep the legacy code until Workzone/cFLP adds all theme roots to sap-ui-config correctly
@@ -412,12 +469,25 @@ sap.ui.define([
             }
 
             // send a message the Iframe to change its theme
-            sap.ui.require(["sap/ushell/components/applicationIntegration/application/PostMessageUtils"], function (PostMessageUtils) {
-                PostMessageUtils.postMessageToMultipleIframes("sap.ushell.appRuntime", "themeChange", {
-                    currentThemeId: this.getTheme(User.prototype.constants.themeFormat.NWBC),
-                    themeServiceRoute: window.location.protocol + "//" + window.location.host + "/comsapuitheming.runtime/themeroot/v1"
-                });
-            }.bind(this));
+            if (Config.last("/core/navigation/enableAppLifeCycleFallback")) {
+                sap.ui.require(["sap/ushell/components/applicationIntegration/application/PostMessageUtils"], function (PostMessageUtils) {
+                    PostMessageUtils.postMessageToMultipleIframes("sap.ushell.appRuntime", "themeChange", {
+                        currentThemeId: this.getTheme(User.prototype.constants.themeFormat.NWBC),
+                        themeServiceRoute: window.location.protocol + "//" + window.location.host + "/comsapuitheming.runtime/themeroot/v1"
+                    });
+                }.bind(this));
+            } else {
+                sap.ui.require(["sap/ushell/components/applicationIntegration/PostMessageManager"], function (PostMessageManager) {
+                    PostMessageManager.sendRequestToAllApplications(
+                        "sap.ushell.appRuntime.themeChange",
+                        {
+                            currentThemeId: this.getTheme(User.prototype.constants.themeFormat.NWBC),
+                            themeServiceRoute: window.location.protocol + "//" + window.location.host + "/comsapuitheming.runtime/themeroot/v1"
+                        },
+                        false
+                    );
+                }.bind(this));
+            }
         };
 
         /**

package/src/main/js/sap/ushell/UserActivityLog.js

@@ -1,4 +1,4 @@
-// Copyright (c) 2009-2023 SAP SE, All Rights Reserved
+// Copyright (c) 2009-2025 SAP SE, All Rights Reserved
 
 /**
  * @fileOverview Implementation of FLP User Activity Log.

package/src/main/js/sap/ushell/adapters/AppVariantPersonalizationAdapter.js

@@ -1,4 +1,4 @@
-// Copyright (c) 2009-2023 SAP SE, All Rights Reserved
+// Copyright (c) 2009-2025 SAP SE, All Rights Reserved
 sap.ui.define([
     "sap/ui/core/Lib",
     "sap/ushell/services/PersonalizationV2/constants",

package/src/main/js/sap/ushell/adapters/cdm/ClientSideTargetResolutionAdapter.js

@@ -1,4 +1,4 @@
-// Copyright (c) 2009-2023 SAP SE, All Rights Reserved
+// Copyright (c) 2009-2025 SAP SE, All Rights Reserved
 
 /**
  * @fileOverview ClientSideTargetResolutionAdapter for the CDM platform.
@@ -9,7 +9,7 @@
  * <li>provide the resolveHashFragment function, a fallback method called by ClientSideTargetResolution service.</li>
  * </ul>
  *
- * @version 1.132.1
+ * @version 1.134.0
  */
 sap.ui.define([
     "sap/base/util/Version",

package/src/main/js/sap/ushell/adapters/cdm/CommonDataModelAdapter.js

@@ -1,10 +1,10 @@
-// Copyright (c) 2009-2023 SAP SE, All Rights Reserved
+// Copyright (c) 2009-2025 SAP SE, All Rights Reserved
 
 /**
  * @fileOverview The Unified Shell's sap.ushell.adapters.cdm.CommonDataModelAdapter for the 'CDM'
  *               platform.
  *
- * @version 1.132.1
+ * @version 1.134.0
  */
 sap.ui.define([
     "sap/base/Log",

package/src/main/js/sap/ushell/adapters/cdm/ConfigurationDefaultsAdapter.js

@@ -1,9 +1,9 @@
-// Copyright (c) 2009-2023 SAP SE, All Rights Reserved
+// Copyright (c) 2009-2025 SAP SE, All Rights Reserved
 
 /**
  * @fileOverview The ConfigurationDefaults adapter for the CDM platform.
  *
- * @version 1.132.1
+ * @version 1.134.0
  */
 sap.ui.define([
     "sap/ushell/bootstrap/cdm/cdm.constants",

package/src/main/js/sap/ushell/adapters/cdm/ContainerAdapter.js

@@ -1,8 +1,8 @@
-// Copyright (c) 2009-2023 SAP SE, All Rights Reserved
+// Copyright (c) 2009-2025 SAP SE, All Rights Reserved
 /**
  * @fileOverview The Unified Shell"s container adapter for the Common Data Model (CDM) platform.
  *
- * @version 1.132.1
+ * @version 1.134.0
  */
 sap.ui.define([
     "sap/base/Log",
@@ -15,7 +15,8 @@ sap.ui.define([
     "sap/ushell/User",
     "sap/ushell/utils",
     "sap/ushell/Container",
-    "sap/ushell/resources"
+    "sap/ushell/resources",
+    "sap/ushell/Config"
 ], function (
     Log,
     deepClone,
@@ -27,7 +28,8 @@ sap.ui.define([
     User,
     ushellUtils,
     Container,
-    resources
+    resources,
+    ushellConfig
 ) {
 
     "use strict";
@@ -180,7 +182,20 @@ sap.ui.define([
             return {
                 setThemePermitted: false,
                 setAccessibilityPermitted: false,
-                setContentDensityPermitted: false
+                setContentDensityPermitted: false,
+                getLanguageAndRegionSettingsEntry: async function () {
+                    let oEntry;
+                    // TODO:
+                    // This will check will be removed once we are good to set the new entry as default for the cdm platform
+                    // And only the cdm/UserLanguageAndRegionEntry will be used.
+                    // BLI Item to track this: https://jira.tools.sap/browse/FLPCOREANDUX-10542
+                    if (ushellConfig.last("/core/shell/cdmUserLanguageAndSettingsView")) {
+                        [oEntry] = await ushellUtils.requireAsync(["sap/ushell/adapters/cdm/Settings/UserLanguageAndRegion/UserLanguageAndRegionEntry"]);
+                    } else {
+                        [oEntry] = await ushellUtils.requireAsync(["sap/ushell/components/shell/Settings/userLanguageRegion/UserLanguageRegionEntry"]);
+                    }
+                    return oEntry;
+                }
             };
         }
 
@@ -463,7 +478,8 @@ sap.ui.define([
                 "setThemePermitted",
                 "importBookmarks",
                 "showMyHome",
-                "detectDarkMode"
+                "detectDarkMode",
+                "getLanguageAndRegionSettingsEntry"
             ];
 
             Object.keys(oPropertiesClone).forEach(function (sKey) {

package/src/main/js/sap/ushell/adapters/cdm/LaunchPageAdapter.js

@@ -1,10 +1,10 @@
-// Copyright (c) 2009-2023 SAP SE, All Rights Reserved
+// Copyright (c) 2009-2025 SAP SE, All Rights Reserved
 
 /**
  * @fileOverview The Unified Shell's LaunchPageAdapter for the
  *               'CDM' platform - Version 2 (V2)
  * @deprecated since 1.100
- * @version 1.132.1
+ * @version 1.134.0
  */
 sap.ui.define([
     "sap/ushell/adapters/cdm/_LaunchPage/readHome",

package/src/main/js/sap/ushell/adapters/cdm/MenuAdapter.js

@@ -1,4 +1,4 @@
-// Copyright (c) 2009-2023 SAP SE, All Rights Reserved
+// Copyright (c) 2009-2025 SAP SE, All Rights Reserved
 
 /**
  * @fileOverview MenuAdapter for the CDM platform.

package/src/main/js/sap/ushell/adapters/cdm/PagesCommonDataModelAdapter.js

@@ -1,11 +1,11 @@
-// Copyright (c) 2009-2023 SAP SE, All Rights Reserved
+// Copyright (c) 2009-2025 SAP SE, All Rights Reserved
 /**
  * @fileOverview The Unified Shell's platform independent sap.ushell.adapters.PagesCommonDataModelAdapter.
  *
  * It combines the page data, tile data, navigation data and personalization into a CDM 3.1 site.
  * Only used on the ABAP platform and on local for testing.
  *
- * @version 1.132.1
+ * @version 1.134.0
  */
 sap.ui.define([
     "sap/base/Log",

package/src/main/js/sap/ushell/adapters/cdm/PersonalizationAdapter.js

@@ -1,11 +1,11 @@
-// Copyright (c) 2009-2023 SAP SE, All Rights Reserved
+// Copyright (c) 2009-2025 SAP SE, All Rights Reserved
 
 /**
  * @fileOverview The Personalization adapter for the CDM platform.
  *
  *
  * The CDM personalization adapter can be used to store data in the RA@ABAP platform.
- * @version 1.132.1
+ * @version 1.134.0
  */
 sap.ui.define([
     "sap/ushell/adapters/cdm/_Personalization/internals",

package/src/main/js/sap/ushell/adapters/cdm/PersonalizationV2Adapter.js

@@ -1,11 +1,11 @@
-// Copyright (c) 2009-2023 SAP SE, All Rights Reserved
+// Copyright (c) 2009-2025 SAP SE, All Rights Reserved
 
 /**
  * @fileOverview The Personalization adapter for the CDM platform.
  *
  *
  * The CDM personalization adapter can be used to store data in the RA@ABAP platform.
- * @version 1.132.1
+ * @version 1.134.0
  */
 sap.ui.define([
     "./PersonalizationAdapter"

package/src/main/js/sap/ushell/adapters/cdm/Settings/UserLanguageAndRegion/UserLanguageAndRegion.controller.js

@@ -0,0 +1,251 @@
+// Copyright (c) 2009-2025 SAP SE, All Rights Reserved
+
+sap.ui.define([
+    "sap/base/Log",
+    "sap/base/i18n/Formatting",
+    "sap/ui/core/Locale",
+    "sap/ui/core/LocaleData",
+    "sap/ui/core/format/DateFormat",
+    "sap/ui/core/mvc/Controller",
+    "sap/ui/model/json/JSONModel",
+    "sap/ui/performance/Measurement",
+    "sap/ushell/Container",
+    "sap/ui/core/format/NumberFormat",
+    "sap/base/i18n/Localization",
+    "sap/ushell/resources"
+], function (
+    Log,
+    Formatting,
+    Locale,
+    LocaleData,
+    DateFormat,
+    Controller,
+    JSONModel,
+    Measurement,
+    Container,
+    NumberFormat,
+    Localization,
+    oResources
+) {
+    "use strict";
+
+    return Controller.extend("sap.ushell.adapters.cdm.Settings.UserLanguageAndRegion.UserLanguageAndRegion", {
+        onInit: function () {
+            this.oUser = Container.getUser();
+
+            var oLocale = new Locale(Formatting.getLanguageTag());
+
+            var bIsLanguagePersonalized = this.oUser.isLanguagePersonalized();
+
+            var { sTimeFormat, sExampleDate, sDecimalFormat, sWorkWeek, sTimeZone } = this._getParsedLocaleProperties(oLocale);
+
+            var oModel = new JSONModel({
+                languageList: null,
+                selectedLanguage: this.oUser.getLanguage(),
+                selectedDateFormat: sExampleDate,
+                selectedTimeFormat: sTimeFormat,
+                selectedDecimalFormat: sDecimalFormat,
+                selectedTimeZone: sTimeZone,
+                isLanguagePersonalized: bIsLanguagePersonalized,
+                selectedWorkWeek: sWorkWeek
+            });
+
+            this.getView().setBusy(true);
+
+            this._loadLanguagesList().then(function (aLanguageList) {
+                if (aLanguageList?.length > 1) {
+                    oModel.setProperty("/languageList", aLanguageList);
+
+                    if (!bIsLanguagePersonalized) {
+                        var bHasDefault = aLanguageList.some(function (oLanguage) {
+                            return oLanguage.key === "default";
+                        });
+
+                        if (bHasDefault) {
+                            oModel.setProperty("/selectedLanguage", "default");
+                        }
+                    }
+                }
+
+                this.getView().setBusy(false);
+            }.bind(this));
+
+            this.oView.setModel(oModel);
+        },
+
+        /**
+         * Load language via userInfoService API
+         * @returns {Promise<object[]>} the language list from the platforms
+         * @private
+         */
+        _loadLanguagesList: function () {
+            Measurement.start("FLP:UserLanguageAndRegion._getLanguagesList", "_getLanguagesList", "FLP");
+            return Container.getServiceAsync("UserInfo")
+                .then(function (UserInfo) {
+                    return new Promise(function (resolve) {
+                        Measurement.start("FLP:UserLanguageAndRegion._getLanguagesList", "_getLanguagesList", "FLP");
+                        UserInfo.getLanguageList()
+                            .done(function (oData) {
+                                Measurement.end("FLP:UserLanguageAndRegion._getLanguagesList");
+                                resolve(oData);
+                            })
+                            .fail(function (error) {
+                                Measurement.end("FLP:UserLanguageAndRegion._getLanguagesList");
+                                Log.error("Failed to load language list.", error,
+                                    "sap.ushell.components.ushell.settings.UserLanguageAndRegion.UserLanguageAndRegion.controller");
+                                resolve(null);
+                            });
+                    });
+                });
+        },
+
+        /**
+         * Sets language to the previously picked
+         * @private
+         */
+        _resetLanguage: function () {
+            var oUserLanguage = this.oUser.getLanguage(),
+                oModel = this.getView().getModel(),
+                oModelData = oModel.getData();
+            // if the user language isn't personalzied - need to return browser language in select
+            var sSelectedLanguage = oModelData.isLanguagePersonalized ? oUserLanguage : "default";
+            oModel.setProperty("/selectedLanguage", sSelectedLanguage);
+            // Date and time format are taken from current language
+            this._updateTextFields(sSelectedLanguage);
+        },
+
+        onCancel: function () {
+            var oModel = this.getView().getModel(),
+                oModelData = oModel.getData(),
+                aLanguageList = oModelData.languageList;
+
+            if (aLanguageList && aLanguageList.length > 0) {
+                this._resetLanguage();
+            }
+        },
+
+        onSaveSuccess: function (oUser) {
+            var oResolvedResult = {
+                refresh: true
+            };
+
+            Log.debug("[000] onSaveSuccess: oUser.resetChangedPropertyLanguage:", "UserLanguageAndRegion.controller");
+            oUser.resetChangedProperty("language");
+            oResolvedResult.obsoleteUrlParams = ["sap-language"];
+            oResolvedResult.clearSapUserContextCookie = true; // Language related content in `sap-usercontext` cookie is invalid now.
+
+            return oResolvedResult; //refresh the page to apply changes.
+        },
+
+        /**
+         * Event fired on the Save of the Language and Region Settings
+         * @param {function} fnUpdateUserPreferences A function to update user preferences.
+         * @returns {Promise<object>} oResolvedResult Promise that resolves with the save result containing urlParams and a refresh parameter
+         *    and rejects with a message object.
+         * @private
+         */
+        onSave: function (fnUpdateUserPreferences) {
+            var oUser = this.oUser,
+                oModelData = this.getView().getModel().getData(),
+                sSelectedLanguage = oModelData.selectedLanguage,
+                sOriginLanguage = oUser.getLanguage(),
+                bLanguageChanged = sSelectedLanguage && sSelectedLanguage !== (oModelData.isLanguagePersonalized ? sOriginLanguage : "default"),
+                bUpdateLanguage = oModelData.languageList && oModelData.languageList.length > 0 && bLanguageChanged;
+
+            Log.debug("[000] UserLanguageAndRegion:onSave:bUpdateLanguage:", bUpdateLanguage, "UserLanguageAndRegion.controller");
+            if (bUpdateLanguage) {
+                Log.debug("[000] UserLanguageAndRegion:onSave:UserInfo: oUser.setLanguage:", sSelectedLanguage, "UserLanguageAndRegion.controller");
+                oUser.setLanguage(sSelectedLanguage);
+
+                return fnUpdateUserPreferences()
+                    .then(function () {
+                        Log.debug("[000] onSave:fnUpdateUserPreferences", "UserLanguageAndRegion.controller");
+                        return this.onSaveSuccess(oUser);
+                    }.bind(this))
+                    // in case of failure - return to the original language
+                    .catch(function (errorMessage) {
+                        Log.debug("[000] onSave:catch:errorMessage", errorMessage, "UserLanguageAndRegion.controller");
+
+                        oUser.setLanguage(sOriginLanguage);
+                        oUser.resetChangedProperty("language");
+                        this._updateTextFields(sOriginLanguage);
+
+                        Log.error("Failed to save Language and Region Settings", errorMessage,
+                            "sap.ushell.adapters.cdm.Settings.cdmUserLanguageRegion.UserLanguageAndRegion.controller");
+                        throw errorMessage;
+                    }.bind(this));
+            }
+
+            this._resetLanguage();
+            return Promise.resolve();
+        },
+
+        /**
+         * This method call handle the change in the selection language
+         * @param {string} oEvent control event
+         * @private
+         */
+        _handleLanguageSelectChange: function (oEvent) {
+            var sSelectedLanguage = oEvent.getSource().getSelectedKey();
+            if (sSelectedLanguage) {
+                this._updateTextFields(sSelectedLanguage);
+            }
+        },
+
+        /**
+         * Update Date and Time text fields
+         * @param {string} language the newly selected language
+         * @private
+         */
+        _updateTextFields: function (language) {
+            Formatting.setLanguageTag(language);
+            var oLocale = new Locale(language);
+
+            var { sTimeFormat, sExampleDate, sDecimalFormat, sWorkWeek, sTimeZone } = this._getParsedLocaleProperties(oLocale);
+            var oModel = this.getView().getModel();
+
+            oModel.setProperty("/selectedTimeFormat", sTimeFormat);
+            oModel.setProperty("/selectedDateFormat", sExampleDate);
+            oModel.setProperty("/selectedDecimalFormat", sDecimalFormat);
+            oModel.setProperty("/selectedWorkWeek", sWorkWeek);
+            oModel.setProperty("/selectedTimeZone", sTimeZone);
+        },
+
+        /**
+         *
+         * @param {sap.ui.core.Locale} oLocale the locale object
+         * @returns {object} the parsed locale properties
+         * @private
+         */
+        _getParsedLocaleProperties: function (oLocale) {
+            var oLocaleData = LocaleData.getInstance(oLocale);
+            var sDatePattern = oLocaleData.getDatePattern("medium");
+            var sTimePattern = oLocaleData.getTimePattern("medium");
+
+            var oDateFormat = DateFormat.getDateInstance({
+                pattern: sDatePattern
+            });
+
+            var sDecimalPattern = oLocaleData.getDecimalPattern();
+
+            var oNumberFormat = NumberFormat.getInstance({
+                pattern: sDecimalPattern
+            });
+
+            const iStartingWeekend = oLocaleData.getWeekendStart();
+            const iEndingWeekend = oLocaleData.getWeekendEnd();
+
+            const aWorkWeekDays = oLocaleData.getDaysStandAlone("wide").filter((_, index) => {
+                return index !== iStartingWeekend && index !== iEndingWeekend;
+            });
+
+            return {
+                sTimeFormat: (sTimePattern.indexOf("H") === -1) ? oResources.i18n.getText("fld12h") : oResources.i18n.getText("fld24h"),
+                sExampleDate: oDateFormat.format(new Date()),
+                sDecimalFormat: oNumberFormat.format(1000.2),
+                sWorkWeek: aWorkWeekDays[0] + " - " + aWorkWeekDays[aWorkWeekDays.length - 1],
+                sTimeZone: Localization.getTimezone()
+            };
+        }
+    });
+});

package/src/main/js/sap/ushell/adapters/cdm/Settings/UserLanguageAndRegion/UserLanguageAndRegion.view.xml

@@ -0,0 +1,69 @@
+<mvc:View controllerName="sap.ushell.adapters.cdm.Settings.UserLanguageAndRegion.UserLanguageAndRegion"
+    xmlns="sap.m"
+    xmlns:form="sap.ui.layout.form"
+    xmlns:mvc="sap.ui.core.mvc"
+    xmlns:core="sap.ui.core"
+    xmlns:model="sap.ui.model"
+    height="32rem"
+>
+    <FlexBox
+        class="sapUiSmallMargin sapUiFlexJustifyContentCenter"
+        justifyContent="SpaceBetween"
+        direction="Column"
+        fitContainer="true"
+    >
+        <form:SimpleForm
+            id="languageForm"
+            editable="true"
+            layout="ResponsiveGridLayout"
+            ariaLabelledBy="LanguageSettingsLabel"
+			labelSpanXL="3"
+			labelSpanL="3"
+			labelSpanM="3"
+			labelSpanS="12"
+			emptySpanXL="4"
+			emptySpanL="4"
+			emptySpanM="4"
+			columnsXL="1"
+			columnsL="1"
+			columnsM="1"
+            width="100%"
+        >
+        <form:content>
+            <Label text="{i18n>timeZoneFld}"/>
+            <HBox alignItems="Center">
+                <Text text="{/selectedTimeZone}" class="sapUiTinyMarginEnd"/>
+                <core:Icon src="sap-icon://information" tooltip="{i18n>timeZoneTooltip}"/>
+            </HBox>
+
+            <Label text="{i18n>languageSlashRegion}" labelFor="languageSelectionSelect"/>
+            <ComboBox id="languageSelectionSelect"
+                items="{/languageList}"
+                selectedKey="{/selectedLanguage}"
+                valueState="{= ${/selectedLanguage} ? 'None' : 'Error'}"
+                change="._handleLanguageSelectChange">
+                <core:Item key="{key}" text="{text}" />
+            </ComboBox>
+
+            <Label text="{i18n>date}"/>
+            <Text text="{/selectedDateFormat}" />
+
+            <Label text="{i18n>time}"/>
+            <Text text="{/selectedTimeFormat}" />
+
+            <Label text="{i18n>decimalFormat}"/>
+            <Text text="{/selectedDecimalFormat}" />
+
+            <Label text="{i18n>workWeek}"/>
+            <Text text="{/selectedWorkWeek}" />
+        </form:content>
+        </form:SimpleForm>
+        <core:InvisibleText id="LanguageSettingsLabel" text="{i18n>languageAndRegionForm}" />
+        <MessageStrip
+            text="{i18n>languageAndRegionsInfoPopup}"
+            type="Information"
+            showIcon="true"
+            showCloseButton="true"
+            class="sapUiMediumMarginBottom" />
+    </FlexBox>
+</mvc:View>