refac: audio settings

src/lib/components/chat/Settings/Audio.svelte

 <script lang="ts">
 	import { getAudioConfig, updateAudioConfig } from '$lib/apis/audio';
+	import { user } from '$lib/stores';
 	import { createEventDispatcher, onMount, getContext } from 'svelte';
 	import { toast } from 'svelte-sonner';
 	const dispatch = createEventDispatcher();
@@ -102,19 +103,23 @@
 			getWebAPIVoices();
 		}
 
+		if ($user.role === 'admin') {
 			const res = await getAudioConfig(localStorage.token);
 
 			if (res) {
 				OpenAIUrl = res.OPENAI_API_BASE_URL;
 				OpenAIKey = res.OPENAI_API_KEY;
 			}
+		}
 	});
 </script>
 
 <form
 	class="flex flex-col h-full justify-between space-y-3 text-sm"
 	on:submit|preventDefault={async () => {
+		if ($user.role === 'admin') {
 			await updateConfigHandler();
+		}
 		saveSettings({
 			audio: {
 				STTEngine: STTEngine !== '' ? STTEngine : undefined,
@@ -220,6 +225,7 @@
 				</div>
 			</div>
 
+			{#if $user.role === 'admin'}
 				{#if TTSEngine === 'openai'}
 					<div class="mt-1 flex gap-2 mb-1">
 						<input
@@ -237,6 +243,7 @@
 						/>
 					</div>
 				{/if}
+			{/if}
 
 			<div class=" py-0.5 flex w-full justify-between">
 				<div class=" self-center text-xs font-medium">{$i18n.t('Auto-playback response')}</div>
@@ -265,7 +272,7 @@
 				<div class="flex w-full">
 					<div class="flex-1">
 						<select
-							class="w-full rounded py-2 px-4 text-sm dark:text-gray-300 dark:bg-gray-800 outline-none"
+							class="w-full rounded-lg py-2 px-4 text-sm dark:text-gray-300 dark:bg-gray-850 outline-none"
 							bind:value={speaker}
 							placeholder="Select a voice"
 						>