Clean Up Sonarcloud Quality Gate Issues (#1748)

* sonarcloud quality gate fixes

* remove role = presentation

* use gravatar service

* remove old placeholder.com references

cypress/e2e/group1/hostedWorkflows.ts

@@ -13,14 +13,7 @@
  *    See the License for the specific language governing permissions and
  *    limitations under the License.
  */
-import {
-  clickFirstActionsButtonPublic,
-  clickFirstActionsButtonPrivate,
-  goToTab,
-  goToUnexpandedSidebarEntry,
-  resetDB,
-  setTokenUserViewPort,
-} from '../../support/commands';
+import { clickFirstActionsButtonPrivate, goToTab, goToUnexpandedSidebarEntry, resetDB, setTokenUserViewPort } from '../../support/commands';
 
 describe('Dockstore hosted workflows', () => {
   resetDB();

cypress/e2e/group2/organizations.ts

@@ -86,7 +86,7 @@ describe('Dockstore Organizations', () => {
       typeInInput('Organization website', 'https://www.google.ca');
       cy.get('#createOrUpdateOrganizationButton').should('be.visible').should('not.be.disabled');
 
-      cy.get('[data-cy=image-url-input').clear().type('https://via.placeholder.com/150');
+      cy.get('[data-cy=image-url-input').clear().type('https://www.gravatar.com/avatar/');
       cy.get('#createOrUpdateOrganizationButton').should('be.visible').should('be.disabled');
 
       typeInInput('Contact Email Address', 'asdf@asdf.ca');

src/app/aliases/aliases.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit } from '@angular/core';
-import { combineLatest, Observable } from 'rxjs';
+import { Observable } from 'rxjs';
 import { map, takeUntil } from 'rxjs/operators';
 import { Base } from '../shared/base';
 import { Collection, DockstoreTool, Organization, Workflow, WorkflowVersionPathInfo } from '../shared/swagger';

src/app/changeUsernameBanner/changeUsernameBanner.component.ts

@@ -19,6 +19,4 @@ import { Component } from '@angular/core';
   selector: 'app-change-username-banner',
   templateUrl: './changeUsernameBanner.component.html',
 })
-export class ChangeUsernameBannerComponent {
-  constructor() {}
-}
+export class ChangeUsernameBannerComponent {}

src/app/container/container.component.ts

@@ -240,7 +240,7 @@ export class ContainerComponent extends Entry implements AfterViewInit, OnInit {
     this.selectTab(this.validTabs.indexOf('versions'));
   }
 
-  public setupPublicEntry(url: String) {
+  public setupPublicEntry(url: string) {
     if (url.includes('/containers/github.com') || url.includes('/tools/github.com')) {
       this.containerService.setTool(null);
       this.displayAppTool = true;

src/app/container/version-modal/version-modal.service.ts

@@ -60,5 +60,4 @@ export class VersionModalService {
 
     return sizeStr;
   }
-  constructor() {}
 }

src/app/docs/docs.component.html

@@ -14,7 +14,7 @@
   ~    limitations under the License.
   -->
 
-<app-header> <img src="../assets/images/dockstore/dockstore-documentation.png" /> Documentation </app-header>
+<app-header> <img src="../assets/images/dockstore/dockstore-documentation.png" alt="Docs icon" /> Documentation </app-header>
 
 <div class="container">
   <div class="row">

src/app/docs/docs.component.ts

@@ -42,8 +42,6 @@ export class DocsComponent implements OnInit {
 
   public redirectLink = this.getLink();
 
-  constructor() {}
-
   ngOnInit() {
     setTimeout(() => {
       window.location.href = this.getLink();
@@ -66,7 +64,7 @@ export class DocsComponent implements OnInit {
     if (matchingDoc != null) {
       redirectPath = matchingDoc.newPath;
     }
-    return redirectBase + redirectPath + '.html';
+    return redirectBase + redirectPath;
   }
 
   // Returns a function to test elements of an array against a path

src/app/entry/file-path.pipe.ts

@@ -5,7 +5,7 @@ import { Pipe, PipeTransform } from '@angular/core';
  */
 @Pipe({ name: 'filePathPipe' })
 export class FilePathPipe implements PipeTransform {
-  transform(filePath: String): String {
+  transform(filePath: string): string {
     if (filePath.endsWith('.dockstore.yml')) {
       if (filePath.endsWith('.github/.dockstore.yml')) {
         return '/.github/.dockstore.yml';

src/app/entry/router-link.pipe.ts

@@ -6,7 +6,7 @@ import { Workflow } from '../shared/openapi';
   name: 'routerLink',
 })
 export class RouterLinkPipe implements PipeTransform {
-  transform(entryType: EntryType, workflow: Workflow): String | null {
+  transform(entryType: EntryType, workflow: Workflow): string | null {
     if (!workflow || !entryType) {
       return null;
     }

src/app/funding/funding.component.ts

@@ -111,5 +111,4 @@ export class FundingComponent {
   getFunders(): Funder[] {
     return this.funders;
   }
-  constructor() {}
 }

src/app/gravatar/gravatar.service.ts

@@ -6,7 +6,6 @@ import { Md5 } from 'ts-md5/dist/md5';
 })
 export class GravatarService {
   readonly gravatarBaseUrl = 'https://www.gravatar.com/avatar/';
-  constructor() {}
 
   public gravatarUrlForEmail(email: string, defaultImage: string) {
     const hash = Md5.hashStr(email);

src/app/home-page/widget/entry-box/entry-box.component.ts

@@ -16,8 +16,7 @@
 
 import { Component, Input, OnInit } from '@angular/core';
 import { EntryType } from 'app/shared/enum/entry-type';
-import { EntryType as NewEntryType } from 'app/shared/openapi';
-import { EntryUpdateTime, UsersService } from 'app/shared/openapi';
+import { EntryUpdateTime, UsersService, EntryType as NewEntryType } from 'app/shared/openapi';
 import { debounceTime, finalize, takeUntil } from 'rxjs/operators';
 import { MyWorkflowsService } from 'app/myworkflows/myworkflows.service';
 import { RegisterToolService } from 'app/container/register-tool/register-tool.service';

src/app/loginComponents/auth/auth.component.html

@@ -1,5 +1,5 @@
 <div class="container">
   <div class="absCenter">
-    <img src="../../../assets/images/dockstore/loading.gif" />
+    <img src="../../../assets/images/dockstore/loading.gif" alt="Loading" />
   </div>
 </div>

src/app/loginComponents/onboarding/quickstart.component.ts

@@ -24,7 +24,7 @@ export class QuickStartComponent implements OnInit {
   public curStep = 1;
   public tokenSetComplete: boolean;
   Dockstore = Dockstore;
-  constructor() {}
+
   ngOnInit() {
     localStorage.setItem('page', '/quick-start');
   }

src/app/logout/logout.component.ts

@@ -5,6 +5,4 @@ import { Component } from '@angular/core';
   templateUrl: './logout.component.html',
   styleUrls: ['./logout.component.scss'],
 })
-export class LogoutComponent {
-  constructor() {}
-}
+export class LogoutComponent {}

src/app/maintenance/maintenance.component.ts

@@ -5,6 +5,4 @@ import { Component } from '@angular/core';
   templateUrl: './maintenance.component.html',
   styleUrls: ['./maintenance.component.scss'],
 })
-export class MaintenanceComponent {
-  constructor() {}
-}
+export class MaintenanceComponent {}

src/app/my-sidebar/my-sidebar.component.ts

@@ -5,6 +5,4 @@ import { Component } from '@angular/core';
   templateUrl: './my-sidebar.component.html',
   styleUrls: ['./my-sidebar.component.scss'],
 })
-export class MySidebarComponent {
-  constructor() {}
-}
+export class MySidebarComponent {}

src/app/mytools/mytools.component.ts

@@ -20,6 +20,4 @@ import { Component } from '@angular/core';
   templateUrl: './mytools.component.html',
   styleUrls: ['./mytools.component.css'],
 })
-export class MyToolsComponent {
-  constructor() {}
-}
+export class MyToolsComponent {}

src/app/organizations/organization-members/organization-members.component.html

@@ -38,17 +38,15 @@
             <div fxLayout="row" fxLayoutAlign="space-between stretch">
               <div fxFlex fxLayout="row" fxLayoutGap="1rem" fxLayoutAlign="center center">
                 <img
-                  *ngIf="organizationUser.user?.avatarUrl"
+                  *ngIf="organizationUser.user?.avatarUrl; else noAvatar"
                   mat-card-avatar
                   class="header-image"
                   [src]="organizationUser.user?.avatarUrl"
+                  alt="User avatar"
                 />
-                <img
-                  *ngIf="!organizationUser.user?.avatarUrl"
-                  mat-card-avatar
-                  class="header-image"
-                  src="https://via.placeholder.com/300x300?text=Avatar+Not+Found"
-                />
+                <ng-template #noAvatar>
+                  <img mat-card-avatar class="header-image" [src]="gravatarService.gravatarUrlForMysteryPerson()" alt="User avatar" />
+                </ng-template>
                 <div fxFlex="100" fxLayout="column" fxLayoutAlign="start stretch" fxLayoutGap="0.5rem">
                   <div fxLayout="row" fxLayoutAlign="space-between center">
                     <a class="no-underline" routerLink="/users/{{ organizationUser.user?.username }}">

src/app/organizations/organization-members/organization-members.component.ts

@@ -29,6 +29,7 @@ import { OrganizationMembersQuery } from '../state/organization-members.query';
 import { OrganizationMembersService } from '../state/organization-members.service';
 import { OrganizationQuery } from '../state/organization.query';
 import { UpsertOrganizationMemberComponent } from '../upsert-organization-member/upsert-organization-member.component';
+import { GravatarService } from '../../gravatar/gravatar.service';
 
 @Component({
   selector: 'app-organization-members',
@@ -49,7 +50,8 @@ export class OrganizationMembersComponent extends Base implements OnInit {
     private organizationMembersService: OrganizationMembersService,
     private matDialog: MatDialog,
     private userQuery: UserQuery,
-    private alertService: AlertService
+    private alertService: AlertService,
+    public gravatarService: GravatarService
   ) {
     super();
   }

src/app/organizations/organization/organization-starring/organization-starring.service.ts

@@ -17,10 +17,7 @@
 import { Injectable } from '@angular/core';
 import { Observable } from 'rxjs';
 
-import { Organization, User } from '../../../shared/swagger';
-import { OrganizationsService } from '../../../shared/swagger';
-import { UsersService } from '../../../shared/swagger';
-import { StarRequest } from '../../../shared/swagger';
+import { Organization, User, OrganizationsService, UsersService, StarRequest } from '../../../shared/swagger';
 
 @Injectable()
 export class OrganizationStarringService {

src/app/organizations/state/register-organization.service.spec.ts

@@ -110,18 +110,18 @@ describe('RegisterOrganizationService', () => {
 
   it('should have correct avatar URL regex', () => {
     const regexp = new RegExp(registerOrganizationService.logoUrlRegex);
-    expect(regexp.test('https://www.https://via.placeholder.com/150.jpg')).toBeTruthy();
-    expect(regexp.test('https://www.https://via.placeholder.com/150.jPG')).toBeTruthy();
-    expect(regexp.test('https://www.https://via.placeholder.com/150.jpeg')).toBeTruthy();
-    expect(regexp.test('https://www.https://via.placeholder.com/150.jPEG')).toBeTruthy();
-    expect(regexp.test('https://www.https://via.placeholder.com/150.pNg')).toBeTruthy();
-    expect(regexp.test('https://www.https://via.placeholder.com/150.png')).toBeTruthy();
-    expect(regexp.test('https://www.https://via.placeholder.com/150.gif')).toBeTruthy();
-    expect(regexp.test('https://www.https://via.placeholder.com/150.gIf')).toBeTruthy();
-    expect(regexp.test('https://www.https://via.placeholder.com/150')).toBeFalsy();
+    expect(regexp.test('https://www.gravatar.com/avatar/.jpg')).toBeTruthy();
+    expect(regexp.test('https://www.gravatar.com/avatar/.jPG')).toBeTruthy();
+    expect(regexp.test('https://www.gravatar.com/avatar/.jpeg')).toBeTruthy();
+    expect(regexp.test('https://www.gravatar.com/avatar/.jPEG')).toBeTruthy();
+    expect(regexp.test('https://www.gravatar.com/avatar/.pNg')).toBeTruthy();
+    expect(regexp.test('https://www.gravatar.com/avatar/.png')).toBeTruthy();
+    expect(regexp.test('https://www.gravatar.com/avatar/.gif')).toBeTruthy();
+    expect(regexp.test('https://www.gravatar.com/avatar/.gIf')).toBeTruthy();
+    expect(regexp.test('https://www.gravatar.com/avatar/')).toBeFalsy();
     expect(regexp.test('.png')).toBeFalsy();
-    expect(regexp.test('https://www.https://via.placeholder.com/150.png potato')).toBeFalsy();
+    expect(regexp.test('https://www.gravatar.com/avatar/.png potato')).toBeFalsy();
     expect(regexp.test('adf .jpg')).toBeFalsy();
-    expect(regexp.test('https://via.placeholder.com/150.jpg asdf')).toBeFalsy();
+    expect(regexp.test('https://avatar/.jpg asdf')).toBeFalsy();
   });
 });

src/app/search/search-results/search-results.component.html

@@ -24,7 +24,7 @@
           <button fxFlex="21rem" type="button" class="btn btn-info tagCloud-btn workflow" (click)="clickTagCloudBtn('workflow')">
             <div fxLayout="row" fxLayoutAlign="space-between center">
               <div>
-                <img class="tag-cloud" src="../assets/images/dockstore/tag-cloud.svg" />
+                <img class="tag-cloud" src="../assets/images/dockstore/tag-cloud.svg" alt="Popular keywords icon" />
                 <span class="m-2"><b>Popular Keywords</b></span>
               </div>
               <fa-icon [icon]="(showWorkflowTagCloud$ | async) ? faMinus : faPlus" aria-hidden="true"></fa-icon>
@@ -58,7 +58,7 @@
           <button fxFlex="21rem" type="button" class="btn btn-info tagCloud-btn tool" (click)="clickTagCloudBtn('tool')">
             <div fxLayout="row" fxLayoutAlign="space-between center">
               <div>
-                <img class="tag-cloud" src="../assets/images/dockstore/tag-cloud.svg" />
+                <img class="tag-cloud" src="../assets/images/dockstore/tag-cloud.svg" alt="Popular keywords icon" />
                 <span class="m-2"><b>Popular Keywords</b></span>
               </div>
               <fa-icon [icon]="(showToolTagCloud$ | async) ? faMinus : faPlus" aria-hidden="true"></fa-icon>

src/app/search/search-workflow-table/search-workflow-table.component.spec.ts

@@ -1,7 +1,6 @@
 /* eslint-disable no-unused-vars, @typescript-eslint/no-unused-vars */
-import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
-import { async, ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
-import { By } from '@angular/platform-browser';
+import { NO_ERRORS_SCHEMA } from '@angular/core';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { RouterTestingModule } from '@angular/router/testing';

src/app/search/search.component.ts

@@ -131,7 +131,7 @@ export class SearchComponent implements OnInit, OnDestroy {
   public friendlyNames: Map<string, string>;
   public toolTips: Map<string, string>;
   private entryOrder: Map<string, SubBucket>;
-  private expandedPanels: Map<string, Boolean>;
+  private expandedPanels: Map<string, boolean>;
   public basicSearchText$: Observable<string>;
   private advancedSearchOptions = ['ANDSplitFilter', 'ANDNoSplitFilter', 'ORFilter', 'NOTFilter', 'searchMode'];
   public filterKeys$: Observable<Array<string>>;
@@ -673,10 +673,10 @@ export class SearchComponent implements OnInit, OnDestroy {
    * Saves state to local storage
    *
    * @param {string} key
-   * @param {Boolean} expanded
+   * @param {boolean} expanded
    * @memberof SearchComponent
    */
-  updateExpandedPanels(key: string, expanded: Boolean) {
+  updateExpandedPanels(key: string, expanded: boolean) {
     this.expandedPanels.set(key, expanded);
     this.clearExpandedPanelsState();
     this.saveExpandedPanelsState();

src/app/session-expired/session-expired.component.ts

@@ -19,6 +19,4 @@ import { Component } from '@angular/core';
   selector: 'app-policy-update',
   templateUrl: './session-expired.component.html',
 })
-export class SessionExpiredComponent {
-  constructor() {}
-}
+export class SessionExpiredComponent {}

src/app/shared/base.ts

@@ -31,8 +31,6 @@ import { Subject } from 'rxjs';
 export abstract class Base implements OnDestroy {
   protected ngUnsubscribe: Subject<{}> = new Subject();
 
-  constructor() {}
-
   ngOnDestroy() {
     this.ngUnsubscribe.next();
     this.ngUnsubscribe.complete();

src/app/shared/descriptor-type-compat.service.ts

@@ -32,8 +32,6 @@ import { ToolDescriptor, Workflow } from './swagger';
   providedIn: 'root',
 })
 export class DescriptorTypeCompatService {
-  constructor() {}
-
   /**
    * Checks if the descriptor type string is valid
    *

src/app/shared/descriptor.service.ts

@@ -20,8 +20,6 @@ import { SourceFile, ToolDescriptor } from './swagger';
 
 @Injectable({ providedIn: 'root' })
 export class DescriptorService {
-  constructor() {}
-
   /**
    * Gets the descriptor types (cwl/wdl/nfl) that the version has a sourcefile of
    *

src/app/shared/dockstore.service.ts

@@ -28,8 +28,6 @@ interface SourceObject {
   providedIn: 'root',
 })
 export class DockstoreService {
-  constructor() {}
-
   getValidVersions(versions: Array<WorkflowVersion | Tag>): Array<WorkflowVersion | Tag> {
     return versions.filter((version) => version.valid);
   }

src/app/shared/entry.ts

@@ -112,7 +112,7 @@ export abstract class Entry implements OnDestroy {
     this.verifiedLink = this.dateService.getVerifiedLink();
   }
 
-  private parseURL(url: String): void {
+  private parseURL(url: string): void {
     if (this.isPublic()) {
       this.title = this.getEntryPathFromURL();
       this.urlVersion = this.getVersionFromURL();
@@ -147,7 +147,7 @@ export abstract class Entry implements OnDestroy {
   abstract getDefaultVersionName(): string;
   abstract resetCopyBtn(): void;
   abstract isPublic(): boolean;
-  abstract setupPublicEntry(url: String): void;
+  abstract setupPublicEntry(url: string): void;
   /**
    * Upon entry init (either from the my-workflows page or public workflow page),
    * the previous active entry should be removed so that the component starts displaying with a the correct/current entry

src/app/shared/entry/entry-tab.ts

@@ -26,8 +26,6 @@ export abstract class EntryTab implements OnDestroy {
 
   protected ngUnsubscribe: Subject<{}> = new Subject();
 
-  constructor() {}
-
   ngOnDestroy() {
     this.ngUnsubscribe.next();
     this.ngUnsubscribe.complete();

src/app/shared/entry/recent-events.pipe.ts

@@ -16,7 +16,7 @@ export class RecentEventsPipe implements PipeTransform {
    *
    * @param {Event} event
    * @param {string} type 'displayName' | 'entryLink' | 'entryType' | 'orgLink' | 'collectionLink'
-   * @returns String | null
+   * @returns string | null
    */
   transform(event: Event, type: 'displayName' | 'entryLink' | 'entryType' | 'orgLink' | 'collectionLink'): string | null {
     if (!event || !type) {

src/app/shared/feature.service.ts

@@ -5,8 +5,6 @@ import { Dockstore } from './dockstore.model';
   providedIn: 'root',
 })
 export class FeatureService {
-  constructor() {}
-
   updateFeatureFlags(queryParams: string) {
     const urlSearchParams = new URLSearchParams(queryParams);
     const gitHubAppCallBackToNewDashBoard = urlSearchParams.has('state') && urlSearchParams.get('state').includes('newDashboard');

src/app/shared/loading/loading.component.ts

@@ -17,5 +17,4 @@ import { Component, Input } from '@angular/core';
 export class LoadingComponent {
   @Input() loading = true;
   @Input() retainContent = false;
-  constructor() {}
 }