1 files changed, 43 insertions, 19 deletions

diff --git a/client/src/app/+signup/+register/register.component.ts b/client/src/app/+signup/+register/register.component.ts
index 958770ebf..9259d902c 100644
--- a/client/src/app/+signup/+register/register.component.ts
+++ b/client/src/app/+signup/+register/register.component.ts
@@ -5,10 +5,10 @@ import { ActivatedRoute } from '@angular/router'
 import { AuthService } from '@app/core'
 import { HooksService } from '@app/core/plugins/hooks.service'
 import { InstanceAboutAccordionComponent } from '@app/shared/shared-instance'
-import { UserSignupService } from '@app/shared/shared-users'
 import { NgbAccordion } from '@ng-bootstrap/ng-bootstrap'
 import { UserRegister } from '@shared/models'
 import { ServerConfig } from '@shared/models/server'
+import { SignupService } from '../shared/signup.service'
 
 @Component({
   selector: 'my-register',
@@ -53,7 +53,7 @@ export class RegisterComponent implements OnInit {
   constructor (
     private route: ActivatedRoute,
     private authService: AuthService,
-    private userSignupService: UserSignupService,
+    private signupService: SignupService,
     private hooks: HooksService
   ) { }
 
@@ -61,6 +61,10 @@ export class RegisterComponent implements OnInit {
     return this.serverConfig.signup.requiresEmailVerification
   }
 
+  get requiresApproval () {
+    return this.serverConfig.signup.requiresApproval
+  }
+
   get minimumAge () {
     return this.serverConfig.signup.minimumAge
   }
@@ -132,42 +136,49 @@ export class RegisterComponent implements OnInit {
   skipChannelCreation () {
     this.formStepChannel.reset()
     this.lastStep.select()
+
     this.signup()
   }
 
   async signup () {
     this.signupError = undefined
 
-    const body: UserRegister = await this.hooks.wrapObject(
+    const termsForm = this.formStepTerms.value
+    const userForm = this.formStepUser.value
+    const channelForm = this.formStepChannel?.value
+
+    const channel = this.formStepChannel?.value?.name
+      ? { name: channelForm?.name, displayName: channelForm?.displayName }
+      : undefined
+
+    const body = await this.hooks.wrapObject(
       {
-        ...this.formStepUser.value,
+        username: userForm.username,
+        password: userForm.password,
+        email: userForm.email,
+        displayName: userForm.displayName,
+
+        registrationReason: termsForm.registrationReason,
 
-        channel: this.formStepChannel?.value?.name
-          ? this.formStepChannel.value
-          : undefined
+        channel
       },
       'signup',
       'filter:api.signup.registration.create.params'
     )
 
-    this.userSignupService.signup(body).subscribe({
+    const obs = this.requiresApproval
+      ? this.signupService.requestSignup(body)
+      : this.signupService.directSignup(body)
+
+    obs.subscribe({
       next: () => {
-        if (this.requiresEmailVerification) {
+        if (this.requiresEmailVerification || this.requiresApproval) {
           this.signupSuccess = true
           return
         }
 
         // Auto login
-        this.authService.login({ username: body.username, password: body.password })
-          .subscribe({
-            next: () => {
-              this.signupSuccess = true
-            },
-
-            error: err => {
-              this.signupError = err.message
-            }
-          })
+        this.autoLogin(body)
       },
 
       error: err => {
@@ -175,4 +186,17 @@ export class RegisterComponent implements OnInit {
       }
     })
   }
+
+  private autoLogin (body: UserRegister) {
+    this.authService.login({ username: body.username, password: body.password })
+      .subscribe({
+        next: () => {
+          this.signupSuccess = true
+        },
+
+        error: err => {
+          this.signupError = err.message
+        }
+      })
+  }
 }