diff --git a/src/app/components/add-callback-dialog/add-callback-dialog.component.html b/src/app/components/add-callback-dialog/add-callback-dialog.component.html index fc73d2a9..3254ec48 100644 --- a/src/app/components/add-callback-dialog/add-callback-dialog.component.html +++ b/src/app/components/add-callback-dialog/add-callback-dialog.component.html @@ -58,7 +58,7 @@

{{ isEditMode ? 'Edit Callback' : 'Add ' + callbackType + ' #callbackNameInput="ngModel" (ngModelChange)="validate()" [errorStateMatcher]="matcher" - (keydown.enter)="addCallback()" + (keydown.enter)="addCallback($event)" matInput> Same callback name has been used Cannot have callback consist of two words diff --git a/src/app/components/add-callback-dialog/add-callback-dialog.component.spec.ts b/src/app/components/add-callback-dialog/add-callback-dialog.component.spec.ts index af7f5534..24f00086 100644 --- a/src/app/components/add-callback-dialog/add-callback-dialog.component.spec.ts +++ b/src/app/components/add-callback-dialog/add-callback-dialog.component.spec.ts @@ -16,6 +16,7 @@ */ import { ComponentFixture, TestBed } from '@angular/core/testing'; +import { By } from '@angular/platform-browser'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; // 1p-ONLY-IMPORTS: import {beforeEach, describe, expect, it} @@ -101,6 +102,20 @@ describe('AddCallbackDialogComponent', () => { expect(mockDialogRef.close).not.toHaveBeenCalled(); }); + it('should not submit while an IME composition is active', () => { + component.callbackName = 'ใƒ†ใ‚นใƒˆ'; + component.callbackType = 'before_agent'; + fixture.detectChanges(); + + const input = fixture.debugElement.query(By.css('input')); + input.triggerEventHandler( + 'keydown.enter', + new KeyboardEvent('keydown', {key: 'Enter', isComposing: true}), + ); + + expect(mockDialogRef.close).not.toHaveBeenCalled(); + }); + it('should close dialog without data when cancel is called', () => { component.cancel(); diff --git a/src/app/components/add-callback-dialog/add-callback-dialog.component.ts b/src/app/components/add-callback-dialog/add-callback-dialog.component.ts index 7f047ac3..c39f289b 100644 --- a/src/app/components/add-callback-dialog/add-callback-dialog.component.ts +++ b/src/app/components/add-callback-dialog/add-callback-dialog.component.ts @@ -35,6 +35,7 @@ import { MatSelectModule } from '@angular/material/select'; import { CallbackNode } from '../../core/models/AgentBuilder'; import { TooltipUtil, CallbackInfo } from '../../../utils/tooltip-util'; import { MatIconModule } from '@angular/material/icon'; +import {isImeComposing} from '../../utils/keyboard-event.utils'; /** Error when invalid control is dirty, touched, or submitted. */ export class ImmediateErrorStateMatcher implements ErrorStateMatcher { @@ -98,7 +99,11 @@ export class AddCallbackDialogComponent { } } - addCallback() { + addCallback(event?: Event) { + if (isImeComposing(event)) { + return; + } + if (!this.callbackName.trim() || this.hasSpaces() || this.isDuplicateName()) { return; } diff --git a/src/app/components/add-item-dialog/add-item-dialog.component.html b/src/app/components/add-item-dialog/add-item-dialog.component.html index 3953e8c4..96967ede 100644 --- a/src/app/components/add-item-dialog/add-item-dialog.component.html +++ b/src/app/components/add-item-dialog/add-item-dialog.component.html @@ -20,7 +20,7 @@

Create a new app

+ (keydown.enter)="createNewApp($event)"> @if (!isNameValid()) { Start with a letter or underscore, and contain only letters, digits, and underscores. diff --git a/src/app/components/add-item-dialog/add-item-dialog.component.ts b/src/app/components/add-item-dialog/add-item-dialog.component.ts index b8300046..16064578 100644 --- a/src/app/components/add-item-dialog/add-item-dialog.component.ts +++ b/src/app/components/add-item-dialog/add-item-dialog.component.ts @@ -32,6 +32,7 @@ import { MatFormField, MatHint } from '@angular/material/form-field'; import { MatInput } from '@angular/material/input'; import { FormsModule } from '@angular/forms'; import { MatButton } from '@angular/material/button'; +import {isImeComposing} from '../../utils/keyboard-event.utils'; @Component({ changeDetection: ChangeDetectionStrategy.Default, @@ -84,7 +85,11 @@ export class AddItemDialogComponent { public dialogRef: MatDialogRef, ) {} - createNewApp() { + createNewApp(event?: Event) { + if (isImeComposing(event)) { + return; + } + const trimmedName = this.newAppName.trim(); // Check validation first diff --git a/src/app/components/add-tool-dialog/add-tool-dialog.component.html b/src/app/components/add-tool-dialog/add-tool-dialog.component.html index 9ccc5130..a215b73b 100644 --- a/src/app/components/add-tool-dialog/add-tool-dialog.component.html +++ b/src/app/components/add-tool-dialog/add-tool-dialog.component.html @@ -49,7 +49,7 @@

{{ isEditMode ? 'Editing Tool' : 'Add [(ngModel)]="toolName" matInput placeholder="Enter full function name" - (keydown.enter)="addTool()"> + (keydown.enter)="addTool($event)"> } diff --git a/src/app/components/add-tool-dialog/add-tool-dialog.component.ts b/src/app/components/add-tool-dialog/add-tool-dialog.component.ts index c02062a8..af2991f1 100644 --- a/src/app/components/add-tool-dialog/add-tool-dialog.component.ts +++ b/src/app/components/add-tool-dialog/add-tool-dialog.component.ts @@ -25,6 +25,7 @@ import { MatInput } from '@angular/material/input'; import { MatOption, MatSelect } from '@angular/material/select'; import { MatIcon } from '@angular/material/icon'; import { TooltipUtil } from '../../../utils/tooltip-util'; +import {isImeComposing} from '../../utils/keyboard-event.utils'; @Component({ changeDetection: ChangeDetectionStrategy.Default, @@ -90,7 +91,11 @@ export class AddToolDialogComponent implements OnInit{ } } - addTool() { + addTool(event?: Event) { + if (isImeComposing(event)) { + return; + } + if (this.toolType === 'Function tool' && !this.toolName.trim()) { return; } diff --git a/src/app/components/eval-tab/add-eval-session-dialog/add-eval-session-dialog/add-eval-session-dialog.component.html b/src/app/components/eval-tab/add-eval-session-dialog/add-eval-session-dialog/add-eval-session-dialog.component.html index a42f8fe5..2ec92603 100644 --- a/src/app/components/eval-tab/add-eval-session-dialog/add-eval-session-dialog/add-eval-session-dialog.component.html +++ b/src/app/components/eval-tab/add-eval-session-dialog/add-eval-session-dialog/add-eval-session-dialog.component.html @@ -24,10 +24,10 @@

Add Current Session To Eval Set

} @else { - + } - \ No newline at end of file + diff --git a/src/app/components/eval-tab/add-eval-session-dialog/add-eval-session-dialog/add-eval-session-dialog.component.ts b/src/app/components/eval-tab/add-eval-session-dialog/add-eval-session-dialog/add-eval-session-dialog.component.ts index 8707b81c..2ff06af3 100644 --- a/src/app/components/eval-tab/add-eval-session-dialog/add-eval-session-dialog/add-eval-session-dialog.component.ts +++ b/src/app/components/eval-tab/add-eval-session-dialog/add-eval-session-dialog/add-eval-session-dialog.component.ts @@ -25,6 +25,7 @@ import { MatInput } from '@angular/material/input'; import { FormsModule } from '@angular/forms'; import { MatButton } from '@angular/material/button'; import { MatProgressSpinner } from '@angular/material/progress-spinner'; +import {isImeComposing} from '../../../../utils/keyboard-event.utils'; @Component({ changeDetection: ChangeDetectionStrategy.Default, @@ -61,7 +62,11 @@ export class AddEvalSessionDialogComponent { constructor() {} - createNewEvalCase() { + createNewEvalCase(event?: Event) { + if (isImeComposing(event)) { + return; + } + if (!this.newCaseId || this.newCaseId == '') { alert('Cannot create eval set with empty id!'); } else { diff --git a/src/app/components/eval-tab/new-eval-set-dialog/new-eval-set-dialog-component/new-eval-set-dialog-component.component.html b/src/app/components/eval-tab/new-eval-set-dialog/new-eval-set-dialog-component/new-eval-set-dialog-component.component.html index 660fa84f..9af39fa0 100644 --- a/src/app/components/eval-tab/new-eval-set-dialog/new-eval-set-dialog-component/new-eval-set-dialog-component.component.html +++ b/src/app/components/eval-tab/new-eval-set-dialog/new-eval-set-dialog-component/new-eval-set-dialog-component.component.html @@ -20,7 +20,7 @@

Create New Eval Set

Eval Set Name - + @if (isEvalV2Enabled) { @@ -34,4 +34,4 @@

Create New Eval Set

- \ No newline at end of file + diff --git a/src/app/components/eval-tab/new-eval-set-dialog/new-eval-set-dialog-component/new-eval-set-dialog-component.component.ts b/src/app/components/eval-tab/new-eval-set-dialog/new-eval-set-dialog-component/new-eval-set-dialog-component.component.ts index 4a9ffcb8..b552b3ba 100644 --- a/src/app/components/eval-tab/new-eval-set-dialog/new-eval-set-dialog-component/new-eval-set-dialog-component.component.ts +++ b/src/app/components/eval-tab/new-eval-set-dialog/new-eval-set-dialog-component/new-eval-set-dialog-component.component.ts @@ -26,6 +26,7 @@ import { MatInput } from '@angular/material/input'; import { FormsModule } from '@angular/forms'; import { MatButton } from '@angular/material/button'; import { MatSelectModule } from '@angular/material/select'; +import {isImeComposing} from '../../../../utils/keyboard-event.utils'; @Component({ changeDetection: ChangeDetectionStrategy.Default, @@ -61,7 +62,11 @@ export class NewEvalSetDialogComponentComponent { }); } - createNewEvalSet() { + createNewEvalSet(event?: Event) { + if (isImeComposing(event)) { + return; + } + if (!this.newSetId || this.newSetId == '') { alert('Cannot create eval set with empty id!'); } else { diff --git a/src/app/components/long-running-response/long-running-response.html b/src/app/components/long-running-response/long-running-response.html index 30410605..fa520e1d 100644 --- a/src/app/components/long-running-response/long-running-response.html +++ b/src/app/components/long-running-response/long-running-response.html @@ -110,7 +110,7 @@ } } @else { -