chore(project landing page): use service to get contact type; correct…

… identation;
dasch-swiss · Mar 1, 2021 · b688416 · b688416
1 parent 37b3dce
commit b688416
Show file tree

Hide file tree

Showing 8 changed files with 118 additions and 118 deletions.
diff --git a/src/app/project/board/attribution-tab-view/attribution-tab-view.component.ts b/src/app/project/board/attribution-tab-view/attribution-tab-view.component.ts
@@ -1,5 +1,6 @@
 import { Component, Input } from '@angular/core';
 import { Attribution, IId, Organization, Person } from '@dasch-swiss/dsp-js';
+import { DatasetMetadataService } from '../dataset-metadata.service';
 
 @Component({
     selector: 'app-attribution-tab-view',
@@ -14,26 +15,18 @@ export class AttributionTabViewComponent {
 
     currentAgent: Person | Organization | IId;
 
+    constructor(private _datasetMetadataService: DatasetMetadataService) {
+    }
+
     // return the type of agent to use correct template to display it
-    setAgent (agent: Person | Organization | IId) {
-        let atype = this.getAgentType(agent);
+    setAgent (agent: Person | Organization | IId): string {
+        let atype = this._datasetMetadataService.getContactType(agent);
         if (atype) {
             this.currentAgent = agent;
             return atype;
         }
         this.currentAgent = this.subProperties[agent.id];
-        atype = this.getAgentType(this.currentAgent);
+        atype = this._datasetMetadataService.getContactType(this.currentAgent);
         return atype;
     }
-
-    getAgentType (agent: Person | Organization | IId) {
-        if (agent instanceof Person) {
-            return 'person';
-        }
-        if (agent instanceof Organization) {
-            return 'organisation';
-        }
-        return undefined;
-    }
-
 }
diff --git a/src/app/project/board/board.component.html b/src/app/project/board/board.component.html
@@ -4,21 +4,21 @@
     <div class="content large middle">
         <!--  mobile version: status and edit icon displayed before the title -->
         <div class="app-toolbar-mobile">
-        <span class="app-toolbar-action-status">
-            <span [class.active]="project.status" class="badge status">
-                <span *ngIf="project.status">Active</span>
-                <span *ngIf="!project.status">Deactivated</span>
+            <span class="app-toolbar-action-status">
+                <span [class.active]="project.status" class="badge status">
+                    <span *ngIf="project.status">Active</span>
+                    <span *ngIf="!project.status">Deactivated</span>
+                </span>
+            </span>
+            <span class="fill-remaining-space-action"></span>
+            <span class="app-toolbar-action-edit">
+                <button mat-icon-button
+                        *ngIf="projectAdmin && project.status"
+                        (click)="openDialog('editProject', project.shortname, project.shortcode)"
+                        class="right">
+                    <mat-icon>edit</mat-icon>
+                </button>
             </span>
-        </span>
-        <span class="fill-remaining-space-action"></span>
-        <span class="app-toolbar-action-edit">
-            <button mat-icon-button
-                *ngIf="projectAdmin && project.status"
-                (click)="openDialog('editProject', project.shortname, project.shortcode)"
-                class="right">
-                <mat-icon>edit</mat-icon>
-            </button>
-        </span>
         </div>
 
         <!-- desktop and tablet version -->
@@ -53,9 +53,7 @@ <h2 class="mat-title">
     </div>
 
     <div class="project-info-container flex-panel" *ngIf="!metadataLoading && selectedDataset">
-
         <div class="left-info column">
-
             <section class="project description">
                 <div class="metadata-property">
                     <div class="property-label">
@@ -84,15 +82,15 @@ <h2 class="mat-title">
                         </ng-template>
                         <app-dataset-tab-view [metadata]="selectedDataset" [noOfDatasets]="datasetOptions.length"></app-dataset-tab-view>
                     </mat-tab>
-                    
+
                     <mat-tab>
                         <ng-template mat-tab-label>
                             <mat-icon class="tab-icon">assignment</mat-icon>
                             Attribution
                         </ng-template>
                         <app-attribution-tab-view [attributions]="selectedDataset.qualifiedAttribution" [subProperties]="subProperties"></app-attribution-tab-view>
                     </mat-tab>
-                
+
                     <mat-tab>
                         <ng-template mat-tab-label>
                             <mat-icon class="tab-icon">receipt</mat-icon>
@@ -118,19 +116,17 @@ <h2 class="mat-title">
                         Dataset(s)
                     </div>
                     <div class="sidenav-prop-text">
-                        <mat-radio-group
-                        aria-label="Select a dataset"
-                        name="datasetsList"
-                        fxLayout="column"
-                        (change)="updateDataset($event)">
-                        <mat-radio-button
-                            *ngFor="let ds of datasetOptions"
-                            name="datasetsList"
-                            [checked]="ds.checked"
-                            [value]="ds.id">
-                            {{ ds.name }}
-                        </mat-radio-button>
-                    </mat-radio-group>
+                        <mat-radio-group aria-label="Select a dataset"
+                                         name="datasetsList"
+                                         fxLayout="column"
+                                         (change)="updateDataset($event)">
+                            <mat-radio-button *ngFor="let ds of datasetOptions"
+                                              name="datasetsList"
+                                              [checked]="ds.checked"
+                                              [value]="ds.id">
+                                {{ ds.name }}
+                            </mat-radio-button>
+                        </mat-radio-group>
                     </div>
                 </div>
             </div>
@@ -139,12 +135,12 @@ <h2 class="mat-title">
                 <div class="metadata-property">
                     <div>
                         <div class="property-label display-inline-block">Cite as</div>
-                        <button mat-button 
-                            matTooltip="Copy citation url"
-                            matTooltipPosition="below"
-                            [cdkCopyToClipboard]="selectedDataset.howToCite"
-                            (click)="copyToClipboard('Citation link')"
-                            class="btn-copy-to-clipboard">
+                        <button mat-button
+                                matTooltip="Copy citation url"
+                                matTooltipPosition="below"
+                                [cdkCopyToClipboard]="selectedDataset.howToCite"
+                                (click)="copyToClipboard('Citation link')"
+                                class="btn-copy-to-clipboard">
                             <mat-icon [inline]="true" class="icon-arkurl">content_copy</mat-icon>
                         </button>
                     </div>
@@ -155,44 +151,44 @@ <h2 class="mat-title">
             </div>
 
             <div class="metadata-box">
-
-                    <div class="metadata-property">
-                        <div>
-                            <div class="property-label display-inline-block">
-                                Persistent identifier
-                            </div>
-                            <button mat-button 
+                <div class="metadata-property">
+                    <div>
+                        <div class="property-label display-inline-block">
+                            Persistent identifier
+                        </div>
+                        <button mat-button
                                 matTooltip="Copy persistent identifier"
                                 matTooltipPosition="below"
                                 [cdkCopyToClipboard]="selectedProject.id"
                                 (click)="copyToClipboard('Persistent identifier')"
                                 class="btn-copy-to-clipboard">
-                                <mat-icon [inline]="true" class="icon-arkurl">content_copy</mat-icon>
-                            </button>
-                        </div>
-                        <div class="sidenav-prop-text property-value">
-                            <a href="{{ selectedProject.id }}" target="_blank"> {{ selectedProject.id }} </a>
-                        </div>
+                            <mat-icon [inline]="true" class="icon-arkurl">content_copy</mat-icon>
+                        </button>
                     </div>
-                    <div class="metadata-property">
-                        <div class="property-label display-inline-block">
-                            License
-                        </div>
-                        <div class="sidenav-prop-text property-value">
-                            <p class="p-block" *ngFor="let license of selectedDataset.license">
-                                <a *ngIf="license.url" href="{{ license.url }}" target="_blank"> {{ license.url }} </a>
-                            </p>
-                        </div>
+                    <div class="sidenav-prop-text property-value">
+                        <a href="{{ selectedProject.id }}" target="_blank"> {{ selectedProject.id }} </a>
                     </div>
-                    <div class="metadata-property" *ngIf="selectedDataset.datePublished">
-                        <div class="property-label">
-                            Publication date
-                        </div>
-                        <div class="sidenav-prop-text property-value">
-                            {{ selectedDataset.datePublished | date:'MMMM d, yyyy' }}
-                        </div>
+                </div>
+
+                <div class="metadata-property">
+                    <div class="property-label display-inline-block">
+                        License
+                    </div>
+                    <div class="sidenav-prop-text property-value">
+                        <p class="p-block" *ngFor="let license of selectedDataset.license">
+                            <a *ngIf="license.url" href="{{ license.url }}" target="_blank"> {{ license.url }} </a>
+                        </p>
                     </div>
+                </div>
 
+                <div class="metadata-property" *ngIf="selectedDataset.datePublished">
+                    <div class="property-label">
+                        Publication date
+                    </div>
+                    <div class="sidenav-prop-text property-value">
+                        {{ selectedDataset.datePublished | date:'MMMM d, yyyy' }}
+                    </div>
+                </div>
             </div>
 
             <div class="metadata-box">
@@ -215,12 +211,12 @@ <h2 class="mat-title">
                     </div>
                     <div class="sidenav-prop-text">
                         <a [routerLink]="" (click)="downloadMetadata()">JSON</a>
-                    <!-- Functionality to be implemented -->
-                    <a href *ngFor="let dformat of metadataDownloadFormats" class="download-metadata"> {{ dformat }} </a>
+                        <!-- Functionality to be implemented -->
+                        <a href *ngFor="let dformat of metadataDownloadFormats" class="download-metadata"> {{ dformat }} </a>
                     </div>
                 </div>
             </div>
         </div>
 
     </div>
-</div>
+</div>
diff --git a/src/app/project/board/board.component.ts b/src/app/project/board/board.component.ts
@@ -131,6 +131,7 @@ export class BoardComponent implements OnInit {
         this._dspApiConnection.v2.metadata.getProjectMetadata(this.project.id).subscribe(
             (response: ProjectsMetadata) => {
                 this.projectsMetadata = response;
+
                 this.metadataLoading = false;
 
                 // create list according to it's type
@@ -181,7 +182,7 @@ export class BoardComponent implements OnInit {
         }
     }
 
-    getSubProperty(id: string) {
+    getSubProperty(id: string): object {
         return this.subProperties[id];
     }
 

diff --git a/src/app/project/board/contacts-tab-view/contacts-tab-view.component.ts b/src/app/project/board/contacts-tab-view/contacts-tab-view.component.ts
@@ -1,5 +1,6 @@
 import { Component, Input, OnInit } from '@angular/core';
 import { IId, Organization, Person } from '@dasch-swiss/dsp-js';
+import { DatasetMetadataService } from '../dataset-metadata.service';
 
 @Component({
     selector: 'app-contacts-tab-view',
@@ -15,11 +16,14 @@ export class ContactsTabViewComponent implements OnInit {
     contactsList = [];
     contactType: string;
 
+    constructor(private _datasetMetadataService: DatasetMetadataService) {
+    }
+
     ngOnInit() {
 
         if (this.contactDetails) {
             // check which type of array is present
-            this.contactType = this.getContactType(this.contactDetails[0]);
+            this.contactType = this._datasetMetadataService.getContactType(this.contactDetails[0]);
 
             // if contactType is person or organization
             if (this.contactType) {
@@ -31,18 +35,8 @@ export class ContactsTabViewComponent implements OnInit {
             for (const contact of this.contactDetails) {
                 this.contactsList.push(this.subProperties[contact.id]);
             }
-            this.contactType = this.getContactType(this.contactsList[0]);
-
-        }
-    }
+            this.contactType = this._datasetMetadataService.getContactType(this.contactsList[0]);
 
-    getContactType(obj: Person | Organization | IId) {
-        if (obj instanceof Person) {
-            return 'person';
-        }
-        if (obj instanceof Organization) {
-            return 'organization';
         }
-        return undefined;
     }
 }
diff --git a/src/app/project/board/dataset-metadata.service.ts b/src/app/project/board/dataset-metadata.service.ts
@@ -0,0 +1,26 @@
+import { Injectable } from '@angular/core';
+import { IId, Organization, Person } from '@dasch-swiss/dsp-js';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class DatasetMetadataService {
+
+  constructor() { }
+
+  /**
+  * used in project metadata page
+  * determine if the object is of type Person or Organization or Iid
+  * @param obj Person | Organization | IId
+  */
+  getContactType(obj: Person | Organization | IId): string {
+    if (obj instanceof Person) {
+      return 'person';
+    }
+    if (obj instanceof Organization) {
+      return 'organization';
+    }
+    return undefined;
+  }
+
+}
diff --git a/src/app/project/board/organisation-template/organisation-template.component.ts b/src/app/project/board/organisation-template/organisation-template.component.ts
@@ -26,7 +26,7 @@ import { Organization } from '@dasch-swiss/dsp-js';
 
             <div *ngIf="organisation.email" class="metadata-property">
                 <div class="property-label display-inline-block">
-                Email:
+                    Email:
                 </div>
                 <div class="display-inline-block add-left-margin">
                     <a href="mailto:{{ organisation.email }}"> {{ organisation.email }} </a>

diff --git a/src/app/project/board/person-template/person-template.component.ts b/src/app/project/board/person-template/person-template.component.ts
@@ -17,7 +17,7 @@ export class PersonTemplateComponent implements OnInit {
 
     ngOnInit() {
         // check if members list is the list of [Organization] or [Iid]
-        let isOrganizationType: boolean = false;
+        let isOrganizationType = false;
 
         // if it is [Organization]
         if (this.person.memberOf[0] instanceof Organization) {