[MM-61685]: Add described by prop to notifications settings (#29813)
* MM-61685: Add described by prop to notifications settings * MM-61685: Fixed issue related to aria-described being overritten internally * MM-61685: Moved Input component outside NotificationTab class component * MM-61685: Fixed failing CI --------- Co-authored-by: ayush-chauhan233 <ankur@brightscout.com> Co-authored-by: ayush-chauhan233 <ayush.chauhan@brightscout.com> Co-authored-by: Mattermost Build <build@mattermost.com>
Этот коммит содержится в:
коммит произвёл
GitHub
родитель
2cb8d65522
Коммит
268b921913
@@ -7,7 +7,8 @@ import React from 'react';
|
|||||||
import type {ChangeEvent} from 'react';
|
import type {ChangeEvent} from 'react';
|
||||||
import type {WrappedComponentProps} from 'react-intl';
|
import type {WrappedComponentProps} from 'react-intl';
|
||||||
import {FormattedMessage, injectIntl} from 'react-intl';
|
import {FormattedMessage, injectIntl} from 'react-intl';
|
||||||
import type {OnChangeValue, StylesConfig} from 'react-select';
|
import type {InputProps, OnChangeValue, StylesConfig} from 'react-select';
|
||||||
|
import {components} from 'react-select';
|
||||||
import CreatableReactSelect from 'react-select/creatable';
|
import CreatableReactSelect from 'react-select/creatable';
|
||||||
|
|
||||||
import {LightbulbOutlineIcon} from '@mattermost/compass-icons/components';
|
import {LightbulbOutlineIcon} from '@mattermost/compass-icons/components';
|
||||||
@@ -227,6 +228,19 @@ function getDefaultStateFromProps(props: Props): State {
|
|||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const Input = (props: InputProps<MultiInputValue, true>) => {
|
||||||
|
const ariaProps = {
|
||||||
|
'aria-labelledby': 'settingTitle',
|
||||||
|
'aria-describedby': 'extraInfo',
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<components.Input
|
||||||
|
{...props}
|
||||||
|
{...ariaProps}
|
||||||
|
/>);
|
||||||
|
};
|
||||||
|
|
||||||
class NotificationsTab extends React.PureComponent<Props, State> {
|
class NotificationsTab extends React.PureComponent<Props, State> {
|
||||||
static defaultProps = {
|
static defaultProps = {
|
||||||
activeSection: '',
|
activeSection: '',
|
||||||
@@ -596,8 +610,8 @@ class NotificationsTab extends React.PureComponent<Props, State> {
|
|||||||
DropdownIndicator: () => null,
|
DropdownIndicator: () => null,
|
||||||
Menu: () => null,
|
Menu: () => null,
|
||||||
MenuList: () => null,
|
MenuList: () => null,
|
||||||
|
Input,
|
||||||
}}
|
}}
|
||||||
aria-labelledby='notificationTriggerCustom'
|
|
||||||
onChange={this.handleChangeForCustomKeysWithNotificationInput}
|
onChange={this.handleChangeForCustomKeysWithNotificationInput}
|
||||||
value={this.state.customKeysWithNotification}
|
value={this.state.customKeysWithNotification}
|
||||||
inputValue={this.state.customKeysWithNotificationInputValue}
|
inputValue={this.state.customKeysWithNotificationInputValue}
|
||||||
|
|||||||
Ссылка в новой задаче
Block a user