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

[MM-54804] Convert ./components/post_emoji/post_emoji.tsx from Class Component to Function Component (#25080)

Browse Source 
* ISSUE-#24767 | Convert post_emoji.tsx from Class Component to Function Component

* lint fix

* resolve changes

* lint fix

* lint fix

---------

Co-authored-by: Mattermost Build <build@mattermost.com>
This commit is contained in:
Atharva Joshi 2023-11-07 15:21:53 +05:30 committed by GitHub
parent 7f457ffed3
commit f8f50ca882
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 20 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
webapp/channels/src/components/post_emoji/post_emoji.tsx
View File

@ -3,7 +3,7 @@
import React from 'react';
interface PostEmojiProps {
interface Props {
name: string;
imageUrl: string;
}
@ -13,23 +13,24 @@ declare module 'react' {
}
}
export default class PostEmoji extends React.PureComponent<PostEmojiProps> {
public render() {
const emojiText = ':' + this.props.name + ':';
const PostEmoji = ({name, imageUrl}: Props) => {
const emojiText = `:${name}:`;
const backgroundImageUrl = `url(${imageUrl})`;
if (!this.props.imageUrl) {
return emojiText;
}
return (
<span
alt={emojiText}
className='emoticon'
title={emojiText}
style={{backgroundImage: 'url(' + this.props.imageUrl + ')'}}
>
{emojiText}
</span>
);
if (!imageUrl) {
return <>{emojiText}</>;
}
}
return (
<span
alt={emojiText}
className='emoticon'
title={emojiText}
style={{backgroundImage: backgroundImageUrl}}
>
{emojiText}
</span>
);
};
export default React.memo(PostEmoji);