appcues script updation change commit (#106)

appcues script updation change commit

src/app/auth/auth-routing.module.ts

@@ -6,6 +6,7 @@ import { LoginComponent } from './login/login.component';
 import { CallbackComponent } from './callback/callback.component';
 import { LogoutComponent } from './logout/logout.component';
 import { SharedLoginComponent } from './shared-login/shared-login.component';
+import { RedirectComponent } from './redirect/redirect.component';
 
 const routes: Routes = [
   {
@@ -27,6 +28,10 @@ const routes: Routes = [
       {
         path: 'shared_login',
         component: SharedLoginComponent
+      },
+      {
+        path: 'redirect',
+        component: RedirectComponent
       }
     ]
   }

src/app/auth/auth.module.ts

@@ -10,14 +10,16 @@ import { FlexLayoutModule } from '@angular/flex-layout';
 import { MatButtonModule } from '@angular/material/button';
 import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
 import { SharedLoginComponent } from './shared-login/shared-login.component';
+import { RedirectComponent } from './redirect/redirect.component';
 
 @NgModule({
   declarations: [
     AuthComponent,
     LoginComponent,
     CallbackComponent,
     LogoutComponent,
-    SharedLoginComponent
+    SharedLoginComponent,
+    RedirectComponent
   ],
   imports: [
     CommonModule,

src/app/auth/redirect/redirect.component.html

@@ -0,0 +1,3 @@
+<div fxLayoutAlign="center center" fxFlexFill>
+  <mat-progress-spinner mode="indeterminate"></mat-progress-spinner>
+</div>

src/app/auth/redirect/redirect.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { RedirectComponent } from './redirect.component';
+
+describe('RedirectComponent', () => {
+  let component: RedirectComponent;
+  let fixture: ComponentFixture<RedirectComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ RedirectComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(RedirectComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/auth/redirect/redirect.component.ts

@@ -0,0 +1,66 @@
+import { Component, OnInit } from '@angular/core';
+import { MinimalPatchWorkspace } from 'src/app/core/models/workspace.model';
+import { AuthService } from 'src/app/core/services/auth.service';
+import { StorageService } from 'src/app/core/services/storage.service';
+import { WindowReferenceService } from 'src/app/core/services/window.service';
+import { WorkspaceService } from 'src/app/core/services/workspace.service';
+import { environment } from 'src/environments/environment';
+
+@Component({
+  selector: 'app-redirect',
+  templateUrl: './redirect.component.html',
+  styleUrls: ['./redirect.component.scss']
+})
+export class RedirectComponent implements OnInit {
+
+  windowReference: Window;
+
+  orgsCount: number;
+
+  constructor(
+    private workspaceService: WorkspaceService,
+    private authService: AuthService,
+    private storageService: StorageService,
+    private windowReferenceService: WindowReferenceService,
+  ) {
+    this.windowReference = this.windowReferenceService.nativeWindow;
+  }
+
+  switchToNewApp(workspace: MinimalPatchWorkspace | void): void {
+    if (!workspace) {
+      workspace = {
+        app_version: 'v2',
+        onboarding_state: 'COMPLETE'
+      };
+    }
+
+    this.workspaceService.patchWorkspace(workspace).subscribe(() => {
+      this.redirectToNewApp();
+    });
+  }
+
+  private redirectToNewApp(): void {
+    const user = this.authService.getUser();
+
+    const localStorageDump = {
+      user: {
+        email: user.employee_email,
+        access_token: this.storageService.get('access_token'),
+        refresh_token: this.storageService.get('refresh_token'),
+        full_name: user.full_name,
+        user_id: user.user_id,
+        org_id: user.org_id,
+        org_name: user.org_name
+      },
+      orgsCount: this.orgsCount
+    };
+
+    this.windowReference.location.href = `${environment.new_xero_app_url}?local_storage_dump=${encodeURIComponent(JSON.stringify(localStorageDump))}`;
+  }
+
+  ngOnInit() {
+    this.orgsCount = this.authService.getOrgCount();
+    this.switchToNewApp({app_version: 'v2'});
+  }
+
+}

src/app/xero/dashboard/dashboard.component.ts

@@ -1,6 +1,6 @@
 import { Component, OnInit } from '@angular/core';
 import { SettingsService } from 'src/app/core/services/settings.service';
-import { ActivatedRoute } from '@angular/router';
+import { ActivatedRoute, NavigationEnd, Router } from '@angular/router';
 import { forkJoin } from 'rxjs';
 import { MappingsService } from 'src/app/core/services/mappings.service';
 import { environment } from 'src/environments/environment';
@@ -59,6 +59,7 @@ export class DashboardComponent implements OnInit {
     private expenseGroupService: ExpenseGroupsService,
     private settingsService: SettingsService,
     private route: ActivatedRoute,
+    private router: Router,
     private mappingsService: MappingsService,
     private storageService: StorageService,
     private windowReferenceService: WindowReferenceService,
@@ -284,7 +285,11 @@ export class DashboardComponent implements OnInit {
     const that = this;
     that.workspaceId = +that.route.snapshot.params.workspace_id;
     const onboarded = that.storageService.get('onboarded');
-
+    this.router.events.subscribe((event) => {
+      if (event instanceof NavigationEnd) {
+        (window as any).Appcues && (window as any).Appcues.page();
+      }
+    });
     if (onboarded) {
       that.xero.showAppSwitcher();
       this.appcuesService.initialiseAppcues();

src/app/xero/xero.component.html

@@ -67,7 +67,7 @@
             {{user.org_name}}
           </span>
         </div>
-        <!-- <div class="mat-small xero--title-separator" *ngIf="user.org_name || showSwitchApp">
+        <div class="mat-small xero--title-separator" *ngIf="user.org_name || showSwitchApp">
           |
         </div>
         <div class="mat-small" *ngIf="user.org_name">
@@ -83,7 +83,7 @@
           class="switcher--back-btn">
           <img src="assets/images/svgs/sync.svg" class="switcher--back-btn-arrow" width="12px" height="9px" />
           <span class="switcher--btn-icon">Switch to Integration 2.0</span>
-        </div> -->
+        </div>
 
         <div class="mat-small" *ngIf="showRefreshIcon">
           <mat-icon class="refresh"

src/index.html

@@ -20,6 +20,11 @@
     }
   </script>
   <!-- appcues -->
+  <script type="text/javascript">
+    window.AppcuesSettings = {
+      enableURLDetection: true
+    };
+  </script>
   <script src="https://fast.appcues.com/71692.js"></script>
 </head>