Update flare-ui/src/app/dialogs/version-edit-dialog/version-edit-dialog.component.html

flare-ui/src/app/dialogs/version-edit-dialog/version-edit-dialog.component.html

@@ -34,6 +34,12 @@
     </div>
 
     <mat-progress-bar *ngIf="loading" mode="indeterminate"></mat-progress-bar>
+    
+    <!-- Warning for published version -->
+    <div class="alert alert-warning" *ngIf="selectedVersion?.published">
+      <mat-icon>info</mat-icon>
+      This version is published and cannot be edited. Create a new version or unpublish to make changes.
+    </div>
 
     <!-- Version Editor -->
     <div class="version-editor" *ngIf="selectedVersion && !loading">
@@ -44,7 +50,7 @@
             <div class="tab-content">
               <div class="metadata-info">
                 <mat-chip-listbox>
-                  <mat-chip-option>Version ID: {{ versionForm.get('id')?.value }}</mat-chip-option>
+                  <mat-chip-option>Version {{ selectedVersion.no }}</mat-chip-option>
                   <mat-chip-option *ngIf="selectedVersion.published" selected>Published</mat-chip-option>
                   <mat-chip-option *ngIf="!selectedVersion.published">Draft</mat-chip-option>
                   <mat-chip-option *ngIf="selectedVersion.last_update_date">
@@ -55,7 +61,7 @@
 
               <mat-form-field appearance="outline" class="full-width">
                 <mat-label>Caption</mat-label>
-                <input matInput formControlName="caption" placeholder="Version description">
+                <input matInput formControlName="caption" placeholder="Version description" [readonly]="!canEdit">
               </mat-form-field>
 
               <mat-form-field appearance="outline" class="full-width">
@@ -64,7 +70,8 @@
                   class="code-textarea"
                   formControlName="general_prompt" 
                   rows="10"
-                  placeholder="Define the assistant's behavior and capabilities..."></textarea>
+                  placeholder="Define the assistant's behavior and capabilities..."
+                  [readonly]="!canEdit"></textarea>
                 <mat-hint>This prompt defines the overall behavior of your assistant</mat-hint>
               </mat-form-field>
 
@@ -86,7 +93,8 @@
               <mat-form-field appearance="outline" class="full-width">
                 <mat-label>Model Repository ID</mat-label>
                 <input matInput formControlName="repo_id" 
-                       placeholder="e.g., ytu-ce-cosmos/Turkish-Llama-8b-Instruct-v0.1">
+                       placeholder="e.g., ytu-ce-cosmos/Turkish-Llama-8b-Instruct-v0.1"
+                       [readonly]="!canEdit">
                 <mat-hint>HuggingFace model repository ID</mat-hint>
               </mat-form-field>
 
@@ -94,25 +102,25 @@
               <div formGroupName="generation_config" class="generation-config">
                 <mat-form-field appearance="outline">
                   <mat-label>Max New Tokens</mat-label>
-                  <input matInput type="number" formControlName="max_new_tokens">
+                  <input matInput type="number" formControlName="max_new_tokens" [readonly]="!canEdit">
                   <mat-hint>Maximum tokens to generate (1-2048)</mat-hint>
                 </mat-form-field>
 
                 <mat-form-field appearance="outline">
                   <mat-label>Temperature</mat-label>
-                  <input matInput type="number" step="0.1" formControlName="temperature">
+                  <input matInput type="number" step="0.1" formControlName="temperature" [readonly]="!canEdit">
                   <mat-hint>Controls randomness (0-2)</mat-hint>
                 </mat-form-field>
 
                 <mat-form-field appearance="outline">
                   <mat-label>Top P</mat-label>
-                  <input matInput type="number" step="0.1" formControlName="top_p">
+                  <input matInput type="number" step="0.1" formControlName="top_p" [readonly]="!canEdit">
                   <mat-hint>Nucleus sampling (0-1)</mat-hint>
                 </mat-form-field>
 
                 <mat-form-field appearance="outline">
                   <mat-label>Repetition Penalty</mat-label>
-                  <input matInput type="number" step="0.1" formControlName="repetition_penalty">
+                  <input matInput type="number" step="0.1" formControlName="repetition_penalty" [readonly]="!canEdit">
                   <mat-hint>Penalty for repetition (1-2)</mat-hint>
                 </mat-form-field>
               </div>
@@ -120,7 +128,7 @@
               <mat-divider></mat-divider>
 
               <div class="fine-tune-section">
-                <mat-checkbox formControlName="use_fine_tune">
+                <mat-checkbox formControlName="use_fine_tune" [disabled]="!canEdit">
                   Use Fine-Tuned Model
                 </mat-checkbox>
 
@@ -128,7 +136,8 @@
                                 *ngIf="versionForm.get('llm.use_fine_tune')?.value">
                   <mat-label>Fine-Tune ZIP URL</mat-label>
                   <input matInput formControlName="fine_tune_zip" 
