feat: enhance ErrorModal and ChatWindow error handling

- Added HelpCircle icon to ErrorModal for improved visual feedback.
- Implemented logic to differentiate between instructions and technical details in ErrorModal.
- Updated ChatWindow to utilize traduzirErro for user-friendly error messages during call initiation.
- Enhanced error handling to provide clearer instructions and details based on error types.

apps/web/src/lib/components/chat/ChatWindow.svelte

@@ -13,6 +13,7 @@
 	import ErrorModal from '../ErrorModal.svelte';
 	import { getAvatarUrl } from '$lib/utils/avatarGenerator';
 	import { browser } from '$app/environment';
+	import { traduzirErro } from '$lib/utils/erroHelpers';
 	import {
 		Bell,
 		X,
@@ -47,6 +48,7 @@
 	let showErrorModal = $state(false);
 	let errorTitle = $state('Erro');
 	let errorMessage = $state('');
+	let errorInstructions = $state<string | undefined>(undefined);
 	let errorDetails = $state<string | undefined>(undefined);
 
 	const chamadaAtivaQuery = useQuery(api.chamadas.obterChamadaAtiva, {
@@ -146,8 +148,9 @@
 	// Funções para chamadas
 	async function iniciarChamada(tipo: 'audio' | 'video'): Promise<void> {
 		if (chamadaAtual) {
-			errorTitle = 'Chamada Ativa';
-			errorMessage = 'Já existe uma chamada ativa nesta conversa';
+			errorTitle = 'Chamada já em andamento';
+			errorMessage = 'Já existe uma chamada ativa nesta conversa. Você precisa finalizar a chamada atual antes de iniciar uma nova.';
+			errorInstructions = 'Finalize a chamada atual e tente novamente.';
 			errorDetails = undefined;
 			showErrorModal = true;
 			return;
@@ -166,23 +169,17 @@
 		} catch (error) {
 			console.error('Erro ao iniciar chamada:', error);
 			
-			// Tratar diferentes tipos de erro
-			if (error instanceof Error) {
-				errorTitle = 'Erro ao Iniciar Chamada';
-				
-				// Verificar se é erro do Convex sobre função não encontrada
-				if (error.message.includes('Could not find public function')) {
-					errorMessage = 'O servidor de chamadas não está sincronizado. Por favor, aguarde alguns segundos e tente novamente.';
-					errorDetails = `Erro técnico: ${error.message}\n\nSugestão: Verifique se o backend Convex está rodando corretamente.`;
-				} else {
-					errorMessage = error.message || 'Erro ao iniciar chamada';
-					errorDetails = error.stack;
-				}
-			} else {
-				errorTitle = 'Erro ao Iniciar Chamada';
-				errorMessage = 'Ocorreu um erro desconhecido ao iniciar a chamada. Por favor, tente novamente.';
-				errorDetails = String(error);
-			}
+			// Traduzir erro técnico para mensagem amigável
+			const erroTraduzido = traduzirErro(error);
+			
+			errorTitle = erroTraduzido.titulo;
+			errorMessage = erroTraduzido.mensagem;
+			errorInstructions = erroTraduzido.instrucoes;
+			
+			// Apenas mostrar detalhes técnicos se solicitado e disponível
+			errorDetails = erroTraduzido.mostrarDetalhesTecnicos && erroTraduzido.detalhesTecnicos
+				? erroTraduzido.detalhesTecnicos
+				: undefined;
 			
 			showErrorModal = true;
 		} finally {
@@ -193,6 +190,7 @@
 	function fecharErrorModal(): void {
 		showErrorModal = false;
 		errorMessage = '';
+		errorInstructions = undefined;
 		errorDetails = undefined;
 	}
 
@@ -632,6 +630,6 @@
 	open={showErrorModal}
 	title={errorTitle}
 	message={errorMessage}
-	details={errorDetails}
+	details={errorInstructions || errorDetails}
 	onClose={fecharErrorModal}
 />