Merge pull request #1 from Arif-Khalid/main

Update branch with latest updates to main

package.json

@@ -1,6 +1,6 @@
 {
   "name": "WATcher",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "main": "main.js",
   "scripts": {
     "ng": "ng",

src/app/issues-viewer/card-view/card-view.component.ts

@@ -1,4 +1,4 @@
-import { AfterViewInit, Component, Input, OnDestroy, OnInit, ViewChild } from '@angular/core';
+import { AfterViewInit, Component, ElementRef, Input, OnDestroy, OnInit, ViewChild } from '@angular/core';
 import { MatPaginator } from '@angular/material/paginator';
 import { MatSort } from '@angular/material/sort';
 import { Observable } from 'rxjs';
@@ -29,7 +29,10 @@ export class CardViewComponent implements OnInit, AfterViewInit, OnDestroy, Filt
   issues: IssuesDataTable;
   issues$: Observable<Issue[]>;
 
-  constructor(public issueService: IssueService) {}
+  isLoading = true;
+  issueLength = 0;
+
+  constructor(public element: ElementRef, public issueService: IssueService) {}
 
   ngOnInit() {
     this.issues = new IssuesDataTable(this.issueService, this.sort, this.paginator, this.headers, this.assignee, this.filters);
@@ -41,6 +44,16 @@ export class CardViewComponent implements OnInit, AfterViewInit, OnDestroy, Filt
     setTimeout(() => {
       this.issues.loadIssues();
       this.issues$ = this.issues.connect();
+
+      // Emit event when issues change
+      this.issues$.subscribe((issues) => {
+        this.issueLength = issues.length;
+      });
+
+      // Emit event when loading state changes
+      this.issues.isLoading$.subscribe((isLoadingUpdate) => {
+        this.isLoading = isLoadingUpdate;
+      });
     });
   }
 

src/app/issues-viewer/issues-viewer.component.html

@@ -10,11 +10,20 @@
       <app-card-view
         *ngFor="let assignee of assignees"
         class="issue-table"
+        #card
+        [ngStyle]="{ display: card.isLoading || card.issueLength > 0 ? 'initial' : 'none' }"
         [assignee]="assignee"
         [headers]="this.displayedColumns"
         [sort]="filterbar.matSort"
       ></app-card-view>
-      <app-card-view class="issue-table" [headers]="this.displayedColumns" [sort]="filterbar.matSort"></app-card-view>
+      <app-card-view
+        class="issue-table"
+        #card
+        [ngStyle]="{ display: card.isLoading || card.issueLength > 0 ? 'initial' : 'none' }"
+        [headers]="this.displayedColumns"
+        [sort]="filterbar.matSort"
+      >
+      </app-card-view>
     </div>
   </ng-template>
 </div>

src/app/shared/layout/header.component.html

@@ -8,7 +8,10 @@
   >
     <mat-icon>arrow_back_ios</mat-icon>
   </button>
-  <a class="mat-toolbar mat-primary" style="text-decoration: none" [routerLink]="phaseService.currentPhase"
+  <a
+    class="mat-toolbar mat-primary"
+    style="text-decoration: none"
+    [routerLink]="phaseService.isRepoSet() ? phaseService.currentPhase : null"
     >WATcher v{{ this.getVersion() }}</a
   >
   <span id="phase-descriptor" *ngIf="auth.isAuthenticated()" style="margin-left: 10px">