fix DB initialization and teardown, wrong upload parameters order

src/lib/blob-helpers.js

@@ -124,7 +124,7 @@ export function imageScaled(fileOrBlob, maxWidth, maxHeight, maxSize, forceSquar
     }
 
     canvas = null;
-    onSuccess(blob, mime, dim.dstWidth, dim.dstHeight, fileNameForMime(fileOrBlob.name, mime));
+    onSuccess(mime, blob, dim.dstWidth, dim.dstHeight, fileNameForMime(fileOrBlob.name, mime));
   };
   img.src = URL.createObjectURL(fileOrBlob);
 }

src/version.js

@@ -1,3 +1,3 @@
 // This is a generated file. Don't edit.
 
-export const PACKAGE_VERSION = "0.17.1";
+export const PACKAGE_VERSION = "0.17.2-alpha1";

src/views/login-view.jsx

@@ -15,7 +15,7 @@ export default class LoginView extends React.Component {
       login: props.login,
       password: '',
       hostName: props.serverAddress,
-      saveToken: LocalStorageUtil.getObject('keep-logged-in')
+      saveToken: props.persist
     };
     this.handleLoginChange = this.handleLoginChange.bind(this);
     this.handlePasswordChange = this.handlePasswordChange.bind(this);
@@ -32,7 +32,7 @@ export default class LoginView extends React.Component {
   }
 
   handleToggleSaveToken() {
-    LocalStorageUtil.setObject('keep-logged-in', !this.state.saveToken);
+    this.props.onPersistenceChange(!this.state.saveToken);
     this.setState({saveToken: !this.state.saveToken});
   }
 

src/views/sidepanel-view.jsx

@@ -91,14 +91,9 @@ class SidepanelView extends React.Component {
   constructor(props) {
     super(props);
 
-    this.handleLoginRequested = this.handleLoginRequested.bind(this);
     this.handleNewTopic = this.handleNewTopic.bind(this);
   }
 
-  handleLoginRequested(login, password) {
-    this.props.onLoginRequest(login, password);
-  }
-
   handleNewTopic() {
     this.props.onBasicNavigate('newtpk');
   }
@@ -146,7 +141,9 @@ class SidepanelView extends React.Component {
           <LoginView
             login={this.props.login}
             disabled={this.props.loginDisabled}
-            onLogin={this.handleLoginRequested} /> :
+            persist={this.props.persist}
+            onLogin={this.props.onLoginRequest}
+            onPersistenceChange={this.props.onPersistenceChange} /> :
 
           view === 'register' ?
           <CreateAccountView

src/views/tinode-web.jsx

@@ -79,6 +79,7 @@ class TinodeWeb extends React.Component {
     this.handleVisibilityEvent = this.handleVisibilityEvent.bind(this);
     this.handleError = this.handleError.bind(this);
     this.handleLoginRequest = this.handleLoginRequest.bind(this);
+    this.handlePersistenceChange = this.handlePersistenceChange.bind(this);
     this.handleConnected = this.handleConnected.bind(this);
     this.handleAutoreconnectIteration = this.handleAutoreconnectIteration.bind(this);
     this.doLogin = this.doLogin.bind(this);
@@ -175,6 +176,7 @@ class TinodeWeb extends React.Component {
 
       login: '',
       password: '',
+      persist: persist,
       myUserId: null,
       liveConnection: navigator.onLine,
       topicSelected: '',
@@ -226,11 +228,9 @@ class TinodeWeb extends React.Component {
       viewportHeight: document.documentElement.clientHeight
     });
 
-    const keepLoggedIn = LocalStorageUtil.getObject('keep-logged-in');
-
     new Promise((resolve, reject) => {
       this.tinode = TinodeWeb.tnSetup(this.state.serverAddress, this.state.transport,
-        this.props.intl.locale, keepLoggedIn, resolve);
+        this.props.intl.locale, this.state.persist, resolve);
       this.tinode.onConnect = this.handleConnected;
       this.tinode.onDisconnect = this.handleDisconnect;
       this.tinode.onAutoreconnectIteration = this.handleAutoreconnectIteration;
@@ -257,7 +257,7 @@ class TinodeWeb extends React.Component {
       // Read contacts from cache.
       this.resetContactList();
 
-      const token = keepLoggedIn ? LocalStorageUtil.getObject('auth-token') : undefined;
+      const token = this.state.persist ? LocalStorageUtil.getObject('auth-token') : undefined;
       if (token) {
         this.setState({autoLogin: true});
 
@@ -465,6 +465,23 @@ class TinodeWeb extends React.Component {
     }
   }
 
+  // Enable or disable saving the password and IndexedDB.
+  handlePersistenceChange(persist) {
+    if (persist) {
+      this.tinode.initStorage().then(() => {
+        console.log("storage initialized");
+        LocalStorageUtil.setObject('keep-logged-in', true);
+        this.setState({persist: true});
+      });
+    } else {
+      this.tinode.clearStorage().then(() => {
+        console.log("storage cleared");
+        LocalStorageUtil.setObject('keep-logged-in', false);
+        this.setState({persist: false});
+      });
+    }
+  }
+
   // Connection succeeded.
   handleConnected() {
     // Just to be sure.
@@ -1016,6 +1033,7 @@ class TinodeWeb extends React.Component {
       LocalStorageUtil.getObject('keep-logged-in'));
     this.tinode.onConnect = this.handleConnected;
     this.tinode.onDisconnect = this.handleDisconnect;
+    this.tinode.onAutoreconnectIteration = this.handleAutoreconnectIteration;
 
     this.setState({
       serverAddress: serverAddress,
@@ -1252,6 +1270,7 @@ class TinodeWeb extends React.Component {
       this.state.transport, this.props.intl.locale, LocalStorageUtil.getObject('keep-logged-in'));
     this.tinode.onConnect = this.handleConnected;
     this.tinode.onDisconnect = this.handleDisconnect;
+    this.tinode.onAutoreconnectIteration = this.handleAutoreconnectIteration;
     HashNavigation.navigateTo('');
   }
 
@@ -1517,6 +1536,7 @@ class TinodeWeb extends React.Component {
           title={this.state.sidePanelTitle}
           avatar={this.state.sidePanelAvatar}
           login={this.state.login}
+          persist={this.state.persist}
           myUserId={this.state.myUserId}
           loginDisabled={this.state.loginDisabled}
           loadSpinnerVisible={this.state.loadSpinnerVisible}
@@ -1544,6 +1564,7 @@ class TinodeWeb extends React.Component {
           onSettings={this.handleSettings}
           onBasicNavigate={this.basicNavigator}
           onLoginRequest={this.handleLoginRequest}
+          onPersistenceChange={this.handlePersistenceChange}
           onCreateAccount={this.handleNewAccountRequest}
           onUpdateAccount={this.handleUpdateAccountRequest}
           onUpdateAccountTags={this.handleUpdateAccountTagsRequest}

src/widgets/chat-message.jsx

@@ -204,6 +204,7 @@ function draftyFormatter(style, data, values, key) {
             if (attr.src) {
               attr.onClick = this.handleImagePreview;
               attr.className += ' image-clickable';
+              attr.loading = 'lazy';
             } else {
               attr.src = 'img/broken_image.png';
             }