From 3780200a1b705cdd608549f551cc830f30a062d8 Mon Sep 17 00:00:00 2001
From: Ovgodd <c.gromoff@gmail.com>
Date: Tue, 23 Jul 2024 15:42:40 +0200
Subject: [PATCH 1/5] add timezone parameter

Changelog: fixed
---
 .../rhs_settings_display/index.ts             |  5 +-
 .../rhs_settings_display.tsx                  | 56 +++++++++++-
 .../manage_timezones/manage_timezones.tsx     | 90 ++++++++++++-------
 .../mattermost-redux/src/actions/users.ts     |  8 +-
 webapp/channels/src/utils/constants.tsx       |  2 +
 5 files changed, 126 insertions(+), 35 deletions(-)

diff --git a/webapp/channels/src/components/rhs_settings/rhs_settings_display/index.ts b/webapp/channels/src/components/rhs_settings/rhs_settings_display/index.ts
index 334042ec13..55f7715e7e 100644
--- a/webapp/channels/src/components/rhs_settings/rhs_settings_display/index.ts
+++ b/webapp/channels/src/components/rhs_settings/rhs_settings_display/index.ts
@@ -13,7 +13,7 @@ import {autoUpdateTimezone} from 'mattermost-redux/actions/timezone';
 import {updateMe} from 'mattermost-redux/actions/users';
 import {getConfig, getLicense} from 'mattermost-redux/selectors/entities/general';
 import {get, isCollapsedThreadsAllowed, getCollapsedThreadsPreference} from 'mattermost-redux/selectors/entities/preferences';
-import {getCurrentTimezone, getCurrentTimezoneLabel} from 'mattermost-redux/selectors/entities/timezone';
+import {getCurrentTimezone, getCurrentTimezoneFull, getCurrentTimezoneLabel} from 'mattermost-redux/selectors/entities/timezone';
 import {getCurrentUserId, getUser} from 'mattermost-redux/selectors/entities/users';
 import {getUserCurrentTimezone} from 'mattermost-redux/utils/timezone_utils';
 
