client/src/app/+signup/+register/register.component.ts

   1 import { Component, OnInit, ViewChild } from '@angular/core'
   2 import { AuthService, Notifier, RedirectService, ServerService } from '@app/core'
   3 import { UserService, UserValidatorsService } from '@app/shared'
   4 import { I18n } from '@ngx-translate/i18n-polyfill'
   5 import { UserRegister } from '@shared/models/users/user-register.model'
   6 import { FormGroup } from '@angular/forms'
   7 import { About } from '@shared/models/server'
   8 import { InstanceService } from '@app/shared/instance/instance.service'
   9 import { HooksService } from '@app/core/plugins/hooks.service'
  10 import { NgbAccordion } from '@ng-bootstrap/ng-bootstrap'
  11
  12 @Component({
  13   selector: 'my-register',
  14   templateUrl: './register.component.html',
  15   styleUrls: [ './register.component.scss' ]
  16 })
  17 export class RegisterComponent implements OnInit {
  18   @ViewChild('accordion', { static: true }) accordion: NgbAccordion
  19
  20   info: string = null
  21   error: string = null
  22   success: string = null
  23   signupDone = false
  24
  25   about: About
  26   aboutHtml = {
  27     description: '',
  28     terms: '',
  29     codeOfConduct: '',
  30     moderationInformation: '',
  31     administrator: ''
  32   }
  33
  34   formStepUser: FormGroup
  35   formStepChannel: FormGroup
  36
  37   constructor (
  38     private authService: AuthService,
  39     private userValidatorsService: UserValidatorsService,
  40     private notifier: Notifier,
  41     private userService: UserService,
  42     private serverService: ServerService,
  43     private redirectService: RedirectService,
  44     private instanceService: InstanceService,
  45     private hooks: HooksService,
  46     private i18n: I18n
  47   ) {
  48   }
  49
  50   get requiresEmailVerification () {
  51     return this.serverService.getConfig().signup.requiresEmailVerification
  52   }
  53
  54   ngOnInit (): void {
  55     this.instanceService.getAbout()
  56       .subscribe(
  57         async about => {
  58           this.about = about
  59
  60           this.aboutHtml = await this.instanceService.buildHtml(about)
  61         },
  62
  63         err => this.notifier.error(err.message)
  64       )
  65
  66     this.hooks.runAction('action:signup.register.init', 'signup')
  67   }
  68
  69   hasSameChannelAndAccountNames () {
  70     return this.getUsername() === this.getChannelName()
  71   }
  72
  73   getUsername () {
  74     if (!this.formStepUser) return undefined
  75
  76     return this.formStepUser.value['username']
  77   }
  78
  79   getChannelName () {
  80     if (!this.formStepChannel) return undefined
  81
  82     return this.formStepChannel.value['name']
  83   }
  84
  85   onUserFormBuilt (form: FormGroup) {
  86     this.formStepUser = form
  87   }
  88
  89   onChannelFormBuilt (form: FormGroup) {
  90     this.formStepChannel = form
  91   }
  92
  93   onTermsClick () {
  94     if (this.accordion) this.accordion.toggle('terms')
  95   }
  96
  97   onCodeOfConductClick () {
  98     if (this.accordion) this.accordion.toggle('code-of-conduct')
  99   }
 100
 101   async signup () {
 102     this.error = null
 103
 104     const body: UserRegister = await this.hooks.wrapObject(
 105       Object.assign(this.formStepUser.value, { channel: this.formStepChannel.value }),
 106       'signup',
 107       'filter:api.signup.registration.create.params'
 108     )
 109
 110     this.userService.signup(body).subscribe(
 111       () => {
 112         this.signupDone = true
 113
 114         if (this.requiresEmailVerification) {
 115           this.info = this.i18n('Now please check your emails to verify your account and complete signup.')
 116           return
 117         }
 118
 119         // Auto login
 120         this.authService.login(body.username, body.password)
 121             .subscribe(
 122               () => {
 123                 this.success = this.i18n('You are now logged in as {{username}}!', { username: body.username })
 124               },
 125
 126               err => this.error = err.message
 127             )
 128       },
 129
 130       err => this.error = err.message
 131     )
 132   }
 133 }