widget for showing pinned messages (wip)

src/widgets/badge-list.jsx

@@ -29,7 +29,7 @@ class BadgeList extends React.PureComponent {
     let badges = null;
     if (this.props.trustedBadges && this.props.trustedBadges.length > 0) {
       badges = [];
-      this.props.trustedBadges.map((b) => {
+      this.props.trustedBadges.forEach(b => {
         const comment = this.props.short ? null : formatMessage(messages['badge_' + b]);
         const style = 'material-icons ' + b + '-color';
         badges.push(<div className="trusted-badge" key={b}><i className={style}>{icon_mapping[b] || b}</i> {comment}</div>);

src/widgets/chat-message.jsx

@@ -114,7 +114,7 @@ class BaseChatMessage extends React.PureComponent {
         }
       }
       if (this.props.userIsAdmin) {
-        menuItems.push('menu_item_pin');
+        menuItems.push(this.props.pinned ? 'menu_item_unpin' : 'menu_item_pin');
       }
     }
     menuItems.push('menu_item_forward');

src/widgets/chip-input.jsx

@@ -44,7 +44,7 @@ export default class ChipInput extends React.Component {
   static indexChips(chips) {
     const index = {};
     let count = 0;
-    chips.map((item) => {
+    chips.forEach(item => {
       index[item.user] = count;
       count ++;
     });
@@ -55,7 +55,7 @@ export default class ChipInput extends React.Component {
   static sortChips(chips, keep) {
     const required = [];
     const normal = [];
-    chips.map((item) => {
+    chips.forEach(item => {
       if (keep && keep.includes(item.user)) {
         required.push(item);
       } else {
@@ -115,7 +115,7 @@ export default class ChipInput extends React.Component {
     const chips = [];
     let count = 0;
     const staticMembers = this.props.staticMembers || [];
-    this.state.sortedChips.map((item) => {
+    this.state.sortedChips.forEach(item => {
       chips.push(
         <Chip
           tinode={this.props.tinode}

src/widgets/contact-badges.jsx

@@ -8,7 +8,7 @@ export default class ContactBadges extends React.PureComponent {
     let badges = null;
     if (this.props.badges && this.props.badges.length > 0) {
       badges = [];
-      this.props.badges.map((b) => {
+      this.props.badges.forEach(b => {
         const color = (b.color ? ' ' + b.color : '');
         if (b.icon) {
           badges.push(<i className={'material-icons as-badge' + color} key={b.key || b.icon}>{icon_mapping[b.icon] || b.icon}</i>);

src/widgets/contact-list.jsx

@@ -32,7 +32,7 @@ class ContactList extends React.Component {
     const contactNodes = [];
     let contactsCount = 0;
     if (this.props.contacts && this.props.contacts.length > 0) {
-      this.props.contacts.map((c) => {
+      this.props.contacts.forEach(c => {
         if (c.action) {
           // Action item
           contactNodes.push(

src/widgets/context-menu.jsx

@@ -458,29 +458,8 @@ class ContextMenu extends React.Component {
     if (!topic) {
       return;
     }
-
-    let pinned = topic.aux('pins');
-    console.log("topic.aux[pins]=", pinned);
-    if (!Array.isArray(pinned)) {
-      pinned = [];
-    }
-    let changed = false;
-    if (pin) {
-      if (!pinned.includes(params.seq)) {
-        changed = true;
-        pinned.push(params.seq);
-      }
-    } else {
-      if (pinned.includes(params.seq)) {
-        changed = true;
-        pinned = pinned.filter(seq => seq != params.seq)
-      }
-    }
-    if (changed) {
-      console.log("sending pins=", pinned);
-      topic.setMeta({aux: {pins: pinned}})
-        .catch(err => errorHandler ? errorHandler(err.message, 'err') : null);
-    }
+    topic.pinMessage(params.seq, pin)
+      .catch(err => errorHandler ? errorHandler(err.message, 'err') : null);
   }
 
   // Function is used by context menu to set permissions.
@@ -509,7 +488,7 @@ class ContextMenu extends React.Component {
   render() {
     const menu = [];
     let count = 0;
-    this.props.items.map((item) => {
+    this.props.items.forEach(item => {
       if (typeof item == 'string') {
         item = this.MenuItems[item];
       }

src/widgets/group-manager.jsx

@@ -41,7 +41,7 @@ class GroupManager extends React.Component {
 
   static indexMembers(members) {
     let index = {};
-    members.map((m) => {
+    members.forEach(m => {
       index[m.user] = {delta: 0, present: true}; // Delta: 0 unchanged, +1 added, -1 removed
     });
     return index;
@@ -49,7 +49,7 @@ class GroupManager extends React.Component {
 
   static staticMembers(members, keepInitial, requiredMember) {
     let stat = [];
-    members.map((m) => {
+    members.forEach(m => {
       if (keepInitial || m.user == requiredMember) {
         stat.push(m.user);
       }
@@ -59,7 +59,7 @@ class GroupManager extends React.Component {
 
   static selectedContacts(members) {
     let sel = [];
-    members.map((m) => {
+    members.forEach(m => {
       sel.push(m.user);
     });
     return sel;
@@ -130,20 +130,19 @@ class GroupManager extends React.Component {
   }
 
   handleSubmit() {
-    var instance = this;
-    var members = [];
-    var added = [];
-    var removed = [];
+    const members = [];
+    const added = [];
+    const removed = [];
 
-    var keys = Object.keys(this.state.index);
-    keys.map(function(k) {
-      if (instance.state.index[k].present) {
+    const keys = Object.keys(this.state.index);
+    keys.forEach(k => {
+      if (this.state.index[k].present) {
         members.push(k);
       }
 
-      if (instance.state.index[k].delta > 0) {
+      if (this.state.index[k].delta > 0) {
         added.push(k);
-      } else if (instance.state.index[k].delta < 0) {
+      } else if (this.state.index[k].delta < 0) {
         removed.push(k);
       }
     });
@@ -155,7 +154,6 @@ class GroupManager extends React.Component {
   }
 
   render() {
-    const {formatMessage} = this.props.intl;
     return (
       <div id="group-manager">
         <div className="panel-form-row">

src/widgets/group-subs.jsx

@@ -30,7 +30,9 @@ export default class GroupSubs extends React.Component {
       );
       return usersOnline.length == countToShow;
     });
-
+    if (usersOnline.length == 0) {
+      return null;
+    }
     return (
       <div id="topic-users">{usersOnline} {totalCount > countToShow ?
         <span>

src/widgets/host-selector.jsx

@@ -36,7 +36,7 @@ export default class HostSelector extends React.PureComponent {
   }
 
   render() {
-    var hostOptions = [];
+    const hostOptions = [];
     for (let key in KNOWN_HOSTS) {
       let item = KNOWN_HOSTS[key];
       hostOptions.push(

src/widgets/side-navbar.jsx

@@ -12,7 +12,7 @@ export default class SideNavbar extends React.PureComponent {
   render() {
     const icon_badges = [];
     if (this.props.trustedBadges) {
-      this.props.trustedBadges.map((b) => {
+      this.props.trustedBadges.forEach(b => {
         icon_badges.push({icon: b, color: 'badge-inv'});
       });
     }

src/widgets/tag-manager.jsx

@@ -92,11 +92,11 @@ export default class TagManager extends React.Component {
 
     let tags = [];
     if (this.state.activated) {
-      this.state.tags.map((tag) => {
+      this.state.tags.forEach(tag => {
         tags.push({user: tag, invalid: (tag.length < minTagLength || tag.length > maxTagLength)});
       });
     } else {
-      this.state.tags.map((tag) => {
+      this.state.tags.forEach(tag => {
         tags.push(<span className="badge" key={tags.length}>{tag}</span>);
       });
       if (tags.length == 0) {