Replace activeSurveyId$ with URL param from NavigationService (#2389)

gino-m · web-flow · commit a3d11ab0494d · 2026-01-19T15:23:44.000+01:00
diff --git a/lib/src/date-util.ts b/lib/src/date-util.ts
@@ -25,6 +25,6 @@ export function timestampToInt(
   return (
     (Long.isLong(timestamp.seconds)
       ? timestamp.seconds.toInt()
-      : timestamp.seconds || 0) * 1000
+      : (timestamp.seconds as number) || 0) * 1000
   );
 }
diff --git a/web/src/app/app.spec.ts b/web/src/app/app.spec.ts
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import { Component, NO_ERRORS_SCHEMA } from '@angular/core';
 import { TestBed } from '@angular/core/testing';
 import { RouterTestingModule } from '@angular/router/testing';
 
@@ -22,7 +23,7 @@ import { AppComponent } from 'app/app.component';
 describe('AppComponent', () => {
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      imports: [RouterTestingModule],
+      imports: [RouterTestingModule.withRoutes([])],
       declarations: [AppComponent],
     }).compileComponents();
   });
diff --git a/web/src/app/components/create-survey/create-survey.component.spec.ts b/web/src/app/components/create-survey/create-survey.component.spec.ts
@@ -143,7 +143,6 @@ describe('CreateSurveyComponent', () => {
 
     route = new ActivatedRouteStub();
     surveyServiceSpy = jasmine.createSpyObj<SurveyService>('SurveyService', [
-      'activateSurvey',
       'getActiveSurvey$',
       'updateTitleAndDescription',
       'createSurvey',
@@ -247,10 +246,8 @@ describe('CreateSurveyComponent', () => {
       await fixture.whenStable();
     });
 
-    it('activates survey ID', async () => {
-      expect(surveyServiceSpy.activateSurvey).toHaveBeenCalledOnceWith(
-        surveyId
-      );
+    it('initializes draft survey', async () => {
+      expect(draftSurveyServiceSpy.init).toHaveBeenCalledWith(surveyId);
     });
   });
 
diff --git a/web/src/app/components/create-survey/create-survey.component.ts b/web/src/app/components/create-survey/create-survey.component.ts
@@ -154,7 +154,6 @@ export class CreateSurveyComponent implements OnInit {
     this.subscription.add(
       this.navigationService.getSurveyId$().subscribe(async surveyId => {
         this.surveyId = surveyId ? surveyId : SURVEY_ID_NEW;
-        this.surveyService.activateSurvey(this.surveyId);
         await this.draftSurveyService.init(this.surveyId);
         this.draftSurveyService
           .getSurvey$()
diff --git a/web/src/app/components/edit-survey/edit-survey.component.spec.ts b/web/src/app/components/edit-survey/edit-survey.component.spec.ts
@@ -99,12 +99,12 @@ describe('EditSurveyComponent', () => {
         'getEditSurveyPageSignal',
         'navigateToEditJob',
         'navigateToEditSurvey',
+        'selectSurvey',
       ]
     );
     navigationServiceSpy.getEditSurveyPageSignal.and.returnValue(signal(''));
 
     surveyServiceSpy = jasmine.createSpyObj<SurveyService>('SurveyService', [
-      'activateSurvey',
       'getActiveSurvey$',
     ]);
     activeSurvey$ = new Subject<Survey>();
@@ -193,10 +193,8 @@ describe('EditSurveyComponent', () => {
       fixture.detectChanges(); // Update view (content)
     });
 
-    it('activates survey ID', () => {
-      expect(surveyServiceSpy.activateSurvey).toHaveBeenCalledOnceWith(
-        surveyId
-      );
+    it('initializes draft survey', () => {
+      expect(draftSurveyServiceSpy.init).toHaveBeenCalledWith(surveyId);
     });
   });
 
diff --git a/web/src/app/components/edit-survey/edit-survey.component.ts b/web/src/app/components/edit-survey/edit-survey.component.ts
@@ -66,7 +66,6 @@ export class EditSurveyComponent {
       const id = this.surveyId();
 
       if (id) {
-        this.surveyService.activateSurvey(id);
         await this.draftSurveyService.init(id);
         this.draftSurveyService.getSurvey$().subscribe(survey => {
           this.survey = survey;
diff --git a/web/src/app/components/main-page-container/main-page-container.component.spec.ts b/web/src/app/components/main-page-container/main-page-container.component.spec.ts
@@ -34,7 +34,7 @@ const navigationService = {
 
 const surveyService = jasmine.createSpyObj('SurveyService', [
   'getActiveSurvey$',
-  'activateSurvey',
+  'loadSurvey$',
 ]);
 
 describe('MainPageContainerComponent', () => {
@@ -54,6 +54,7 @@ describe('MainPageContainerComponent', () => {
       schemas: [NO_ERRORS_SCHEMA],
     }).compileComponents();
 
+    surveyService.loadSurvey$.and.returnValue(NEVER);
     fixture = TestBed.createComponent(MainPageContainerComponent);
     component = fixture.componentInstance;
     fixture.detectChanges();
diff --git a/web/src/app/components/main-page-container/main-page-container.component.ts b/web/src/app/components/main-page-container/main-page-container.component.ts
@@ -36,10 +36,5 @@ export class MainPageContainerComponent {
     )
   );
 
-  constructor() {
-    effect(() => {
-      const id = this.surveyId();
-      if (id) this.surveyService.activateSurvey(id);
-    });
-  }
+  constructor() {}
 }
diff --git a/web/src/app/components/main-page-container/main-page/survey-header/survey-header.component.spec.ts b/web/src/app/components/main-page-container/main-page/survey-header/survey-header.component.spec.ts
@@ -25,6 +25,7 @@ import { NEVER, of } from 'rxjs';
 import { DataSharingType, Survey } from 'app/models/survey.model';
 import { GroundIconModule } from 'app/modules/ground-icon.module';
 import { DataStoreService } from 'app/services/data-store/data-store.service';
+import { NavigationService } from 'app/services/navigation/navigation.service';
 import { SurveyService } from 'app/services/survey/survey.service';
 
 import { SurveyHeaderComponent } from './survey-header.component';
@@ -61,6 +62,14 @@ describe('SurveyHeaderComponent', () => {
             updateTitle: () => Promise.resolve(),
           },
         },
+        {
+          provide: NavigationService,
+          useValue: {
+            navigateToSurveyList: () => {},
+            isEditSurveyPage: () => false,
+            onClickSidePanelButton: () => {},
+          },
+        },
         {
           provide: Router,
           useValue: {
diff --git a/web/src/app/components/shared/header/header.component.spec.ts b/web/src/app/components/shared/header/header.component.spec.ts
@@ -24,6 +24,7 @@ import { of } from 'rxjs';
 import { AuthService } from 'app/services/auth/auth.service';
 import { DataStoreService } from 'app/services/data-store/data-store.service';
 import { DraftSurveyService } from 'app/services/draft-survey/draft-survey.service';
+import { NavigationService } from 'app/services/navigation/navigation.service';
 import { SurveyService } from 'app/services/survey/survey.service';
 
 import { HeaderComponent } from './header.component';
@@ -44,7 +45,19 @@ describe('HeaderComponent', () => {
         { provide: MatDialog, useValue: {} },
         { provide: AuthService, useValue: { getUser$: () => of() } },
         { provide: DraftSurveyService, useValue: {} },
-        { provide: Router, useValue: { events: of() } },
+        { provide: Router, useValue: { events: of(), url: '' } },
+        {
+          provide: NavigationService,
+          useValue: {
+            isEditSurveyPage: () => false,
+            isSurveyPage: () => false,
+            navigateToSurveyList: () => {},
+            navigateToEditSurvey: () => {},
+            navigateToAboutPage: () => {},
+            navigateToTermsOfService: () => {},
+            selectSurvey: () => {},
+          },
+        },
         {
           provide: SurveyService,
           useValue: {
diff --git a/web/src/app/services/survey/survey.service.spec.ts b/web/src/app/services/survey/survey.service.spec.ts
@@ -16,21 +16,24 @@
 
 import { TestBed } from '@angular/core/testing';
 import { List, Map } from 'immutable';
-import { ReplaySubject, Subject, of, take } from 'rxjs';
+import { BehaviorSubject, ReplaySubject, Subject, of, take } from 'rxjs';
 
 import { DataSharingType, Survey, SurveyState } from 'app/models/survey.model';
 import { User } from 'app/models/user.model';
 import { AuthService } from 'app/services/auth/auth.service';
 import { DataStoreService } from 'app/services/data-store/data-store.service';
 import { SurveyService } from 'app/services/survey/survey.service';
 import { SURVEY_ID_NEW } from 'app/services/navigation/navigation.constants';
+import { NavigationService } from 'app/services/navigation/navigation.service';
 import { Role } from 'app/models/role.model';
 
 describe('SurveyService', () => {
   let service: SurveyService;
   let dataStoreServiceSpy: jasmine.SpyObj<DataStoreService>;
   let authServiceSpy: jasmine.SpyObj<AuthService>;
 
+  let navigationServiceSpy: jasmine.SpyObj<NavigationService>;
+  let surveyId$: BehaviorSubject<string | null>;
   let user$: ReplaySubject<User>;
   const mockUser = new User('user1', 'user@test.com', true);
   const newSurveyId = 'newSurveyId';
@@ -45,6 +48,12 @@ describe('SurveyService', () => {
   );
 
   beforeEach(() => {
+    navigationServiceSpy = jasmine.createSpyObj('NavigationService', [
+      'getSurveyId$',
+    ]);
+    surveyId$ = new BehaviorSubject<string | null>(null);
+    navigationServiceSpy.getSurveyId$.and.returnValue(surveyId$);
+
     dataStoreServiceSpy = jasmine.createSpyObj('DataStoreService', [
       'loadSurvey$',
       'loadAccessibleSurveys$',
@@ -70,6 +79,7 @@ describe('SurveyService', () => {
       providers: [
         { provide: DataStoreService, useValue: dataStoreServiceSpy },
         { provide: AuthService, useValue: authServiceSpy },
+        { provide: NavigationService, useValue: navigationServiceSpy },
       ],
     });
 
@@ -93,8 +103,8 @@ describe('SurveyService', () => {
           done();
         });
 
+      surveyId$.next(mockSurvey.id);
       user$.next(mockUser);
-      service.activateSurvey(mockSurvey.id);
     });
 
     it('should return UNSAVED_NEW when activating new survey ID', done => {
@@ -107,7 +117,7 @@ describe('SurveyService', () => {
         });
 
       user$.next(mockUser);
-      service.activateSurvey(SURVEY_ID_NEW);
+      surveyId$.next(SURVEY_ID_NEW);
     });
   });
 
@@ -138,7 +148,7 @@ describe('SurveyService', () => {
     beforeEach(() => {
       // Activate survey to set this.activeSurvey
       user$.next(mockUser);
-      service.activateSurvey(mockSurvey.id);
+      surveyId$.next(mockSurvey.id);
     });
 
     it('should update title', async () => {
diff --git a/web/src/app/services/survey/survey.service.ts b/web/src/app/services/survey/survey.service.ts
@@ -16,39 +16,43 @@
 
 import { Injectable } from '@angular/core';
 import { List, Map } from 'immutable';
-import { Observable, ReplaySubject, firstValueFrom, of } from 'rxjs';
+import { Observable, firstValueFrom, of } from 'rxjs';
 import { shareReplay, switchMap } from 'rxjs/operators';
 
 import { Role } from 'app/models/role.model';
 import { DataSharingType, Survey, SurveyState } from 'app/models/survey.model';
 import { AuthService } from 'app/services/auth/auth.service';
 import { DataStoreService } from 'app/services/data-store/data-store.service';
 import { SURVEY_ID_NEW } from 'app/services/navigation/navigation.constants';
+import { NavigationService } from 'app/services/navigation/navigation.service';
 
 @Injectable({
   providedIn: 'root',
 })
 export class SurveyService {
-  private activeSurveyId$ = new ReplaySubject<string>(1);
   private activeSurvey$: Observable<Survey>;
   private activeSurvey!: Survey;
 
   constructor(
     private dataStore: DataStoreService,
-    private authService: AuthService
+    private authService: AuthService,
+    private navigationService: NavigationService
   ) {
     // Reload active survey each time authenticated user changes.
     this.activeSurvey$ = authService.getUser$().pipe(
       switchMap(() =>
         //  on each change to survey id.
-        this.activeSurveyId$.pipe(
+        this.navigationService.getSurveyId$().pipe(
           // Asynchronously load survey. switchMap() internally disposes
           // of previous subscription if present.
           switchMap(id => {
             if (id === SURVEY_ID_NEW) {
               return of(Survey.UNSAVED_NEW);
             }
-            return this.dataStore.loadSurvey$(id);
+            if (id) {
+              return this.dataStore.loadSurvey$(id);
+            }
+            return of(Survey.UNSAVED_NEW);
           })
         )
       ),
@@ -63,10 +67,6 @@ export class SurveyService {
     return this.activeSurvey;
   }
 
-  activateSurvey(id: string) {
-    this.activeSurveyId$.next(id);
-  }
-
   getActiveSurvey$(): Observable<Survey> {
     return this.activeSurvey$;
   }

Original file line number	Diff line number	Diff line change
`@@ -25,6 +25,6 @@ export function timestampToInt(`
`25`	`25`	`return (`
`26`	`26`	`(Long.isLong(timestamp.seconds)`
`27`	`27`	`? timestamp.seconds.toInt()`
`28`		`- : timestamp.seconds \|\| 0) * 1000`
	`28`	`+ : (timestamp.seconds as number) \|\| 0) * 1000`
`29`	`29`	`);`
`30`	`30`	`}`
Original file line number	Diff line number	Diff line change
`@@ -36,10 +36,5 @@ export class MainPageContainerComponent {`
`36`	`36`	`)`
`37`	`37`	`);`
`38`	`38`
`39`		`- constructor() {`
`40`		`- effect(() => {`
`41`		`- const id = this.surveyId();`
`42`		`- if (id) this.surveyService.activateSurvey(id);`
`43`		`- });`
`44`		`- }`
	`39`	`+ constructor() {}`
`45`	`40`	`}`