feat: u#2887 full name may contain special characters

kaleidos-ventures · Sep 4, 2023 · 753e287 · 753e287
1 parent 7e49338
commit 753e287
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 0 deletions.
diff --git a/...t/apps/taiga/src/app/modules/auth/feature-sign-up/components/signup/signup.component.html b/...t/apps/taiga/src/app/modules/auth/feature-sign-up/components/signup/signup.component.html
@@ -29,6 +29,14 @@
         </tg-ui-error>
       </ng-container>
     </tg-ui-input>
+    <tg-ui-inline-notification
+      aria-live="polite"
+      status="warning"
+      *ngIf="fullNameOnlyEmojis">
+      <p>
+        {{ t('signup.warnings.only_emojis') }}
+      </p>
+    </tg-ui-inline-notification>
 
     <tg-ui-input
       class="input-email"

diff --git a/...ipt/apps/taiga/src/app/modules/auth/feature-sign-up/components/signup/signup.component.ts b/...ipt/apps/taiga/src/app/modules/auth/feature-sign-up/components/signup/signup.component.ts
@@ -10,12 +10,15 @@ import {
   ChangeDetectionStrategy,
   ChangeDetectorRef,
   Component,
+  DestroyRef,
   ElementRef,
   EventEmitter,
   Input,
   OnInit,
   Output,
+  inject,
 } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import {
   FormBuilder,
   FormControl,
@@ -29,6 +32,7 @@ import { Actions, ofType } from '@ngrx/effects';
 import { Store } from '@ngrx/store';
 import { TuiLinkModule } from '@taiga-ui/core';
 import { InvitationParams, SignUpError } from '@taiga/data';
+import { InlineNotificationComponent } from '@taiga/ui/inline-notification';
 import { InputsModule } from '@taiga/ui/inputs/inputs.module';
 import { PasswordStrengthComponent } from '@taiga/ui/inputs/password-strength/password-strength.component';
 import {
@@ -57,6 +61,7 @@ import { GetUrlPipeModule } from '~/app/shared/pipes/get-url/get-url.pipe.module
     ButtonLoadingModule,
     TuiLinkModule,
     ExternalLinkModule,
+    InlineNotificationComponent,
   ],
   providers: [
     {
@@ -84,7 +89,10 @@ export class SignupComponent implements OnInit {
   @Output()
   public signUpSuccess = new EventEmitter();
 
+  public destroyRef = inject(DestroyRef);
+
   public signUpForm!: FormGroup;
+  public fullNameOnlyEmojis = false;
 
   constructor(
     private fb: FormBuilder,
@@ -143,6 +151,13 @@ export class SignupComponent implements OnInit {
     if (this.data) {
       this.signUpForm.setValue(this.data);
     }
+
+    this.signUpForm
+      .get('fullName')
+      ?.valueChanges.pipe(takeUntilDestroyed(this.destroyRef))
+      .subscribe((value: string) => {
+        this.fullNameOnlyEmojis = this.isOnlyEmojis(value);
+      });
   }
 
   public onSubmit() {
@@ -174,4 +189,11 @@ export class SignupComponent implements OnInit {
   public signUpDone() {
     this.signUpSuccess.next(this.signUpForm.value);
   }
+
+  public isOnlyEmojis(str: string): boolean {
+    const regEx =
+      /^(\u00a9|\u00ae|[\u2000-\u3300]|\ud83c[\ud000-\udfff]|\ud83d[\ud000-\udfff]|\ud83e[\ud000-\udfff])+$/g;
+
+    return regEx.test(str.replaceAll(' ', '').trim());
+  }
 }
diff --git a/javascript/apps/taiga/src/assets/i18n/auth/en-US.json b/javascript/apps/taiga/src/assets/i18n/auth/en-US.json
@@ -38,6 +38,9 @@
       "resend_email_label": "Sorry, something went wrong sending the email",
       "resend_email_message": "Wait a few minutes and try again"
     },
+    "warnings": {
+      "only_emojis": "Some people might not understand your full name correctly if it only has emojis."
+    },
     "delete_account_success_title": "Your account was deleted successfully.",
     "delete_account_success_subtitle": "👋 Sorry to see you go!"
   },