mirrors/mostlymatter
1
0
Форкнуть 0
Код Задачи Запросы на слияние Действия Пакеты Проекты Релизы Вики Активность

[MM-54835] Convert LocalizedInput of 'custom_url_schemes_setting.tsx' to regular input component (#24854)

Просмотр исходного кода
Этот коммит содержится в:
Balaji K
2023-10-11 11:46:45 +05:30
коммит произвёл GitHub
родитель 463945e8cc
Коммит 176370e175
3 изменённых файлов: 476 добавлений и 144 удалений
Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

544
webapp/channels/src/components/admin_console/__snapshots__/custom_url_schemes_setting.test.tsx.snap
Просмотреть файл

@@ -1,121 +1,465 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`components/AdminConsole/CustomUrlSchemeSetting initial state with multiple items 1`] = `
<Settings
helpText="Allows message text to link if it begins with any of the comma-separated URL schemes listed. By default, the following schemes will create links: \\"http\\", \\"https\\", \\"ftp\\", \\"tel\\", and \\"mailto\\"."
inputId="MySetting"
label="Custom URL Schemes:"
setByEnv={false}
>
<LocalizedInput
className="form-control"
disabled={false}
id="MySetting"
onChange={[Function]}
placeholder={
Object {
"defaultMessage": "E.g.: \\"git,smtp\\"",
"id": "admin.customization.customUrlSchemesPlaceholder",
}
<CustomURLSchemesSetting
disabled={false}
id="MySetting"
intl={
Object {
"$t": [Function],
"defaultFormats": Object {},
"defaultLocale": "en",
"defaultRichTextElements": undefined,
"fallbackOnEmptyString": true,
"formatDate": [Function],
"formatDateTimeRange": [Function],
"formatDateToParts": [Function],
"formatDisplayName": [Function],
"formatList": [Function],
"formatListToParts": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatNumberToParts": [Function],
"formatPlural": [Function],
"formatRelativeTime": [Function],
"formatTime": [Function],
"formatTimeToParts": [Function],
"formats": Object {},
"formatters": Object {
"getDateTimeFormat": [Function],
"getDisplayNames": [Function],
"getListFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralRules": [Function],
"getRelativeTimeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"onError": [Function],
"onWarn": [Function],
"textComponent": "span",
"timeZone": "Etc/UTC",
}
type="text"
value="git,smtp,steam"
/>
</Settings>
}
onChange={[MockFunction]}
setByEnv={false}
value={
Array [
"git",
"smtp",
"steam",
]
}
>
<Settings
helpText="Allows message text to link if it begins with any of the comma-separated URL schemes listed. By default, the following schemes will create links: \\"http\\", \\"https\\", \\"ftp\\", \\"tel\\", and \\"mailto\\"."
inputId="MySetting"
label="Custom URL Schemes:"
setByEnv={false}
>
<div
className="form-group"
data-testid="MySetting"
>
<label
className="control-label col-sm-4"
htmlFor="MySetting"
>
Custom URL Schemes:
</label>
<div
className="col-sm-8"
>
<input
className="form-control"
disabled={false}
id="MySetting"
onChange={[Function]}
placeholder="E.g.: \\"git,smtp\\""
type="text"
value="git,smtp,steam"
/>
<div
className="help-text"
data-testid="MySettinghelp-text"
>
Allows message text to link if it begins with any of the comma-separated URL schemes listed. By default, the following schemes will create links: "http", "https", "ftp", "tel", and "mailto".
</div>
</div>
</div>
</Settings>
</CustomURLSchemesSetting>
`;
exports[`components/AdminConsole/CustomUrlSchemeSetting initial state with no items 1`] = `
<Settings
helpText="Allows message text to link if it begins with any of the comma-separated URL schemes listed. By default, the following schemes will create links: \\"http\\", \\"https\\", \\"ftp\\", \\"tel\\", and \\"mailto\\"."
inputId="MySetting"
label="Custom URL Schemes:"
setByEnv={false}
>
<LocalizedInput
className="form-control"
disabled={false}
id="MySetting"
onChange={[Function]}
placeholder={
Object {
"defaultMessage": "E.g.: \\"git,smtp\\"",
"id": "admin.customization.customUrlSchemesPlaceholder",
}
<CustomURLSchemesSetting
disabled={false}
id="MySetting"
intl={
Object {
"$t": [Function],
"defaultFormats": Object {},
"defaultLocale": "en",
"defaultRichTextElements": undefined,
"fallbackOnEmptyString": true,
"formatDate": [Function],
"formatDateTimeRange": [Function],
"formatDateToParts": [Function],
"formatDisplayName": [Function],
"formatList": [Function],
"formatListToParts": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatNumberToParts": [Function],
"formatPlural": [Function],
"formatRelativeTime": [Function],
"formatTime": [Function],
"formatTimeToParts": [Function],
"formats": Object {},
"formatters": Object {
"getDateTimeFormat": [Function],
"getDisplayNames": [Function],
"getListFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralRules": [Function],
"getRelativeTimeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"onError": [Function],
"onWarn": [Function],
"textComponent": "span",
"timeZone": "Etc/UTC",
}
type="text"
value=""
/>
</Settings>
}
onChange={[MockFunction]}
setByEnv={false}
value={Array []}
>
<Settings
helpText="Allows message text to link if it begins with any of the comma-separated URL schemes listed. By default, the following schemes will create links: \\"http\\", \\"https\\", \\"ftp\\", \\"tel\\", and \\"mailto\\"."
inputId="MySetting"
label="Custom URL Schemes:"
setByEnv={false}
>
<div
className="form-group"
data-testid="MySetting"
>
<label
className="control-label col-sm-4"
htmlFor="MySetting"
>
Custom URL Schemes:
</label>
<div
className="col-sm-8"
>
<input
className="form-control"
disabled={false}
id="MySetting"
onChange={[Function]}
placeholder="E.g.: \\"git,smtp\\""
type="text"
value=""
/>
<div
className="help-text"
data-testid="MySettinghelp-text"
>
Allows message text to link if it begins with any of the comma-separated URL schemes listed. By default, the following schemes will create links: "http", "https", "ftp", "tel", and "mailto".
</div>
</div>
</div>
</Settings>
</CustomURLSchemesSetting>
`;
exports[`components/AdminConsole/CustomUrlSchemeSetting initial state with one item 1`] = `
<Settings
helpText="Allows message text to link if it begins with any of the comma-separated URL schemes listed. By default, the following schemes will create links: \\"http\\", \\"https\\", \\"ftp\\", \\"tel\\", and \\"mailto\\"."
inputId="MySetting"
label="Custom URL Schemes:"
setByEnv={false}
>
<LocalizedInput
className="form-control"
disabled={false}
id="MySetting"
onChange={[Function]}
placeholder={
Object {
"defaultMessage": "E.g.: \\"git,smtp\\"",
"id": "admin.customization.customUrlSchemesPlaceholder",
}
<CustomURLSchemesSetting
disabled={false}
id="MySetting"
intl={
Object {
"$t": [Function],
"defaultFormats": Object {},
"defaultLocale": "en",
"defaultRichTextElements": undefined,
"fallbackOnEmptyString": true,
"formatDate": [Function],
"formatDateTimeRange": [Function],
"formatDateToParts": [Function],
"formatDisplayName": [Function],
"formatList": [Function],
"formatListToParts": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatNumberToParts": [Function],
"formatPlural": [Function],
"formatRelativeTime": [Function],
"formatTime": [Function],
"formatTimeToParts": [Function],
"formats": Object {},
"formatters": Object {
"getDateTimeFormat": [Function],
"getDisplayNames": [Function],
"getListFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralRules": [Function],
"getRelativeTimeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"onError": [Function],
"onWarn": [Function],
"textComponent": "span",
"timeZone": "Etc/UTC",
}
type="text"
value="git"
/>
</Settings>
}
onChange={[MockFunction]}
setByEnv={false}
value={
Array [
"git",
]
}
>
<Settings
helpText="Allows message text to link if it begins with any of the comma-separated URL schemes listed. By default, the following schemes will create links: \\"http\\", \\"https\\", \\"ftp\\", \\"tel\\", and \\"mailto\\"."
inputId="MySetting"
label="Custom URL Schemes:"
setByEnv={false}
>
<div
className="form-group"
data-testid="MySetting"
>
<label
className="control-label col-sm-4"
htmlFor="MySetting"
>
Custom URL Schemes:
</label>
<div
className="col-sm-8"
>
<input
className="form-control"
disabled={false}
id="MySetting"
onChange={[Function]}
placeholder="E.g.: \\"git,smtp\\""
type="text"
value="git"
/>
<div
className="help-text"
data-testid="MySettinghelp-text"
>
Allows message text to link if it begins with any of the comma-separated URL schemes listed. By default, the following schemes will create links: "http", "https", "ftp", "tel", and "mailto".
</div>
</div>
</div>
</Settings>
</CustomURLSchemesSetting>
`;
exports[`components/AdminConsole/CustomUrlSchemeSetting renders properly when disabled 1`] = `
<Settings
helpText="Allows message text to link if it begins with any of the comma-separated URL schemes listed. By default, the following schemes will create links: \\"http\\", \\"https\\", \\"ftp\\", \\"tel\\", and \\"mailto\\"."
inputId="MySetting"
label="Custom URL Schemes:"
setByEnv={false}
>
<LocalizedInput
className="form-control"
disabled={true}
id="MySetting"
onChange={[Function]}
placeholder={
Object {
"defaultMessage": "E.g.: \\"git,smtp\\"",
"id": "admin.customization.customUrlSchemesPlaceholder",
}
<CustomURLSchemesSetting
disabled={true}
id="MySetting"
intl={
Object {
"$t": [Function],
"defaultFormats": Object {},
"defaultLocale": "en",
"defaultRichTextElements": undefined,
"fallbackOnEmptyString": true,
"formatDate": [Function],
"formatDateTimeRange": [Function],
"formatDateToParts": [Function],
"formatDisplayName": [Function],
"formatList": [Function],
"formatListToParts": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatNumberToParts": [Function],
"formatPlural": [Function],
"formatRelativeTime": [Function],
"formatTime": [Function],
"formatTimeToParts": [Function],
"formats": Object {},
"formatters": Object {
"getDateTimeFormat": [Function],
"getDisplayNames": [Function],
"getListFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralRules": [Function],
"getRelativeTimeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"onError": [Function],
"onWarn": [Function],
"textComponent": "span",
"timeZone": "Etc/UTC",
}
type="text"
value="git,smtp"
/>
</Settings>
}
onChange={[MockFunction]}
setByEnv={false}
value={
Array [
"git",
"smtp",
]
}
>
<Settings
helpText="Allows message text to link if it begins with any of the comma-separated URL schemes listed. By default, the following schemes will create links: \\"http\\", \\"https\\", \\"ftp\\", \\"tel\\", and \\"mailto\\"."
inputId="MySetting"
label="Custom URL Schemes:"
setByEnv={false}
>
<div
className="form-group"
data-testid="MySetting"
>
<label
className="control-label col-sm-4"
htmlFor="MySetting"
>
Custom URL Schemes:
</label>
<div
className="col-sm-8"
>
<input
className="form-control"
disabled={true}
id="MySetting"
onChange={[Function]}
placeholder="E.g.: \\"git,smtp\\""
type="text"
value="git,smtp"
/>
<div
className="help-text"
data-testid="MySettinghelp-text"
>
Allows message text to link if it begins with any of the comma-separated URL schemes listed. By default, the following schemes will create links: "http", "https", "ftp", "tel", and "mailto".
</div>
</div>
</div>
</Settings>
</CustomURLSchemesSetting>
`;
exports[`components/AdminConsole/CustomUrlSchemeSetting renders properly when set by environment variable 1`] = `
<Settings
helpText="Allows message text to link if it begins with any of the comma-separated URL schemes listed. By default, the following schemes will create links: \\"http\\", \\"https\\", \\"ftp\\", \\"tel\\", and \\"mailto\\"."
inputId="MySetting"
label="Custom URL Schemes:"
setByEnv={true}
>
<LocalizedInput
className="form-control"
disabled={true}
id="MySetting"
onChange={[Function]}
placeholder={
Object {
"defaultMessage": "E.g.: \\"git,smtp\\"",
"id": "admin.customization.customUrlSchemesPlaceholder",
}
<CustomURLSchemesSetting
disabled={false}
id="MySetting"
intl={
Object {
"$t": [Function],
"defaultFormats": Object {},
"defaultLocale": "en",
"defaultRichTextElements": undefined,
"fallbackOnEmptyString": true,
"formatDate": [Function],
"formatDateTimeRange": [Function],
"formatDateToParts": [Function],
"formatDisplayName": [Function],
"formatList": [Function],
"formatListToParts": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatNumberToParts": [Function],
"formatPlural": [Function],
"formatRelativeTime": [Function],
"formatTime": [Function],
"formatTimeToParts": [Function],
"formats": Object {},
"formatters": Object {
"getDateTimeFormat": [Function],
"getDisplayNames": [Function],
"getListFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralRules": [Function],
"getRelativeTimeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"onError": [Function],
"onWarn": [Function],
"textComponent": "span",
"timeZone": "Etc/UTC",
}
type="text"
value="git,smtp"
/>
</Settings>
}
onChange={[MockFunction]}
setByEnv={true}
value={
Array [
"git",
"smtp",
]
}
>
<Settings
helpText="Allows message text to link if it begins with any of the comma-separated URL schemes listed. By default, the following schemes will create links: \\"http\\", \\"https\\", \\"ftp\\", \\"tel\\", and \\"mailto\\"."
inputId="MySetting"
label="Custom URL Schemes:"
setByEnv={true}
>
<div
className="form-group"
data-testid="MySetting"
>
<label
className="control-label col-sm-4"
htmlFor="MySetting"
>
Custom URL Schemes:
</label>
<div
className="col-sm-8"
>
<input
className="form-control"
disabled={true}
id="MySetting"
onChange={[Function]}
placeholder="E.g.: \\"git,smtp\\""
type="text"
value="git,smtp"
/>
<div
className="help-text"
data-testid="MySettinghelp-text"
>
Allows message text to link if it begins with any of the comma-separated URL schemes listed. By default, the following schemes will create links: "http", "https", "ftp", "tel", and "mailto".
</div>
<SetByEnv>
<div
className="alert alert-warning"
>
<FormattedMessage
defaultMessage="This setting has been set through an environment variable. It cannot be changed through the System Console."
id="admin.set_by_env"
>
<span>
This setting has been set through an environment variable. It cannot be changed through the System Console.
</span>
</FormattedMessage>
</div>
</SetByEnv>
</div>
</div>
</Settings>
</CustomURLSchemesSetting>
`;

