diff --git a/src/SIL.XForge.Scripture/ClientApp/src/app/translate/editor/note-dialog/note-dialog.component.html b/src/SIL.XForge.Scripture/ClientApp/src/app/translate/editor/note-dialog/note-dialog.component.html index b6297a1242..2cc9869ec0 100644 --- a/src/SIL.XForge.Scripture/ClientApp/src/app/translate/editor/note-dialog/note-dialog.component.html +++ b/src/SIL.XForge.Scripture/ClientApp/src/app/translate/editor/note-dialog/note-dialog.component.html @@ -67,10 +67,13 @@

} @if (canInsertNote) { - - {{ t("your_comment") }} - - +
+ + {{ t("your_comment") }} + + {{ t("required") }} + +
} diff --git a/src/SIL.XForge.Scripture/ClientApp/src/app/translate/editor/note-dialog/note-dialog.component.scss b/src/SIL.XForge.Scripture/ClientApp/src/app/translate/editor/note-dialog/note-dialog.component.scss index 15f6468f7b..7d886ce2cd 100644 --- a/src/SIL.XForge.Scripture/ClientApp/src/app/translate/editor/note-dialog/note-dialog.component.scss +++ b/src/SIL.XForge.Scripture/ClientApp/src/app/translate/editor/note-dialog/note-dialog.component.scss @@ -122,8 +122,8 @@ h1 { } .save-options { - background-color: variables.$sf_grey; - color: white; + background-color: variables.$sf_grey !important; + color: white !important; ::ng-deep .mat-button-toggle-label-content { line-height: 36px; } diff --git a/src/SIL.XForge.Scripture/ClientApp/src/app/translate/editor/note-dialog/note-dialog.component.spec.ts b/src/SIL.XForge.Scripture/ClientApp/src/app/translate/editor/note-dialog/note-dialog.component.spec.ts index efea7f21d5..150b7206ab 100644 --- a/src/SIL.XForge.Scripture/ClientApp/src/app/translate/editor/note-dialog/note-dialog.component.spec.ts +++ b/src/SIL.XForge.Scripture/ClientApp/src/app/translate/editor/note-dialog/note-dialog.component.spec.ts @@ -350,8 +350,8 @@ describe('NoteDialogComponent', () => { env = new TestEnvironment({ verseRef: new VerseRef('MAT 1:1') }); expect(env.noteInputElement).toBeTruthy(); env.submit(); + expect(env.noteInputElement).toBeTruthy(); verify(mockedProjectService.createNoteThread(anything(), anything())).never(); - expect(env.dialogResult).toBeFalsy(); })); it('does not show text area for users without write permissions', fakeAsync(() => { diff --git a/src/SIL.XForge.Scripture/ClientApp/src/app/translate/editor/note-dialog/note-dialog.component.ts b/src/SIL.XForge.Scripture/ClientApp/src/app/translate/editor/note-dialog/note-dialog.component.ts index ff678b1b7a..535e5fbc74 100644 --- a/src/SIL.XForge.Scripture/ClientApp/src/app/translate/editor/note-dialog/note-dialog.component.ts +++ b/src/SIL.XForge.Scripture/ClientApp/src/app/translate/editor/note-dialog/note-dialog.component.ts @@ -1,4 +1,5 @@ import { Component, Inject, OnInit } from '@angular/core'; +import { FormControl, FormGroup, Validators } from '@angular/forms'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; import { translate } from '@ngneat/transloco'; import { VerseRef } from '@sillsdev/scripture'; @@ -65,9 +66,9 @@ interface NoteDisplayInfo { }) export class NoteDialogComponent implements OnInit { showSegmentText: boolean = false; - currentNoteContent: string = ''; notesToDisplay: NoteDisplayInfo[] = []; - saveOption: 'save' | 'resolve' = 'save'; + _saveOption: 'save' | 'resolve' = 'save'; + noteDialogForm: FormGroup = new FormGroup({ comment: new FormControl('', Validators.required) }); private biblicalTermDoc?: BiblicalTermDoc; private isAssignedToOtherUser: boolean = false; @@ -197,6 +198,24 @@ export class NoteDialogComponent implements OnInit { ); } + set saveOption(option: 'save' | 'resolve') { + if (option === 'resolve') { + this.noteDialogForm.controls.comment.clearValidators(); + } else { + this.noteDialogForm.controls.comment.setValidators(Validators.required); + } + this.noteDialogForm.updateValueAndValidity(); + this._saveOption = option; + } + + get saveOption(): 'save' | 'resolve' { + return this._saveOption; + } + + get currentNoteContent(): string { + return this.noteDialogForm.controls.comment.value ?? ''; + } + private get defaultNoteTagId(): number | undefined { return this.projectProfileDoc?.data?.translateConfig.defaultNoteTagId; } @@ -233,7 +252,7 @@ export class NoteDialogComponent implements OnInit { editNote(note: Note): void { this.noteIdBeingEdited = note.dataId; - this.currentNoteContent = XmlUtils.decodeFromXml(note.content ?? ''); + this.noteDialogForm.controls.comment.setValue(XmlUtils.decodeFromXml(note.content ?? '')); this.notesToDisplay.pop(); } @@ -311,12 +330,13 @@ export class NoteDialogComponent implements OnInit { } submit(): void { - if (this.saveOption === 'resolve') { + if (this._saveOption === 'resolve') { return this.resolve(); } - if (this.currentNoteContent.trim().length === 0) { - return this.close(); + if (!this.noteDialogForm.valid) { + this.noteDialogForm.markAllAsTouched(); + return; } this.dialogRef.close({ diff --git a/src/SIL.XForge.Scripture/ClientApp/src/assets/i18n/non_checking_en.json b/src/SIL.XForge.Scripture/ClientApp/src/assets/i18n/non_checking_en.json index 7143492e93..5c5f1ea622 100644 --- a/src/SIL.XForge.Scripture/ClientApp/src/assets/i18n/non_checking_en.json +++ b/src/SIL.XForge.Scripture/ClientApp/src/assets/i18n/non_checking_en.json @@ -377,6 +377,7 @@ "paratext_user": "Assigned to a Paratext user", "permanently_delete_note": "Permanently delete this comment?", "reattached": "(Re-attached)", + "required": "Required", "resolve": "Save and resolve", "save": "Save", "show_changes": "Show changes",