aboutsummaryrefslogtreecommitdiff
path: root/vnext/src/components
diff options
context:
space:
mode:
authorGravatar Vitaly Takmazov2019-02-21 00:20:21 +0300
committerGravatar Vitaly Takmazov2023-01-13 10:37:54 +0300
commitd01d3369318b79f4f38820ef8c48344a6b082aff (patch)
tree3ec47c71215ff8e514646c5bb695cbc5df286403 /vnext/src/components
parente39818079a05cdd7cfc4744e972ce87105e1ff87 (diff)
More pure components
Diffstat (limited to 'vnext/src/components')
-rw-r--r--vnext/src/components/Message.js14
-rw-r--r--vnext/src/components/NavigationIcon.js4
-rw-r--r--vnext/src/components/PM.js4
-rw-r--r--vnext/src/components/Spinner.js4
4 files changed, 17 insertions, 9 deletions
diff --git a/vnext/src/components/Message.js b/vnext/src/components/Message.js
index 032504c3..6afb8d96 100644
--- a/vnext/src/components/Message.js
+++ b/vnext/src/components/Message.js
@@ -11,7 +11,7 @@ import { format } from '../utils/embed';
import './Message.css';
-const Message = React.memo(({ data, visitor, children, ...rest }) => {
+function Message({ data, visitor, children, ...rest }) {
return (
<div className="msg-cont">
<header className="h">
@@ -25,7 +25,7 @@ const Message = React.memo(({ data, visitor, children, ...rest }) => {
</Link>
</div>
</Avatar>
- <Tags user={data.user} data={data.tags || []} />
+ <TagsList user={data.user} data={data.tags || []} />
</header>
<div className="msg-txt">
<p dangerouslySetInnerHTML={{ __html: format(data.body, data.mid, (data.tags || []).indexOf('code') >= 0) }}></p>
@@ -82,11 +82,11 @@ const Message = React.memo(({ data, visitor, children, ...rest }) => {
{children}
</div>
);
-});
+}
-export default Message;
+export default React.memo(Message);
-const Tags = React.memo(({ data, user, ...rest }) => {
+function Tags({ data, user, ...rest }) {
return data.length > 0 && (
<div className="msg-tags">
{
@@ -96,7 +96,9 @@ const Tags = React.memo(({ data, user, ...rest }) => {
}
</div>
);
-});
+}
+
+const TagsList = React.memo(Tags);
Message.propTypes = {
data: MessageType,
diff --git a/vnext/src/components/NavigationIcon.js b/vnext/src/components/NavigationIcon.js
index 5c5415ef..0a22ac57 100644
--- a/vnext/src/components/NavigationIcon.js
+++ b/vnext/src/components/NavigationIcon.js
@@ -5,7 +5,7 @@ import Icon from './Icon';
import './NavigationIcon.css';
-export default function NavigationIcon(props) {
+function NavigationIcon(props) {
return (
<div id="navicon" className="mobile" onClick={props.onToggle}>
<Icon name="ei-navicon" size="s"/>
@@ -13,6 +13,8 @@ export default function NavigationIcon(props) {
);
}
+export default React.memo(NavigationIcon);
+
NavigationIcon.propTypes = {
onToggle: PropTypes.func.isRequired
};
diff --git a/vnext/src/components/PM.js b/vnext/src/components/PM.js
index 6b8c053b..a1e70ad5 100644
--- a/vnext/src/components/PM.js
+++ b/vnext/src/components/PM.js
@@ -5,7 +5,7 @@ import { UserType, MessageType } from './Types';
import Avatar from './Avatar';
import { format } from '../utils/embed';
-export default function PM(props) {
+function PM(props) {
const { chat } = props;
return (
<li>
@@ -19,6 +19,8 @@ export default function PM(props) {
);
}
+export default React.memo(PM);
+
function bubbleStyle(me, msg) {
const isMe = me.uid === msg.user.uid;
const color = isMe ? '#fff' : '#222';
diff --git a/vnext/src/components/Spinner.js b/vnext/src/components/Spinner.js
index fffa2c80..c1d42db4 100644
--- a/vnext/src/components/Spinner.js
+++ b/vnext/src/components/Spinner.js
@@ -1,7 +1,7 @@
import React from 'react';
import ContentLoader from 'react-content-loader';
-export default function Spinner(props) {
+function Spinner(props) {
return (
<div className="msg-cont">
<ContentLoader
@@ -21,6 +21,8 @@ export default function Spinner(props) {
);
}
+export default React.memo(Spinner);
+
export function ChatSpinner(props) {
return (
<ContentLoader