progress status during upates

themes/grav/app/updates/safe-upgrade.js

@@ -394,6 +394,9 @@ export default class SafeUpgrade {
                     target_version: data.version || (data.manifest && data.manifest.target_version) || null,
                     manifest: data.manifest || null
                 });
+                if (data.status === 'success') {
+                    setTimeout(() => window.location.reload(), 2500);
+                }
                 return;
             }
 
@@ -465,15 +468,24 @@ export default class SafeUpgrade {
             }
 
             const payload = response.data || {};
+            const job = payload.job || {};
             const data = payload.progress || payload;
             nextStage = data.stage || null;
-            this.renderProgress(data);
 
-            if (payload.job && payload.job.status === 'success') {
+            this.renderProgress(data, job);
+
+            if (job.status === 'error') {
                 shouldContinue = false;
+                nextStage = 'error';
+                const message = job.error || data.message || t('SAFE_UPGRADE_GENERIC_ERROR', 'Safe upgrade could not complete. See Grav logs for details.');
+                this.renderResult({ status: 'error', message });
+            } else if (job.status === 'success' && data.stage === 'complete') {
+                shouldContinue = false;
+                nextStage = 'complete';
+                if (job.result) {
+                    this.renderResult(job.result);
                 }
-
+            } else if (nextStage === 'installing' || nextStage === 'finalizing' || nextStage === 'complete') {
-            if (nextStage === 'installing' || nextStage === 'finalizing' || nextStage === 'complete') {
                 shouldContinue = false;
             }
         });
