The whole API now uses id's for identification

src/app/login/login.component.html

@@ -3,7 +3,7 @@
 			(ngSubmit)="userService.login(selectedIdP)" #loginForm="ngForm">
 		<mat-form-field>
 			<mat-select name="idp" required [(ngModel)]="selectedIdP">
-				<mat-option *ngFor="let idp of idps" [value]="idp.id">
+				<mat-option *ngFor="let idp of idps" [value]="idp">
 					{{ idp.name }}
 				</mat-option>
 			</mat-select>

src/app/login/login.component.ts

 import { Component } from '@angular/core';
-import { HttpClient } from '@angular/common/http';
 
 import { DialogService } from '../dialog.service';
 import { UserService } from '../user.service';
+import { AllAuthInfo, IdP } from '../types/types.module';
 
 @Component({
   selector: 'app-login',
@@ -11,23 +11,18 @@ import { UserService } from '../user.service';
 })
 export class LoginComponent {
   private profileDialog;
-  public idps: any[];
-  public selectedIdP: number;
+  public idps: IdP[];
+  public selectedIdP: IdP;
 
   constructor(
     public userService: UserService,
     public dialog: DialogService,
-    public http: HttpClient,
   ) {
-    this.selectedIdP = this.userService.getIdPPreference();
-
-    this.userService.getAuthInfo().subscribe(
-      data => {
-        this.idps = data['idps'];
-        if (!this.selectedIdP) {
-          this.selectedIdP = data['default'];
+      this.userService.getIdPPreference().subscribe(
+        (allAuthInfo: AllAuthInfo) => {
+          this.idps = allAuthInfo.idps;
+          this.selectedIdP = allAuthInfo.selected;
         }
-      }
-    );
+      );
   }
 }

src/app/service/service.component.ts

@@ -36,7 +36,7 @@ export class ServiceComponent implements OnInit {
     if (deployment) {
 
       return deployment.ssh_keys.some(k => {
-        return k.name === key.name;
+        return k.id === key.id;
       });
     }
     return false;
@@ -44,9 +44,9 @@ export class ServiceComponent implements OnInit {
 
   public deploymentChange(key) {
     if (!this.isDeployed(key)) {
-      this.userService.addDeployment(this.serviceData.name, key.name);
+      this.userService.addDeployment(this.serviceData, key);
     } else {
-      this.userService.removeDeployment(this.serviceData.name, key.name);
+      this.userService.removeDeployment(this.serviceData, key);
     }
   }
 }

src/app/ssh-keys/ssh-keys.component.html

 <div style="margin-bottom: 25px;">
 	<mat-table *ngIf="userService.user.ssh_keys" [dataSource]="userService.sshKeyData">
-		 <ng-container matColumnDef="name">
-      <mat-header-cell *matHeaderCellDef>Name</mat-header-cell>
-      <mat-cell *matCellDef="let element">{{ element.name}}</mat-cell>
-    </ng-container>
-    <ng-container matColumnDef="key">
-      <mat-header-cell *matHeaderCellDef>Key</mat-header-cell>
-      <mat-cell *matCellDef="let element">{{ element.key }}</mat-cell>
-    </ng-container>
-    <ng-container matColumnDef="action">
-      <mat-header-cell *matHeaderCellDef>Action</mat-header-cell>
-      <mat-cell *matCellDef="let element">
-				<button mat-icon-button (click)="deleteKey(element.name)"><mat-icon>delete_forever</mat-icon></button>
+		<ng-container matColumnDef="name">
+			<mat-header-cell *matHeaderCellDef>Name</mat-header-cell>
+			<mat-cell *matCellDef="let element">{{ element.name}}</mat-cell>
+		</ng-container>
+		<ng-container matColumnDef="key">
+			<mat-header-cell *matHeaderCellDef>Key</mat-header-cell>
+			<mat-cell *matCellDef="let element">{{ element.key }}</mat-cell>
+		</ng-container>
+		<ng-container matColumnDef="action">
+			<mat-header-cell *matHeaderCellDef>Action</mat-header-cell>
+			<mat-cell *matCellDef="let element">
+				<button mat-icon-button (click)="deleteKey(element)"><mat-icon>delete_forever</mat-icon></button>
 			</mat-cell>
-    </ng-container>
+		</ng-container>
 		<mat-header-row *matHeaderRowDef="columns"></mat-header-row>
-    <mat-row *matRowDef="let row; columns: columns;"></mat-row>
+		<mat-row *matRowDef="let row; columns: columns;"></mat-row>
 	</mat-table>
 	<p *ngIf="!userService.user.ssh_keys">
-	You have no keys uploaded yet.
+	You have no uploaded keys.
 	</p>
 </div>
 <div *ngIf="!upload">

src/app/ssh-keys/ssh-keys.component.ts

@@ -2,6 +2,7 @@ import { Component, OnInit } from '@angular/core';
 import { MatTableDataSource } from '@angular/material';
 
 import { UserService } from '../user.service';
+import { SSHKey, NewSSHKey } from '../types/types.module';
 
 @Component({
   selector: 'app-ssh-keys',
@@ -26,12 +27,16 @@ export class SshKeysComponent implements OnInit {
   }
 
   public uploadKey() {
-    this.userService.addSshKey({name: this.newKeyName, key: this.newKeyKey});
+    const newKey: NewSSHKey = {
+      name: this.newKeyName,
+      key: this.newKeyKey,
+    };
+    this.userService.addSshKey(newKey);
     this.ngOnInit();
   }
 
-  public deleteKey(name: string) {
-    this.userService.removeSshKey(name);
+  public deleteKey(key: SSHKey) {
+    this.userService.removeSshKey(key);
     this.ngOnInit();
   }
 }

src/app/types/types.module.ts

@@ -2,8 +2,8 @@ import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
 
-interface IdP {
-  id: string;
+export interface IdP {
+  id: number;
   name: string;
 }
 
@@ -12,17 +12,28 @@ export interface AuthInfo {
   default: number;
 }
 
+export interface AllAuthInfo {
+  idps: IdP[];
+  selected: IdP;
+}
+
 interface Group {
   name: string;
 }
 
-interface SSHKey {
-  id: string;
+export interface NewSSHKey {
+  name: string;
+  key: string;
+}
+
+export interface SSHKey {
+  id: number;
   name: string;
   key: string;
 }
 
 export interface Service {
+  id: number;
   name: string;
 }
 
@@ -38,6 +49,11 @@ export interface User {
   deployments: Deployment[];
 }
 
+interface StateAPI {
+  services: Service[];
+  logged_in: boolean;
+}
+
 export interface UserState {
   services: Service[];
   logged_in: boolean;

src/app/user.service.ts

@@ -11,7 +11,7 @@ import { MatTableDataSource } from '@angular/material';
 import { SnackBarService } from './snackbar.service';
 
 import { environment } from '../environments/environment';
-import { User, Service, AuthInfo, UserState } from './types/types.module';
+import { IdP, User, Service, AuthInfo, AllAuthInfo, UserState, SSHKey, NewSSHKey } from './types/types.module';
 
 
 @Injectable()
@@ -21,7 +21,6 @@ export class UserService {
   public sshKeyData: MatTableDataSource<any>;
   public userInfoData: MatTableDataSource<any>;
   public services: Service[];
-  public authInfo: AuthInfo;
 
 
   constructor(
@@ -32,22 +31,34 @@ export class UserService {
     this.update();
   }
 
-  public logState() {
-    console.log(
-      this.user,
-    );
+  public setIdPPreference(idp: IdP) {
+    this.cookieService.set(environment.idpCookieName, String(idp.id));
   }
 
-  public setIdPPreference(idpId: number) {
-    this.cookieService.set(environment.idpCookieName, String(idpId));
-  }
+  public getIdPPreference(): Observable<AllAuthInfo> {
+    let idpID = Number(this.cookieService.get(environment.idpCookieName));
 
-  public getIdPPreference(): number {
-    return Number(this.cookieService.get(environment.idpCookieName));
+    return this.http.get('/backend/auth/v1/info/').map(
+      (authInfo: AuthInfo) => {
+        let selected = authInfo.idps[1];
+
+        if (!idpID) {
+          idpID = authInfo.default;
+        }
+        for (const idp of authInfo.idps) {
+          if (idp.id === idpID) {
+            selected = idp;
+          }
+        }
+        return {
+          idps: authInfo.idps,
+          selected: selected,
+        };
+      }
+    );
   }
 
   public updateData(data: any) {
-
     if (data['error']) {
       this.snackBar.open(data['error']);
     }
@@ -83,20 +94,6 @@ export class UserService {
       this.sshKeyData = null;
       this.userInfoData = null;
     }
-
-    // FIXME remove
-    this.logState();
-  }
-
-  public getAuthInfo() {
-    return this.http.get('/backend/auth/v1/info/').map(
-      (data) => {
-        return data;
-      },
-      (err) => {
-        return {};
-      }
-    );
   }
 
   public updateState() {
@@ -117,8 +114,8 @@ export class UserService {
     this.updateState();
   }
 
-  public login(idpId: number) {
-    this.setIdPPreference(idpId);
+  public login(idp: IdP) {
+    this.setIdPPreference(idp);
     window.location.href = 'https://hdf-portal.data.kit.edu/backend/auth/v1/request';
   }
 
@@ -130,7 +127,7 @@ export class UserService {
     );
   }
 
-  public addSshKey(key: Object) {
+  public addSshKey(key: NewSSHKey) {
     const body = {
       'type': 'add',
       'key': key,
@@ -147,10 +144,10 @@ export class UserService {
     );
   }
 
-  public removeSshKey(id: string) {
+  public removeSshKey(key: SSHKey) {
     const body = {
       'type': 'remove',
-      'id': id,
+      'id': key.id,
     };
     return this.http.post('/backend/api/sshkey/', body).subscribe(
       (data) => {
@@ -164,38 +161,39 @@ export class UserService {
     );
   }
 
-  public addDeployment(serviceName: string, keyName: string) {
+  public addDeployment(service: Service, key: SSHKey) {
     const body = {
       'type': 'add',
-      'key': keyName,
-      'service': serviceName,
+      'key': key.id,
+      'service': service.id,
     };
     return this.http.post('/backend/api/deployments/', body).subscribe(
       (data) => {
-        this.snackBar.open('Deployed key ' + keyName);
+        this.snackBar.open('Deployed key ' + key.name);
         this.updateData(data);
       },
       (err) => {
-        this.snackBar.open('Error deploying key ' + keyName);
+        this.snackBar.open('Error deploying key ' + key.name);
         console.log(err);
         this.update();
       }
     );
   }
 
-  public removeDeployment(serviceName: string, keyName: string) {
+  public removeDeployment(service: Service, key: SSHKey) {
     const body = {
       'type': 'remove',
-      'key': keyName,
-      'service': serviceName,
+      'key': key.id,
+      'service':  service.id,
     };
+
     return this.http.post('/backend/api/deployments/', body).subscribe(
       (data) => {
-        this.snackBar.open('Withdrew key ' + keyName);
+        this.snackBar.open('Withdrew key ' + key.name);
         this.updateData(data);
       },
       (err) => {
-        this.snackBar.open('Error withdrawing key ' + keyName);
+        this.snackBar.open('Error withdrawing key ' + key.name);
         console.log(err);
         this.update();
       }