fix(ngx-components): missing validation, profile is undefined error, …

…i18n
IPS-LMU · Nov 20, 2024 · 32d4997 · 32d4997
1 parent 7299a37
commit 32d4997
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 39 deletions.
diff --git a/libs/ngx-components/src/lib/components/bugreport-modal/bugreport-modal.component.html b/libs/ngx-components/src/lib/components/bugreport-modal/bugreport-modal.component.html
@@ -16,12 +16,6 @@ <h5 class="modal-title" id="modal-title">
     </p>
     @if (sendStatus === 'error') {
     <div [innerHTML]="i18n.error" class="alert alert-danger bugsent">
-      <!-- {
-                email:
-                  '<a href=\'mailto:octra@phonetik.uni-muenchen.de?body=' +
-                  bgdescr +
-                  '\'>octra@phonetik.uni-muenchen.de</a>'
-              }  -->
     </div>
     } @else if (sendStatus === 'success') {
     <div class="alert alert-success bugsent">
@@ -33,7 +27,7 @@ <h5 class="modal-title" id="modal-title">
       </div>
     }
 
-    <form>
+    <form #form=ngForm>
       @if (showSenderFields) {
       <div class="row">
         <div class="col-6">
@@ -44,6 +38,7 @@ <h5 class="modal-title" id="modal-title">
               id="inputName"
               name="name"
               aria-describedby="name"
+              [required]="true"
               [placeholder]="i18n.name"
               [(ngModel)]="name"
             />
@@ -58,7 +53,9 @@ <h5 class="modal-title" id="modal-title">
               id="inputEmail"
               name="email"
               aria-describedby="email"
+              [pattern]="'[^@]+\\@.+\\.[^.]+$'"
               [(ngModel)]="email"
+              [required]="true"
               placeholder="email@example.com"
             />
             <label for="inputEmail" class="form-label">{{
@@ -181,7 +178,7 @@ <h5 class="modal-title" id="modal-title">
     </button>
     <button
       (click)="sendBugReport()"
-      [disabled]="!isvalid || sendStatus === 'sending' || sendStatus === 'success'"
+      [disabled]="!form.valid || !isvalid || sendStatus === 'sending' || sendStatus === 'success'"
       class="btn btn-primary"
       type="button"
     >

diff --git a/libs/ngx-components/src/lib/components/bugreport-modal/bugreport-modal.component.ts b/libs/ngx-components/src/lib/components/bugreport-modal/bugreport-modal.component.ts
@@ -3,7 +3,6 @@ import {
   ChangeDetectorRef,
   Component,
   EventEmitter,
-  OnInit,
   ViewChild,
 } from '@angular/core';
 import { FormsModule } from '@angular/forms';
@@ -18,7 +17,7 @@ const defaultTranslations: BugReportTranslations = {
   error:
     'Unfortunately your feedback could not be sent to us. Please send us an e-mail to {{email}}.',
   introduction:
-    'Please tell us what you think about OCTRA. What can we do better? Did you find any bugs?',
+    'Please tell us what you think about this web application. What can we do better? Did you find any bugs?',
   bugReportSent: 'Your feedback was successfully reported \uD83D\uDE42',
   addProtocol: 'Add Protocol (recommended)',
   eMail: 'E-Mail',
@@ -28,7 +27,7 @@ const defaultTranslations: BugReportTranslations = {
   protocol: 'Protocol',
   abort: 'Abort',
   sendFeedback: 'Send Feedback',
-  sending: "Please wait for octra sending your feedback..."
+  sending: 'Please wait while sending your feedback...',
 };
 
 @Component({
@@ -40,7 +39,7 @@ const defaultTranslations: BugReportTranslations = {
 })
 export class BugreportModalComponent
   extends SubscriberComponent
-  implements OnInit, AfterViewInit
+  implements AfterViewInit
 {
   @ViewChild('editor') editor?: NgxJoditComponent;
   public static options: NgbModalOptions = {
@@ -76,30 +75,30 @@ export class BugreportModalComponent
   }[] = [];
   protected data = undefined;
 
-  _profile: {
+  _profile?: {
     email?: string;
     name?: string;
   } = {};
 
   protected set email(email: string) {
-    this._profile = email ? { ...this._profile, email } : {};
+    this._profile = { ...(this._profile ?? {}), ...(email ? { email } : {}) };
     this.profileChange.emit(this._profile);
   }
 
   protected get email(): string | undefined {
-    return this._profile.email;
+    return this._profile?.email;
   }
 
   protected set name(name: string | undefined) {
-    this._profile = name ? { ...this._profile, name } : {};
+    this._profile = { ...(this._profile ?? {}), ...(name ? { name } : {}) };
     this.profileChange.emit(this._profile);
   }
 
   protected get name(): string | undefined {
-    return this._profile.name;
+    return this._profile?.name;
   }
 
-  protected get profile(): { email?: string; name?: string } {
+  protected get profile(): { email?: string; name?: string } | undefined {
     return this._profile;
   }
 
@@ -108,7 +107,7 @@ export class BugreportModalComponent
     name?: string;
   }> = new EventEmitter();
 
-  pkgText = "";
+  pkgText = '';
 
   showSenderFields = true;
 
@@ -155,24 +154,6 @@ export class BugreportModalComponent
     super();
   }
 
-  ngOnInit() {
-    /*
-    if (this.appStorage.useMode !== 'online') {
-      this._profileName = this.appStorage.snapshot.user.name ?? '';
-      this._profileEmail = this.appStorage.snapshot.user.email ?? '';
-    } else {
-      this._profileName =
-        this.appStorage.snapshot.authentication.me?.username ?? '';
-      this._profileEmail =
-        this.appStorage.snapshot.authentication.me?.email ?? '';
-    }
-
-    setTimeout(() => {
-      this.bugService.getPackage();
-    }, 1000);
-     */
-  }
-
   onHidden() {
     this.visible = false;
     this.bugsent = false;
@@ -192,8 +173,8 @@ export class BugreportModalComponent
 
     this.sendStatus = 'sending';
     this.send.emit({
-      name: this.profile.name,
-      email: this.profile.email,
+      name: this.profile!.name,
+      email: this.profile!.email,
       message: this.bgdescr,
       sendProtocol: this.sendProObj,
       screenshots: this.screenshots,