mirror of
https://github.com/mattermost/mattermost.git
synced 2025-02-25 18:55:24 -06:00
#24773 Converted ./components/emoji_picker/components/emoji_picker_header.tsx to Function Component (#24803)
* #24773 Converted ./components/emoji_picker/components/emoji_picker_header.tsx to Function Component * Fixed the lint errors and removed the explicit functional component type * Added memo to make the functional component pure.
This commit is contained in:
parent
654669aa00
commit
f86ec9da18
@ -9,30 +9,30 @@ type Props = {
|
|||||||
handleEmojiPickerClose: MouseEventHandler;
|
handleEmojiPickerClose: MouseEventHandler;
|
||||||
}
|
}
|
||||||
|
|
||||||
export default class EmojiPickerHeader extends React.PureComponent<Props> {
|
const EmojiPickerHeader = ({handleEmojiPickerClose}: Props) => {
|
||||||
render(): React.ReactNode {
|
return (
|
||||||
return (
|
<div className='emoji-picker__header modal-header'>
|
||||||
<div className='emoji-picker__header modal-header'>
|
<button
|
||||||
<button
|
type='button'
|
||||||
type='button'
|
className='close emoji-picker__header-close-button'
|
||||||
className='close emoji-picker__header-close-button'
|
onClick={handleEmojiPickerClose}
|
||||||
onClick={this.props.handleEmojiPickerClose}
|
>
|
||||||
>
|
<span aria-hidden='true'>{'×'}</span>
|
||||||
<span aria-hidden='true'>{'×'}</span>
|
<span className='sr-only'>
|
||||||
<span className='sr-only'>
|
|
||||||
<FormattedMessage
|
|
||||||
id={'emoji_picker.close'}
|
|
||||||
defaultMessage={'Close'}
|
|
||||||
/>
|
|
||||||
</span>
|
|
||||||
</button>
|
|
||||||
<h4 className='modal-title emoji-picker__header-title'>
|
|
||||||
<FormattedMessage
|
<FormattedMessage
|
||||||
id={'emoji_picker.header'}
|
id={'emoji_picker.close'}
|
||||||
defaultMessage={'Emoji Picker'}
|
defaultMessage={'Close'}
|
||||||
/>
|
/>
|
||||||
</h4>
|
</span>
|
||||||
</div>
|
</button>
|
||||||
);
|
<h4 className='modal-title emoji-picker__header-title'>
|
||||||
}
|
<FormattedMessage
|
||||||
}
|
id={'emoji_picker.header'}
|
||||||
|
defaultMessage={'Emoji Picker'}
|
||||||
|
/>
|
||||||
|
</h4>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default React.memo(EmojiPickerHeader);
|
||||||
|
Loading…
Reference in New Issue
Block a user