IntenseWebs/mattermost
3
0
Fork 0
mirror of https://github.com/mattermost/mattermost.git synced 2025-02-25 18:55:24 -06:00
Code Issues Packages Projects Releases Wiki Activity

Migrate ./components/widgets/icons/fa_warning_icon.tsx from Class Component to Function Component (#25644)

Browse Source 
* chore: migrate fa_warning_icon to functional component

* test: updated snapshots

* removed injectIntl funtion call

* test: updated snapshots
This commit is contained in:
Aditi Patel
2023-12-13 09:16:02 -06:00
committed by GitHub
parent f8d191b7cb
commit 440039ba98
2 changed files with 23 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

108
webapp/channels/src/components/admin_console/request_button/__snapshots__/request_button.test.tsx.snap
View File

@@ -115,54 +115,12 @@ exports[`components/admin_console/request_button/request_button.jsx should match
<div
className="alert alert-warning"
>
<injectIntl(WarningIcon)>
<WarningIcon
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",
"wrapRichTextChunksInFragment": undefined,
}
}
>
<i
className="fa fa-warning"
title="Warning Icon"
/>
</WarningIcon>
</injectIntl(WarningIcon)>
<Memo(WarningIcon)>
<i
className="fa fa-warning"
title="Warning Icon"
/>
</Memo(WarningIcon)>
<FormattedMessage
defaultMessage="Error Message: {error}"
id="error.message"
@@ -282,54 +240,12 @@ exports[`components/admin_console/request_button/request_button.jsx should match
<div
className="alert alert-warning"
>
<injectIntl(WarningIcon)>
<WarningIcon
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",
"wrapRichTextChunksInFragment": undefined,
}
}
>
<i
className="fa fa-warning"
title="Warning Icon"
/>
</WarningIcon>
</injectIntl(WarningIcon)>
<Memo(WarningIcon)>
<i
className="fa fa-warning"
title="Warning Icon"
/>
</Memo(WarningIcon)>
<FormattedMessage
defaultMessage="Error Message: {error}"
id="error.message"

24
webapp/channels/src/components/widgets/icons/fa_warning_icon.tsx
View File

@@ -3,22 +3,20 @@
import classNames from 'classnames';
import React from 'react';
import {injectIntl, type IntlShape} from 'react-intl';
import {useIntl} from 'react-intl';
type Props = {
additionalClassName?: string;
intl: IntlShape;
}
class WarningIcon extends React.PureComponent<Props> {
public render(): JSX.Element {
return (
<i
className={classNames('fa fa-warning', this.props.additionalClassName)}
title={this.props.intl.formatMessage({id: 'generic_icons.warning', defaultMessage: 'Warning Icon'})}
/>
);
}
}
const WarningIcon = ({additionalClassName}: Props) => {
const {formatMessage} = useIntl();
return (
<i
className={classNames('fa fa-warning', additionalClassName)}
title={formatMessage({id: 'generic_icons.warning', defaultMessage: 'Warning Icon'})}
/>
);
};
export default injectIntl(WarningIcon);
export default React.memo(WarningIcon);