Merge remote-tracking branch 'weblate/develop' into develop

[github/Chocobozzz/PeerTube.git] / client / src / app / +signup / +register / register-step-channel.component.ts

diff --git a/client/src/app/+signup/+register/register-step-channel.component.ts b/client/src/app/+signup/+register/register-step-channel.component.ts
index 9e13f75b39d616c55adb77028b5a243993580b61..d965a786550697e5a4bd54f53b2ecda715805fe9 100644 (file)
--- a/client/src/app/+signup/+register/register-step-channel.component.ts
+++ b/client/src/app/+signup/+register/register-step-channel.component.ts
@@ -1,8 +1,10 @@
+import { concat, of } from 'rxjs'
+import { pairwise } from 'rxjs/operators'
 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
-import { AuthService } from '@app/core'
-import { FormReactive, VideoChannelValidatorsService } from '@app/shared'
-import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
 import { FormGroup } from '@angular/forms'
+import { UserService } from '@app/core'
+import { VIDEO_CHANNEL_DISPLAY_NAME_VALIDATOR, VIDEO_CHANNEL_NAME_VALIDATOR } from '@app/shared/form-validators/video-channel-validators'
+import { FormReactive, FormValidatorService } from '@app/shared/shared-forms'
 
 @Component({
   selector: 'my-register-step-channel',
@@ -15,8 +17,7 @@ export class RegisterStepChannelComponent extends FormReactive implements OnInit
 
   constructor (
     protected formValidatorService: FormValidatorService,
-    private authService: AuthService,
-    private videoChannelValidatorsService: VideoChannelValidatorsService
+    private userService: UserService
   ) {
     super()
   }
@@ -25,16 +26,29 @@ export class RegisterStepChannelComponent extends FormReactive implements OnInit
     return window.location.host
   }
 
-  isSameThanUsername () {
-    return this.username && this.username === this.form.value['name']
-  }
-
   ngOnInit () {
     this.buildForm({
-      name: this.videoChannelValidatorsService.VIDEO_CHANNEL_NAME,
-      displayName: this.videoChannelValidatorsService.VIDEO_CHANNEL_DISPLAY_NAME
+      displayName: VIDEO_CHANNEL_DISPLAY_NAME_VALIDATOR,
+      name: VIDEO_CHANNEL_NAME_VALIDATOR
     })
 
     setTimeout(() => this.formBuilt.emit(this.form))
+
+    concat(
+      of(''),
+      this.form.get('displayName').valueChanges
+    ).pipe(pairwise())
+     .subscribe(([ oldValue, newValue ]) => this.onDisplayNameChange(oldValue, newValue))
+  }
+
+  isSameThanUsername () {
+    return this.username && this.username === this.form.value['name']
+  }
+
+  private onDisplayNameChange (oldDisplayName: string, newDisplayName: string) {
+    const name = this.form.value['name'] || ''
+
+    const newName = this.userService.getNewUsername(oldDisplayName, newDisplayName, name)
+    this.form.patchValue({ name: newName })
   }
 }