luci-app-attendedsysupgrade: improve ux during install and reboot

During the sysupgrade image installation and reboot process, it
is possible for LuCI to reconnect before the device is rebooted.
This leads to confusion and possible danger of changes being made
that will damage the device.

We set expectations as to what will happen during the installation
process with better wording in the spin dialog, and also "lock up"
the interface for 10s, allowing sysupgrade to do its job and avoid
reconnecting too early

Link: https://forum.openwrt.org/t/luci-attended-sysupgrade-support-thread/230552/268
Signed-off-by: Eric Fahlgren <[email protected]>
(cherry picked from commit 3dced05aa2b28685335762656702be0fb8ff3937)

diff --git a/applications/luci-app-attendedsysupgrade/htdocs/luci-static/resources/view/attendedsysupgrade/overview.js b/applications/luci-app-attendedsysupgrade/htdocs/luci-static/resources/view/attendedsysupgrade/overview.js
index 36ea8fd36e30691361ed7e2da545268927a7e41b..2959c5b823f89f11c32448ea36fb59f61d7eb773 100644 (file)
--- a/applications/luci-app-attendedsysupgrade/htdocs/luci-static/resources/view/attendedsysupgrade/overview.js
+++ b/applications/luci-app-attendedsysupgrade/htdocs/luci-static/resources/view/attendedsysupgrade/overview.js
@@ -476,27 +476,26 @@ return view.extend({
                                        .then((response) => {
                                                if (response.sha256sum != sha256) {
                                                        ui.showModal(_('Wrong checksum'), [
-                                                               E(
-                                                                       'p',
-                                                                       _('Error during download of firmware. Please try again')
-                                                               ),
+                                                               E('p', _('Error during download of firmware. Please try again')),
                                                                E('div', { class: 'btn', click: ui.hideModal }, _('Close')),
                                                        ]);
                                                } else {
                                                        ui.showModal(_('Installing...'), [
-                                                               E(
-                                                                       'p',
-                                                                       { class: 'spinning' },
-                                                                       _('Installing the sysupgrade. Do not unpower device!')
-                                                               ),
+                                                               E('div', { class: 'spinning' }, [
+                                                                       E('p', _('Installing the sysupgrade image...')),
+                                                                       E('p', 
+                                                                       _('Once the image is written, the system will reboot.')
+                                                                       + ' ' +
+                                                                       _('This should take at least a minute, so please wait for the login screen.')
+                                                                       ),
+                                                                       E('b', _('While you are waiting, do not unpower device!')),
+                                                               ]),
                                                        ]);
 
                                                        L.resolveDefault(callUpgradeStart(keep), {}).then((response) => {
-                                                               if (keep) {
-                                                                       ui.awaitReconnect(window.location.host);
-                                                               } else {
-                                                                       ui.awaitReconnect('192.168.1.1', 'openwrt.lan');
-                                                               }
+                                                               // Wait 10 seconds before we try to reconnect...
+                                                               let hosts = keep ? [] : ['192.168.1.1', 'openwrt.lan'];
+                                                               setTimeout(() => { ui.awaitReconnect(...hosts); }, 10000);
                                                        });
                                                }
                                        });