Set "Workspaces" to be page title and customized the page titles for...

Set "Workspaces" to be page title and customized the page titles for capability request and active requests pages

apps/web/src/app/app.module.ts

@@ -16,7 +16,7 @@
  * You should have received a copy of the GNU General Public License
  * along with Workspaces.  If not, see <https://www.gnu.org/licenses/>.
  */
-import {BrowserModule} from "@angular/platform-browser";
+import {BrowserModule, Title} from "@angular/platform-browser";
 import {BrowserAnimationsModule} from "@angular/platform-browser/animations";
 import {ReactiveFormsModule} from "@angular/forms";
 import {APP_INITIALIZER, NgModule} from "@angular/core";
@@ -52,7 +52,7 @@ export function initializeApp(testDataService: TestDataService) {
     SharedModule,
   ],
 
-  providers: [WebAnalyticsService, {provide: APP_INITIALIZER, useFactory: initializeApp, deps: [TestDataService], multi: true},],
+  providers: [WebAnalyticsService, {provide: APP_INITIALIZER, useFactory: initializeApp, deps: [TestDataService], multi: true}, Title],
   bootstrap: [AppComponent],
 })
 export class AppModule {}

apps/web/src/app/workspaces/components/active-capability-requests/active-capability-requests.component.ts

@@ -17,6 +17,7 @@
  * along with Workspaces.  If not, see <https://www.gnu.org/licenses/>.
  */
 import { Component, OnInit } from "@angular/core";
+import { Title } from "@angular/platform-browser";
 import { ActivatedRoute, Router, Params } from "@angular/router";
 import { Capability } from "../../model/capability";
 import { CapabilityRequest } from "../../model/capability-request";
@@ -40,6 +41,7 @@ export const defaultSortOrder = "desc"
   styleUrls: ["./active-capability-requests.component.scss"],
 })
 export class ActiveCapabilityRequestsComponent implements OnInit {
+  public title = 'Active Capability Requests';
   public activeCapabilityRequests: Array<CapabilityRequest>;
   public capability: Capability;
   public isPaused: boolean;
@@ -133,9 +135,12 @@ export class ActiveCapabilityRequestsComponent implements OnInit {
     private router: Router,
     private storageService: StorageService,
     private activeRequestsService: ActiveRequestsService,
+    private titleService: Title,
   ) {
     // Initialize table sorting to sort on request ID
     this.sortOn("id");
+    // Set page title
+    this.titleService.setTitle(this.title)
   }
 
   ngOnInit(): void {

apps/web/src/app/workspaces/components/capability-request/capability-request.component.ts

@@ -20,6 +20,7 @@ import { Component, OnDestroy, OnInit } from "@angular/core";
 
 import { CapabilityRequest } from "../../model/capability-request";
 import { ActivatedRoute } from "@angular/router";
+import { Title } from "@angular/platform-browser";
 import { DataRetrieverService } from "../../services/data-retriever.service";
 import { CapabilityExecution } from "../../model/capability-execution";
 import { CapabilityRequestService } from "../../services/capability-request.service";
@@ -37,6 +38,7 @@ import { Capability } from "../../model/capability";
   styleUrls: ["./capability-request.component.scss"],
 })
 export class CapabilityRequestComponent implements OnInit, OnDestroy {
+  public baseTitle = 'Capability Request #';
   public capabilityRequest: CapabilityRequest;
   public capability: Capability;
   public capabilityExecution: CapabilityExecution;
@@ -77,6 +79,10 @@ export class CapabilityRequestComponent implements OnInit, OnDestroy {
           type: "CapabilityExecution",
         };
       }
+
+      // Set page title
+      this.titleService.setTitle(this.baseTitle + this.capabilityRequest.id)
+
       this.dataRetriever
         .getCapability(this.capabilityRequest.capability_name)
         .pipe(takeUntil(this.ngUnsubscribe))
@@ -118,6 +124,7 @@ export class CapabilityRequestComponent implements OnInit, OnDestroy {
     private capabilityRequestService: CapabilityRequestService,
     private pollingDataUpdaterService: PollingDataUpdaterService,
     private alertService: AlertService,
+    private titleService: Title,
   ) {
     const requestID = parseInt(this.route.snapshot.paramMap.get("id"));
     this.pollingDataUpdaterService

apps/web/src/index.html

@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-  <title>Archive2</title>
+  <title>Workspaces</title>
   <base href="/">
 
   <meta name="viewport" content="width=device-width, initial-scale=1">