chore: Bring back appcues (#1202)

* Revert "fix: remove AppCues (#1043)"

This reverts commit d3a7597.

* chore: Bring back appcues

* fixes

* fixes

Author: ashwin1111

.gitignore

@@ -78,3 +78,5 @@ documentation.json
 .sentryclirc
 
 commits.csv
+dependency-check-report.csv
+dependency-check-report.html

package.json

@@ -56,7 +56,6 @@
     "@angular-eslint/eslint-plugin-template": "14.1.2",
     "@angular-eslint/schematics": "^18.4.3",
     "@angular-eslint/template-parser": "14.1.2",
-    "@compodoc/compodoc": "^1.1.23",
     "@storybook/addon-docs": "^7.6.3",
     "@storybook/addon-essentials": "^7.6.3",
     "@storybook/addon-interactions": "^7.6.3",

src/app/app.component.ts

@@ -9,7 +9,7 @@ import { SiAuthService } from './core/services/si/si-core/si-auth.service';
 import { XeroAuthService } from './core/services/xero/xero-core/xero-auth.service';
 import { NetsuiteAuthService } from './core/services/netsuite/netsuite-core/netsuite-auth.service';
 import { StorageService } from './core/services/common/storage.service';
-import { Router } from '@angular/router';
+import { NavigationEnd, Router } from '@angular/router';
 import { IntegrationsService } from './core/services/common/integrations.service';
 
 @Component({
@@ -89,6 +89,11 @@ export class AppComponent implements OnInit {
   }
 
   ngOnInit(): void {
+    this.router.events.subscribe((event) => {
+      if (event instanceof NavigationEnd) {
+        (window as any).Appcues && (window as any).Appcues.page();
+      }
+    });
     this.eventsService.receiveEvent();
     this.setupLoginWatcher();
     this.primengConfig.ripple = true;

src/app/core/services/integration/appcues.service.spec.ts

@@ -0,0 +1,40 @@
+import { TestBed } from '@angular/core/testing';
+
+import { AppcuesService } from './appcues.service';
+import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { of } from 'rxjs';
+import { UserService } from '../misc/user.service';
+import { minimalUser } from '../../interceptor/jwt.fixture';
+
+describe('AppcuesService', () => {
+  let service: AppcuesService;
+
+  beforeEach(() => {
+    const service2 = {
+      getUserProfile: () => of(minimalUser)
+    };
+    TestBed.configureTestingModule({
+      imports: [HttpClientTestingModule],
+      providers: [AppcuesService,
+        { provide: UserService, useValue: service2 }
+      ]
+    });
+    service = TestBed.inject(AppcuesService);
+    (window as any).Appcues = {
+      identify: () => undefined
+    };
+  });
+
+  it('should be created', () => {
+    expect(service).toBeTruthy();
+  });
+
+  it('get function check', () => {
+    expect(service.appcues).toBeDefined();
+  });
+
+  it('initialiseAppcues function check', () => {
+    // @ts-ignore: force this private property value for testing.
+    expect(service.initialiseAppcues()).toBeUndefined();
+  });
+});

src/app/core/services/integration/appcues.service.ts

@@ -0,0 +1,35 @@
+import { Injectable } from '@angular/core';
+import { UserService } from '../misc/user.service';
+import { AppName } from '../../models/enum/enum.model';
+import { SiWorkspaceService } from '../si/si-core/si-workspace.service';
+import { MinimalUser } from '../../models/db/user.model';
+import { IntacctWorkspace } from '../../models/intacct/db/workspaces.model';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class AppcuesService {
+
+  user: MinimalUser = this.userService.getUserProfile();
+
+  constructor(
+    private userService: UserService
+  ) { }
+
+  get appcues() {
+    return (window as any).Appcues;
+  }
+
+  initialiseAppcues(appName: AppName, workspace_created_at: Date): void {
+    workspace_created_at = new Date(workspace_created_at);
+    if (this.appcues) {
+      const user = this.userService.getUserProfile();
+      this.appcues.identify(user.user_id, {
+        'Org ID': user.org_id,
+        'User ID': user.user_id,
+        source: 'Fyle Integrations App',
+        'App Name': appName
+      });
+    }
+  }
+}

src/app/integrations/intacct/intacct.component.spec.ts

@@ -120,4 +120,5 @@ describe('IntacctComponent', () => {
 
     expect(router.navigateByUrl).not.toHaveBeenCalled();
   });
+
 });

src/app/integrations/intacct/intacct.component.ts

@@ -6,6 +6,7 @@ import { IntacctWorkspace } from 'src/app/core/models/intacct/db/workspaces.mode
 import { HelperService } from 'src/app/core/services/common/helper.service';
 import { StorageService } from 'src/app/core/services/common/storage.service';
 import { WindowService } from 'src/app/core/services/common/window.service';
+import { AppcuesService } from 'src/app/core/services/integration/appcues.service';
 import { UserService } from 'src/app/core/services/misc/user.service';
 import { SiWorkspaceService } from 'src/app/core/services/si/si-core/si-workspace.service';
 import { SiAuthService } from 'src/app/core/services/si/si-core/si-auth.service';

src/app/integrations/qbd-direct/qbd-direct.component.ts

@@ -1,13 +1,14 @@
 import { Component, OnInit } from '@angular/core';
 import { Router, RouterModule } from '@angular/router';
 import { MinimalUser } from 'src/app/core/models/db/user.model';
-import { AppUrl, QbdDirectOnboardingState } from 'src/app/core/models/enum/enum.model';
+import { AppName, AppUrl, QbdDirectOnboardingState } from 'src/app/core/models/enum/enum.model';
 import { QbdDirectWorkspace } from 'src/app/core/models/qbd-direct/db/qbd-direct-workspaces.model';
 import { HelperService } from 'src/app/core/services/common/helper.service';
 import { IntegrationsUserService } from 'src/app/core/services/common/integrations-user.service';
 import { StorageService } from 'src/app/core/services/common/storage.service';
 import { WindowService } from 'src/app/core/services/common/window.service';
 import { WorkspaceService } from 'src/app/core/services/common/workspace.service';
+import { AppcuesService } from 'src/app/core/services/integration/appcues.service';
 import { QbdDirectHelperService } from 'src/app/core/services/qbd-direct/qbd-direct-core/qbd-direct-helper.service';
 
 @Component({
@@ -28,6 +29,7 @@ export class QbdDirectComponent implements OnInit {
   windowReference: Window;
 
   constructor(
+    private appcuesService: AppcuesService,
     private helperService: HelperService,
     private qbdDirectHelperService: QbdDirectHelperService,
     private router: Router,
@@ -64,6 +66,7 @@ export class QbdDirectComponent implements OnInit {
     this.workspace = workspace;
     this.storageService.set('workspaceId', this.workspace.id);
     this.storageService.set('onboarding-state', this.workspace.onboarding_state);
+    this.appcuesService.initialiseAppcues(AppName.QBD_DIRECT, this.workspace.created_at);
     this.workspaceService.importFyleAttributes(false).subscribe();
     this.qbdDirectHelperService.importQBDAttributes(false).subscribe();
     this.isLoading = false;

src/index.html

@@ -25,6 +25,14 @@
     }
   </script>
 
+   <!-- appcues -->
+   <script type="text/javascript">
+    window.AppcuesSettings = {
+      enableURLDetection: true
+    };
+  </script>
+  <script src="https://fast.appcues.com/218944.js"></script>
+
   <!-- refiner.io -->
   <script type="text/javascript">
     if (window.location.hostname !== "localhost") {