From cbf5c5a748194fc633239c1b051e34141ebb16d7 Mon Sep 17 00:00:00 2001
From: pietervdvn <pietervdvn@posteo.net>
Date: Fri, 2 Sep 2022 12:39:40 +0200
Subject: [PATCH] Properly wire 'async' through the uploader

---
 Logic/ImageProviders/Imgur.ts         | 12 ++++++------
 Logic/ImageProviders/ImgurUploader.ts |  8 ++++----
 UI/Image/ImageUploadFlow.ts           | 13 +++++++------
 UI/SpecialVisualizations.ts           |  4 ++--
 4 files changed, 19 insertions(+), 18 deletions(-)

diff --git a/Logic/ImageProviders/Imgur.ts b/Logic/ImageProviders/Imgur.ts
index a290f66f0..836916072 100644
--- a/Logic/ImageProviders/Imgur.ts
+++ b/Logic/ImageProviders/Imgur.ts
@@ -17,7 +17,7 @@ export class Imgur extends ImageProvider {
 
     static uploadMultiple(
         title: string, description: string, blobs: FileList,
-        handleSuccessfullUpload: ((imageURL: string) => void),
+        handleSuccessfullUpload: ((imageURL: string) => Promise<void>),
         allDone: (() => void),
         onFail: ((reason: string) => void),
         offset: number = 0) {
@@ -29,8 +29,8 @@ export class Imgur extends ImageProvider {
         const blob = blobs.item(offset);
         const self = this;
         this.uploadImage(title, description, blob,
-            (imageUrl) => {
-                handleSuccessfullUpload(imageUrl);
+            async (imageUrl) => {
+                await handleSuccessfullUpload(imageUrl);
                 self.uploadMultiple(
                     title, description, blobs,
                     handleSuccessfullUpload,
@@ -45,7 +45,7 @@ export class Imgur extends ImageProvider {
     }
 
     static uploadImage(title: string, description: string, blob: File,
-                       handleSuccessfullUpload: ((imageURL: string) => void),
+                       handleSuccessfullUpload: ((imageURL: string) => Promise<void>),
                        onFail: (reason: string) => void) {
 
         const apiUrl = 'https://api.imgur.com/3/image';
@@ -74,9 +74,9 @@ export class Imgur extends ImageProvider {
         // Response contains stringified JSON
         // Image URL available at response.data.link
         // @ts-ignore
-        $.ajax(settings).done(function (response) {
+        $.ajax(settings).done(async function (response) {
             response = JSON.parse(response);
-            handleSuccessfullUpload(response.data.link);
+            await handleSuccessfullUpload(response.data.link);
         }).fail((reason) => {
             console.log("Uploading to IMGUR failed", reason);
             // @ts-ignore
diff --git a/Logic/ImageProviders/ImgurUploader.ts b/Logic/ImageProviders/ImgurUploader.ts
index 65cb8c9f0..0e98364fc 100644
--- a/Logic/ImageProviders/ImgurUploader.ts
+++ b/Logic/ImageProviders/ImgurUploader.ts
@@ -7,9 +7,9 @@ export default class ImgurUploader {
     public readonly failed: UIEventSource<string[]> = new UIEventSource<string[]>([]);
     public readonly success: UIEventSource<string[]> = new UIEventSource<string[]>([]);
     public maxFileSizeInMegabytes = 10;
-    private readonly _handleSuccessUrl: (string) => void;
+    private readonly _handleSuccessUrl: (string) => Promise<void>;
 
-    constructor(handleSuccessUrl: (string) => void) {
+    constructor(handleSuccessUrl: (string) => Promise<void>) {
         this._handleSuccessUrl = handleSuccessUrl;
     }
 
@@ -24,11 +24,11 @@ export default class ImgurUploader {
         Imgur.uploadMultiple(title,
             description,
             files,
-            function (url) {
+            async function (url) {
                 console.log("File saved at", url);
                 self.success.data.push(url)
                 self.success.ping();
-                self._handleSuccessUrl(url);
+                await self._handleSuccessUrl(url);
             },
             function () {
                 console.log("All uploads completed");
diff --git a/UI/Image/ImageUploadFlow.ts b/UI/Image/ImageUploadFlow.ts
index 1c4f49001..b459a3341 100644
--- a/UI/Image/ImageUploadFlow.ts
+++ b/UI/Image/ImageUploadFlow.ts
@@ -36,7 +36,7 @@ export class ImageUploadFlow extends Toggle {
             perId.set(id, new UIEventSource<number>(0))
         }
         const uploadedCount = perId.get(id)
-        const uploader = new ImgurUploader(url => {
+        const uploader = new ImgurUploader(async url => {
             // A file was uploaded - we add it to the tags of the object
 
             const tags = tagsSource.data
@@ -48,17 +48,18 @@ export class ImageUploadFlow extends Toggle {
                 }
                 key = imagePrefix + ":" + freeIndex;
             }
-            console.log("Adding image:" + key, url);
-            uploadedCount.data++
-            uploadedCount.ping()
-            Promise.resolve(state.changes
+ 
+           await state.changes
                 .applyAction(new ChangeTagAction(
                     tags.id, new Tag(key, url), tagsSource.data,
                     {
                         changeType: "add-image",
                         theme: state.layoutToUse.id
                     }
-                )))
+                ))
+            console.log("Adding image:" + key, url);
+            uploadedCount.data++
+            uploadedCount.ping()
         })
 
         const licensePicker = new LicensePicker(state)
diff --git a/UI/SpecialVisualizations.ts b/UI/SpecialVisualizations.ts
index 8602ba60d..d29511112 100644
--- a/UI/SpecialVisualizations.ts
+++ b/UI/SpecialVisualizations.ts
@@ -1062,9 +1062,9 @@ export default class SpecialVisualizations {
                         const t = Translations.t.notes;
                         const id = tags.data[args[0] ?? "id"]
 
-                        const uploader = new ImgurUploader(url => {
+                        const uploader = new ImgurUploader(async url => {
                             isUploading.setData(false)
-                            state.osmConnection.addCommentToNote(id, url)
+                            await state.osmConnection.addCommentToNote(id, url)
                             NoteCommentElement.addCommentTo(url, tags, state)
 
                         })