refactor: updated elevenLabs API module and remove button UX

[Abhijay007]

ref : #6557 (comment), #6557 (comment)

PR Description

updated elevenLabs API module and remove UX

Type of Change

• Refactor / Code quality

AI Assistance

• This PR was created or reviewed with AI assistance

Testing

Tested In Desktop UI

Screenshots/Demos (for UX changes)

[Copilot]

Pull request overview

Refactors the ElevenLabs API key settings UI in the desktop app by simplifying state management and removing some loading/validation UX.

Changes:

• Simplifies initial key detection to a single useEffect check.
• Switches save/remove flows to optimistic local state updates (no reload-based recheck).
• Adjusts the UI to show a dedicated “Remove API Key” action outside edit mode and removes inline validation/error messaging.

[Copilot]

handleSave no longer catches upsert failures, which will surface as an unhandled rejection and leaves the user with no feedback if saving fails; add try/catch and only flip hasElevenLabsKey/cache after a successful save (and consider surfacing an error message/toast on failure).

Suggested change

	await upsert(ELEVENLABS_API_KEY, trimmedKey, true);
	setElevenLabsApiKey('');
	setIsEditing(false);
	setHasElevenLabsKey(true);
	setElevenLabsKeyCache(true);
	try {
	await upsert(ELEVENLABS_API_KEY, trimmedKey, true);
	setElevenLabsApiKey('');
	setIsEditing(false);
	setHasElevenLabsKey(true);
	setElevenLabsKeyCache(true);
	} catch (error) {
	// eslint-disable-next-line no-console
	console.error('Failed to save ElevenLabs API key', error);
	if (typeof window !== 'undefined' && window.alert) {
	window.alert('Failed to save ElevenLabs API key. Please try again.');
	}
	}

[Copilot]

handleRemove now awaits remove without handling errors, so a backend/config failure will become an unhandled rejection and the UI won’t show why the key wasn’t removed; wrap this in try/catch and avoid updating hasElevenLabsKey/cache unless removal succeeds.

Suggested change

	await remove(ELEVENLABS_API_KEY, true);
	setElevenLabsApiKey('');
	setIsEditing(false);
	setHasElevenLabsKey(false);
	setElevenLabsKeyCache(false);
	try {
	await remove(ELEVENLABS_API_KEY, true);
	setElevenLabsApiKey('');
	setIsEditing(false);
	setHasElevenLabsKey(false);
	setElevenLabsKeyCache(false);
	} catch (error) {
	// Avoid updating local state/cache if removal fails so UI stays consistent with backend
	console.error('Failed to remove ElevenLabs API key:', error);
	}

[Copilot]

read(ELEVENLABS_API_KEY, true) is awaited inside an effect without any error handling, so a read failure will create an unhandled promise rejection and skip updating setElevenLabsKeyCache/state; wrap the async body in try/catch (or checkKey().catch(...)) and set the cache/state to false on error (similar to useDictationSettings).

Suggested change

	const response = await read(ELEVENLABS_API_KEY, true);
	const hasKey = isSecretKeyConfigured(response);
	setHasElevenLabsKey(hasKey);
	setElevenLabsKeyCache(hasKey);
	try {
	const response = await read(ELEVENLABS_API_KEY, true);
	const hasKey = isSecretKeyConfigured(response);
	setHasElevenLabsKey(hasKey);
	setElevenLabsKeyCache(hasKey);
	} catch {
	setHasElevenLabsKey(false);
	setElevenLabsKeyCache(false);
	}

[lifeizhou-ap]

Thank you @Abhijay007 for this improvement!

[Abhijay007]

@DOsinga, could you please take a look at this as well? I believe it’s ready to be merged. I’m asking since you had initially mentioned the refactor in the other PR