1 files changed, 16 insertions, 29 deletions
diff --git a/vnext/src/components/Message.js b/vnext/src/components/Message.js
index c63c5750..f19888c2 100644
--- a/vnext/src/components/Message.js
+++ b/vnext/src/components/Message.js
@@ -14,6 +14,8 @@ import './Message.css';
 
 function Message({ data, visitor, children, ...rest }) {
     const isCode = (data.tags || []).indexOf('code') >= 0;
+    const likesSummary = data.likes ? `${data.likes}` : 'Recommend';
+    const commentsSummary = data.replies ? `${data.replies}` : 'Comment';
     return (
         <div className="msg-cont">
             <Recommendations forMessage={data} />
@@ -30,39 +32,40 @@ function Message({ data, visitor, children, ...rest }) {
                 </Avatar>
                 <TagsList user={data.user} data={data.tags || []} />
             </header>
-            <div className="msg-txt">
-                <MessageContainer isCode={isCode} data={{ __html: format(data.body, data.mid, isCode) }} />
-            </div>
-            {data.photo &&
+            {
+                data.body &&
+                <div className="msg-txt">
+                    <MessageContainer isCode={isCode} data={{ __html: format(data.body, data.mid, isCode) }} />
+                </div>
+            }            
+            {
+                data.photo &&
                 <p className="ir"><a href={`//i.juick.com/p/${data.mid}.${data.attach}`} data-fname={`${data.mid}.${data.attach}`}>
                     <img src={`//i.juick.com/photos-512/${data.mid}.${data.attach}`} alt="" /></a>
                 </p>
             }
-            <MessageSummary message={data} />
             <nav className="l">
                 {visitor.uid === data.user.uid ? (
-                    <Link to={{ pathname: `/${data.user.uname}/${data.mid}`}} className="a-like msg-button">
+                    <Link to={{ pathname: `/${data.user.uname}/${data.mid}` }} className="a-like msg-button">
                         <Icon name="ei-heart" size="s" />
-                        <span className="desktop">Recommend</span>
+                        <span>{likesSummary}</span>
                     </Link>
                 ) : visitor.uid > 0 ? (
                     <Link to={{ pathname: '/post', search: `?body=!+%23${data.mid}` }} className="a-like msg-button">
                         <Icon name="ei-heart" size="s" />
-                        <span className="desktop">Recommend</span>
+                        <span>{likesSummary}</span>
                     </Link>
                 ) : (
                             <a href="/login" className="a-login msg-button">
-                                <span className="msg-button-icon">
-                                    <Icon name="ei-heart" size="s" />
-                                </span>
-                                <span className="desktop">Recommend</span>
+                                <Icon name="ei-heart" size="s" />
+                                <span>{likesSummary}</span>
                             </a>
                         )}
                 {!data.ReadOnly | (visitor.uid === data.user.uid) && (
                     <>
                         <Link to={{ pathname: `/${data.user.uname}/${data.mid}`, state: { msg: data } }} className="a-comment msg-button">
                             <Icon name="ei-comment" size="s" />
-                            <span className="desktop">Comment</span>
+                            <span>{ commentsSummary }</span>
                         </Link>
                     </>
                 )}
@@ -110,22 +113,6 @@ function Recommends({ forMessage, ...rest }) {
 
 const Recommendations = React.memo(Recommends);
 
-function Summary({ message }) {
-    let likes = message.likes && `Recommended: ${message.likes}`;
-    let comments = message.replies && `Comments: ${message.replies}`;
-    return (
-        <div className="msg-summary">
-            {[likes, comments].filter(Boolean).join(' ')}
-        </div>
-    );
-}
-
-Summary.propTypes = {
-    message: MessageType.isRequired
-};
-
-const MessageSummary = React.memo(Summary);
-
 Message.propTypes = {
     data: MessageType,
     visitor: UserType.isRequired,