@@ -28,6 +28,7 @@ export function makeMapStateToProps() {
         const config = getConfig(state);
         const currentUserId = getCurrentUserId(state);
         const userTimezone = getCurrentTimezone(state);
+        const timezone = getCurrentTimezoneFull(state);
         const timezoneLabel = getCurrentTimezoneLabel(state);
         const allowCustomThemes = config.AllowCustomThemes === 'true';
         const enableLinkPreviews = config.EnableLinkPreviews === 'true';
@@ -50,7 +51,9 @@ export function makeMapStateToProps() {
             timezones,
             timezoneLabel,
             userTimezone,
+            timezone,
             currentUserTimezone: getCurrentTimezone(state),
+            timezoneDisplay: get(state, Preferences.CATEGORY_DISPLAY_SETTINGS, Preferences.TIMEZONE_DISPLAY, Preferences.TIMEZONE_DISPLAY_DEFAULT),
             availabilityStatusOnPosts: get(state, Preferences.CATEGORY_DISPLAY_SETTINGS, Preferences.AVAILABILITY_STATUS_ON_POSTS, Preferences.AVAILABILITY_STATUS_ON_POSTS_DEFAULT),
             teammateNameDisplay: get(state, Preferences.CATEGORY_DISPLAY_SETTINGS, Preferences.NAME_NAME_FORMAT, configTeammateNameDisplay),
             channelDisplayMode: get(state, Preferences.CATEGORY_DISPLAY_SETTINGS, Preferences.CHANNEL_DISPLAY_MODE, Preferences.CHANNEL_DISPLAY_MODE_DEFAULT),
diff --git a/webapp/channels/src/components/rhs_settings/rhs_settings_display/rhs_settings_display.tsx b/webapp/channels/src/components/rhs_settings/rhs_settings_display/rhs_settings_display.tsx
index 11d9ffffc8..ad09bde450 100644
--- a/webapp/channels/src/components/rhs_settings/rhs_settings_display/rhs_settings_display.tsx
+++ b/webapp/channels/src/components/rhs_settings/rhs_settings_display/rhs_settings_display.tsx
@@ -2,9 +2,12 @@
 // See LICENSE.txt for license information.
 
 import type {PrimitiveType, FormatXMLElementFn} from 'intl-messageformat';
+import isEqual from 'lodash/isEqual';
+import type {ComponentProps} from 'react';
 import React from 'react';
 import {FormattedMessage} from 'react-intl';
 import ReactSelect from 'react-select';
+import type {Timezone} from 'timezones.json';
 
 import type {PreferenceType} from '@mattermost/types/preferences';
 import type {UserProfile, UserTimezone} from '@mattermost/types/users';
@@ -17,6 +20,7 @@ import RhsLimitVisibleGMsDMs from 'components/rhs_settings/rhs_settings_display/
 import RhsSettingsItem from 'components/rhs_settings/rhs_settings_item/rhs_settings_item';
 import RhsThemeSetting from 'components/rhs_settings/rhs_settings_theme';
 import Toggle from 'components/toggle';
+import ManageTimezones from 'components/user_settings/display/manage_timezones';
 
 import Constants from 'utils/constants';
 import {t} from 'utils/i18n';
@@ -110,6 +114,8 @@ type Props = {
     setRequireConfirm?: () => void;
     setEnforceFocus?: () => void;
     userTimezone: UserTimezone;
+    timezones: Timezone[];
+    timezone: UserTimezone;
     allowCustomThemes: boolean;
     enableLinkPreviews: boolean;
     defaultClientLocale: string;
@@ -134,6 +140,7 @@ type Props = {
     militaryTime: string;
     lastActiveDisplay: string;
     lastActiveTimeEnabled: boolean;
+    timezoneDisplay: string;
     actions: {
         savePreferences: (userId: string, preferences: PreferenceType[]) => void;
         autoUpdateTimezone: (deviceTimezone: string) => void;
@@ -142,7 +149,6 @@ type Props = {
 }
 
 type State = {
-    [key: string]: any;
     isSaving: boolean;
     teammateNameDisplay: string;
     availabilityStatusOnPosts: string;
@@ -158,6 +164,8 @@ type State = {
     serverError?: string;
     militaryTime: string;
     lastActiveDisplay: string;
+    timezoneDisplay: string;
+    timezone: UserTimezone;
 }
 
 export default class RhsSettingsDisplay extends React.PureComponent<Props, State> {
@@ -175,6 +183,8 @@ export default class RhsSettingsDisplay extends React.PureComponent<Props, State
             oneClickReactionsOnPosts: props.oneClickReactionsOnPosts ? props.oneClickReactionsOnPosts : 'true',
             showUnreadsCategory: props.showUnreadsCategory ? props.showUnreadsCategory : 'true',
             unreadScrollPosition: props.unreadScrollPosition ? props.unreadScrollPosition : Preferences.UNREAD_SCROLL_POSITION,
+            timezoneDisplay: props.timezoneDisplay ? props.timezoneDisplay : 'true',
+            timezone: props.timezone,
         };
     }
 
@@ -204,6 +214,8 @@ export default class RhsSettingsDisplay extends React.PureComponent<Props, State
             showUnreadsCategory: props.showUnreadsCategory ? props.showUnreadsCategory : 'true',
             unreadScrollPosition: props.unreadScrollPosition ? props.unreadScrollPosition : Preferences.UNREAD_SCROLL_POSITION,
             isSaving: false,
+            timezoneDisplay: props.timezoneDisplay ? props.timezoneDisplay : 'true',
+            timezone: props.timezone,
         };
 
         this.prevSections = {
@@ -236,9 +248,11 @@ export default class RhsSettingsDisplay extends React.PureComponent<Props, State
         const userId = user.id;
 
         // User preferences patch user and don't need to update preferences
-        if (newSettingsState.lastActiveDisplay !== this.props.lastActiveDisplay) {
+        if (newSettingsState.lastActiveDisplay !== this.props.lastActiveDisplay ||
+            !isEqual(newSettingsState.timezone, this.props.timezone)) {
             const updatedUser = {
                 ...user,
+                timezone: newSettingsState.timezone,
                 props: {
                     ...user.props,
                     show_last_active: newSettingsState.lastActiveDisplay,
@@ -337,6 +351,12 @@ export default class RhsSettingsDisplay extends React.PureComponent<Props, State
             value: newSettingsState.militaryTime,
         };
 
+        const timezonePreference = {
+            user_id: userId,
+            category: Preferences.CATEGORY_DISPLAY_SETTINGS,
+            name: Preferences.TIMEZONE_DISPLAY,
+            value: newSettingsState.timezoneDisplay,
+        };
         this.setState({isSaving: true});
 
         const preferences = [
@@ -351,6 +371,7 @@ export default class RhsSettingsDisplay extends React.PureComponent<Props, State
             availabilityStatusOnPostsPreference,
             colorizeUsernamesPreference,
             timePreference,
+            timezonePreference,
         ];
 
         await this.props.actions.savePreferences(userId, preferences);
@@ -360,9 +381,16 @@ export default class RhsSettingsDisplay extends React.PureComponent<Props, State
         this.setState({isSaving: false});
     };
 
-    handleOnChange(display: {[key: string]: any}) {
+    handleOnChange(display: Partial<State>) {
         this.handleSubmit({...this.state, ...display});
     }
+    handleOnTimezoneChange: ComponentProps<typeof ManageTimezones>['onChange'] = (timezone) => {
+        this.handleOnChange({timezone: {
+            useAutomaticTimezone: timezone.useAutomaticTimezone.toString(),
+            manualTimezone: timezone.useAutomaticTimezone ? timezone.automaticTimezone : timezone.manualTimezone,
+            automaticTimezone: timezone.useAutomaticTimezone ? timezone.automaticTimezone : timezone.manualTimezone,
+        }});
+    };
 
     updateSection = (section: string) => {
         this.props.updateSection(section);
@@ -873,12 +901,34 @@ export default class RhsSettingsDisplay extends React.PureComponent<Props, State
             });
         }
 
+        let timezoneSelection;
+        if (this.props.enableTimezone && !this.props.shouldAutoUpdateTimezone) {
+            timezoneSelection = (
+                <>
+                    <label htmlFor='user.settings.display.timezone'>
+                        <FormattedMessage
+                            id='user.settings.display.timezone'
+                            defaultMessage='Timezone'
+                        />
+                    </label>
+                    <ManageTimezones
+                        user={this.props.user}
+                        updateSection={this.updateSection}
+                        onChange={this.handleOnTimezoneChange}
+                        compact={true}
+                        {...this.props.timezone}
+                    />
+                </>
+            );
+        }
+
         return (
             <div id='displaySettings'>
                 <div className='user-settings user-rhs-container container'>
                     <div className='divider-dark first'/>
                     {themeSection}
                     {messageDisplaySection}
+                    {timezoneSelection}
                     {collapseSection}
                     {linkPreviewSection}
                     {oneClickReactionsOnPostsSection}
diff --git a/webapp/channels/src/components/user_settings/display/manage_timezones/manage_timezones.tsx b/webapp/channels/src/components/user_settings/display/manage_timezones/manage_timezones.tsx
index 29703ca00b..7d84aff867 100644
--- a/webapp/channels/src/components/user_settings/display/manage_timezones/manage_timezones.tsx
+++ b/webapp/channels/src/components/user_settings/display/manage_timezones/manage_timezones.tsx
@@ -20,15 +20,30 @@ type Actions = {
     updateMe: (user: UserProfile) => Promise<ActionResult>;
 }
 
+type OnChangeActions = {
+    selectedOption: {
+        label: string;
+        value: string;
+    };
+} & ({
+    useAutomaticTimezone: true;
+    automaticTimezone: string;
+} | {
+    useAutomaticTimezone: false;
+    manualTimezone: string;
+});
+
 type Props = {
     user: UserProfile;
-    updateSection: (section: string) => void;
-    useAutomaticTimezone: boolean;
+    updateSection?: (section: string) => void;
+    useAutomaticTimezone: boolean | string;
     automaticTimezone: string;
     manualTimezone: string;
     timezones: Timezone[];
     timezoneLabel: string;
     actions: Actions;
+    compact?: boolean;
+    onChange?: (values: OnChangeActions) => void;
 }
 type SelectedOption = {
     value: string;
@@ -48,22 +63,32 @@ type State = {
 export default class ManageTimezones extends React.PureComponent<Props, State> {
     constructor(props: Props) {
         super(props);
+        const useAutomaticTimezone = (
+            props.useAutomaticTimezone === 'true' ||
+            props.useAutomaticTimezone === true
+        );
         this.state = {
-            useAutomaticTimezone: props.useAutomaticTimezone,
+            useAutomaticTimezone,
             automaticTimezone: props.automaticTimezone,
             manualTimezone: props.manualTimezone,
             isSaving: false,
             openMenu: false,
-            selectedOption: {label: props.timezoneLabel, value: props.useAutomaticTimezone ? props.automaticTimezone : props.manualTimezone},
+            selectedOption: {
+                label: props.timezoneLabel,
+                value: useAutomaticTimezone ? props.automaticTimezone : props.manualTimezone,
+            },
         };
     }
 
     onChange = (selectedOption: ValueType<SelectedOption>) => {
         if (selectedOption && 'value' in selectedOption) {
-            this.setState({
+            const nextState: OnChangeActions = {
                 manualTimezone: selectedOption.value,
                 selectedOption,
-            });
+                useAutomaticTimezone: false,
+            };
+            this.setState(nextState);
+            this.props.onChange?.(nextState);
         }
     };
 
@@ -89,7 +114,7 @@ export default class ManageTimezones extends React.PureComponent<Props, State> {
 
     changeTimezone = () => {
         if (this.timezoneNotChanged()) {
-            this.props.updateSection('');
+            this.props.updateSection?.('');
             return;
         }
 
@@ -114,7 +139,7 @@ export default class ManageTimezones extends React.PureComponent<Props, State> {
         actions.updateMe(updatedUser).
             then((res) => {
                 if ('data' in res) {
-                    this.props.updateSection('');
+                    this.props.updateSection?.('');
                 } else if ('error' in res) {
                     const {error} = res;
                     let serverError;
@@ -129,35 +154,38 @@ export default class ManageTimezones extends React.PureComponent<Props, State> {
     };
 
     handleAutomaticTimezone = (e: React.ChangeEvent<HTMLInputElement>) => {
-        const useAutomaticTimezone = e.target.checked;
-        let automaticTimezone = '';
-        let timezoneLabel: string;
-        let selectedOptionValue: string;
-
-        if (useAutomaticTimezone) {
-            automaticTimezone = getBrowserTimezone();
-            timezoneLabel = getTimezoneLabel(this.props.timezones, automaticTimezone);
-            selectedOptionValue = automaticTimezone;
+        if (e.target.checked) {
+            const automaticTimezone = getBrowserTimezone();
+            const nextState: OnChangeActions = {
+                useAutomaticTimezone: true,
+                automaticTimezone,
+                selectedOption: {
+                    label: getTimezoneLabel(this.props.timezones, automaticTimezone),
+                    value: automaticTimezone,
+                },
+            };
+            this.setState(nextState);
+            this.props.onChange?.(nextState);
         } else {
-            timezoneLabel = getTimezoneLabel(this.props.timezones, getBrowserTimezone());
-            selectedOptionValue = getBrowserTimezone();
-            this.setState({
-                manualTimezone: getBrowserTimezone(),
-            });
+            const manualTimezone = getBrowserTimezone();
+            const nextState: OnChangeActions = {
+                useAutomaticTimezone: false,
+                manualTimezone,
+                selectedOption: {
+                    label: getTimezoneLabel(this.props.timezones, manualTimezone),
+                    value: manualTimezone,
+                },
+            };
+            this.setState(nextState);
+            this.props.onChange?.(nextState);
         }
-
-        this.setState({
-            useAutomaticTimezone,
-            automaticTimezone,
-            selectedOption: {label: timezoneLabel, value: selectedOptionValue},
-        });
     };
 
     handleManualTimezone = (e: React.ChangeEvent<HTMLSelectElement>) => {
         this.setState({manualTimezone: e.target.value});
     };
     render() {
-        const {timezones} = this.props;
+        const {timezones, compact} = this.props;
         const {useAutomaticTimezone} = this.state;
 
         const timeOptions = this.props.timezones.map((timeObject) => {
@@ -235,7 +263,9 @@ export default class ManageTimezones extends React.PureComponent<Props, State> {
                 />
             </div>,
         );
-
+        if (compact) {
+            return inputs;
+        }
         return (
             <SettingItemMax
                 title={
diff --git a/webapp/channels/src/packages/mattermost-redux/src/actions/users.ts b/webapp/channels/src/packages/mattermost-redux/src/actions/users.ts
index b182ca021b..15b83f65b0 100644
--- a/webapp/channels/src/packages/mattermost-redux/src/actions/users.ts
+++ b/webapp/channels/src/packages/mattermost-redux/src/actions/users.ts
@@ -978,7 +978,13 @@ export function patchUser(user: UserProfile): ActionFuncAsync<UserProfile> {
     return async (dispatch) => {
         let data: UserProfile;
         try {
-            data = await Client4.patchUser(user);
+            data = await Client4.patchUser({
+                ...user,
+                timezone: user.timezone ? {
+                    ...user.timezone,
+                    useAutomaticTimezone: user.timezone.useAutomaticTimezone.toString(),
+                } : undefined,
+            });
         } catch (error) {
             dispatch(logError(error));
             return {error};
diff --git a/webapp/channels/src/utils/constants.tsx b/webapp/channels/src/utils/constants.tsx
index 16ccee7e77..d35eaee456 100644
--- a/webapp/channels/src/utils/constants.tsx
+++ b/webapp/channels/src/utils/constants.tsx
@@ -138,6 +138,8 @@ export const Preferences = {
     CLOUD_USER_EPHEMERAL_INFO: 'cloud_user_ephemeral_info',
     CATEGORY_CLOUD_LIMITS: 'cloud_limits',
     THREE_DAYS_LEFT_TRIAL_MODAL: 'three_days_left_trial_modal',
+    TIMEZONE_DISPLAY: 'timezone_display',
+    TIMEZONE_DISPLAY_DEFAULT: 'true',
 
     // For one off things that have a special, attention-grabbing UI until you interact with them
     TOUCHED: 'touched',

From 1f3bb18ab1eb9e5a667e3613b22f7a1f021d7104 Mon Sep 17 00:00:00 2001
From: Ovgodd <c.gromoff@gmail.com>
Date: Wed, 24 Jul 2024 10:28:37 +0200
Subject: [PATCH 2/5] change after mr review, keep mattermost code as most as
 possible

---
 .../rhs_settings_display/index.ts             |  1 -
 .../rhs_settings_display.tsx                  | 15 +---
 .../manage_timezones/manage_timezones.tsx     | 73 ++++++++++---------
 .../mattermost-redux/src/actions/users.ts     |  8 +-
 webapp/channels/src/utils/constants.tsx       |  2 -
 5 files changed, 43 insertions(+), 56 deletions(-)

diff --git a/webapp/channels/src/components/rhs_settings/rhs_settings_display/index.ts b/webapp/channels/src/components/rhs_settings/rhs_settings_display/index.ts
index 55f7715e7e..8de123ade4 100644
--- a/webapp/channels/src/components/rhs_settings/rhs_settings_display/index.ts
+++ b/webapp/channels/src/components/rhs_settings/rhs_settings_display/index.ts
@@ -53,7 +53,6 @@ export function makeMapStateToProps() {
             userTimezone,
             timezone,
             currentUserTimezone: getCurrentTimezone(state),
-            timezoneDisplay: get(state, Preferences.CATEGORY_DISPLAY_SETTINGS, Preferences.TIMEZONE_DISPLAY, Preferences.TIMEZONE_DISPLAY_DEFAULT),
             availabilityStatusOnPosts: get(state, Preferences.CATEGORY_DISPLAY_SETTINGS, Preferences.AVAILABILITY_STATUS_ON_POSTS, Preferences.AVAILABILITY_STATUS_ON_POSTS_DEFAULT),
             teammateNameDisplay: get(state, Preferences.CATEGORY_DISPLAY_SETTINGS, Preferences.NAME_NAME_FORMAT, configTeammateNameDisplay),
             channelDisplayMode: get(state, Preferences.CATEGORY_DISPLAY_SETTINGS, Preferences.CHANNEL_DISPLAY_MODE, Preferences.CHANNEL_DISPLAY_MODE_DEFAULT),
diff --git a/webapp/channels/src/components/rhs_settings/rhs_settings_display/rhs_settings_display.tsx b/webapp/channels/src/components/rhs_settings/rhs_settings_display/rhs_settings_display.tsx
index ad09bde450..ae18df4721 100644
--- a/webapp/channels/src/components/rhs_settings/rhs_settings_display/rhs_settings_display.tsx
+++ b/webapp/channels/src/components/rhs_settings/rhs_settings_display/rhs_settings_display.tsx
@@ -140,7 +140,6 @@ type Props = {
     militaryTime: string;
     lastActiveDisplay: string;
     lastActiveTimeEnabled: boolean;
-    timezoneDisplay: string;
     actions: {
         savePreferences: (userId: string, preferences: PreferenceType[]) => void;
         autoUpdateTimezone: (deviceTimezone: string) => void;
@@ -149,6 +148,7 @@ type Props = {
 }
 
 type State = {
+    [key: string]: any;
     isSaving: boolean;
     teammateNameDisplay: string;
     availabilityStatusOnPosts: string;
@@ -164,7 +164,6 @@ type State = {
     serverError?: string;
     militaryTime: string;
     lastActiveDisplay: string;
-    timezoneDisplay: string;
     timezone: UserTimezone;
 }
 
@@ -183,7 +182,6 @@ export default class RhsSettingsDisplay extends React.PureComponent<Props, State
             oneClickReactionsOnPosts: props.oneClickReactionsOnPosts ? props.oneClickReactionsOnPosts : 'true',
             showUnreadsCategory: props.showUnreadsCategory ? props.showUnreadsCategory : 'true',
             unreadScrollPosition: props.unreadScrollPosition ? props.unreadScrollPosition : Preferences.UNREAD_SCROLL_POSITION,
-            timezoneDisplay: props.timezoneDisplay ? props.timezoneDisplay : 'true',
             timezone: props.timezone,
         };
     }
@@ -214,7 +212,6 @@ export default class RhsSettingsDisplay extends React.PureComponent<Props, State
             showUnreadsCategory: props.showUnreadsCategory ? props.showUnreadsCategory : 'true',
             unreadScrollPosition: props.unreadScrollPosition ? props.unreadScrollPosition : Preferences.UNREAD_SCROLL_POSITION,
             isSaving: false,
-            timezoneDisplay: props.timezoneDisplay ? props.timezoneDisplay : 'true',
             timezone: props.timezone,
         };
 
@@ -350,13 +347,6 @@ export default class RhsSettingsDisplay extends React.PureComponent<Props, State
             name: Preferences.USE_MILITARY_TIME,
             value: newSettingsState.militaryTime,
         };
-
-        const timezonePreference = {
-            user_id: userId,
-            category: Preferences.CATEGORY_DISPLAY_SETTINGS,
-            name: Preferences.TIMEZONE_DISPLAY,
-            value: newSettingsState.timezoneDisplay,
-        };
         this.setState({isSaving: true});
 
         const preferences = [
@@ -371,7 +361,6 @@ export default class RhsSettingsDisplay extends React.PureComponent<Props, State
             availabilityStatusOnPostsPreference,
             colorizeUsernamesPreference,
             timePreference,
-            timezonePreference,
         ];
 
         await this.props.actions.savePreferences(userId, preferences);
@@ -381,7 +370,7 @@ export default class RhsSettingsDisplay extends React.PureComponent<Props, State
         this.setState({isSaving: false});
     };
 
-    handleOnChange(display: Partial<State>) {
+    handleOnChange(display: {[key: string]: any}) {
         this.handleSubmit({...this.state, ...display});
     }
     handleOnTimezoneChange: ComponentProps<typeof ManageTimezones>['onChange'] = (timezone) => {
diff --git a/webapp/channels/src/components/user_settings/display/manage_timezones/manage_timezones.tsx b/webapp/channels/src/components/user_settings/display/manage_timezones/manage_timezones.tsx
index 7d84aff867..49e1f88194 100644
--- a/webapp/channels/src/components/user_settings/display/manage_timezones/manage_timezones.tsx
+++ b/webapp/channels/src/components/user_settings/display/manage_timezones/manage_timezones.tsx
@@ -26,16 +26,14 @@ type OnChangeActions = {
         value: string;
     };
 } & ({
-    useAutomaticTimezone: true;
+    useAutomaticTimezone: boolean;
     automaticTimezone: string;
-} | {
-    useAutomaticTimezone: false;
     manualTimezone: string;
 });
 
 type Props = {
     user: UserProfile;
-    updateSection?: (section: string) => void;
+    updateSection: (section: string) => void;
     useAutomaticTimezone: boolean | string;
     automaticTimezone: string;
     manualTimezone: string;
@@ -82,13 +80,18 @@ export default class ManageTimezones extends React.PureComponent<Props, State> {
 
     onChange = (selectedOption: ValueType<SelectedOption>) => {
         if (selectedOption && 'value' in selectedOption) {
-            const nextState: OnChangeActions = {
+            this.setState({
                 manualTimezone: selectedOption.value,
+                automaticTimezone: selectedOption.value,
                 selectedOption,
                 useAutomaticTimezone: false,
-            };
-            this.setState(nextState);
-            this.props.onChange?.(nextState);
+            });
+            this.props.onChange?.({
+                manualTimezone: selectedOption.value,
+                automaticTimezone: selectedOption.value,
+                selectedOption,
+                useAutomaticTimezone: false,
+            });
         }
     };
 
@@ -114,7 +117,7 @@ export default class ManageTimezones extends React.PureComponent<Props, State> {
 
     changeTimezone = () => {
         if (this.timezoneNotChanged()) {
-            this.props.updateSection?.('');
+            this.props.updateSection('');
             return;
         }
 
@@ -139,7 +142,7 @@ export default class ManageTimezones extends React.PureComponent<Props, State> {
         actions.updateMe(updatedUser).
             then((res) => {
                 if ('data' in res) {
-                    this.props.updateSection?.('');
+                    this.props.updateSection('');
                 } else if ('error' in res) {
                     const {error} = res;
                     let serverError;
@@ -154,31 +157,35 @@ export default class ManageTimezones extends React.PureComponent<Props, State> {
     };
 
     handleAutomaticTimezone = (e: React.ChangeEvent<HTMLInputElement>) => {
-        if (e.target.checked) {
-            const automaticTimezone = getBrowserTimezone();
-            const nextState: OnChangeActions = {
-                useAutomaticTimezone: true,
-                automaticTimezone,
-                selectedOption: {
-                    label: getTimezoneLabel(this.props.timezones, automaticTimezone),
-                    value: automaticTimezone,
-                },
-            };
-            this.setState(nextState);
-            this.props.onChange?.(nextState);
+        const useAutomaticTimezone = e.target.checked;
+        const manualTimezone = '';
+        let automaticTimezone = '';
+        let timezoneLabel: string;
+        let selectedOptionValue: string;
+
+        if (useAutomaticTimezone) {
+            automaticTimezone = getBrowserTimezone();
+            timezoneLabel = getTimezoneLabel(this.props.timezones, automaticTimezone);
+            selectedOptionValue = automaticTimezone;
         } else {
-            const manualTimezone = getBrowserTimezone();
-            const nextState: OnChangeActions = {
-                useAutomaticTimezone: false,
-                manualTimezone,
-                selectedOption: {
-                    label: getTimezoneLabel(this.props.timezones, manualTimezone),
-                    value: manualTimezone,
-                },
-            };
-            this.setState(nextState);
-            this.props.onChange?.(nextState);
+            timezoneLabel = getTimezoneLabel(this.props.timezones, getBrowserTimezone());
+            selectedOptionValue = getBrowserTimezone();
+            this.setState({
+                manualTimezone: getBrowserTimezone(),
+            });
         }
+
+        this.setState({
+            useAutomaticTimezone,
+            automaticTimezone,
+            selectedOption: {label: timezoneLabel, value: selectedOptionValue},
+        });
+        this.props.onChange?.({
+            useAutomaticTimezone,
+            manualTimezone,
+            automaticTimezone,
+            selectedOption: {label: timezoneLabel, value: selectedOptionValue},
+        });
     };
 
     handleManualTimezone = (e: React.ChangeEvent<HTMLSelectElement>) => {
diff --git a/webapp/channels/src/packages/mattermost-redux/src/actions/users.ts b/webapp/channels/src/packages/mattermost-redux/src/actions/users.ts
index 15b83f65b0..b182ca021b 100644
--- a/webapp/channels/src/packages/mattermost-redux/src/actions/users.ts
+++ b/webapp/channels/src/packages/mattermost-redux/src/actions/users.ts
@@ -978,13 +978,7 @@ export function patchUser(user: UserProfile): ActionFuncAsync<UserProfile> {
     return async (dispatch) => {
         let data: UserProfile;
         try {
-            data = await Client4.patchUser({
-                ...user,
-                timezone: user.timezone ? {
-                    ...user.timezone,
-                    useAutomaticTimezone: user.timezone.useAutomaticTimezone.toString(),
-                } : undefined,
-            });
+            data = await Client4.patchUser(user);
         } catch (error) {
             dispatch(logError(error));
             return {error};
diff --git a/webapp/channels/src/utils/constants.tsx b/webapp/channels/src/utils/constants.tsx
index d35eaee456..16ccee7e77 100644
--- a/webapp/channels/src/utils/constants.tsx
+++ b/webapp/channels/src/utils/constants.tsx
@@ -138,8 +138,6 @@ export const Preferences = {
     CLOUD_USER_EPHEMERAL_INFO: 'cloud_user_ephemeral_info',
     CATEGORY_CLOUD_LIMITS: 'cloud_limits',
     THREE_DAYS_LEFT_TRIAL_MODAL: 'three_days_left_trial_modal',
-    TIMEZONE_DISPLAY: 'timezone_display',
-    TIMEZONE_DISPLAY_DEFAULT: 'true',
 
     // For one off things that have a special, attention-grabbing UI until you interact with them
     TOUCHED: 'touched',

From abc86eb03d4d22418cbb303b49002670b274486e Mon Sep 17 00:00:00 2001
From: Cyril Gromoff <cyril.gromoff@infomaniak.com>
Date: Tue, 13 Aug 2024 15:19:36 +0200
Subject: [PATCH 3/5] replace manual timezone options by a link to the profile
 where we can change the manual timezone

---
 .../settings_button/settings_button.tsx       |  4 ++-
 .../manage_timezones/manage_timezones.tsx     | 25 ++++++++-----------
 webapp/channels/src/i18n/de.json              |  1 +
 webapp/channels/src/i18n/en.json              |  1 +
 webapp/channels/src/i18n/es.json              |  1 +
 webapp/channels/src/i18n/fr.json              |  1 +
 webapp/channels/src/i18n/it.json              |  1 +
 7 files changed, 19 insertions(+), 15 deletions(-)

diff --git a/webapp/channels/src/components/global_header/right_controls/settings_button/settings_button.tsx b/webapp/channels/src/components/global_header/right_controls/settings_button/settings_button.tsx
index 2f3ea8cc63..f43fec3713 100644
--- a/webapp/channels/src/components/global_header/right_controls/settings_button/settings_button.tsx
+++ b/webapp/channels/src/components/global_header/right_controls/settings_button/settings_button.tsx
@@ -39,7 +39,9 @@ const SettingsButton = ({tab = 'display', className, icon, tooltipPlacement, too
     const settingButtonClick = (e: React.MouseEvent<HTMLButtonElement>) => {
         e.preventDefault();
         if (!isDesktopApp()) {
-            document.dispatchEvent(new CustomEvent('openSettings', {detail: ['ksuite-kchat', 'ksuite-kchat-personalization', {selectedId: currentTeam.product_id}]}));
+            dispatch(showSettings(tab));
+
+            //document.dispatchEvent(new CustomEvent('openSettings', {detail: ['ksuite-kchat', 'ksuite-kchat-personalization', {selectedId: currentTeam.product_id}]}));
         } else if (rhsState === RHSStates.SETTINGS) {
             dispatch(closeRightHandSide());
         } else {
diff --git a/webapp/channels/src/components/user_settings/display/manage_timezones/manage_timezones.tsx b/webapp/channels/src/components/user_settings/display/manage_timezones/manage_timezones.tsx
index 49e1f88194..d08ac164a3 100644
--- a/webapp/channels/src/components/user_settings/display/manage_timezones/manage_timezones.tsx
+++ b/webapp/channels/src/components/user_settings/display/manage_timezones/manage_timezones.tsx
@@ -12,6 +12,7 @@ import type {UserProfile} from '@mattermost/types/users';
 import type {ActionResult} from 'mattermost-redux/types/actions';
 import {getTimezoneLabel} from 'mattermost-redux/utils/timezone_utils';
 
+import ExternalLink from 'components/external_link';
 import SettingItemMax from 'components/setting_item_max';
 
 import {getBrowserTimezone} from 'utils/timezone';
@@ -240,20 +241,16 @@ export default class ManageTimezones extends React.PureComponent<Props, State> {
             <div
                 className='pt-2'
             >
-                <ReactSelect
-                    className='react-select react-select-top'
-                    classNamePrefix='react-select'
-                    id='displayTimezone'
-                    menuPortalTarget={document.body}
-                    styles={reactStyles}
-                    options={timeOptions}
-                    clearable={false}
-                    onChange={this.onChange}
-                    value={this.state.selectedOption}
-                    aria-labelledby='changeInterfaceTimezoneLabel'
-                    isDisabled={useAutomaticTimezone}
-                />
-                {serverError}
+                {!useAutomaticTimezone &&
+                <ExternalLink
+                    href='https://manager.infomaniak.com/v3/ng/profile/user/dashboard'
+                    target='_blank'
+                >
+                    <FormattedMessage
+                        id='user.settings.timezones.modify'
+                        defaultMessage='Change your time zone'
+                    />
+                </ExternalLink>}
             </div>
         );
 
diff --git a/webapp/channels/src/i18n/de.json b/webapp/channels/src/i18n/de.json
index 1d9e31e915..7e5d8a9fe2 100644
--- a/webapp/channels/src/i18n/de.json
+++ b/webapp/channels/src/i18n/de.json
@@ -5972,6 +5972,7 @@
   "user.settings.sidebar.title": "Seitenleisteneinstellungen",
   "user.settings.timezones.automatic": "Automatisch",
   "user.settings.timezones.promote": "Wähle die Zeitzone, die für Zeitstempel in der Benutzeroberfläche und E-Mail-Benachrichtigungen verwendet wird.",
+  "user.settings.timezones.modify" : "Seine Zeitzone ändern",
   "user.settings.tokens.activate": "Aktivieren",
   "user.settings.tokens.cancel": "Abbrechen",
   "user.settings.tokens.clickToEdit": "Klicke 'Bearbeiten', um deine persönlichen Zugriffs-Token zu verwalten",
diff --git a/webapp/channels/src/i18n/en.json b/webapp/channels/src/i18n/en.json
index 26676f7fa8..0ad4875279 100644
--- a/webapp/channels/src/i18n/en.json
+++ b/webapp/channels/src/i18n/en.json
@@ -5990,6 +5990,7 @@
   "user.settings.sidebar.title": "Sidebar Settings",
   "user.settings.timezones.automatic": "Automatic",
   "user.settings.timezones.promote": "Select the timezone used for timestamps in the user interface and email notifications.",
+  "user.settings.timezones.modify" : "Changing your time zone",
   "user.settings.tokens.activate": "Enable",
   "user.settings.tokens.cancel": "Cancel",
   "user.settings.tokens.clickToEdit": "Click 'Edit' to manage your personal access tokens",
diff --git a/webapp/channels/src/i18n/es.json b/webapp/channels/src/i18n/es.json
index 3328904fc3..199cb1c6ab 100644
--- a/webapp/channels/src/i18n/es.json
+++ b/webapp/channels/src/i18n/es.json
@@ -4916,6 +4916,7 @@
   "user.settings.sidebar.title": "Preferencias de la Barra Lateral",
   "user.settings.timezones.automatic": "Automático",
   "user.settings.timezones.promote": "Selecciona la zona horaria para ser utilizada en la interfaz de usuario y notificaciones de correo electrónico.",
+  "user.settings.timezones.modify" : "Cambiar de huso horario",
   "user.settings.tokens.activate": "Activado",
   "user.settings.tokens.botId": "Bot ID: ",
   "user.settings.tokens.cancel": "Cancelar",
diff --git a/webapp/channels/src/i18n/fr.json b/webapp/channels/src/i18n/fr.json
index d883b7dd38..f34494f443 100644
--- a/webapp/channels/src/i18n/fr.json
+++ b/webapp/channels/src/i18n/fr.json
@@ -4857,6 +4857,7 @@
   "user.settings.sidebar.title": "Paramètres de la barre latérale",
   "user.settings.timezones.automatic": "Automatique",
   "user.settings.timezones.promote": "Sélectionnez le fuseau horaire de l'horodatage utilisé dans l'interface utilisateur et dans les notifications par e-mail.",
+  "user.settings.timezones.modify" : "Modifier son fuseau horaire",
   "user.settings.tokens.activate": "Activer",
   "user.settings.tokens.cancel": "Annuler",
   "user.settings.tokens.clickToEdit": "Cliquez sur 'Modifier' pour gérer vos jetons d'accès",
diff --git a/webapp/channels/src/i18n/it.json b/webapp/channels/src/i18n/it.json
index 51cace56ed..e8c9338be2 100644
--- a/webapp/channels/src/i18n/it.json
+++ b/webapp/channels/src/i18n/it.json
@@ -3740,6 +3740,7 @@
   "user.settings.sidebar.title": "Impostazioni barra laterale",
   "user.settings.timezones.automatic": "Imposta automaticamente",
   "user.settings.timezones.promote": "Seleziona il fuso orario utilizzato per le ore nell'interfaccia utente e nelle notifiche email.",
+  "user.settings.timezones.modify" : "Cambiare il fuso orario",
   "user.settings.tokens.activate": "Attiva",
   "user.settings.tokens.botId": "Bot ID: ",
   "user.settings.tokens.cancel": "Annulla",

From fd1a1444f5ee5814dbbad2784f3690599525f3a0 Mon Sep 17 00:00:00 2001
From: "anton.buksa" <anton.buksa@infomaniak.com>
Date: Mon, 16 Sep 2024 13:12:32 +0200
Subject: [PATCH 4/5] undo hardcoded desktop settings open

---
 .../right_controls/settings_button/settings_button.tsx        | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/webapp/channels/src/components/global_header/right_controls/settings_button/settings_button.tsx b/webapp/channels/src/components/global_header/right_controls/settings_button/settings_button.tsx
index f43fec3713..2f3ea8cc63 100644
--- a/webapp/channels/src/components/global_header/right_controls/settings_button/settings_button.tsx
+++ b/webapp/channels/src/components/global_header/right_controls/settings_button/settings_button.tsx
@@ -39,9 +39,7 @@ const SettingsButton = ({tab = 'display', className, icon, tooltipPlacement, too
     const settingButtonClick = (e: React.MouseEvent<HTMLButtonElement>) => {
         e.preventDefault();
         if (!isDesktopApp()) {
-            dispatch(showSettings(tab));
-
-            //document.dispatchEvent(new CustomEvent('openSettings', {detail: ['ksuite-kchat', 'ksuite-kchat-personalization', {selectedId: currentTeam.product_id}]}));
+            document.dispatchEvent(new CustomEvent('openSettings', {detail: ['ksuite-kchat', 'ksuite-kchat-personalization', {selectedId: currentTeam.product_id}]}));
         } else if (rhsState === RHSStates.SETTINGS) {
             dispatch(closeRightHandSide());
         } else {

From 3fa5d6b23c8e2922917df79a2a7ff865f92d5c12 Mon Sep 17 00:00:00 2001
From: "anton.buksa" <anton.buksa@infomaniak.com>
Date: Mon, 16 Sep 2024 14:20:03 +0200
Subject: [PATCH 5/5] ux fixes, transform into toggle

---
 .../rhs_settings_display.tsx                  | 15 +++--
 .../manage_timezones/manage_timezones.tsx     | 65 ++++++++++---------
 webapp/channels/src/i18n/de.json              |  1 +
 webapp/channels/src/i18n/en.json              |  1 +
 webapp/channels/src/i18n/es.json              |  1 +
 webapp/channels/src/i18n/fr.json              |  1 +
 webapp/channels/src/i18n/it.json              |  1 +
 7 files changed, 50 insertions(+), 35 deletions(-)

diff --git a/webapp/channels/src/components/rhs_settings/rhs_settings_display/rhs_settings_display.tsx b/webapp/channels/src/components/rhs_settings/rhs_settings_display/rhs_settings_display.tsx
index ae18df4721..9dd1a9d908 100644
--- a/webapp/channels/src/components/rhs_settings/rhs_settings_display/rhs_settings_display.tsx
+++ b/webapp/channels/src/components/rhs_settings/rhs_settings_display/rhs_settings_display.tsx
@@ -373,11 +373,14 @@ export default class RhsSettingsDisplay extends React.PureComponent<Props, State
     handleOnChange(display: {[key: string]: any}) {
         this.handleSubmit({...this.state, ...display});
     }
-    handleOnTimezoneChange: ComponentProps<typeof ManageTimezones>['onChange'] = (timezone) => {
+    handleOnTimezoneChange: ComponentProps<typeof ManageTimezones>['onChange'] = (timezone, xd) => {
+        console.log(timezone);
+        console.log(xd);
         this.handleOnChange({timezone: {
             useAutomaticTimezone: timezone.useAutomaticTimezone.toString(),
-            manualTimezone: timezone.useAutomaticTimezone ? timezone.automaticTimezone : timezone.manualTimezone,
-            automaticTimezone: timezone.useAutomaticTimezone ? timezone.automaticTimezone : timezone.manualTimezone,
+
+            // manualTimezone: timezone.useAutomaticTimezone ? timezone.automaticTimezone : timezone.manualTimezone,
+            // automaticTimezone: timezone.useAutomaticTimezone ? timezone.automaticTimezone : timezone.manualTimezone,
         }});
     };
 
@@ -896,8 +899,8 @@ export default class RhsSettingsDisplay extends React.PureComponent<Props, State
                 <>
                     <label htmlFor='user.settings.display.timezone'>
                         <FormattedMessage
-                            id='user.settings.display.timezone'
-                            defaultMessage='Timezone'
+                            id='user.settings.display.timezone2'
+                            defaultMessage='Automatic timezone'
                         />
                     </label>
                     <ManageTimezones
@@ -917,7 +920,6 @@ export default class RhsSettingsDisplay extends React.PureComponent<Props, State
                     <div className='divider-dark first'/>
                     {themeSection}
                     {messageDisplaySection}
-                    {timezoneSelection}
                     {collapseSection}
                     {linkPreviewSection}
                     {oneClickReactionsOnPostsSection}
@@ -925,6 +927,7 @@ export default class RhsSettingsDisplay extends React.PureComponent<Props, State
                     {lastActiveSection}
                     {channelDisplayModeSection}
                     {UnreadScrollPositionSection}
+                    {timezoneSelection}
                     {clockSection}
                     {teammateNameDisplaySection}
                     <RhsLimitVisibleGMsDMs/>
diff --git a/webapp/channels/src/components/user_settings/display/manage_timezones/manage_timezones.tsx b/webapp/channels/src/components/user_settings/display/manage_timezones/manage_timezones.tsx
index d08ac164a3..1b2fc3840a 100644
--- a/webapp/channels/src/components/user_settings/display/manage_timezones/manage_timezones.tsx
+++ b/webapp/channels/src/components/user_settings/display/manage_timezones/manage_timezones.tsx
@@ -14,6 +14,7 @@ import {getTimezoneLabel} from 'mattermost-redux/utils/timezone_utils';
 
 import ExternalLink from 'components/external_link';
 import SettingItemMax from 'components/setting_item_max';
+import Toggle from 'components/toggle';
 
 import {getBrowserTimezone} from 'utils/timezone';
 
@@ -157,8 +158,8 @@ export default class ManageTimezones extends React.PureComponent<Props, State> {
             });
     };
 
-    handleAutomaticTimezone = (e: React.ChangeEvent<HTMLInputElement>) => {
-        const useAutomaticTimezone = e.target.checked;
+    handleAutomaticTimezone = () => {
+        const useAutomaticTimezone = !this.state.automaticTimezone;
         const manualTimezone = '';
         let automaticTimezone = '';
         let timezoneLabel: string;
@@ -219,27 +220,33 @@ export default class ManageTimezones extends React.PureComponent<Props, State> {
 
         const noTimezonesFromServer = timezones.length === 0;
         const automaticTimezoneInput = (
-            <div className='checkbox'>
-                <label>
-                    <input
-                        id='automaticTimezoneInput'
-                        type='checkbox'
-                        checked={useAutomaticTimezone}
-                        onChange={this.handleAutomaticTimezone}
-                        disabled={noTimezonesFromServer}
-                    />
-                    <FormattedMessage
-                        id='user.settings.timezones.automatic'
-                        defaultMessage='Automatic'
-                    />
 
-                </label>
-            </div>
+            // <div className='checkbox'>
+            //     <label>
+            //         <input
+            //             id='automaticTimezoneInput'
+            //             type='checkbox'
+            //             checked={useAutomaticTimezone}
+            //             onChange={this.handleAutomaticTimezone}
+            //             disabled={noTimezonesFromServer}
+            //         />
+            //         <FormattedMessage
+            //             id='user.settings.timezones.automatic'
+            //             defaultMessage='Automatic'
+            //         />
+
+            //     </label>
+            // </div>
+            <Toggle
+                id={'automaticTimezoneInput childOption'}
+                onToggle={this.handleAutomaticTimezone}
+                toggled={useAutomaticTimezone}
+            />
         );
 
         const manualTimezoneInput = (
             <div
-                className='pt-2'
+                className='pt-2 pb-4'
             >
                 {!useAutomaticTimezone &&
                 <ExternalLink
@@ -258,15 +265,15 @@ export default class ManageTimezones extends React.PureComponent<Props, State> {
 
         inputs.push(manualTimezoneInput);
 
-        inputs.push(
-            <div>
-                <br/>
-                <FormattedMessage
-                    id='user.settings.timezones.promote'
-                    defaultMessage='Select the time zone used for timestamps in the user interface and email notifications.'
-                />
-            </div>,
-        );
+        // inputs.push(
+        //     <div>
+        //         <br/>
+        //         <FormattedMessage
+        //             id='user.settings.timezones.promote'
+        //             defaultMessage='Select the time zone used for timestamps in the user interface and email notifications.'
+        //         />
+        //     </div>,
+        // );
         if (compact) {
             return inputs;
         }
@@ -274,8 +281,8 @@ export default class ManageTimezones extends React.PureComponent<Props, State> {
             <SettingItemMax
                 title={
                     <FormattedMessage
-                        id='user.settings.display.timezone'
-                        defaultMessage='Timezone'
+                        id='user.settings.display.timezone2'
+                        defaultMessage='Automatic timezone'
                     />
                 }
                 containerStyle='timezone-container'
diff --git a/webapp/channels/src/i18n/de.json b/webapp/channels/src/i18n/de.json
index 7e5d8a9fe2..7585ba00cb 100644
--- a/webapp/channels/src/i18n/de.json
+++ b/webapp/channels/src/i18n/de.json
@@ -5716,6 +5716,7 @@
   "user.settings.display.theme.themeDark": "Thema Dunkel",
   "user.settings.display.theme.themeAuto": "Automatisches Thema",
   "user.settings.display.timezone": "Zeitzone",
+  "user.settings.display.timezone2": "automatische Zeitzone",
   "user.settings.display.title": "Anzeigeeinstellungen",
   "user.settings.general.close": "Schließen",
   "user.settings.general.confirmEmail": "E-Mail-Adresse bestätigen",
diff --git a/webapp/channels/src/i18n/en.json b/webapp/channels/src/i18n/en.json
index 0ad4875279..40b51854ee 100644
--- a/webapp/channels/src/i18n/en.json
+++ b/webapp/channels/src/i18n/en.json
@@ -5731,6 +5731,7 @@
   "user.settings.display.theme.themeDark": "Dark Theme",
   "user.settings.display.theme.themeAuto": "Automatic Theme",
   "user.settings.display.timezone": "Timezone",
+  "user.settings.display.timezone2": "Automatic timezone",
   "user.settings.display.title": "Display Settings",
   "user.settings.general.close": "Close",
   "user.settings.general.confirmEmail": "Confirm Email",
diff --git a/webapp/channels/src/i18n/es.json b/webapp/channels/src/i18n/es.json
index 199cb1c6ab..c42766c571 100644
--- a/webapp/channels/src/i18n/es.json
+++ b/webapp/channels/src/i18n/es.json
@@ -4687,6 +4687,7 @@
   "user.settings.display.theme.themeDark": "Tema Oscuro",
   "user.settings.display.theme.themeAuto": "Tema Automático",
   "user.settings.display.timezone": "Zona horaria",
+  "user.settings.display.timezone2": "Zona horaria automática",
   "user.settings.display.title": "Configuración de Visualización",
   "user.settings.general.close": "Cerrar",
   "user.settings.general.confirmEmail": "Confirmar Correo electrónico",
diff --git a/webapp/channels/src/i18n/fr.json b/webapp/channels/src/i18n/fr.json
index f34494f443..f000a76dc1 100644
--- a/webapp/channels/src/i18n/fr.json
+++ b/webapp/channels/src/i18n/fr.json
@@ -4618,6 +4618,7 @@
   "user.settings.display.theme.themeDark": "Thème Sombre",
   "user.settings.display.theme.themeAuto": "Thème automatique",
   "user.settings.display.timezone": "Fuseau horaire",
+  "user.settings.display.timezone2": "Fuseau horaire automatique",
   "user.settings.display.title": "Paramètres d'affichage",
   "user.settings.general.close": "Fermer",
   "user.settings.general.confirmEmail": "Confirmation de l'adresse e-mail",
diff --git a/webapp/channels/src/i18n/it.json b/webapp/channels/src/i18n/it.json
index e8c9338be2..ea36bfb6e9 100644
--- a/webapp/channels/src/i18n/it.json
+++ b/webapp/channels/src/i18n/it.json
@@ -3522,6 +3522,7 @@
   "user.settings.display.theme.themeDark": "Tema Scuro",
   "user.settings.display.theme.themeAuto": "Tema Automatico",
   "user.settings.display.timezone": "Fuso orario",
+  "user.settings.display.timezone2": "Fuso orario automatico",
   "user.settings.display.title": "Impostazioni aspetto",
   "user.settings.general.close": "Chiudi",
   "user.settings.general.confirmEmail": "Conferma l'indirizzo email",