diff --git a/public/scripts/extensions/connection-manager/index.js b/public/scripts/extensions/connection-manager/index.js index 3814be945..7bd5f0fe1 100644 --- a/public/scripts/extensions/connection-manager/index.js +++ b/public/scripts/extensions/connection-manager/index.js @@ -49,6 +49,48 @@ const FANCY_NAMES = { 'tokenizer': 'Tokenizer', }; +/** + * A wrapper for the connection manager spinner. + */ +class ConnectionManagerSpinner { + /** + * @type {AbortController[]} + */ + static abortControllers = []; + + /** @type {HTMLElement} */ + spinnerElement; + + /** @type {AbortController} */ + abortController = new AbortController(); + + constructor() { + // @ts-ignore + this.spinnerElement = document.getElementById('connection_profile_spinner'); + this.abortController = new AbortController(); + } + + start() { + ConnectionManagerSpinner.abortControllers.push(this.abortController); + this.spinnerElement.classList.remove('hidden'); + } + + stop() { + this.spinnerElement.classList.add('hidden'); + } + + isAborted() { + return this.abortController.signal.aborted; + } + + static abort() { + for (const controller of ConnectionManagerSpinner.abortControllers) { + controller.abort(); + } + ConnectionManagerSpinner.abortControllers = []; + } +} + /** @type {() => SlashCommandEnumValue[]} */ const profilesProvider = () => [ new SlashCommandEnumValue(NONE), @@ -214,10 +256,19 @@ async function applyConnectionProfile(profile) { return; } + // Abort any ongoing profile application + ConnectionManagerSpinner.abort(); + const mode = profile.mode; const commands = mode === 'cc' ? CC_COMMANDS : TC_COMMANDS; + const spinner = new ConnectionManagerSpinner(); + spinner.start(); for (const command of commands) { + if (spinner.isAborted()) { + throw new Error('Profile application aborted'); + } + const argument = profile[command]; if (!argument) { continue; @@ -226,9 +277,11 @@ async function applyConnectionProfile(profile) { try { await executeSlashCommandsWithOptions(commandText, { handleParserErrors: false, handleExecutionErrors: false }); } catch (error) { - console.warn(`Failed to execute command: ${commandText}`, error); + console.error(`Failed to execute command: ${commandText}`, error); } } + + spinner.stop(); } /** diff --git a/public/scripts/extensions/connection-manager/settings.html b/public/scripts/extensions/connection-manager/settings.html index 0cf9acb67..598e660be 100644 --- a/public/scripts/extensions/connection-manager/settings.html +++ b/public/scripts/extensions/connection-manager/settings.html @@ -13,8 +13,9 @@
- - Profile Details + + Profile Details +
diff --git a/public/scripts/extensions/connection-manager/style.css b/public/scripts/extensions/connection-manager/style.css index 153a14767..a3255d032 100644 --- a/public/scripts/extensions/connection-manager/style.css +++ b/public/scripts/extensions/connection-manager/style.css @@ -7,3 +7,7 @@ #connection_profile_details ul { margin: 5px 0; } + +#connection_profile_spinner { + margin-lefT: 5px; +}