-                         placeholder="https://example.com/lora-adapter.zip">
+                         placeholder="https://example.com/lora-adapter.zip"
+                         [readonly]="!canEdit">
                   <mat-hint>URL to LoRA adapter ZIP file</mat-hint>
                 </mat-form-field>
               </div>
@@ -140,12 +149,22 @@
             <div class="tab-content">
               <div class="intents-header">
                 <h3>Intent Definitions</h3>
-                <button mat-raised-button color="primary" (click)="addIntent()">
+                <button mat-raised-button color="primary" (click)="addIntent()" [disabled]="!canEdit">
                   <mat-icon>add</mat-icon>
                   Add Intent
                 </button>
               </div>
 
+              <!-- Locale selector for examples display -->
+              <mat-form-field appearance="outline" class="locale-selector">
+                <mat-label>Example Language</mat-label>
+                <mat-select [(value)]="selectedExampleLocale">
+                  <mat-option *ngFor="let locale of project.supported_locales" [value]="locale">
+                    {{ locale }}
+                  </mat-option>
+                </mat-select>
+              </mat-form-field>
+
               <div formArrayName="intents" class="intents-list">
                 <mat-expansion-panel *ngFor="let intent of intents.controls; let i = index" 
                                      [formGroupName]="i">
@@ -164,11 +183,11 @@
 
                   <div class="intent-content">
                     <div class="intent-actions">
-                      <button mat-button color="primary" (click)="editIntent(i)">
+                      <button mat-button color="primary" (click)="editIntent(i)" [disabled]="!canEdit">
                         <mat-icon>edit</mat-icon>
                         Edit Details
                       </button>
-                      <button mat-button color="warn" (click)="removeIntent(i)">
+                      <button mat-button color="warn" (click)="removeIntent(i)" [disabled]="!canEdit">
                         <mat-icon>delete</mat-icon>
                         Delete
                       </button>
@@ -181,15 +200,34 @@
                         <p>{{ intent.get('detection_prompt')?.value || 'Not set' }}</p>
                       </div>
                       
-                      <div class="summary-item" *ngIf="getIntentExamples(i).length > 0">
-                        <strong>Examples:</strong>
+                      <div class="summary-item" *ngIf="getLocalizedExamples(intent.get('examples')?.value, selectedExampleLocale).length > 0">
+                        <strong>Examples ({{ selectedExampleLocale }}):</strong>
                         <mat-chip-listbox>
-                          <mat-chip-option *ngFor="let example of getIntentExamples(i).controls">
-                            {{ example.value }}
+                          <mat-chip-option *ngFor="let example of getLocalizedExamples(intent.get('examples')?.value, selectedExampleLocale)">
+                            {{ example.example }}
                           </mat-chip-option>
                         </mat-chip-listbox>
                       </div>
 
+                      <div class="summary-item" *ngIf="canEdit">
+                        <strong>Examples ({{ selectedExampleLocale }}):</strong>
+                        <div class="examples-display">
+                          <mat-form-field appearance="outline" class="full-width">
+                            <mat-label>Add Example</mat-label>
+                            <input matInput #exampleInput 
+                                   placeholder="Type an example and press Enter"
+                                   (keyup.enter)="addLocalizedExample(i, exampleInput.value); exampleInput.value=''"
+                                   [disabled]="!canEdit">
+                          </mat-form-field>
+                          <mat-chip-row *ngFor="let example of getLocalizedExamples(intent.get('examples')?.value, selectedExampleLocale)"
+                                        (removed)="removeLocalizedExample(i, example)"
+                                        [removable]="canEdit">
+                            {{ example.example }}
+                            <mat-icon matChipRemove *ngIf="canEdit">cancel</mat-icon>
+                          </mat-chip-row>
+                        </div>
+                      </div>
+
                       <div class="summary-item" *ngIf="getIntentParameters(i).length > 0">
                         <strong>Parameters:</strong>
                         <mat-list>
@@ -208,7 +246,7 @@
               <div class="empty-state" *ngIf="intents.length === 0">
                 <mat-icon>psychology</mat-icon>
                 <p>No intents defined yet.</p>
-                <button mat-raised-button color="primary" (click)="addIntent()">
+                <button mat-raised-button color="primary" (click)="addIntent()" [disabled]="!canEdit">
                   Add First Intent
                 </button>
               </div>
@@ -292,7 +330,7 @@
   <button mat-raised-button 
           color="primary" 
           (click)="saveVersion()"
-          [disabled]="!selectedVersion || selectedVersion.published || versionForm.invalid || saving">
+          [disabled]="!selectedVersion || !canEdit || versionForm.invalid || saving">
     {{ saving ? 'Saving...' : 'Save Changes' }}
   </button>
   <button mat-raised-button