add alert for destructable actions

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(function(item) {
+    chips.map((item) => {
       index[item.user] = count;
       count ++;
     });
@@ -55,8 +55,8 @@ export default class ChipInput extends React.Component {
   static sortChips(chips, keep) {
     const required = [];
     const normal = [];
-    chips.map(function(item) {
-      if (keep.includes(item.user)) {
+    chips.map((item) => {
+      if (keep && keep.includes(item.user)) {
         required.push(item);
       } else {
         normal.push(item);
@@ -114,6 +114,7 @@ export default class ChipInput extends React.Component {
   render() {
     const chips = [];
     let count = 0;
+    const staticMembers = this.props.staticMembers || [];
     this.state.sortedChips.map((item) => {
       chips.push(
         <Chip
@@ -122,7 +123,7 @@ export default class ChipInput extends React.Component {
           title={item.public ? item.public.fn : undefined}
           noAvatar={this.props.avatarDisabled}
           topic={item.user}
-          required={this.props.staticMembers.includes(item.user)}
+          required={staticMembers.includes(item.user)}
           invalid={item.invalid}
           index={count}
           key={item.user} />

src/widgets/context-menu.jsx

@@ -277,7 +277,7 @@ class ContextMenu extends React.Component {
       return;
     }
     // Can't cancel. Delete instead.
-    let promise = all ?
+    const promise = all ?
       topic.delMessagesAll(hard) :
       topic.delMessagesList([params.seq], hard);
 
@@ -296,19 +296,7 @@ class ContextMenu extends React.Component {
       return;
     }
 
-    let am, user;
-    if (params.user) {
-      user = topic.subscriber(params.user);
-      if (!user) {
-        console.log("Subscriber not found", params.topicName + "[" + params.user + "]");
-        return;
-      }
-      am = user.acs.updateGiven(mode).getGiven();
-    } else {
-      am = topic.getAccessMode().updateWant(mode).getWant();
-    }
-
-    let result = topic.setMeta({sub: {user: params.user, mode: am}});
+    let result = topic.updateMode(params.user, mode);
     if (errorHandler) {
       result = result.catch((err) => {
         errorHandler(err.message, 'err');

src/widgets/error-panel.jsx

@@ -31,7 +31,7 @@ export default class ErrorPanel extends React.PureComponent {
   render() {
     const icons = {err: 'error', warn: 'warning', info: 'info'}
     const level = icons[this.props.level] || '';
-    const className = 'alert-box ' + level;
+    const className = 'info-box ' + level;
     return (
       <div className={className}>
         <div className="icon"><i className="material-icons">{level}</i></div>

src/widgets/permissions-editor.jsx

@@ -150,12 +150,12 @@ class PermissionsEditor extends React.Component {
         </tbody></table>
         <br />
         <div className="dialog-buttons">
+          <button className="outline" onClick={this.handleCancel}>
+            <FormattedMessage id="button_cancel" />
+          </button>
           <button className="blue" onClick={this.handleSubmit}>
             <FormattedMessage id="button_ok" />
           </button>
-          <button className="white" onClick={this.handleCancel}>
-            <FormattedMessage id="button_cancel" />
-          </button>
         </div>
       </div>
     );

src/widgets/tag-manager.jsx

@@ -121,13 +121,13 @@ export default class TagManager extends React.Component {
               filterFunc={this.handleTagInput} />
           }</FormattedMessage>
           {this.props.onSubmit || this.props.onCancel ?
-            <div id="tag-manager-buttons" className="panel-form-row">
+            <div id="tag-manager-buttons" className="dialog-buttons panel-form-row">
+              <button className="outline" onClick={this.handleCancel}>
+                <FormattedMessage id="button_cancel" defautMessage="Cancel" description="Rejection button [Cancel]" />
+              </button>
               <button className="blue" onClick={this.handleSubmit}>
                 <FormattedMessage id="button_ok" defautMessage="OK" description="Confirmation button [OK]" />
               </button>
-              <button className="white" onClick={this.handleCancel}>
-                <FormattedMessage id="button_cancel" defautMessage="Cancel" description="Rejection button [Cancel]" />
-              </button>
             </div>
           : null}
         </div>