lmendoza/sep-25-batch-of-fixes

src/app/register2/components/form-current-employment/form-current-employment.component.ts

@@ -32,7 +32,7 @@ import { RecordAffiliationService } from 'src/app/core/record-affiliations/recor
 import { dateMonthYearValidator } from 'src/app/shared/validators/date/date.validator'
 import { RegisterStateService } from '../../register-state.service'
 import { OrgDisambiguated } from 'src/app/types'
-import { RegisterObservabilityService } from '../../register-obserability'
+import { RegisterObservabilityService } from '../../register-observability.service'
 export class MyErrorStateMatcher implements ErrorStateMatcher {
   isErrorState(
     control: FormControl | null,

src/app/register2/components/form-password/form-password.component.ts

@@ -22,7 +22,7 @@ import { OrcidValidators } from 'src/app/validators'
 import { BaseForm } from '../BaseForm'
 import { LiveAnnouncer } from '@angular/cdk/a11y'
 import { environment } from 'src/environments/environment'
-import { RegisterObservabilityService } from '../../register-obserability'
+import { RegisterObservabilityService } from '../../register-observability.service'
 import { RegisterStateService } from '../../register-state.service'
 
 @Component({

src/app/register2/components/form-personal/form-personal.component.ts

@@ -50,8 +50,7 @@ import { SignInService } from 'src/app/core/sign-in/sign-in.service'
 import { ErrorHandlerService } from 'src/app/core/error-handler/error-handler.service'
 import { ERROR_REPORT } from 'src/app/errors'
 import { RegisterStateService } from '../../register-state.service'
-import { CustomEventService } from 'src/app/core/observability-events/observability-events.service'
-import { RegisterObservabilityService } from '../../register-obserability'
+import { RegisterObservabilityService } from '../../register-observability.service'
 export class MyErrorStateMatcher implements ErrorStateMatcher {
   isErrorState(
     control: FormControl | null,

src/app/register2/components/form-visibility/form-visibility.component.ts

@@ -12,7 +12,7 @@ import { Register2Service } from 'src/app/core/register2/register2.service'
 
 import { BaseForm } from '../BaseForm'
 import { RegisterStateService } from '../../register-state.service'
-import { RegisterObservabilityService } from '../../register-obserability'
+import { RegisterObservabilityService } from '../../register-observability.service'
 
 @Component({
   selector: 'app-form-visibility',

src/app/register2/components/step-a/step-a.component.ts

@@ -14,8 +14,8 @@ import { ApplicationRoutes } from 'src/app/constants'
 import { environment } from 'src/environments/environment'
 import { ReactivationLocal } from '../../../types/reactivation.local'
 import { BaseStepDirective } from '../BaseStep'
-import { CustomEventService } from 'src/app/core/observability-events/observability-events.service'
 import { RegisterStateService } from '../../register-state.service'
+import { RegisterObservabilityService } from '../../register-observability.service'
 
 @Component({
   selector: 'app-step-a',
@@ -39,16 +39,14 @@ export class StepAComponent
   constructor(
     private _platform: PlatformInfoService,
     private _router: Router,
-    private _observability: CustomEventService,
-    private _registerStateService: RegisterStateService
+    private _registerStateService: RegisterStateService,
+    private _registerObservabilityService: RegisterObservabilityService
   ) {
     super()
   }
 
   ngOnInit(): void {
-    this._observability.recordEvent('orcid_registration', 'step-a-loaded', {
-      initialFormValue: this.formGroup.controls.personal.value,
-    })
+    this._registerObservabilityService.stepLoaded('a')
   }
   infoSiteBaseUrl = environment.INFO_SITE
 
@@ -94,10 +92,7 @@ export class StepAComponent
   }
 
   signIn() {
-    this._observability.recordEvent(
-      'orcid_registration',
-      'step-a-sign-in-button-clicked'
-    )
+    this._registerObservabilityService.signInButtonClicked()
     this._platform
       .get()
       .pipe(first())

src/app/register2/components/step-b/step-b.component.ts

@@ -1,9 +1,9 @@
-import { Component, Input } from '@angular/core'
+import { Component, Input, OnInit } from '@angular/core'
 
 import { ReactivationLocal } from '../../../types/reactivation.local'
 import { BaseStepDirective } from '../BaseStep'
-import { CustomEventService } from 'src/app/core/observability-events/observability-events.service'
 import { RegisterStateService } from '../../register-state.service'
+import { RegisterObservabilityService } from '../../register-observability.service'
 
 @Component({
   selector: 'app-step-b',
@@ -14,17 +14,19 @@ import { RegisterStateService } from '../../register-state.service'
     '../register2.scss-theme.scss',
   ],
 })
-export class StepBComponent extends BaseStepDirective {
+export class StepBComponent extends BaseStepDirective implements OnInit {
   @Input() personalData
   @Input() reactivation: ReactivationLocal
 
   constructor(
-    private _observability: CustomEventService,
-    private _registerStateService: RegisterStateService
+    private _registerStateService: RegisterStateService,
+    private _registerObservabilityService: RegisterObservabilityService
   ) {
-    _observability.recordEvent('orcid_registration', 'step-b-loaded')
     super()
   }
+  ngOnInit(): void {
+    this._registerObservabilityService.stepLoaded('b')
+  }
 
   nextButtonWasClicked = false
 

src/app/register2/components/step-c/step-c.component.ts

@@ -1,9 +1,9 @@
-import { Component, Input } from '@angular/core'
+import { Component, Input, OnInit } from '@angular/core'
 
 import { ReactivationLocal } from '../../../types/reactivation.local'
 import { BaseStepDirective } from '../BaseStep'
-import { CustomEventService } from 'src/app/core/observability-events/observability-events.service'
 import { RegisterStateService } from '../../register-state.service'
+import { RegisterObservabilityService } from '../../register-observability.service'
 
 @Component({
   selector: 'app-step-c',
@@ -14,13 +14,19 @@ import { RegisterStateService } from '../../register-state.service'
     '../register2.scss-theme.scss',
   ],
 })
-export class StepCComponent extends BaseStepDirective {
+export class StepCComponent extends BaseStepDirective implements OnInit {
   @Input() loading
   @Input() reactivation: ReactivationLocal
 
-  constructor(private _registrationStateService: RegisterStateService) {
+  constructor(
+    private _registrationStateService: RegisterStateService,
+    private _registerObservabilityService: RegisterObservabilityService
+  ) {
     super()
   }
+  ngOnInit(): void {
+    this._registerObservabilityService.stepLoaded('c')
+  }
 
   nextButton2() {
     this._registrationStateService.registerStepperButtonClicked('c', 'next')

src/app/register2/components/step-c2/step-c2.component.ts

@@ -1,10 +1,10 @@
-import { Component, EventEmitter, Input, Output } from '@angular/core'
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
 
 import { ReactivationLocal } from '../../../types/reactivation.local'
 import { BaseStepDirective } from '../BaseStep'
 import { FormBuilder, FormGroup } from '@angular/forms'
-import { CustomEventService } from 'src/app/core/observability-events/observability-events.service'
 import { RegisterStateService } from '../../register-state.service'
+import { RegisterObservabilityService } from '../../register-observability.service'
 
 @Component({
   selector: 'app-step-c2',
@@ -15,33 +15,33 @@ import { RegisterStateService } from '../../register-state.service'
     '../register2.scss-theme.scss',
   ],
 })
-export class StepC2Component extends BaseStepDirective {
+export class StepC2Component extends BaseStepDirective implements OnInit {
   @Input() loading
   @Input() reactivation: ReactivationLocal
   nextButtonWasClicked: boolean
   @Output() formGroupStepC2OptionalChange = new EventEmitter<boolean>()
 
   constructor(
-    private _formBuilder: FormBuilder,
-    private _observability: CustomEventService,
-    private _registerStateService: RegisterStateService
+    private _registrationStateService: RegisterStateService,
+    private _registerObservabilityService: RegisterObservabilityService
   ) {
     super()
   }
+  ngOnInit(): void {
+    this._registerObservabilityService.stepLoaded('c2')
+  }
 
   optionalNextStep() {
-
     this.formGroupStepC2OptionalChange.emit(true)
-    this._registerStateService.registerStepperButtonClicked('c2', 'skip')
+    this._registrationStateService.registerStepperButtonClicked('c2', 'skip')
   }
 
   nextButton2() {
-
     this.formGroupStepC2OptionalChange.emit(false)
-    this._registerStateService.registerStepperButtonClicked('c2', 'next')
+    this._registrationStateService.registerStepperButtonClicked('c2', 'next')
   }
 
   backButton() {
-    this._registerStateService.registerStepperButtonClicked('c2', 'back')
+    this._registrationStateService.registerStepperButtonClicked('c2', 'back')
   }
 }

src/app/register2/components/step-d/step-d.component.ts

@@ -2,9 +2,8 @@ import { Component, Input } from '@angular/core'
 
 import { ReactivationLocal } from '../../../types/reactivation.local'
 import { BaseStepDirective } from '../BaseStep'
-import { CustomEventService } from 'src/app/core/observability-events/observability-events.service'
 import { RegisterStateService } from '../../register-state.service'
-import { RegisterObservabilityService } from '../../register-obserability'
+import { RegisterObservabilityService } from '../../register-observability.service'
 
 @Component({
   selector: 'app-step-d',
@@ -21,9 +20,15 @@ export class StepDComponent extends BaseStepDirective {
 
   nextButtonWasClicked = false
 
-  constructor(private _registrationStateService: RegisterStateService, private _registerObservabilityService: RegisterObservabilityService) {
+  constructor(
+    private _registrationStateService: RegisterStateService,
+    private _registerObservabilityService: RegisterObservabilityService
+  ) {
     super()
   }
+  ngOnInit(): void {
+    this._registerObservabilityService.stepLoaded('d')
+  }
 
   nextButton2() {
     this._registrationStateService.registerStepperButtonClicked('d', 'next')

src/app/register2/register-obserability.ts → src/app/register2/register-observability.service.ts

@@ -6,6 +6,7 @@ import { OrgDisambiguated } from '../types'
 import { CustomEventService } from '../core/observability-events/observability-events.service'
 import { UntypedFormArray, UntypedFormGroup } from '@angular/forms'
 import { RegisterStateService } from './register-state.service'
+import init from 'helphero'
 @Injectable({
   providedIn: 'root',
 })
@@ -26,6 +27,13 @@ export class RegisterObservabilityService {
     })
   }
 
+  signInButtonClicked() {
+    this._observability.recordEvent(
+      'orcid_registration',
+      'step-a-sign-in-button-clicked'
+    )
+  }
+
   stepANextButtonClicked(form: UntypedFormGroup) {
     this._observability.recordEvent(
       'orcid_registration',
@@ -134,4 +142,14 @@ export class RegisterObservabilityService {
       }
     )
   }
+
+  stepLoaded(step: 'a' | 'b' | 'c' | 'c2' | 'd') {
+    this._observability.recordEvent('orcid_registration', `step-${step}-loaded`)
+  }
+
+  initializeHelpHero(reactivation) {
+    this._observability.startJourney('orcid_registration', {
+      reactivation,
+    })
+  }
 }