Spaces:
Running
Running
import { Component, inject, OnInit } from '@angular/core'; | |
import { CommonModule } from '@angular/common'; | |
import { FormsModule } from '@angular/forms'; | |
import { MatCardModule } from '@angular/material/card'; | |
import { MatFormFieldModule } from '@angular/material/form-field'; | |
import { MatInputModule } from '@angular/material/input'; | |
import { MatSelectModule } from '@angular/material/select'; | |
import { MatButtonModule } from '@angular/material/button'; | |
import { MatIconModule } from '@angular/material/icon'; | |
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner'; | |
import { MatSnackBar, MatSnackBarModule } from '@angular/material/snack-bar'; | |
import { MatExpansionModule } from '@angular/material/expansion'; | |
import { MatSliderModule } from '@angular/material/slider'; | |
import { MatCheckboxModule } from '@angular/material/checkbox'; | |
import { ApiService, Environment, STTSettings, TTSSettings } from '../../services/api.service'; | |
import { EnvironmentService } from '../../services/environment.service'; | |
({ | |
selector: 'app-environment', | |
standalone: true, | |
imports: [ | |
CommonModule, | |
FormsModule, | |
MatCardModule, | |
MatFormFieldModule, | |
MatInputModule, | |
MatSelectModule, | |
MatButtonModule, | |
MatIconModule, | |
MatProgressSpinnerModule, | |
MatSnackBarModule, | |
MatExpansionModule, | |
MatSliderModule, | |
MatCheckboxModule | |
], | |
templateUrl: './environment.component.html', | |
styleUrls: ['./environment.component.scss'] | |
}) | |
export class EnvironmentComponent implements OnInit { | |
private apiService = inject(ApiService); | |
private snackBar = inject(MatSnackBar); | |
private environmentService = inject(EnvironmentService); | |
environment: Environment = { | |
work_mode: 'hfcloud', | |
cloud_token: '', | |
spark_endpoint: '', | |
internal_prompt: '', | |
tts_engine: 'no_tts', | |
tts_engine_api_key: '', | |
stt_engine: 'no_stt', | |
stt_engine_api_key: '' | |
}; | |
ttsSettings: TTSSettings = { | |
use_ssml: false | |
}; | |
// Separate STT settings object with defaults | |
sttSettings: STTSettings = { | |
speech_timeout_ms: 2000, | |
noise_reduction_level: 2, | |
vad_sensitivity: 0.5, | |
language: 'tr-TR', | |
model: 'latest_long', | |
use_enhanced: true, | |
enable_punctuation: true, | |
interim_results: true | |
}; | |
loading = true; | |
saving = false; | |
ngOnInit() { | |
this.loadEnvironment(); | |
} | |
loadEnvironment() { | |
this.loading = true; | |
this.apiService.getEnvironment().subscribe({ | |
next: (env) => { | |
this.environment = env; | |
// Load TTS settings or use defaults | |
if (env.tts_settings) { | |
this.ttsSettings = { ...this.ttsSettings, ...env.tts_settings }; | |
} | |
// Load STT settings or use defaults | |
if (env.stt_settings) { | |
this.sttSettings = { ...this.sttSettings, ...env.stt_settings }; | |
} | |
this.loading = false; | |
}, | |
error: (err) => { | |
this.snackBar.open('Failed to load environment configuration', 'Close', { | |
duration: 5000, | |
panelClass: 'error-snackbar' | |
}); | |
this.loading = false; | |
} | |
}); | |
} | |
getTokenLabel(): string { | |
switch(this.environment.work_mode) { | |
case 'gpt4o': | |
case 'gpt4o-mini': | |
return 'OpenAI API Key'; | |
case 'hfcloud': | |
case 'cloud': | |
return 'Cloud Token'; | |
default: | |
return 'Cloud Token'; | |
} | |
} | |
getTokenPlaceholder(): string { | |
switch(this.environment.work_mode) { | |
case 'gpt4o': | |
case 'gpt4o-mini': | |
return 'Enter OpenAI API key (sk-...)'; | |
case 'hfcloud': | |
case 'cloud': | |
return 'Enter cloud token'; | |
default: | |
return 'Enter cloud token'; | |
} | |
} | |
isGPTMode(): boolean { | |
return this.environment.work_mode === 'gpt4o' || this.environment.work_mode === 'gpt4o-mini'; | |
} | |
onWorkModeChange() { | |
if (this.environment.work_mode === 'on-premise') { | |
this.environment.cloud_token = ''; | |
} | |
} | |
onTTSEngineChange() { | |
if (this.environment.tts_engine === 'no_tts') { | |
this.environment.tts_engine_api_key = ''; | |
this.ttsSettings.use_ssml = false; | |
} else if (!this.isTTSProviderSSMLCapable()) { | |
// SSML desteklemiyorsa kapat | |
this.ttsSettings.use_ssml = false; | |
} | |
} | |
isTTSProviderSSMLCapable(): boolean { | |
// SSML destekleyen provider'lar | |
const ssmlProviders = ['google', 'azure', 'amazon']; | |
if (!this.environment.tts_engine) { | |
return false; | |
} | |
return ssmlProviders.includes(this.environment.tts_engine); | |
} | |
onSTTEngineChange() { | |
if (this.environment.stt_engine === 'no_stt') { | |
this.environment.stt_engine_api_key = ''; | |
} | |
} | |
getSTTKeyLabel(): string { | |
switch(this.environment.stt_engine) { | |
case 'google': | |
return 'Google Credentials Path'; | |
case 'azure': | |
return 'Azure Subscription Key'; | |
case 'amazon': | |
return 'AWS Access Key'; | |
case 'flicker': | |
return 'Flicker API Key'; | |
default: | |
return 'STT API Key'; | |
} | |
} | |
getSTTKeyPlaceholder(): string { | |
switch(this.environment.stt_engine) { | |
case 'google': | |
return 'Path to Google credentials JSON file'; | |
case 'azure': | |
return 'Enter Azure subscription key'; | |
case 'amazon': | |
return 'Enter AWS access key'; | |
case 'flicker': | |
return 'Enter Flicker API key'; | |
default: | |
return 'Enter STT API key'; | |
} | |
} | |
getSTTKeyHint(): string { | |
switch(this.environment.stt_engine) { | |
case 'google': | |
return 'Path to service account JSON file for Google Cloud'; | |
case 'azure': | |
return 'Subscription key from Azure portal'; | |
case 'amazon': | |
return 'AWS IAM access key with Transcribe permissions'; | |
case 'flicker': | |
return 'API key from Flicker dashboard'; | |
default: | |
return ''; | |
} | |
} | |
formatMilliseconds(value: number): string { | |
return `${value}ms`; | |
} | |
save() { | |
this.saving = true; | |
// Include STT settings in the save | |
const saveData = { | |
...this.environment, | |
stt_settings: this.sttSettings, | |
tts_settings: this.ttsSettings | |
}; | |
this.apiService.updateEnvironment(saveData).subscribe({ | |
next: () => { | |
// Environment service'i güncelle | |
this.environmentService.updateEnvironment(saveData); | |
this.snackBar.open('Environment configuration saved successfully', 'Close', { | |
duration: 3000 | |
}); | |
this.saving = false; | |
}, | |
error: (err) => { | |
this.snackBar.open( | |
err.error?.detail || 'Failed to save configuration', | |
'Close', | |
{ duration: 5000, panelClass: 'error-snackbar' } | |
); | |
this.saving = false; | |
} | |
}); | |
} | |
testConnection() { | |
this.snackBar.open('Testing connection to Spark endpoint...', undefined, { | |
duration: 2000 | |
}); | |
// TODO: Implement actual connection test | |
setTimeout(() => { | |
this.snackBar.open('Connection successful!', 'Close', { | |
duration: 3000 | |
}); | |
}, 2000); | |
} | |
reloadFromSpark() { | |
if (this.isGPTMode()) { | |
return; | |
} | |
this.snackBar.open('Reloading configuration from Spark...', undefined, { | |
duration: 2000 | |
}); | |
setTimeout(() => { | |
this.loadEnvironment(); | |
this.snackBar.open('Configuration reloaded', 'Close', { | |
duration: 3000 | |
}); | |
}, 1000); | |
} | |
} |