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

   1 import { Component, OnInit, ViewChild } from '@angular/core'
   2 import { FormGroup } from '@angular/forms'
   3 import { ActivatedRoute } from '@angular/router'
   4 import { AuthService, Notifier, UserService } from '@app/core'
   5 import { HooksService } from '@app/core/plugins/hooks.service'
   6 import { InstanceService } from '@app/shared/shared-instance'
   7 import { NgbAccordion } from '@ng-bootstrap/ng-bootstrap'
   8 import { UserRegister } from '@shared/models'
   9 import { About, ServerConfig } from '@shared/models/server'
  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   private serverConfig: ServerConfig
  37
  38   constructor (
  39     private route: ActivatedRoute,
  40     private authService: AuthService,
  41     private notifier: Notifier,
  42     private userService: UserService,
  43     private instanceService: InstanceService,
  44     private hooks: HooksService
  45     ) {
  46   }
  47
  48   get requiresEmailVerification () {
  49     return this.serverConfig.signup.requiresEmailVerification
  50   }
  51
  52   ngOnInit (): void {
  53     this.serverConfig = this.route.snapshot.data.serverConfig
  54
  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 = $localize`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 = $localize`You are now logged in as ${body.username}!`
 124               },
 125
 126               err => this.error = err.message
 127             )
 128       },
 129
 130       err => this.error = err.message
 131     )
 132   }
 133 }