diff --git a/app/scenes/Settings/Profile.js b/app/scenes/Settings/Profile.js
index 7a24e14a..1d01a2a8 100644
--- a/app/scenes/Settings/Profile.js
+++ b/app/scenes/Settings/Profile.js
@@ -52,8 +52,13 @@ class Profile extends React.Component<Props> {
     this.name = ev.target.value;
   };
 
-  handleAvatarUpload = (avatarUrl: string) => {
+  handleAvatarUpload = async (avatarUrl: string) => {
     this.avatarUrl = avatarUrl;
+
+    await this.props.auth.updateUser({
+      avatarUrl: this.avatarUrl,
+    });
+    this.props.ui.showToast('Profile picture updated', 'success');
   };
 
   handleAvatarError = (error: ?string) => {
diff --git a/app/scenes/Settings/components/ImageUpload.js b/app/scenes/Settings/components/ImageUpload.js
index 386c4ea7..116fdd0a 100644
--- a/app/scenes/Settings/components/ImageUpload.js
+++ b/app/scenes/Settings/components/ImageUpload.js
@@ -38,8 +38,15 @@ class DropToImport extends React.Component<Props> {
     this.file = files[0];
   };
 
-  handleCrop = async () => {
+  handleCrop = () => {
     this.isUploading = true;
+
+    // allow the UI to update before converting the canvas to a Blob
+    // for large images this can cause the page rendering to hang.
+    setImmediate(this.uploadImage);
+  };
+
+  uploadImage = async () => {
     const canvas = this.avatarEditorRef.getImage();
     const imageBlob = dataUrlToBlob(canvas.toDataURL());
     try {
diff --git a/app/stores/AuthStore.js b/app/stores/AuthStore.js
index 418bad75..12526bfa 100644
--- a/app/stores/AuthStore.js
+++ b/app/stores/AuthStore.js
@@ -62,7 +62,7 @@ class AuthStore {
   };
 
   @action
-  updateUser = async (params: { name: string, avatarUrl: ?string }) => {
+  updateUser = async (params: { name?: string, avatarUrl: ?string }) => {
     this.isSaving = true;
 
     try {