@@ -488,6 +500,9 @@ export default class SafeUpgrade {
             if (nextStage === 'complete' || nextStage === 'error') {
                 this.stopPolling();
                 this.jobId = null;
+                if (nextStage === 'complete') {
+                    setTimeout(() => window.location.reload(), 2500);
+                }
             } else if (shouldContinue) {
                 this.schedulePoll();
             } else {
@@ -499,7 +514,7 @@ export default class SafeUpgrade {
         this.statusRequest.then(finalize, finalize);
     }
 
-    renderProgress(data) {
+    renderProgress(data, job = {}) {
         if (!data) {
             return;
         }
@@ -507,13 +522,34 @@ export default class SafeUpgrade {
         const stage = data.stage || 'initializing';
         const titleResolver = STAGE_TITLES[stage] || STAGE_TITLES.initializing;
         const title = titleResolver();
-        const percent = typeof data.percent === 'number' ? data.percent : null;
+        let percent = typeof data.percent === 'number' ? data.percent : null;
+
+        const scaledPercent = () => {
+            if (stage === 'queued') { return 0; }
+            if (stage === 'initializing') { return percent !== null ? Math.min(percent, 5) : 5; }
+            if (stage === 'downloading') {
+                if (percent !== null) {
+                    return Math.min(60, Math.round(10 + (percent * 0.5)));
+                }
+                return 25;
+            }
+            if (stage === 'installing') { return percent !== null ? Math.max(percent, 80) : 80; }
+            if (stage === 'finalizing') { return percent !== null ? Math.max(percent, 95) : 95; }
+            if (stage === 'complete') { return 100; }
+            if (stage === 'error') { return null; }
+            return percent;
+        };
+
+        percent = scaledPercent();
         const percentLabel = percent !== null ? `${percent}%` : '';
 
+        const statusLine = job && job.status ? `<p class="safe-upgrade-status">${t('SAFE_UPGRADE_JOB_STATUS', 'Status')}: <strong>${job.status.toUpperCase()}</strong>${job.error ? ` &mdash; ${job.error}` : ''}</p>` : '';
+
         this.steps.progress.html(`
             <div class="safe-upgrade-progress">
                 <h3>${title}</h3>
                 <p>${data.message || ''}</p>
+                ${statusLine}
                 ${percentLabel ? `<div class="safe-upgrade-progress-bar"><span style="width:${percent}%"></span></div><div class="progress-value">${percentLabel}</div>` : ''}
             </div>
         `);

themes/grav/js/admin.min.js

@@ -4863,6 +4863,11 @@ var SafeUpgrade = /*#__PURE__*/function () {
             target_version: data.version || data.manifest && data.manifest.target_version || null,
             manifest: data.manifest || null
           });
+          if (data.status === 'success') {
+            setTimeout(function () {
+              return window.location.reload();
+            }, 2500);
+          }
           return;
         }
         if (data.status === 'queued' && data.job_id) {
@@ -4935,13 +4940,25 @@ var SafeUpgrade = /*#__PURE__*/function () {
           return;
         }
         var payload = response.data || {};
+        var job = payload.job || {};
         var data = payload.progress || payload;
         nextStage = data.stage || null;
-        _this6.renderProgress(data);
+        _this6.renderProgress(data, job);
-        if (payload.job && payload.job.status === 'success') {
+        if (job.status === 'error') {
           shouldContinue = false;
+          nextStage = 'error';
+          var message = job.error || data.message || t('SAFE_UPGRADE_GENERIC_ERROR', 'Safe upgrade could not complete. See Grav logs for details.');
+          _this6.renderResult({
+            status: 'error',
+            message: message
+          });
+        } else if (job.status === 'success' && data.stage === 'complete') {
+          shouldContinue = false;
+          nextStage = 'complete';
+          if (job.result) {
+            _this6.renderResult(job.result);
           }
-        if (nextStage === 'installing' || nextStage === 'finalizing' || nextStage === 'complete') {
+        } else if (nextStage === 'installing' || nextStage === 'finalizing' || nextStage === 'complete') {
           shouldContinue = false;
         }
       });
@@ -4953,6 +4970,11 @@ var SafeUpgrade = /*#__PURE__*/function () {
         if (nextStage === 'complete' || nextStage === 'error') {
           _this6.stopPolling();
           _this6.jobId = null;
+          if (nextStage === 'complete') {
+            setTimeout(function () {
+              return window.location.reload();
+            }, 2500);
+          }
         } else if (shouldContinue) {
           _this6.schedulePoll();
         } else {
@@ -4965,6 +4987,7 @@ var SafeUpgrade = /*#__PURE__*/function () {
   }, {
     key: "renderProgress",
     value: function renderProgress(data) {
+      var job = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
       if (!data) {
         return;
       }
@@ -4972,8 +4995,37 @@ var SafeUpgrade = /*#__PURE__*/function () {
       var titleResolver = STAGE_TITLES[stage] || STAGE_TITLES.initializing;
       var title = titleResolver();
       var percent = typeof data.percent === 'number' ? data.percent : null;
+      var scaledPercent = function scaledPercent() {
+        if (stage === 'queued') {
+          return 0;
+        }
+        if (stage === 'initializing') {
+          return percent !== null ? Math.min(percent, 5) : 5;
+        }
+        if (stage === 'downloading') {
+          if (percent !== null) {
+            return Math.min(60, Math.round(10 + percent * 0.5));
+          }
+          return 25;
+        }
+        if (stage === 'installing') {
+          return percent !== null ? Math.max(percent, 80) : 80;
+        }
+        if (stage === 'finalizing') {
+          return percent !== null ? Math.max(percent, 95) : 95;
+        }
+        if (stage === 'complete') {
+          return 100;
+        }
+        if (stage === 'error') {
+          return null;
+        }
+        return percent;
+      };
+      percent = scaledPercent();
       var percentLabel = percent !== null ? "".concat(percent, "%") : '';
-      this.steps.progress.html("\n            <div class=\"safe-upgrade-progress\">\n                <h3>".concat(title, "</h3>\n                <p>").concat(data.message || '', "</p>\n                ").concat(percentLabel ? "<div class=\"safe-upgrade-progress-bar\"><span style=\"width:".concat(percent, "%\"></span></div><div class=\"progress-value\">").concat(percentLabel, "</div>") : '', "\n            </div>\n        "));
+      var statusLine = job && job.status ? "<p class=\"safe-upgrade-status\">".concat(t('SAFE_UPGRADE_JOB_STATUS', 'Status'), ": <strong>").concat(job.status.toUpperCase(), "</strong>").concat(job.error ? " &mdash; ".concat(job.error) : '', "</p>") : '';
+      this.steps.progress.html("\n            <div class=\"safe-upgrade-progress\">\n                <h3>".concat(title, "</h3>\n                <p>").concat(data.message || '', "</p>\n                ").concat(statusLine, "\n                ").concat(percentLabel ? "<div class=\"safe-upgrade-progress-bar\"><span style=\"width:".concat(percent, "%\"></span></div><div class=\"progress-value\">").concat(percentLabel, "</div>") : '', "\n            </div>\n        "));
       this.switchStep('progress');
       if (stage === 'complete') {
         this.renderResult({