Add contact information

src/app/service/service.component.html

 <mat-expansion-panel>
-  <mat-expansion-panel-header>
-	<mat-panel-title style="min-width: 100px;">{{ service.name }}</mat-panel-title>
-	<mat-panel-description *ngIf="(deployment$ | async) as dep">
-	  <span *ngIf="dep.state_target == 'deployed'">
-		Access requested
-	  </span>
-	</mat-panel-description>
-  </mat-expansion-panel-header>
+	<mat-expansion-panel-header>
+		<mat-panel-title style="min-width: 100px;">{{ service.name }}</mat-panel-title>
+		<mat-panel-description *ngIf="(deployment$ | async) as dep">
+			<span *ngIf="dep.state_target == 'deployed'">
+				Access requested
+			</span>
+		</mat-panel-description>
+	</mat-expansion-panel-header>
 
-  <!-- expansion body -->
-  <div>
-	<table>
-	  <thead>
-		<tr>
-		  <td>Site</td>
-		  <td>Service</td>
-		  <td>State</td>
-		</tr>
-	  </thead>
-	  <tbody>
-		<tr deployment-state-tr [service]="service"></tr>
-	  </tbody>
-	</table>
-  </div>
-  <ng-template #noDeployment>
-	<p>
-	Your credentials were never deployed to the service {{ service.name }}
-	</p>
-  </ng-template>
-  <mat-action-row deployment-action-row [deployment$]="deployment$" [service]="service"></mat-action-row>
+	<!-- expansion body -->
+	<div>
+		<table>
+			<thead>
+				<tr>
+					<td>Site</td>
+					<td>Service</td>
+					<td>State</td>
+					<td></td>
+					<td>Contact</td>
+				</tr>
+			</thead>
+			<tbody>
+				<tr deployment-state-tr [service]="service"></tr>
+			</tbody>
+		</table>
+	</div>
+	<ng-template #noDeployment>
+		<p>
+		Your credentials were never deployed to the service {{ service.name }}
+		</p>
+	</ng-template>
+	<mat-action-row deployment-action-row [deployment$]="deployment$" [service]="service"></mat-action-row>
 </mat-expansion-panel>

src/app/state/state.component.html

+<!-- site column -->
 <td>
 	<h4>{{ service.site.name }}</h4>
 	<br>
 	<small>{{ service.site.description }}</small>
 </td>
 
+<!-- service column -->
 <td>
 	<h4>{{ service.name }}</h4>
 	<br>
@@ -11,23 +13,24 @@
 </td>
 
 <ng-container *ngIf="(state$ | async) as state; else noStateItem">
+	<!-- state column -->
 	<td [matTooltip]="tooltip(state)">
 		<span [ngSwitch]="state.state" class="spaced">
 			<mat-icon *ngSwitchCase="'deployed'">call_made</mat-icon>
 			<mat-icon *ngSwitchCase="'questionnaire'">warning</mat-icon>
 			<mat-progress-spinner *ngSwitchCase="'deployment_pending'" diameter="24" mode="indeterminate"></mat-progress-spinner>
 			<mat-progress-spinner *ngSwitchCase="'removal_pending'" diameter="24" mode="indeterminate"></mat-progress-spinner>
-			<mat-icon *ngSwitchCase="'not_deployed'" mat-icon-button>call_received</mat-icon>
-			<mat-icon *ngSwitchCase="'failed'" mat-icon-button>error</mat-icon>
-			<mat-icon *ngSwitchCase="'rejected'" mat-icon-button>error</mat-icon>
-			<mat-icon *ngSwitchDefault mat-icon-button>call_received</mat-icon>
+			<mat-icon *ngSwitchCase="'not_deployed'">call_received</mat-icon>
+			<mat-icon *ngSwitchCase="'failed'">error</mat-icon>
+			<mat-icon *ngSwitchCase="'rejected'">error</mat-icon>
+			<mat-icon *ngSwitchDefault>call_received</mat-icon>
 		</span>
 		<h4>{{ lang.printState(state.state) }}</h4>
 		<br>
 		<div class="mat-small">{{ tooltip(state) }}</div>
 	</td>
 
-	<!-- state dependent buttons -->
+	<!-- actions column -->
 	<td style="width: 120px;">
 		<div *ngIf="state.state == 'deployed'">
 			<button (click)="dialog.openCredentials(state$)" mat-raised-button class="mat-elevation-z6">
@@ -65,6 +68,7 @@
 </ng-container>
 
 <ng-template #noStateItem>
+	<!-- state column -->
 	<td>
 		<span>
 			<mat-icon mat-icon-button>call_received</mat-icon>
@@ -73,4 +77,16 @@
 		<br>
 		<small>Access to this service was never requested.</small>
 	</td>
+	<!-- actions column -->
+	<td></td>
 </ng-template>
+
+
+<!-- contacts column -->
+<td >
+	<button mat-button mat-icon-button href="mailto:{{ service.contact_email }}?Subject=%5BFEUDAL%5D%0A">
+		<mat-icon>contact_support</mat-icon>
+	</button>
+	<br>
+	<small>Click to contact {{ service.contact_description }}</small>
+</td>

src/app/vo-data/vo-data.component.html

@@ -28,6 +28,8 @@
 			  <td>Site</td>
 			  <td>Service</td>
 			  <td>State</td>
+				<td></td>
+				<td>Contact</td>
 			</tr>
 		  </thead>
 		  <tbody>