merge next

src/widgets/contact.jsx

@@ -4,7 +4,6 @@ import { FormattedMessage, injectIntl } from 'react-intl';
 
 import ContactBadges from './contact-badges.jsx';
 import LetterTile from './letter-tile.jsx';
-import ReceivedMarker from './received-marker.jsx'
 import UnreadBadge from './unread-badge.jsx';
 
 import { Drafty } from 'tinode-sdk';
@@ -90,6 +89,7 @@ class Contact extends React.Component {
     const icon = deliveryMarker(this.props.received);
     const marker = icon ? <i className={'material-icons small space-right' +
       (icon.color ? ' ' + icon.color : '')}>{icon.name}</i> : null;
+    const titleClass = 'contact-title' + (this.props.deleted ? ' deleted' : '');
 
     return (
       <li className={!this.props.showCheckmark && this.props.selected ? 'selected' : null} onClick={this.handleClick}>
@@ -98,16 +98,19 @@ class Contact extends React.Component {
             tinode={this.props.tinode}
             avatar={avatar}
             title={this.props.title}
-            topic={this.props.item} />
-          {this.props.showOnline ? <span className={online} /> :
-            (this.props.showCheckmark && this.props.selected ?
+            topic={this.props.item}
+            deleted={this.props.deleted} />
+          {this.props.deleted ? <i className="deleted material-icons">cancel</i> :
+            this.props.showOnline ? <span className={online} /> :
+            (this.props.showCheckmark && this.props.selected) ?
             <i className="checkmark material-icons">check_circle</i>
-            : null)}
+            : null}
         </div>
         <div className="text-box">
-          <div><span className="contact-title">{title}</span>
+          <div><span className={titleClass}>{title}</span>
             {this.props.isChannel ? <img src="/img/channel.png" className="channel" alt="channel" /> : null}
-            <ContactBadges badges={icon_badges} /><UnreadBadge count={this.props.unread} />
+            <ContactBadges badges={icon_badges} />
+            {!this.props.deleted ? <UnreadBadge count={this.props.unread} /> : null}
           </div>
           {this.props.showMode ?
             <span><ContactBadges badges={badges} /></span> :