From cf8a6a042e7c59793cc3cd1131584ed1c4724328 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Cl=C3=A9ment=20Renault?= <clement@meilisearch.com>
Date: Mon, 9 Nov 2020 17:33:36 +0100
Subject: [PATCH] Display a real progress bar when updates are processed

---
 http-ui/public/updates-script.js | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/http-ui/public/updates-script.js b/http-ui/public/updates-script.js
index 8005c554c..c034c45b8 100644
--- a/http-ui/public/updates-script.js
+++ b/http-ui/public/updates-script.js
@@ -52,7 +52,16 @@ $(window).on('load', function () {
     if (status.type == "Progressing") {
       const id = 'update-' + status.update_id;
       const content = $(`#${id} .updateStatus.content`);
-      content.html('progressing... ' + JSON.stringify(status.meta));
+
+      let html;
+      let { type, processed_number_of_documents, total_number_of_documents } = status.meta;
+      if (type === 'DocumentsAddition' && processed_number_of_documents && total_number_of_documents) {
+        let progress = Math.round(processed_number_of_documents / total_number_of_documents * 100);
+        html = `<progress class="progress" title="${progress}%" value="${progress}" max="100"></progress>`;
+      } else {
+        html = `<progress class="progress" max="100"></progress>`;
+      }
+      content.html(html);
     }
 
     if (status.type == "Processed") {