fix: ask in the page instead of native confirm/alert

A native confirm() or alert() leaves the desktop client unable to type
until the window is refocused. ask.js draws both in the page; the SPA
test now bans all three browser dialogs.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

1 files changed, 8 insertions, 7 deletions

diff --git a/packages/meshbay-hub/src/meshbay_hub/static/group-settings.js b/packages/meshbay-hub/src/meshbay_hub/static/group-settings.js
index d7a1a66..5f811e8 100644
--- a/packages/meshbay-hub/src/meshbay_hub/static/group-settings.js
+++ b/packages/meshbay-hub/src/meshbay_hub/static/group-settings.js
@@ -2,6 +2,7 @@ import {
   html, useState, useEffect, useCallback, useMemo, useRef,
 } from './vendor/htm-preact.js';
 import { t } from './i18n.js';
+import { ask } from './ask.js';
 import { Icon } from './icon.js';
 import { CollapsibleSection, ToggleSwitch } from './settings-ui.js';
 import { hubFetch, navigate } from './hub-client.js';
@@ -189,7 +190,7 @@ function SharedDirectoriesTable({ roots, groupId, transport, signFn,
       }
       return;
     }
-    if (!confirm(t('node.root_remove_confirm', { name: rootName }))) return;
+    if (!await ask(t('node.root_remove_confirm', { name: rootName }))) return;
     const ok = await run(async () => {
       if (overMnp) await transport.removeRoot(groupId, rootName, signFn);
       else if (overLoopback) {
@@ -531,7 +532,7 @@ function GroupSettingsPanel({ groupId, group, token, transportRef, gekRef,
   }, [approveCode, userId, transportRef, loadDevices]);
 
   const revokeDevice = useCallback(async (device) => {
-    if (!confirm(t('device.revoke_confirm'))) return;
+    if (!await ask(t('device.revoke_confirm'))) return;
     setDeviceMsg('');
     try {
       await transportRef.current.revokeDevice(
@@ -1046,7 +1047,7 @@ function GroupSettingsPanel({ groupId, group, token, transportRef, gekRef,
             ${isOwner
               ? html`
                 <button class="admin-btn danger" onClick=${async () => {
-                  if (!confirm(t('group.delete_group_confirm', {
+                  if (!await ask(t('group.delete_group_confirm', {
                     name: group.owner_username ? `${group.name}@${group.owner_username}` : group.name,
                   }))) return;
                   try {
@@ -1056,7 +1057,7 @@ function GroupSettingsPanel({ groupId, group, token, transportRef, gekRef,
                         await platform.node.call('POST', '/api/groups/detach',
                           { name: nodeGroupName });
                       } catch (detachErr) {
-                        if (!confirm(t('settings_node.detach_failed_continue'))) return;
+                        if (!await ask(t('settings_node.detach_failed_continue'))) return;
                       }
                     }
                     await hubFetch('/v1/groups/' + groupId, { method: 'DELETE', token });
@@ -1067,7 +1068,7 @@ function GroupSettingsPanel({ groupId, group, token, transportRef, gekRef,
               `
               : html`
                 <button class="admin-btn danger" onClick=${async () => {
-                  if (!confirm(t('group.leave_confirm', {
+                  if (!await ask(t('group.leave_confirm', {
                     name: group.owner_username ? `${group.name}@${group.owner_username}` : group.name,
                   }))) return;
                   try {
@@ -1146,8 +1147,8 @@ function GroupSettingsPanel({ groupId, group, token, transportRef, gekRef,
                 <td class="admin-actions">
                   ${isAdmin && m.user_id !== adminId && html`
                     <button class="admin-btn danger" disabled=${removing === m.user_id}
-                      onClick=${() => {
-                        if (!confirm(t('members.remove_confirm', { user: m.username }))) return;
+                      onClick=${async () => {
+                        if (!await ask(t('members.remove_confirm', { user: m.username }))) return;
                         removeMember(m);
                       }}>
                       ${removing === m.user_id ? '...' : t('members.remove')}