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