support for channels

src/config.js

@@ -31,6 +31,8 @@ export const MAX_TAG_COUNT = 16;
 export const DEFAULT_P2P_ACCESS_MODE = 'JRWPS';
 // Access mode for new group topics created by the current user.
 export const NEW_GRP_ACCESS_MODE = 'JRWPSAO';
+// Access mode for a channel.
+export const CHANNEL_ACCESS_MODE = 'JR';
 
 // Access mode for no access.
 export const NO_ACCESS_MODE = 'N';

src/views/info-view.jsx

@@ -718,7 +718,7 @@ class InfoView extends React.Component {
                 null
               }
             </div>
-            {this.state.groupTopic ?
+            {this.state.groupTopic && this.state.sharer ?
               <>
                 <div className="hr" />
                 <div className="panel-form-column">
@@ -729,12 +729,10 @@ class InfoView extends React.Component {
                     </label>
                   </div>
                   <div className="panel-form-row">
-                    {this.state.sharer ?
-                      <a href="#" className="flat-button" onClick={this.handleShowAddMembers}>
-                        <i className="material-icons">person_add</i> &nbsp;<FormattedMessage id="button_add_members"
-                          defaultMessage="Add members" description="Flat button [Add members] (to topic)" />
-                      </a>
-                      : null}
+                    <a href="#" className="flat-button" onClick={this.handleShowAddMembers}>
+                      <i className="material-icons">person_add</i> &nbsp;<FormattedMessage id="button_add_members"
+                        defaultMessage="Add members" description="Flat button [Add members] (to topic)" />
+                    </a>
                   </div>
                   <FormattedMessage id="group_has_no_members" defaultMessage="No members"
                     description="Shown in place of group members">{

src/views/messages-view.jsx

@@ -152,9 +152,13 @@ class MessagesView extends React.Component {
 
       // Don't request the tags. They are useless unless the user
       // is the owner and is editing the topic.
-      let getQuery = topic.startMetaQuery().withLaterDesc().withLaterSub();
+      let getQuery = topic.startMetaQuery().withLaterDesc();
+      if (this.state.isSharer || (newTopic && !topic.isChannel())) {
+        // Request subscriptions only if one of S,O,A is given or it's a new non-channel topic.
+        getQuery = getQuery.withLaterSub();
+      }
       if (this.state.isReader || newTopic) {
-        // If reading is either permitted or we don't know because it's a new topic. Ask for messages.
+        // Reading is either permitted or we don't know because it's a new topic. Ask for messages.
         getQuery = getQuery.withLaterData(MESSAGES_PAGE);
         if (this.state.isReader) {
           getQuery = getQuery.withLaterDel();
@@ -284,6 +288,9 @@ class MessagesView extends React.Component {
       if (!nextProps.acs.isReader('given') != prevState.readingBlocked) {
         nextState.readingBlocked = !prevState.readingBlocked;
       }
+      if (nextProps.acs.isSharer() != prevState.isSharer) {
+        nextState.isSharer = !prevState.isSharer;
+      }
     } else {
       if (prevState.isWriter) {
         nextState.isWriter = false;
@@ -294,6 +301,9 @@ class MessagesView extends React.Component {
       if (!prevState.readingBlocked) {
         prevState.readingBlocked = true;
       }
+      if (prevState.isSharer) {
+        nextState.isSharer = false;
+      }
     }
 
     if (isUnconfirmed(nextProps.acs) == !prevState.unconformed) {
@@ -726,7 +736,8 @@ class MessagesView extends React.Component {
         );
       } else {
         const topic = this.props.tinode.getTopic(this.state.topic);
-        const groupTopic = topic.getType() == 'grp';
+        const isChannel = topic.isChannel();
+        const groupTopic = topic.getType() == 'grp' && !isChannel;
         let messageNodes = [];
         let previousFrom = null;
         let chatBoxClass = null;
@@ -735,32 +746,33 @@ class MessagesView extends React.Component {
           let nextFrom = null;
 
           if (i + 1 < this.state.messages.length) {
-            nextFrom = this.state.messages[i+1].from
+            nextFrom = this.state.messages[i+1].from || 'chan';
           }
 
           let sequence = 'single';
-          if (msg.from == previousFrom) {
-            if (msg.from == nextFrom) {
+          let thisFrom = msg.from || 'chan';
+          if (thisFrom == previousFrom) {
+            if (thisFrom == nextFrom) {
               sequence = 'middle';
             } else {
               sequence = 'last';
             }
-          } else if (msg.from == nextFrom) {
+          } else if (thisFrom == nextFrom) {
             sequence = 'first';
           }
-          previousFrom = msg.from;
+          previousFrom = thisFrom;
 
-          const isReply = !(msg.from == this.props.myUserId);
+          const isReply = !(thisFrom == this.props.myUserId);
           const deliveryStatus = topic.msgStatus(msg);
 
           let userName, userAvatar, userFrom;
           if (groupTopic) {
-            const user = topic.userDesc(msg.from);
+            const user = topic.userDesc(thisFrom);
             if (user && user.public) {
               userName = user.public.fn;
               userAvatar = makeImageUrl(user.public.photo);
             }
-            userFrom = msg.from;
+            userFrom = thisFrom;
             chatBoxClass='chat-box group';
           } else {
             chatBoxClass='chat-box';
@@ -811,7 +823,7 @@ class MessagesView extends React.Component {
                   avatar={avatar}
                   topic={this.state.topic}
                   title={this.state.title} />
-                <span className={online} />
+                {!isChannel ? <span className={online} /> : null}
               </div>
               <div id="topic-title-group">
                 <div id="topic-title" className="panel-title">{

src/widgets/contact-list.jsx

@@ -3,6 +3,8 @@
 import React from 'react';
 import { defineMessages, injectIntl } from 'react-intl';
 
+import Tinode from 'tinode-sdk';
+
 import Contact from './contact.jsx';
 import ContactAction from './contact-action.jsx';
 
@@ -55,6 +57,7 @@ class ContactList extends React.Component {
             }
           }
 
+          const isChannel = Tinode.isChannelTopicName(key);
           const selected = showCheckmark ?
             (this.props.topicSelected.indexOf(key) > -1) :
             (this.props.topicSelected === key);
@@ -82,7 +85,7 @@ class ContactList extends React.Component {
               badges={badges}
               showCheckmark={showCheckmark}
               selected={selected}
-              showOnline={this.props.showOnline}
+              showOnline={this.props.showOnline && !isChannel}
               onSelected={this.props.onTopicSelected}
               showContextMenu={this.props.showContextMenu}
               item={key}