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

   1 import { CdkStep } from '@angular/cdk/stepper'
   2 import { Component, OnInit, ViewChild } from '@angular/core'
   3 import { FormGroup } from '@angular/forms'
   4 import { ActivatedRoute } from '@angular/router'
   5 import { AuthService } from '@app/core'
   6 import { HooksService } from '@app/core/plugins/hooks.service'
   7 import { InstanceAboutAccordionComponent } from '@app/shared/shared-instance'
   8 import { NgbAccordion } from '@ng-bootstrap/ng-bootstrap'
   9 import { UserRegister } from '@shared/models'
  10 import { ServerConfig } from '@shared/models/server'
  11 import { SignupService } from '../shared/signup.service'
  12
  13 @Component({
  14   selector: 'my-register',
  15   templateUrl: './register.component.html',
  16   styleUrls: [ './register.component.scss' ]
  17 })
  18 export class RegisterComponent implements OnInit {
  19   @ViewChild('lastStep') lastStep: CdkStep
  20
  21   accordion: NgbAccordion
  22
  23   signupError: string
  24   signupSuccess = false
  25
  26   videoUploadDisabled: boolean
  27   videoQuota: number
  28
  29   formStepTerms: FormGroup
  30   formStepUser: FormGroup
  31   formStepChannel: FormGroup
  32
  33   aboutHtml = {
  34     codeOfConduct: ''
  35   }
  36
  37   instanceInformationPanels = {
  38     codeOfConduct: true,
  39     terms: true,
  40     administrators: false,
  41     features: false,
  42     moderation: false
  43   }
  44
  45   defaultPreviousStepButtonLabel = $localize`Go to the previous step`
  46   defaultNextStepButtonLabel = $localize`Go to the next step`
  47   stepUserButtonLabel = this.defaultNextStepButtonLabel
  48
  49   signupDisabled = false
  50
  51   private serverConfig: ServerConfig
  52
  53   constructor (
  54     private route: ActivatedRoute,
  55     private authService: AuthService,
  56     private signupService: SignupService,
  57     private hooks: HooksService
  58   ) { }
  59
  60   get requiresEmailVerification () {
  61     return this.serverConfig.signup.requiresEmailVerification
  62   }
  63
  64   get requiresApproval () {
  65     return this.serverConfig.signup.requiresApproval
  66   }
  67
  68   get minimumAge () {
  69     return this.serverConfig.signup.minimumAge
  70   }
  71
  72   get instanceName () {
  73     return this.serverConfig.instance.name
  74   }
  75
  76   ngOnInit () {
  77     this.serverConfig = this.route.snapshot.data.serverConfig
  78
  79     if (this.serverConfig.signup.allowed === false || this.serverConfig.signup.allowedForCurrentIP === false) {
  80       this.signupDisabled = true
  81       return
  82     }
  83
  84     this.videoQuota = this.serverConfig.user.videoQuota
  85     this.videoUploadDisabled = this.videoQuota === 0
  86
  87     this.stepUserButtonLabel = this.videoUploadDisabled
  88       ? $localize`:Button on the registration form to finalize the account and channel creation:Signup`
  89       : this.defaultNextStepButtonLabel
  90
  91     this.hooks.runAction('action:signup.register.init', 'signup')
  92
  93   }
  94
  95   hasSameChannelAndAccountNames () {
  96     return this.getUsername() === this.getChannelName()
  97   }
  98
  99   getUsername () {
 100     if (!this.formStepUser) return undefined
 101
 102     return this.formStepUser.value['username']
 103   }
 104
 105   getChannelName () {
 106     if (!this.formStepChannel) return undefined
 107
 108     return this.formStepChannel.value['name']
 109   }
 110
 111   onTermsFormBuilt (form: FormGroup) {
 112     this.formStepTerms = form
 113   }
 114
 115   onUserFormBuilt (form: FormGroup) {
 116     this.formStepUser = form
 117   }
 118
 119   onChannelFormBuilt (form: FormGroup) {
 120     this.formStepChannel = form
 121   }
 122
 123   onTermsClick () {
 124     if (this.accordion) this.accordion.toggle('terms')
 125   }
 126
 127   onCodeOfConductClick () {
 128     if (this.accordion) this.accordion.toggle('code-of-conduct')
 129   }
 130
 131   onInstanceAboutAccordionInit (instanceAboutAccordion: InstanceAboutAccordionComponent) {
 132     this.accordion = instanceAboutAccordion.accordion
 133     this.aboutHtml = instanceAboutAccordion.aboutHtml
 134   }
 135
 136   skipChannelCreation () {
 137     this.formStepChannel.reset()
 138     this.lastStep.select()
 139
 140     this.signup()
 141   }
 142
 143   async signup () {
 144     this.signupError = undefined
 145
 146     const termsForm = this.formStepTerms.value
 147     const userForm = this.formStepUser.value
 148     const channelForm = this.formStepChannel?.value
 149
 150     const channel = this.formStepChannel?.value?.name
 151       ? { name: channelForm?.name, displayName: channelForm?.displayName }
 152       : undefined
 153
 154     const body = await this.hooks.wrapObject(
 155       {
 156         username: userForm.username,
 157         password: userForm.password,
 158         email: userForm.email,
 159         displayName: userForm.displayName,
 160
 161         registrationReason: termsForm.registrationReason,
 162
 163         channel
 164       },
 165       'signup',
 166       'filter:api.signup.registration.create.params'
 167     )
 168
 169     const obs = this.requiresApproval
 170       ? this.signupService.requestSignup(body)
 171       : this.signupService.directSignup(body)
 172
 173     obs.subscribe({
 174       next: () => {
 175         if (this.requiresEmailVerification || this.requiresApproval) {
 176           this.signupSuccess = true
 177           return
 178         }
 179
 180         // Auto login
 181         this.autoLogin(body)
 182       },
 183
 184       error: err => {
 185         this.signupError = err.message
 186       }
 187     })
 188   }
 189
 190   private autoLogin (body: UserRegister) {
 191     this.authService.login({ username: body.username, password: body.password })
 192       .subscribe({
 193         next: () => {
 194           this.signupSuccess = true
 195         },
 196
 197         error: err => {
 198           this.signupError = err.message
 199         }
 200       })
 201   }
 202 }