* Remove t and localizeMessage from components/custom_status

* Remove t from components/user_settings/advanced

* Remove t from components/user_settings/display
Этот коммит содержится в:
Harrison Healey
2024-05-24 12:00:05 -04:00
коммит произвёл GitHub
родитель 3cac94a7aa
Коммит 86aced1282
4 изменённых файлов: 259 добавлений и 211 удалений

Просмотреть файл

@@ -5,7 +5,8 @@ import classNames from 'classnames';
import type {Moment} from 'moment-timezone'; import type {Moment} from 'moment-timezone';
import moment from 'moment-timezone'; import moment from 'moment-timezone';
import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react'; import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react';
import {FormattedMessage, useIntl} from 'react-intl'; import type {MessageDescriptor} from 'react-intl';
import {FormattedMessage, defineMessage, useIntl} from 'react-intl';
import {useDispatch, useSelector} from 'react-redux'; import {useDispatch, useSelector} from 'react-redux';
import {useRouteMatch} from 'react-router-dom'; import {useRouteMatch} from 'react-router-dom';
@@ -33,10 +34,8 @@ import EmojiIcon from 'components/widgets/icons/emoji_icon';
import {A11yCustomEventTypes, Constants, ModalIdentifiers} from 'utils/constants'; import {A11yCustomEventTypes, Constants, ModalIdentifiers} from 'utils/constants';
import type {A11yFocusEventDetail} from 'utils/constants'; import type {A11yFocusEventDetail} from 'utils/constants';
import {t} from 'utils/i18n';
import {isKeyPressed} from 'utils/keyboard'; import {isKeyPressed} from 'utils/keyboard';
import {getCurrentMomentForTimezone} from 'utils/timezone'; import {getCurrentMomentForTimezone} from 'utils/timezone';
import {localizeMessage} from 'utils/utils';
import type {GlobalState} from 'types/store'; import type {GlobalState} from 'types/store';
@@ -54,8 +53,7 @@ const EMOJI_PICKER_WIDTH_OFFSET = 308;
type DefaultUserCustomStatus = { type DefaultUserCustomStatus = {
emoji: string; emoji: string;
message: string; message: MessageDescriptor;
messageDefault: string;
duration: CustomStatusDuration; duration: CustomStatusDuration;
}; };
@@ -73,32 +71,42 @@ const {
const defaultCustomStatusSuggestions: DefaultUserCustomStatus[] = [ const defaultCustomStatusSuggestions: DefaultUserCustomStatus[] = [
{ {
emoji: 'calendar', emoji: 'calendar',
message: t('custom_status.suggestions.in_a_meeting'), message: defineMessage({
messageDefault: 'In a meeting', id: 'custom_status.suggestions.in_a_meeting',
defaultMessage: 'In a meeting',
}),
duration: ONE_HOUR, duration: ONE_HOUR,
}, },
{ {
emoji: 'hamburger', emoji: 'hamburger',
message: t('custom_status.suggestions.out_for_lunch'), message: defineMessage({
messageDefault: 'Out for lunch', id: 'custom_status.suggestions.out_for_lunch',
defaultMessage: 'Out for lunch',
}),
duration: THIRTY_MINUTES, duration: THIRTY_MINUTES,
}, },
{ {
emoji: 'sneezing_face', emoji: 'sneezing_face',
message: t('custom_status.suggestions.out_sick'), message: defineMessage({
messageDefault: 'Out sick', id: 'custom_status.suggestions.out_sick',
defaultMessage: 'Out sick',
}),
duration: TODAY, duration: TODAY,
}, },
{ {
emoji: 'house', emoji: 'house',
message: t('custom_status.suggestions.working_from_home'), message: defineMessage({
messageDefault: 'Working from home', id: 'custom_status.suggestions.working_from_home',
defaultMessage: 'Working from home',
}),
duration: TODAY, duration: TODAY,
}, },
{ {
emoji: 'palm_tree', emoji: 'palm_tree',
message: t('custom_status.suggestions.on_a_vacation'), message: defineMessage({
messageDefault: 'On a vacation', id: 'custom_status.suggestions.on_a_vacation',
defaultMessage: 'On a vacation',
}),
duration: THIS_WEEK, duration: THIS_WEEK,
}, },
]; ];
@@ -320,7 +328,7 @@ const CustomStatusModal: React.FC<Props> = (props: Props) => {
const customStatusSuggestions = defaultCustomStatusSuggestions. const customStatusSuggestions = defaultCustomStatusSuggestions.
map((status) => ({ map((status) => ({
emoji: status.emoji, emoji: status.emoji,
text: formatMessage({id: status.message, defaultMessage: status.messageDefault}), text: formatMessage(status.message),
duration: status.duration, duration: status.duration,
})). })).
filter((status: UserCustomStatus) => !recentCustomStatusTexts.includes(status.text)). filter((status: UserCustomStatus) => !recentCustomStatusTexts.includes(status.text)).
@@ -399,7 +407,7 @@ const CustomStatusModal: React.FC<Props> = (props: Props) => {
handleEnterKeyPress={handleSetStatus} handleEnterKeyPress={handleSetStatus}
handleCancel={handleClearStatus} handleCancel={handleClearStatus}
confirmButtonClassName='btn btn-primary' confirmButtonClassName='btn btn-primary'
ariaLabel={localizeMessage('custom_status.set_status', 'Set a status')} ariaLabel={formatMessage({id: 'custom_status.set_status', defaultMessage: 'Set a status'})}
keyboardEscape={false} keyboardEscape={false}
tabIndex={-1} tabIndex={-1}
> >

Просмотреть файл

@@ -5,7 +5,7 @@
import React from 'react'; import React from 'react';
import type {ReactNode} from 'react'; import type {ReactNode} from 'react';
import {FormattedMessage} from 'react-intl'; import {FormattedMessage, defineMessages} from 'react-intl';
import type {PreferenceType} from '@mattermost/types/preferences'; import type {PreferenceType} from '@mattermost/types/preferences';
import type {UserProfile} from '@mattermost/types/users'; import type {UserProfile} from '@mattermost/types/users';
@@ -19,7 +19,6 @@ import SettingItem from 'components/setting_item';
import SettingItemMax from 'components/setting_item_max'; import SettingItemMax from 'components/setting_item_max';
import Constants, {AdvancedSections, Preferences} from 'utils/constants'; import Constants, {AdvancedSections, Preferences} from 'utils/constants';
import {t} from 'utils/i18n';
import {isMac} from 'utils/user_agent'; import {isMac} from 'utils/user_agent';
import {a11yFocus, localizeMessage} from 'utils/utils'; import {a11yFocus, localizeMessage} from 'utils/utils';
@@ -224,26 +223,26 @@ export default class AdvancedSettingsDisplay extends React.PureComponent<Props,
// This function changes ctrl to cmd when OS is mac // This function changes ctrl to cmd when OS is mac
getCtrlSendText = () => { getCtrlSendText = () => {
const description = { const description = defineMessages({
default: { default: {
id: t('user.settings.advance.sendDesc'), id: 'user.settings.advance.sendDesc',
defaultMessage: 'When enabled, CTRL + ENTER will send the message and ENTER inserts a new line.', defaultMessage: 'When enabled, CTRL + ENTER will send the message and ENTER inserts a new line.',
}, },
mac: { mac: {
id: t('user.settings.advance.sendDesc.mac'), id: 'user.settings.advance.sendDesc.mac',
defaultMessage: 'When enabled, ⌘ + ENTER will send the message and ENTER inserts a new line.', defaultMessage: 'When enabled, ⌘ + ENTER will send the message and ENTER inserts a new line.',
}, },
}; });
const title = { const title = defineMessages({
default: { default: {
id: t('user.settings.advance.sendTitle'), id: 'user.settings.advance.sendTitle',
defaultMessage: 'Send Messages on CTRL+ENTER', defaultMessage: 'Send Messages on CTRL+ENTER',
}, },
mac: { mac: {
id: t('user.settings.advance.sendTitle.mac'), id: 'user.settings.advance.sendTitle.mac',
defaultMessage: 'Send Messages on ⌘+ENTER', defaultMessage: 'Send Messages on ⌘+ENTER',
}, },
}; });
if (isMac()) { if (isMac()) {
return { return {
ctrlSendTitle: title.mac, ctrlSendTitle: title.mac,

Просмотреть файл

@@ -1237,7 +1237,7 @@ exports[`components/user_settings/display/UserSettingsDisplay should match snaps
type="radio" type="radio"
/> />
<Memo(MemoizedFormattedMessage) <Memo(MemoizedFormattedMessage)
defaultMessage="On" defaultMessage="Expanded"
id="user.settings.display.collapseOn" id="user.settings.display.collapseOn"
/> />
</label> </label>
@@ -1255,7 +1255,7 @@ exports[`components/user_settings/display/UserSettingsDisplay should match snaps
type="radio" type="radio"
/> />
<Memo(MemoizedFormattedMessage) <Memo(MemoizedFormattedMessage)
defaultMessage="Off" defaultMessage="Collapsed"
id="user.settings.display.collapseOff" id="user.settings.display.collapseOff"
/> />
</label> </label>

Просмотреть файл

@@ -4,9 +4,9 @@
/* eslint-disable max-lines */ /* eslint-disable max-lines */
import deepEqual from 'fast-deep-equal'; import deepEqual from 'fast-deep-equal';
import type {PrimitiveType, FormatXMLElementFn} from 'intl-messageformat';
import React from 'react'; import React from 'react';
import {FormattedMessage} from 'react-intl'; import type {MessageDescriptor} from 'react-intl';
import {FormattedMessage, defineMessage} from 'react-intl';
import type {Timezone} from 'timezones.json'; import type {Timezone} from 'timezones.json';
import type {PreferenceType} from '@mattermost/types/preferences'; import type {PreferenceType} from '@mattermost/types/preferences';
@@ -23,7 +23,6 @@ import ThemeSetting from 'components/user_settings/display/user_settings_theme';
import type {Language} from 'i18n/i18n'; import type {Language} from 'i18n/i18n';
import {getLanguageInfo} from 'i18n/i18n'; import {getLanguageInfo} from 'i18n/i18n';
import Constants from 'utils/constants'; import Constants from 'utils/constants';
import {t} from 'utils/i18n';
import {getBrowserTimezone} from 'utils/timezone'; import {getBrowserTimezone} from 'utils/timezone';
import {a11yFocus} from 'utils/utils'; import {a11yFocus} from 'utils/utils';
@@ -53,21 +52,17 @@ function getDisplayStateFromProps(props: Props) {
} }
type ChildOption = { type ChildOption = {
id: string; label: MessageDescriptor;
message: string;
value: string; value: string;
display: string; display: string;
moreId: string; more: MessageDescriptor;
moreMessage: string;
}; };
type Option = { type Option = {
value: string; value: string;
radionButtonText: { radionButtonText: {
id: string; label: MessageDescriptor;
message: string; more?: MessageDescriptor;
moreId?: string;
moreMessage?: string;
}; };
childOption?: ChildOption; childOption?: ChildOption;
} }
@@ -77,18 +72,11 @@ type SectionProps ={
display: string; display: string;
defaultDisplay: string; defaultDisplay: string;
value: string; value: string;
title: { title: MessageDescriptor;
id: string;
message: string;
};
firstOption: Option; firstOption: Option;
secondOption: Option; secondOption: Option;
thirdOption?: Option; thirdOption?: Option;
description: { description: MessageDescriptor;
id: string;
message: string;
values?: Record<string, React.ReactNode | PrimitiveType | FormatXMLElementFn<React.ReactNode, React.ReactNode>>;
};
disabled?: boolean; disabled?: boolean;
onSubmit?: () => void; onSubmit?: () => void;
} }
@@ -411,20 +399,20 @@ export default class UserSettingsDisplay extends React.PureComponent<Props, Stat
const firstMessage = ( const firstMessage = (
<FormattedMessage <FormattedMessage
id={firstOption.radionButtonText.id} id={firstOption.radionButtonText.label.id}
defaultMessage={firstOption.radionButtonText.message} defaultMessage={firstOption.radionButtonText.label.defaultMessage}
/> />
); );
let moreColon; let moreColon;
let firstMessageMore; let firstMessageMore;
if (firstOption.radionButtonText.moreId) { if (firstOption.radionButtonText.more?.id) {
moreColon = ': '; moreColon = ': ';
firstMessageMore = ( firstMessageMore = (
<span className='font-weight--normal'> <span className='font-weight--normal'>
<FormattedMessage <FormattedMessage
id={firstOption.radionButtonText.moreId} id={firstOption.radionButtonText.more.id}
defaultMessage={firstOption.radionButtonText.moreMessage} defaultMessage={firstOption.radionButtonText.more.defaultMessage}
/> />
</span> </span>
); );
@@ -432,18 +420,18 @@ export default class UserSettingsDisplay extends React.PureComponent<Props, Stat
const secondMessage = ( const secondMessage = (
<FormattedMessage <FormattedMessage
id={secondOption.radionButtonText.id} id={secondOption.radionButtonText.label.id}
defaultMessage={secondOption.radionButtonText.message} defaultMessage={secondOption.radionButtonText.label.defaultMessage}
/> />
); );
let secondMessageMore; let secondMessageMore;
if (secondOption.radionButtonText.moreId) { if (secondOption.radionButtonText.more?.id) {
secondMessageMore = ( secondMessageMore = (
<span className='font-weight--normal'> <span className='font-weight--normal'>
<FormattedMessage <FormattedMessage
id={secondOption.radionButtonText.moreId} id={secondOption.radionButtonText.more.id}
defaultMessage={secondOption.radionButtonText.moreMessage} defaultMessage={secondOption.radionButtonText.more.defaultMessage}
/> />
</span> </span>
); );
@@ -453,8 +441,8 @@ export default class UserSettingsDisplay extends React.PureComponent<Props, Stat
if (thirdOption) { if (thirdOption) {
thirdMessage = ( thirdMessage = (
<FormattedMessage <FormattedMessage
id={thirdOption.radionButtonText.id} id={thirdOption.radionButtonText.label.id}
defaultMessage={thirdOption.radionButtonText.message} defaultMessage={thirdOption.radionButtonText.label.defaultMessage}
/> />
); );
} }
@@ -462,15 +450,14 @@ export default class UserSettingsDisplay extends React.PureComponent<Props, Stat
const messageTitle = ( const messageTitle = (
<FormattedMessage <FormattedMessage
id={title.id} id={title.id}
defaultMessage={title.message} defaultMessage={title.defaultMessage}
/> />
); );
const messageDesc = ( const messageDesc = (
<FormattedMessage <FormattedMessage
id={description.id} id={description.id}
defaultMessage={description.message} defaultMessage={description.defaultMessage}
values={description.values}
/> />
); );
@@ -536,21 +523,21 @@ export default class UserSettingsDisplay extends React.PureComponent<Props, Stat
<input <input
id={name + 'childOption'} id={name + 'childOption'}
type='checkbox' type='checkbox'
name={childOptionToShow.id} name={childOptionToShow.label.id}
checked={childOptionToShow.value === 'true'} checked={childOptionToShow.value === 'true'}
onChange={(e) => { onChange={(e) => {
this.handleOnChange(e, {[childDisplay]: e.target.checked ? 'true' : 'false'}); this.handleOnChange(e, {[childDisplay]: e.target.checked ? 'true' : 'false'});
}} }}
/> />
<FormattedMessage <FormattedMessage
id={childOptionToShow.id} id={childOptionToShow.label.id}
defaultMessage={childOptionToShow.message} defaultMessage={childOptionToShow.label.defaultMessage}
/> />
{moreColon} {moreColon}
<span className='font-weight--normal'> <span className='font-weight--normal'>
<FormattedMessage <FormattedMessage
id={childOptionToShow.moreId} id={childOptionToShow.more.id}
defaultMessage={childOptionToShow.moreMessage} defaultMessage={childOptionToShow.more.defaultMessage}
/> />
</span> </span>
</label> </label>
@@ -658,28 +645,32 @@ export default class UserSettingsDisplay extends React.PureComponent<Props, Stat
display: 'collapseDisplay', display: 'collapseDisplay',
value: this.state.collapseDisplay, value: this.state.collapseDisplay,
defaultDisplay: 'false', defaultDisplay: 'false',
title: { title: defineMessage({
id: t('user.settings.display.collapseDisplay'), id: 'user.settings.display.collapseDisplay',
message: 'Default Appearance of Image Previews', defaultMessage: 'Default Appearance of Image Previews',
}, }),
firstOption: { firstOption: {
value: 'false', value: 'false',
radionButtonText: { radionButtonText: {
id: t('user.settings.display.collapseOn'), label: defineMessage({
message: 'On', id: 'user.settings.display.collapseOn',
defaultMessage: 'Expanded',
}),
}, },
}, },
secondOption: { secondOption: {
value: 'true', value: 'true',
radionButtonText: { radionButtonText: {
id: t('user.settings.display.collapseOff'), label: defineMessage({
message: 'Off', id: 'user.settings.display.collapseOff',
defaultMessage: 'Collapsed',
}),
}, },
}, },
description: { description: defineMessage({
id: t('user.settings.display.collapseDesc'), id: 'user.settings.display.collapseDesc',
message: 'Set whether previews of image links and image attachment thumbnails show as expanded or collapsed by default. This setting can also be controlled using the slash commands /expand and /collapse.', defaultMessage: 'Set whether previews of image links and image attachment thumbnails show as expanded or collapsed by default. This setting can also be controlled using the slash commands /expand and /collapse.',
}, }),
}); });
let linkPreviewSection = null; let linkPreviewSection = null;
@@ -690,28 +681,32 @@ export default class UserSettingsDisplay extends React.PureComponent<Props, Stat
display: 'linkPreviewDisplay', display: 'linkPreviewDisplay',
value: this.state.linkPreviewDisplay, value: this.state.linkPreviewDisplay,
defaultDisplay: 'true', defaultDisplay: 'true',
title: { title: defineMessage({
id: t('user.settings.display.linkPreviewDisplay'), id: 'user.settings.display.linkPreviewDisplay',
message: 'Website Link Previews', defaultMessage: 'Website Link Previews',
}, }),
firstOption: { firstOption: {
value: 'true', value: 'true',
radionButtonText: { radionButtonText: {
id: t('user.settings.display.linkPreviewOn'), label: defineMessage({
message: 'On', id: 'user.settings.display.linkPreviewOn',
defaultMessage: 'On',
}),
}, },
}, },
secondOption: { secondOption: {
value: 'false', value: 'false',
radionButtonText: { radionButtonText: {
id: t('user.settings.display.linkPreviewOff'), label: defineMessage({
message: 'Off', id: 'user.settings.display.linkPreviewOff',
defaultMessage: 'Off',
}),
}, },
}, },
description: { description: defineMessage({
id: t('user.settings.display.linkPreviewDesc'), id: 'user.settings.display.linkPreviewDesc',
message: 'When available, the first web link in a message will show a preview of the website content below the message.', defaultMessage: 'When available, the first web link in a message will show a preview of the website content below the message.',
}, }),
}); });
this.prevSections.message_display = 'linkpreview'; this.prevSections.message_display = 'linkpreview';
} else { } else {
@@ -726,28 +721,32 @@ export default class UserSettingsDisplay extends React.PureComponent<Props, Stat
display: 'lastActiveDisplay', display: 'lastActiveDisplay',
value: this.state.lastActiveDisplay, value: this.state.lastActiveDisplay,
defaultDisplay: 'true', defaultDisplay: 'true',
title: { title: defineMessage({
id: t('user.settings.display.lastActiveDisplay'), id: 'user.settings.display.lastActiveDisplay',
message: 'Share last active time', defaultMessage: 'Share last active time',
}, }),
firstOption: { firstOption: {
value: 'true', value: 'true',
radionButtonText: { radionButtonText: {
id: t('user.settings.display.lastActiveOn'), label: defineMessage({
message: 'On', id: 'user.settings.display.lastActiveOn',
defaultMessage: 'On',
}),
}, },
}, },
secondOption: { secondOption: {
value: 'false', value: 'false',
radionButtonText: { radionButtonText: {
id: t('user.settings.display.lastActiveOff'), label: defineMessage({
message: 'Off', id: 'user.settings.display.lastActiveOff',
defaultMessage: 'Off',
}),
}, },
}, },
description: { description: defineMessage({
id: t('user.settings.display.lastActiveDesc'), id: 'user.settings.display.lastActiveDesc',
message: 'When enabled, other users will see when you were last active.', defaultMessage: 'When enabled, other users will see when you were last active.',
}, }),
onSubmit: this.submitLastActive, onSubmit: this.submitLastActive,
}); });
} }
@@ -757,28 +756,32 @@ export default class UserSettingsDisplay extends React.PureComponent<Props, Stat
display: 'militaryTime', display: 'militaryTime',
value: this.state.militaryTime, value: this.state.militaryTime,
defaultDisplay: 'false', defaultDisplay: 'false',
title: { title: defineMessage({
id: t('user.settings.display.clockDisplay'), id: 'user.settings.display.clockDisplay',
message: 'Clock Display', defaultMessage: 'Clock Display',
}, }),
firstOption: { firstOption: {
value: 'false', value: 'false',
radionButtonText: { radionButtonText: {
id: t('user.settings.display.normalClock'), label: defineMessage({
message: '12-hour clock (example: 4:00 PM)', id: 'user.settings.display.normalClock',
defaultMessage: '12-hour clock (example: 4:00 PM)',
}),
}, },
}, },
secondOption: { secondOption: {
value: 'true', value: 'true',
radionButtonText: { radionButtonText: {
id: t('user.settings.display.militaryClock'), label: defineMessage({
message: '24-hour clock (example: 16:00)', id: 'user.settings.display.militaryClock',
defaultMessage: '24-hour clock (example: 16:00)',
}),
}, },
}, },
description: { description: defineMessage({
id: t('user.settings.display.preferTime'), id: 'user.settings.display.preferTime',
message: 'Select how you prefer time displayed.', defaultMessage: 'Select how you prefer time displayed.',
}, }),
}); });
const teammateNameDisplaySection = this.createSection({ const teammateNameDisplaySection = this.createSection({
@@ -786,35 +789,41 @@ export default class UserSettingsDisplay extends React.PureComponent<Props, Stat
display: 'teammateNameDisplay', display: 'teammateNameDisplay',
value: this.props.lockTeammateNameDisplay ? this.props.configTeammateNameDisplay : this.state.teammateNameDisplay, value: this.props.lockTeammateNameDisplay ? this.props.configTeammateNameDisplay : this.state.teammateNameDisplay,
defaultDisplay: this.props.configTeammateNameDisplay, defaultDisplay: this.props.configTeammateNameDisplay,
title: { title: defineMessage({
id: t('user.settings.display.teammateNameDisplayTitle'), id: 'user.settings.display.teammateNameDisplayTitle',
message: 'Teammate Name Display', defaultMessage: 'Teammate Name Display',
}, }),
firstOption: { firstOption: {
value: Constants.TEAMMATE_NAME_DISPLAY.SHOW_USERNAME, value: Constants.TEAMMATE_NAME_DISPLAY.SHOW_USERNAME,
radionButtonText: { radionButtonText: {
id: t('user.settings.display.teammateNameDisplayUsername'), label: defineMessage({
message: 'Show username', id: 'user.settings.display.teammateNameDisplayUsername',
defaultMessage: 'Show username',
}),
}, },
}, },
secondOption: { secondOption: {
value: Constants.TEAMMATE_NAME_DISPLAY.SHOW_NICKNAME_FULLNAME, value: Constants.TEAMMATE_NAME_DISPLAY.SHOW_NICKNAME_FULLNAME,
radionButtonText: { radionButtonText: {
id: t('user.settings.display.teammateNameDisplayNicknameFullname'), label: defineMessage({
message: 'Show nickname if one exists, otherwise show first and last name', id: 'user.settings.display.teammateNameDisplayNicknameFullname',
defaultMessage: 'Show nickname if one exists, otherwise show first and last name',
}),
}, },
}, },
thirdOption: { thirdOption: {
value: Constants.TEAMMATE_NAME_DISPLAY.SHOW_FULLNAME, value: Constants.TEAMMATE_NAME_DISPLAY.SHOW_FULLNAME,
radionButtonText: { radionButtonText: {
id: t('user.settings.display.teammateNameDisplayFullname'), label: defineMessage({
message: 'Show first and last name', id: 'user.settings.display.teammateNameDisplayFullname',
defaultMessage: 'Show first and last name',
}),
}, },
}, },
description: { description: defineMessage({
id: t('user.settings.display.teammateNameDisplayDescription'), id: 'user.settings.display.teammateNameDisplayDescription',
message: 'Set how to display other user\'s names in posts and the Direct Messages list.', defaultMessage: 'Set how to display other user\'s names in posts and the Direct Messages list.',
}, }),
disabled: this.props.lockTeammateNameDisplay, disabled: this.props.lockTeammateNameDisplay,
}); });
@@ -823,28 +832,32 @@ export default class UserSettingsDisplay extends React.PureComponent<Props, Stat
display: 'availabilityStatusOnPosts', display: 'availabilityStatusOnPosts',
value: this.state.availabilityStatusOnPosts, value: this.state.availabilityStatusOnPosts,
defaultDisplay: 'true', defaultDisplay: 'true',
title: { title: defineMessage({
id: t('user.settings.display.availabilityStatusOnPostsTitle'), id: 'user.settings.display.availabilityStatusOnPostsTitle',
message: 'Show user availability on posts', defaultMessage: 'Show user availability on posts',
}, }),
firstOption: { firstOption: {
value: 'true', value: 'true',
radionButtonText: { radionButtonText: {
id: t('user.settings.sidebar.on'), label: defineMessage({
message: 'On', id: 'user.settings.sidebar.on',
defaultMessage: 'On',
}),
}, },
}, },
secondOption: { secondOption: {
value: 'false', value: 'false',
radionButtonText: { radionButtonText: {
id: t('user.settings.sidebar.off'), label: defineMessage({
message: 'Off', id: 'user.settings.sidebar.off',
defaultMessage: 'Off',
}),
}, },
}, },
description: { description: defineMessage({
id: t('user.settings.display.availabilityStatusOnPostsDescription'), id: 'user.settings.display.availabilityStatusOnPostsDescription',
message: 'When enabled, online availability is displayed on profile images in the message list.', defaultMessage: 'When enabled, online availability is displayed on profile images in the message list.',
}, }),
}); });
let timezoneSelection; let timezoneSelection;
@@ -889,40 +902,52 @@ export default class UserSettingsDisplay extends React.PureComponent<Props, Stat
display: 'messageDisplay', display: 'messageDisplay',
value: this.state.messageDisplay, value: this.state.messageDisplay,
defaultDisplay: Preferences.MESSAGE_DISPLAY_CLEAN, defaultDisplay: Preferences.MESSAGE_DISPLAY_CLEAN,
title: { title: defineMessage({
id: t('user.settings.display.messageDisplayTitle'), id: 'user.settings.display.messageDisplayTitle',
message: 'Message Display', defaultMessage: 'Message Display',
}, }),
firstOption: { firstOption: {
value: Preferences.MESSAGE_DISPLAY_CLEAN, value: Preferences.MESSAGE_DISPLAY_CLEAN,
radionButtonText: { radionButtonText: {
id: t('user.settings.display.messageDisplayClean'), label: defineMessage({
message: 'Standard', id: 'user.settings.display.messageDisplayClean',
moreId: t('user.settings.display.messageDisplayCleanDes'), defaultMessage: 'Standard',
moreMessage: 'Easy to scan and read.', }),
more: defineMessage({
id: 'user.settings.display.messageDisplayCleanDes',
defaultMessage: 'Easy to scan and read.',
}),
}, },
}, },
secondOption: { secondOption: {
value: Preferences.MESSAGE_DISPLAY_COMPACT, value: Preferences.MESSAGE_DISPLAY_COMPACT,
radionButtonText: { radionButtonText: {
id: t('user.settings.display.messageDisplayCompact'), label: defineMessage({
message: 'Compact', id: 'user.settings.display.messageDisplayCompact',
moreId: t('user.settings.display.messageDisplayCompactDes'), defaultMessage: 'Compact',
moreMessage: 'Fit as many messages on the screen as we can.', }),
more: defineMessage({
id: 'user.settings.display.messageDisplayCompactDes',
defaultMessage: 'Fit as many messages on the screen as we can.',
}),
}, },
childOption: { childOption: {
id: t('user.settings.display.colorize'), label: defineMessage({
id: 'user.settings.display.colorize',
defaultMessage: 'Colorize usernames',
}),
value: this.state.colorizeUsernames, value: this.state.colorizeUsernames,
display: 'colorizeUsernames', display: 'colorizeUsernames',
message: 'Colorize usernames', more: defineMessage({
moreId: t('user.settings.display.colorizeDes'), id: 'user.settings.display.colorizeDes',
moreMessage: 'Use colors to distinguish users in compact mode', defaultMessage: 'Use colors to distinguish users in compact mode',
}),
}, },
}, },
description: { description: defineMessage({
id: t('user.settings.display.messageDisplayDescription'), id: 'user.settings.display.messageDisplayDescription',
message: 'Select how messages in a channel should be displayed.', defaultMessage: 'Select how messages in a channel should be displayed.',
}, }),
}); });
let collapsedReplyThreads; let collapsedReplyThreads;
@@ -933,28 +958,32 @@ export default class UserSettingsDisplay extends React.PureComponent<Props, Stat
display: 'collapsedReplyThreads', display: 'collapsedReplyThreads',
value: this.state.collapsedReplyThreads, value: this.state.collapsedReplyThreads,
defaultDisplay: Preferences.COLLAPSED_REPLY_THREADS_FALLBACK_DEFAULT, defaultDisplay: Preferences.COLLAPSED_REPLY_THREADS_FALLBACK_DEFAULT,
title: { title: defineMessage({
id: t('user.settings.display.collapsedReplyThreadsTitle'), id: 'user.settings.display.collapsedReplyThreadsTitle',
message: 'Collapsed Reply Threads', defaultMessage: 'Collapsed Reply Threads',
}, }),
firstOption: { firstOption: {
value: Preferences.COLLAPSED_REPLY_THREADS_ON, value: Preferences.COLLAPSED_REPLY_THREADS_ON,
radionButtonText: { radionButtonText: {
id: t('user.settings.display.collapsedReplyThreadsOn'), label: defineMessage({
message: 'On', id: 'user.settings.display.collapsedReplyThreadsOn',
defaultMessage: 'On',
}),
}, },
}, },
secondOption: { secondOption: {
value: Preferences.COLLAPSED_REPLY_THREADS_OFF, value: Preferences.COLLAPSED_REPLY_THREADS_OFF,
radionButtonText: { radionButtonText: {
id: t('user.settings.display.collapsedReplyThreadsOff'), label: defineMessage({
message: 'Off', id: 'user.settings.display.collapsedReplyThreadsOff',
defaultMessage: 'Off',
}),
}, },
}, },
description: { description: defineMessage({
id: t('user.settings.display.collapsedReplyThreadsDescription'), id: 'user.settings.display.collapsedReplyThreadsDescription',
message: 'When enabled, reply messages are not shown in the channel and you\'ll be notified about threads you\'re following in the "Threads" view.', defaultMessage: 'When enabled, reply messages are not shown in the channel and you\'ll be notified about threads you\'re following in the "Threads" view.',
}, }),
}); });
} }
@@ -963,28 +992,32 @@ export default class UserSettingsDisplay extends React.PureComponent<Props, Stat
display: 'clickToReply', display: 'clickToReply',
value: this.state.clickToReply, value: this.state.clickToReply,
defaultDisplay: 'true', defaultDisplay: 'true',
title: { title: defineMessage({
id: t('user.settings.display.clickToReply'), id: 'user.settings.display.clickToReply',
message: 'Click to open threads', defaultMessage: 'Click to open threads',
}, }),
firstOption: { firstOption: {
value: 'true', value: 'true',
radionButtonText: { radionButtonText: {
id: t('user.settings.sidebar.on'), label: defineMessage({
message: 'On', id: 'user.settings.sidebar.on',
defaultMessage: 'On',
}),
}, },
}, },
secondOption: { secondOption: {
value: 'false', value: 'false',
radionButtonText: { radionButtonText: {
id: t('user.settings.sidebar.off'), label: defineMessage({
message: 'Off', id: 'user.settings.sidebar.off',
defaultMessage: 'Off',
}),
}, },
}, },
description: { description: defineMessage({
id: t('user.settings.display.clickToReplyDescription'), id: 'user.settings.display.clickToReplyDescription',
message: 'When enabled, click anywhere on a message to open the reply thread.', defaultMessage: 'When enabled, click anywhere on a message to open the reply thread.',
}, }),
}); });
const channelDisplayModeSection = this.createSection({ const channelDisplayModeSection = this.createSection({
@@ -992,28 +1025,32 @@ export default class UserSettingsDisplay extends React.PureComponent<Props, Stat
display: 'channelDisplayMode', display: 'channelDisplayMode',
value: this.state.channelDisplayMode, value: this.state.channelDisplayMode,
defaultDisplay: Preferences.CHANNEL_DISPLAY_MODE_FULL_SCREEN, defaultDisplay: Preferences.CHANNEL_DISPLAY_MODE_FULL_SCREEN,
title: { title: defineMessage({
id: t('user.settings.display.channelDisplayTitle'), id: 'user.settings.display.channelDisplayTitle',
message: 'Channel Display', defaultMessage: 'Channel Display',
}, }),
firstOption: { firstOption: {
value: Preferences.CHANNEL_DISPLAY_MODE_FULL_SCREEN, value: Preferences.CHANNEL_DISPLAY_MODE_FULL_SCREEN,
radionButtonText: { radionButtonText: {
id: t('user.settings.display.fullScreen'), label: defineMessage({
message: 'Full width', id: 'user.settings.display.fullScreen',
defaultMessage: 'Full width',
}),
}, },
}, },
secondOption: { secondOption: {
value: Preferences.CHANNEL_DISPLAY_MODE_CENTERED, value: Preferences.CHANNEL_DISPLAY_MODE_CENTERED,
radionButtonText: { radionButtonText: {
id: t('user.settings.display.fixedWidthCentered'), label: defineMessage({
message: 'Fixed width, centered', id: 'user.settings.display.fixedWidthCentered',
defaultMessage: 'Fixed width, centered',
}),
}, },
}, },
description: { description: defineMessage({
id: t('user.settings.display.channeldisplaymode'), id: 'user.settings.display.channeldisplaymode',
message: 'Select the width of the center channel.', defaultMessage: 'Select the width of the center channel.',
}, }),
}); });
let languagesSection; let languagesSection;
@@ -1074,28 +1111,32 @@ export default class UserSettingsDisplay extends React.PureComponent<Props, Stat
display: 'oneClickReactionsOnPosts', display: 'oneClickReactionsOnPosts',
value: this.state.oneClickReactionsOnPosts, value: this.state.oneClickReactionsOnPosts,
defaultDisplay: 'true', defaultDisplay: 'true',
title: { title: defineMessage({
id: t('user.settings.display.oneClickReactionsOnPostsTitle'), id: 'user.settings.display.oneClickReactionsOnPostsTitle',
message: 'Quick reactions on messages', defaultMessage: 'Quick reactions on messages',
}, }),
firstOption: { firstOption: {
value: 'true', value: 'true',
radionButtonText: { radionButtonText: {
id: t('user.settings.sidebar.on'), label: defineMessage({
message: 'On', id: 'user.settings.sidebar.on',
defaultMessage: 'On',
}),
}, },
}, },
secondOption: { secondOption: {
value: 'false', value: 'false',
radionButtonText: { radionButtonText: {
id: t('user.settings.sidebar.off'), label: defineMessage({
message: 'Off', id: 'user.settings.sidebar.off',
defaultMessage: 'Off',
}),
}, },
}, },
description: { description: defineMessage({
id: t('user.settings.display.oneClickReactionsOnPostsDescription'), id: 'user.settings.display.oneClickReactionsOnPostsDescription',
message: 'When enabled, you can react in one-click with recently used reactions when hovering over a message.', defaultMessage: 'When enabled, you can react in one-click with recently used reactions when hovering over a message.',
}, }),
}); });
} }