clearing messages works now

css/base.css

@@ -152,6 +152,7 @@ input[type="password"]:focus {
   border-bottom: 1px solid #2196f3;
   box-shadow: 0 1px 0 rgba(33, 150, 243, 0.25);
 }
+
 /* Scrollbar styling for Chrome. Firefox does not support scrollbar styling.  */
 ::-webkit-scrollbar {
 	width: 0.6rem;
@@ -262,6 +263,17 @@ ul.menu > li.separator:hover {
   }
 }
 
+/* Generic announcement text, centered vertically and horizontally */
+.center-medium-text {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+  font-size: 1.4rem;
+}
+
 /* Class to alternatively hide sidepanel/topic-view */
 .nodisplay {
   display: none!important;
@@ -427,7 +439,7 @@ ul.menu > li.separator:hover {
   background-color: #4caf50;
 }
 .contact-box .offline {
-  background-color: #888;
+  background-color: #C0C0C0;
 }
 /* END of avatar box */
 

index.html

@@ -168,7 +168,9 @@
             console.log("Topic editing not implemented");
             break;
           case "Clear messages":
-            topic.delMessages({before: 0, hard: false});
+            topic.delMessagesAll(false).then(function(){
+              console.log("refresh message list");
+            });
             break;
           case "Mute":
             metaParam('-P');
@@ -177,10 +179,10 @@
             metaParam('+P');
             break;
           case "Block":
-            metaParam('+X');
+            metaParam('-J');
             break;
           case "Unblock":
-            metaParam('-X');
+            metaParam('+J');
             break;
           case "Delete":
             topic.delTopic();
@@ -192,10 +194,10 @@
         var acs = Tinode.getMeTopic().getAccessMode(this.props.topic);
         if (Tinode.getTopicType(this.props.topic) === "grp") {
           return ["Edit...", "Clear messages", acs.isMuted() ? "Unmute" : "Mute",
-            acs.isBanned() ? "Unblock" : "Block", "Delete"];
+            !acs.isJoiner() ? "Unblock" : "Block", "Delete"];
         } else {
           return ["Clear messages", acs.isMuted() ? "Unmute" : "Mute",
-            acs.isBanned() ? "Unblock" : "Block", "Delete"];
+            !acs.isJoiner() ? "Unblock" : "Block", "Delete"];
         }
       }
     };
@@ -684,6 +686,7 @@
           title = title.substring(0, 28) + "...";
         }
         var selected = (this.props.selected === this.props.topic) ? "selected" : null;
+        var online = this.props.now ? "online" : "offline";
         var avatar = this.props.avatar ?
               <img src={this.props.avatar} className="avatar" /> :
               (Tinode.getTopicType(this.props.topic) === "grp") ?
@@ -693,7 +696,7 @@
           <li className={selected} onClick={this.handleClick}>
             <div className="avatar-box">
               {avatar}
-                {this.props.now ? <span className="online"></span> : null}
+              <span className={online} />
             </div>
             <div className="text-box">
               <div><span className="contact-title">{title}</span>
@@ -807,9 +810,14 @@
 
         return (
           <div className="contacts-panel">
+            {contactNodes.length > 0 ?
               <ul className="contact-box">
                 {contactNodes}
               </ul>
+              :
+              <p className="center-medium-text">
+                You have no chats<br />¯\_(ツ)_/¯
+              </p>}
           </div>
         );
       }
@@ -830,7 +838,7 @@
         fnd.onSubsUpdated = this.fndSubsUpdated;
         fnd.onMetaDesc = this.fndMetaDesc;
         if (fnd.isSubscribed()) {
-          this.setState({searchQuery: fnd.private.toString()});
+          this.setState({searchQuery: fnd.private ? fnd.private.toString() : ''});
         } else {
           fnd.subscribe({get: {sub: {}, desc: {}}});
         }
@@ -1168,13 +1176,23 @@
         console.log("topic subscriptions updated");
       },
       handleNewMessage: function(msg) {
+        clearTimeout(this.readTimer);
+        if (msg) {
           this.setState({messages: this.state.messages.concat(msg)});
           // Aknowledge all messages, including own messges.
-        clearTimeout(this.readTimer);
           this.readTimer = setTimeout(function() {
             Tinode.getTopic(msg.topic).noteRead(msg.seq);
           }, READ_DELAY);
           this.props.onData(msg);
+        } else {
+          // msg could be null if one or more messages were deleted.
+          // Just regenerate the message list;
+          var _messages = [];
+          Tinode.getTopic(this.state.topic).messages(function(m) {
+            _messages.concat(m);
+          });
+          this.setState({messages: _messages});
+        }
       },
       handleInfoReceipt: function(info) {
         switch (info.what) {
@@ -1462,20 +1480,27 @@
         }
 
         if (promise) {
-          this.setState({errorText: ''});
           promise.then(function() {
+            instance.handleLoginSuccessful(instance);
+          })
+          .catch(function(err) {
+            // Login failed, report error
+            instance.setState({loginDisabled: false, errorText: err.message});
+          });
+        }
+      },
+
+      handleLoginSuccessful: function(instance) {
+        instance.setState({errorText: ''});
+
         // Logged in fine, subscribe to 'me' attaching callbacks from the contacts view.
         var me = Tinode.getMeTopic();
         me.onMetaDesc = instance.tnMeMetaDesc;
         instance.setState({sidePanelSelected: "contacts", loggedIn: true});
         // Subscribe, fetch topic desc, the list of subscriptions, and messages (invites).
         me.subscribe({get: {desc: {}, sub: {}, data: {}}});
-          }).catch(function(err) {
-            // Login failed, report error
-            instance.setState({loginDisabled: false, errorText: err.message});
-          });
-        }
       },
+
       handleDisconnect: function(err) {
         this.setState({
           sidePanelSelected: 'login',
@@ -1535,10 +1560,15 @@
       // Actual registration of a new account.
       handleNewAccountRequest: function(login_, password_, public_, private_) {
         var instance = this;
-        Tinode.connect(this.state.serverAddress).then(function() {
+        Tinode.connect(this.state.serverAddress)
+          .then(function() {
             return Tinode.createUserBasic(login_, password_,
               {login: "basic", public: public_, private: private_});
-        }).catch(function(err) {
+          })
+          .then(function() {
+            instance.handleLoginSuccessful(instance);
+          })
+          .catch(function(err) {
             instance.setState({errorText: err.message});
           });
       },