feat(KAN-65): add signed macOS updates and DMG distribution

native/ui/updates.js

@@ -0,0 +1,70 @@
+import { en } from './locales/en.js';
+import { updatePresentation } from './updates-state.js';
+
+for (const element of document.querySelectorAll('[data-i18n]')) {
+    element.textContent = en[element.dataset.i18n];
+}
+const element = (id) => document.getElementById(id);
+const action = (name, params = {}) => {
+    const url = new URL(`/updates/${name}`, location.href);
+    for (const [key, value] of Object.entries(params)) {
+        url.searchParams.set(key, value);
+    }
+    location.href = url.href;
+};
+let state;
+window.updateStatus = (next) => {
+    state = next;
+    const view = updatePresentation(state);
+    element('installed').textContent =
+        `${en.installedVersion} ${state.currentVersion} (${en.build} ${state.build})`;
+    element('update-status').textContent = en[view.message];
+    element('update-error').hidden = !state.error;
+    element('update-error').textContent = en[state.error] ?? '';
+    element('check').disabled = view.busy;
+    element('preferences').disabled = view.busy;
+    element('release').hidden = !state.version;
+    element('available-version').textContent =
+        `${en.version} ${state.version ?? ''}`;
+    element('release-notes').textContent = state.notes || en.noReleaseNotes;
+    element('install').hidden = !view.canInstall;
+    element('download-progress').hidden = !view.showProgress;
+    element('download-progress').max = state.total || 1;
+    if (state.total) {
+        element('download-progress').value = state.downloaded;
+    } else {
+        element('download-progress').removeAttribute('value');
+    }
+    element('download-size').hidden = !view.showProgress;
+    element('download-size').textContent =
+        `${(state.downloaded / 1048576).toFixed(1)} MB${state.total ? ` / ${(state.total / 1048576).toFixed(1)} MB` : ''}`;
+    element('automatic').checked = state.preferences.automatic;
+    element('interval').value = String(state.preferences.intervalHours);
+    element('interval').disabled = !state.preferences.automatic;
+    if (view.busy || !view.canInstall) {
+        element('install-confirmation').hidden = true;
+    }
+};
+element('check').addEventListener('click', () => action('check'));
+element('install').addEventListener('click', () => {
+    element('install-confirmation').hidden = false;
+    element('confirm-install').focus();
+});
+element('cancel-install').addEventListener('click', () => {
+    element('install-confirmation').hidden = true;
+    element('install').focus();
+});
+element('confirm-install').addEventListener('click', () => {
+    if (state && updatePresentation(state).canInstall) {
+        element('install-confirmation').hidden = true;
+        action('install', { version: state.version });
+    }
+});
+for (const id of ['automatic', 'interval']) {
+    element(id).addEventListener('change', () =>
+        action('preferences', {
+            automatic: String(element('automatic').checked),
+            interval: element('interval').value,
+        }),
+    );
+}