34
webapp/channels/src/components/admin_console/custom_url_schemes_setting.test.tsx
Просмотреть файл

@@ -1,11 +1,11 @@
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import {shallow} from 'enzyme';
import React from 'react';
import CustomURLSchemesSetting from 'components/admin_console/custom_url_schemes_setting';
import LocalizedInput from 'components/localized_input/localized_input';
import {mountWithIntl} from 'tests/helpers/intl-test-helper';
describe('components/AdminConsole/CustomUrlSchemeSetting', () => {
const baseProps = {
@@ -23,7 +23,7 @@ describe('components/AdminConsole/CustomUrlSchemeSetting', () => {
value: [],
};
const wrapper = shallow(
const wrapper = mountWithIntl(
<CustomURLSchemesSetting {...props}/>,
);
expect(wrapper).toMatchSnapshot();
@@ -37,7 +37,7 @@ describe('components/AdminConsole/CustomUrlSchemeSetting', () => {
value: ['git'],
};
const wrapper = shallow(
const wrapper = mountWithIntl(
<CustomURLSchemesSetting {...props}/>,
);
expect(wrapper).toMatchSnapshot();
@@ -51,7 +51,7 @@ describe('components/AdminConsole/CustomUrlSchemeSetting', () => {
value: ['git', 'smtp', 'steam'],
};
const wrapper = shallow(
const wrapper = mountWithIntl(
<CustomURLSchemesSetting {...props}/>,
);
expect(wrapper).toMatchSnapshot();
@@ -67,11 +67,11 @@ describe('components/AdminConsole/CustomUrlSchemeSetting', () => {
onChange: jest.fn(),
};
const wrapper = shallow(
const wrapper = mountWithIntl(
<CustomURLSchemesSetting {...props}/>,
);
wrapper.find(LocalizedInput).simulate('change', {target: {value: ''}});
wrapper.find('input').simulate('change', {target: {value: ''}});
expect(props.onChange).toBeCalledWith(baseProps.id, []);
});
@@ -82,11 +82,11 @@ describe('components/AdminConsole/CustomUrlSchemeSetting', () => {
onChange: jest.fn(),
};
const wrapper = shallow(
const wrapper = mountWithIntl(
<CustomURLSchemesSetting {...props}/>,
);
wrapper.find(LocalizedInput).simulate('change', {target: {value: ' steam '}});
wrapper.find('input').simulate('change', {target: {value: ' steam '}});
expect(props.onChange).toBeCalledWith(baseProps.id, ['steam']);
});
@@ -97,11 +97,11 @@ describe('components/AdminConsole/CustomUrlSchemeSetting', () => {
onChange: jest.fn(),
};
const wrapper = shallow(
const wrapper = mountWithIntl(
<CustomURLSchemesSetting {...props}/>,
);
wrapper.find(LocalizedInput).simulate('change', {target: {value: 'steam, git'}});
wrapper.find('input').simulate('change', {target: {value: 'steam, git'}});
expect(props.onChange).toBeCalledWith(baseProps.id, ['steam', 'git']);
});
@@ -112,11 +112,11 @@ describe('components/AdminConsole/CustomUrlSchemeSetting', () => {
onChange: jest.fn(),
};
const wrapper = shallow(
const wrapper = mountWithIntl(
<CustomURLSchemesSetting {...props}/>,
);
wrapper.find(LocalizedInput).simulate('change', {target: {value: 'ts3server, smtp, ms-excel'}});
wrapper.find('input').simulate('change', {target: {value: 'ts3server, smtp, ms-excel'}});
expect(props.onChange).toBeCalledWith(baseProps.id, ['ts3server', 'smtp', 'ms-excel']);
});
@@ -127,11 +127,11 @@ describe('components/AdminConsole/CustomUrlSchemeSetting', () => {
onChange: jest.fn(),
};
const wrapper = shallow(
const wrapper = mountWithIntl(
<CustomURLSchemesSetting {...props}/>,
);
wrapper.find(LocalizedInput).simulate('change', {target: {value: ',,,,,chrome,,,,ms-excel,,'}});
wrapper.find('input').simulate('change', {target: {value: ',,,,,chrome,,,,ms-excel,,'}});
expect(props.onChange).toBeCalledWith(baseProps.id, ['chrome', 'ms-excel']);
});
@@ -143,7 +143,7 @@ describe('components/AdminConsole/CustomUrlSchemeSetting', () => {
disabled: true,
};
const wrapper = shallow(
const wrapper = mountWithIntl(
<CustomURLSchemesSetting {...props}/>,
);
expect(wrapper).toMatchSnapshot();
@@ -155,7 +155,7 @@ describe('components/AdminConsole/CustomUrlSchemeSetting', () => {
setByEnv: true,
};
const wrapper = shallow(
const wrapper = mountWithIntl(
<CustomURLSchemesSetting {...props}/>,
);
expect(wrapper).toMatchSnapshot();

42
webapp/channels/src/components/admin_console/custom_url_schemes_setting.tsx
Просмотреть файл

@@ -1,14 +1,9 @@
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import PropTypes from 'prop-types';
import React, {PureComponent} from 'react';
import type {ChangeEvent} from 'react';
import LocalizedInput from 'components/localized_input/localized_input';
import {t} from 'utils/i18n';
import * as Utils from 'utils/utils';
import {injectIntl, type IntlShape} from 'react-intl';
import Setting from './setting';
@@ -18,24 +13,15 @@ type Props = {
onChange: (id: string, valueAsArray: string[]) => void;
disabled: boolean;
setByEnv: boolean;
intl: IntlShape;
}
type State = {
value: string;
}
export default class CustomURLSchemesSetting extends
class CustomURLSchemesSetting extends
PureComponent<Props, State> {
static get propTypes() {
return {
id: PropTypes.string.isRequired,
value: PropTypes.array.isRequired,
onChange: PropTypes.func.isRequired,
disabled: PropTypes.bool,
setByEnv: PropTypes.bool.isRequired,
};
}
constructor(props: Props) {
super(props);
@@ -63,24 +49,24 @@ export default class CustomURLSchemesSetting extends
};
render() {
const label = Utils.localizeMessage('admin.customization.customUrlSchemes', 'Custom URL Schemes:');
const helpText = Utils.localizeMessage(
'admin.customization.customUrlSchemesDesc',
'Allows message text to link if it begins with any of the comma-separated URL schemes listed. By default, the following schemes will create links: "http", "https", "ftp", "tel", and "mailto".',
);
return (
<Setting
label={label}
helpText={helpText}
label={this.props.intl.formatMessage({
id: 'admin.customization.customUrlSchemes',
defaultMessage: 'Custom URL Schemes:',
})}
helpText={this.props.intl.formatMessage({
id: 'admin.customization.customUrlSchemesDesc',
defaultMessage: 'Allows message text to link if it begins with any of the comma-separated URL schemes listed. By default, the following schemes will create links: "http", "https", "ftp", "tel", and "mailto".',
})}
inputId={this.props.id}
setByEnv={this.props.setByEnv}
>
<LocalizedInput
<input
id={this.props.id}
className='form-control'
type='text'
placeholder={{id: t('admin.customization.customUrlSchemesPlaceholder'), defaultMessage: 'E.g.: "git,smtp"'}}
placeholder={this.props.intl.formatMessage({id: 'admin.customization.customUrlSchemesPlaceholder', defaultMessage: 'E.g.: "git,smtp"'})}
value={this.state.value}
onChange={this.handleChange}
disabled={this.props.disabled || this.props.setByEnv}
@@ -89,3 +75,5 @@ export default class CustomURLSchemesSetting extends
);
}
}
export default injectIntl(CustomURLSchemesSetting);