Merge pull request #1 from laxerhd/bugfix/lectures/disable-submit-but…

…ton-on-invalid-form Bugfix/lectures/disable submit button on invalid form
laxerhd · Nov 24, 2024 · 8e3133e · 8e3133e
2 parents 42ab4d0 + 5472b4b
commit 8e3133e
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 15 deletions.
diff --git a/...ure-unit/lecture-unit-management/attachment-unit-form/attachment-unit-form.component.html b/...ure-unit/lecture-unit-management/attachment-unit-form/attachment-unit-form.component.html
@@ -63,7 +63,6 @@
                 @if (isFileTooBig()) {
                     <div class="alert alert-danger">
                         {{ 'artemisApp.attachmentUnit.createAttachmentUnit.fileTooBig' | artemisTranslate }}
-                        {{ 'artemisApp.attachmentUnit.createAttachmentUnit.fileLimitation' | artemisTranslate }}
                     </div>
                 }
                 @if (!fileName() && fileInputTouched) {
@@ -105,20 +104,7 @@
             </div>
             <div class="row">
                 <div class="col-12">
-                    <span
-                        [ngbTooltip]="
-                            !fileInputTouched && nameControl?.invalid
-                                ? ('artemisApp.attachmentUnit.createAttachmentUnit.nameRequiredValidationError' | artemisTranslate) +
-                                  ' ' +
-                                  ('artemisApp.attachmentUnit.createAttachmentUnit.fileRequiredValidationError' | artemisTranslate)
-                                : !fileInputTouched
-                                  ? ('artemisApp.attachmentUnit.createAttachmentUnit.fileRequiredValidationError' | artemisTranslate)
-                                  : nameControl?.invalid
-                                    ? ('artemisApp.attachmentUnit.createAttachmentUnit.nameRequiredValidationError' | artemisTranslate)
-                                    : null
-                        "
-                        container="body"
-                    >
+                    <span [ngbTooltip]="tooltipText" container="body" class="d-inline-block">
                         <button id="submitButton" class="btn btn-primary" type="submit" [disabled]="!isFormValid()">
                             <span jhiTranslate="entity.action.submit"></span>
                         </button>

diff --git a/...cture-unit/lecture-unit-management/attachment-unit-form/attachment-unit-form.component.ts b/...cture-unit/lecture-unit-management/attachment-unit-form/attachment-unit-form.component.ts
@@ -6,6 +6,7 @@ import { ACCEPTED_FILE_EXTENSIONS_FILE_BROWSER, ALLOWED_FILE_EXTENSIONS_HUMAN_RE
 import { CompetencyLectureUnitLink } from 'app/entities/competency.model';
 import { MAX_FILE_SIZE } from 'app/shared/constants/input.constants';
 import { toSignal } from '@angular/core/rxjs-interop';
+import { TranslateService } from '@ngx-translate/core';
 
 export interface AttachmentUnitFormData {
     formProperties: FormProperties;
@@ -56,6 +57,7 @@ export class AttachmentUnitFormComponent implements OnChanges {
     fileName = signal<string | undefined>(undefined);
     isFileTooBig = signal<boolean>(false);
 
+    private readonly translateService = inject(TranslateService);
     private readonly formBuilder = inject(FormBuilder);
     form: FormGroup = this.formBuilder.group({
         name: [undefined as string | undefined, [Validators.required, Validators.maxLength(255)]],
@@ -94,6 +96,23 @@ export class AttachmentUnitFormComponent implements OnChanges {
         this.isFileTooBig.set(this.file.size > MAX_FILE_SIZE);
     }
 
+    get tooltipText(): string | null {
+        if (!this.fileInputTouched && this.nameControl?.invalid) {
+            return (
+                this.translateService.instant('artemisApp.attachmentUnit.createAttachmentUnit.nameRequiredValidationError') +
+                ' ' +
+                this.translateService.instant('artemisApp.attachmentUnit.createAttachmentUnit.fileRequiredValidationError')
+            );
+        }
+        if (!this.fileInputTouched) {
+            return this.translateService.instant('artemisApp.attachmentUnit.createAttachmentUnit.fileRequiredValidationError');
+        }
+        if (this.nameControl?.invalid) {
+            return this.translateService.instant('artemisApp.attachmentUnit.createAttachmentUnit.nameRequiredValidationError');
+        }
+        return null;
+    }
+
     get nameControl() {
         return this.form.get('name');
     }