Merge branch 'next' into next-reply

css/base.css

@@ -392,6 +392,9 @@ div.trusted-badge {
 .blue {
   color: #2196f3!important; /* blue 500 */
 }
+.lt-blue {
+  color: #64b5f6!important; /* blue 300 */
+}
 
 .verified-color {
   color: #03A9F4!important; /* lt-blue 500 */

src/views/tinode-web.jsx

@@ -158,7 +158,7 @@ class TinodeWeb extends React.Component {
       // "On" is the default, so saving the "off" state.
       messageSounds: !settings.messageSoundsOff,
       incognitoMode: false,
-      desktopAlerts: persist && settings.desktopAlerts,
+      desktopAlerts: persist && !!settings.desktopAlerts,
       desktopAlertsEnabled: (isSecureConnection() || isLocalHost()) &&
         (typeof firebase != 'undefined') && (typeof navigator != 'undefined') &&
         (typeof FIREBASE_INIT != 'undefined'),
@@ -1017,9 +1017,14 @@ class TinodeWeb extends React.Component {
   }
 
   handleToggleIncognitoMode(on) {
+    // Make state undefined.
+    this.setState({incognitoMode: null});
+
     const me = this.tinode.getMeTopic();
     const am = me.getAccessMode().updateWant(on ? '-P' : '+P').getWant();
     me.setMeta({sub: {mode: am}}).catch((err) => {
+      // Request failed, keep existing state.
+      this.setState({incognitoMode: !on});
       this.handleError(err.message, 'err');
     });
   }
@@ -1080,6 +1085,7 @@ class TinodeWeb extends React.Component {
 
   togglePushToken(enabled) {
     if (enabled) {
+      this.setState({desktopAlerts: null});
       if (!this.state.firebaseToken) {
         const fcm = this.fbPush ?
           Promise.resolve() :

src/widgets/checkbox.jsx

@@ -15,9 +15,11 @@ export default class CheckBox extends React.PureComponent {
   render() {
     return (
       this.props.onChange ? (
-        this.props.checked ?
+        this.props.checked === true ?
           <i className="material-icons blue clickable" onClick={this.handleChange}>check_box</i> :
-          <i className="material-icons blue clickable" onClick={this.handleChange}>check_box_outline_blank</i>
+        this.props.checked === false ?
+          <i className="material-icons blue clickable" onClick={this.handleChange}>check_box_outline_blank</i> :
+          <i className="material-icons lt-blue">indeterminate_check_box</i>
         ) : (
           this.props.checked ?
             <i className="material-icons">check_box</i> :