Add connection retry logic to handle network interruptions gracefully

- Implement ConnectionManager with exponential backoff retry strategy
- Add automatic connection monitoring and health checks
- Update RequestQueueManager to integrate with connection state
- Create ConnectionUI component for visual connection status
- Queue requests during offline periods and process when online
- Add comprehensive error handling for network-related failures
- Create detailed documentation for connection retry features
- Support manual retry and automatic recovery

Features:
- Real-time connection status indicator
- Offline banner with retry button
- Request queue visualization
- Priority-based request processing
- Configurable retry parameters

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2025-06-03 00:00:03 -06:00
parent b08574efe5
commit 17e0f2f03d
7 changed files with 993 additions and 31 deletions

View File

@@ -5,9 +5,14 @@ import { Validator } from './validator';
import { StreamingTranslation } from './streamingTranslation';
import { PerformanceMonitor } from './performanceMonitor';
import { SpeakerManager } from './speakerManager';
import { ConnectionManager } from './connectionManager';
import { ConnectionUI } from './connectionUI';
// import { apiClient } from './apiClient'; // Available for cross-origin requests
// Initialize error boundary
const errorBoundary = ErrorBoundary.getInstance();
// Initialize connection management
ConnectionManager.getInstance(); // Initialize connection manager
const connectionUI = ConnectionUI.getInstance();
// Configure API client if needed for cross-origin requests
// import { apiClient } from './apiClient';
// apiClient.configure({ baseUrl: 'https://api.talk2me.com', credentials: 'include' });
@@ -596,6 +601,15 @@ function initApp() {
sourceText.innerHTML = `<p class="text-warning">Too many requests. Please wait a moment.</p>`;
statusIndicator.textContent = 'Rate limit - please wait';
}
else if (error.message?.includes('connection') || error.message?.includes('network')) {
sourceText.innerHTML = `<p class="text-warning">Connection error. Your request will be processed when connection is restored.</p>`;
statusIndicator.textContent = 'Connection error - queued';
connectionUI.showTemporaryMessage('Request queued for when connection returns', 'warning');
}
else if (!navigator.onLine) {
sourceText.innerHTML = `<p class="text-warning">You're offline. Request will be sent when connection is restored.</p>`;
statusIndicator.textContent = 'Offline - request queued';
}
else {
sourceText.innerHTML = `<p class="text-danger">Failed to transcribe audio. Please try again.</p>`;
statusIndicator.textContent = 'Transcription failed';
@@ -783,6 +797,11 @@ function initApp() {
translatedText.innerHTML = `<p class="text-warning">Too many requests. Please wait a moment.</p>`;
statusIndicator.textContent = 'Rate limit - please wait';
}
else if (error.message?.includes('connection') || error.message?.includes('network')) {
translatedText.innerHTML = `<p class="text-warning">Connection error. Your translation will be processed when connection is restored.</p>`;
statusIndicator.textContent = 'Connection error - queued';
connectionUI.showTemporaryMessage('Translation queued for when connection returns', 'warning');
}
else if (!navigator.onLine) {
statusIndicator.textContent = 'Offline - checking cache...';
translatedText.innerHTML = `<p class="text-warning">You're offline. Only cached translations are available.</p>`;
@@ -872,6 +891,19 @@ function initApp() {
statusIndicator.textContent = 'Too many requests - please wait';
alert('Too many requests. Please wait a moment before trying again.');
}
else if (error.message?.includes('connection') || error.message?.includes('network')) {
statusIndicator.textContent = 'Connection error - audio generation queued';
connectionUI.showTemporaryMessage('Audio generation queued for when connection returns', 'warning');
// Show TTS server alert
ttsServerAlert.classList.remove('d-none');
ttsServerAlert.classList.remove('alert-success');
ttsServerAlert.classList.add('alert-warning');
ttsServerMessage.textContent = 'Connection error - request queued';
}
else if (!navigator.onLine) {
statusIndicator.textContent = 'Offline - audio generation unavailable';
alert('Audio generation requires an internet connection.');
}
else {
statusIndicator.textContent = 'TTS failed';
// Show TTS server alert