Commit a07a5a1e authored by Lukas Burgey's avatar Lukas Burgey

Do a major refactoring

parent bcb8174b
<div class="mat-typography"> <div class="mat-typography">
<h3>User Info</h3> <h3>User Info</h3>
<mat-table [dataSource]="userService.userInfoData"> <mat-table [dataSource]="userService.userInfo()">
<ng-container matColumnDef="name"> <ng-container matColumnDef="name">
<mat-header-cell *matHeaderCellDef>Name</mat-header-cell> <mat-header-cell *matHeaderCellDef>Name</mat-header-cell>
<mat-cell *matCellDef="let element">{{ element.name}}</mat-cell> <mat-cell *matCellDef="let element">{{ element.name}}</mat-cell>
......
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
<div *ngIf="upload; then uploading else not_uploading"></div> <div *ngIf="upload; then uploading else not_uploading"></div>
</div> </div>
<ng-template #key_list> <ng-template #key_list>
<mat-table [dataSource]="userService.sshKeyData"> <mat-table [dataSource]="userService.sshKeyTable()">
<ng-container matColumnDef="name"> <ng-container matColumnDef="name">
<mat-header-cell *matHeaderCellDef>Name</mat-header-cell> <mat-header-cell *matHeaderCellDef>Name</mat-header-cell>
<mat-cell *matCellDef="let element">{{ element.name}}</mat-cell> <mat-cell *matCellDef="let element">{{ element.name}}</mat-cell>
......
<div> <div>
<span *ngIf="userService.loggedIn ? false : true"> <span *ngIf="userService.userState ? false : true">
<form *ngIf="idps" <form *ngIf="idps"
(ngSubmit)="userService.login(selectedIdP)" #loginForm="ngForm"> (ngSubmit)="userService.login(selectedIdP)" #loginForm="ngForm">
<mat-form-field> <mat-form-field>
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
<button mat-raised-button [disabled]="!loginForm.form.valid" color="accent" type="submit">Login</button> <button mat-raised-button [disabled]="!loginForm.form.valid" color="accent" type="submit">Login</button>
</form> </form>
</span> </span>
<span *ngIf="userService.loggedIn"> <span *ngIf="userService.userState">
<button mat-button mat-icon-button (click)="dialog.openAccount()"> <button mat-button mat-icon-button (click)="dialog.openAccount()">
<mat-icon>settings</mat-icon> <mat-icon>settings</mat-icon>
</button> </button>
......
<div *ngIf="userService.loggedIn"> <div *ngIf="userService.loggedIn()">
<div style="padding-bottom: 30px;"> <div style="padding-bottom: 30px;">
<h2>Services</h2> <h2>Services</h2>
<div *ngIf="userService.services.length > 0"> <div *ngIf="userService.services.length > 0">
<mat-accordion> <mat-accordion>
<app-service *ngFor="let service of userService.services" <app-service *ngFor="let service of userService.services"
[serviceData]="service"></app-service> [service]="service"></app-service>
</mat-accordion> </mat-accordion>
</div> </div>
<p *ngIf="userService.services?.length == 0"> <p *ngIf="userService.services?.length == 0">
......
<mat-expansion-panel *ngIf="serviceData"> <mat-expansion-panel *ngIf="service">
<mat-expansion-panel-header> <mat-expansion-panel-header>
<mat-panel-title>{{ serviceData.name }}</mat-panel-title> <mat-panel-title>{{ service.name }}</mat-panel-title>
<mat-panel-description>{{ serviceData.description }}</mat-panel-description> <mat-panel-description>{{ service.description }}</mat-panel-description>
</mat-expansion-panel-header> </mat-expansion-panel-header>
<table width="60%"> <table width="60%">
<tr style="margin-bottom: 15px;"> <tr style="margin-bottom: 15px;">
<td *ngFor="let site of serviceData.site"> <td *ngFor="let site of service.site">
<span matTooltip="Provided at site {{ site.name }}" style="margin-right: 10px;"> <span matTooltip="Provided at site {{ site.name }}" style="margin-right: 10px;">
<mat-icon style="vertical-align: middle; padding-right: 5px;">storage</mat-icon> <mat-icon style="vertical-align: middle; padding-right: 5px;">storage</mat-icon>
{{ site.name }} {{ site.name }}
</span> </span>
<div *ngIf="userService.user.ssh_keys.length > 0"> <span *ngIf="userService.user.ssh_keys.length > 0">
<span *ngFor="let key of userService.user.ssh_keys" <span *ngFor="let key of userService.user.ssh_keys"
[ngSwitch]="userService.taskState(site, serviceData, key)" class="childs-inline"> [ngSwitch]="userService.taskState(site, service, key)" class="childs-inline" style="margin-right: 5px;">
<!-- states with actions --> <!-- states with actions -->
<button *ngSwitchCase="'deployed'" mat-button mat-icon-button <button *ngSwitchCase="'deployed'" mat-button mat-icon-button
matTooltip="The credentials are deployed to the site."> matTooltip="The key {{key.name}} is deployed to the site. Click to see details.">
<mat-icon style="vertical-align: middle">call_made</mat-icon> <mat-icon style="vertical-align: middle">call_made</mat-icon>
</button> </button>
<button *ngSwitchCase="'questionnaire'" mat-button mat-icon-button <button *ngSwitchCase="'questionnaire'" mat-button mat-icon-button
(click)="dialog.openQuestionnaire(userService.taskItem(site, serviceData))" (click)="dialog.openQuestionnaire(userService.taskItem(site, service))"
matTooltip="This site needs more data to deploy the credentials. Please click to matTooltip="This site needs more data to deploy the keys. Please click to submit the data.">
submit the data.">
<mat-icon>warning</mat-icon> <mat-icon>warning</mat-icon>
</button> </button>
<!-- states without actions --> <!-- states without actions -->
<span *ngSwitchCase="'deployment_pending'" <span *ngSwitchCase="'deployment_pending'" matTooltip="Waiting for the deployment of the key {{ key.name }} by the site">
matTooltip="Waiting for the deployment of the credentials from the site">
<mat-progress-spinner diameter="24" mode="indeterminate"></mat-progress-spinner> <mat-progress-spinner diameter="24" mode="indeterminate"></mat-progress-spinner>
</span> </span>
<span *ngSwitchCase="'removal_pending'" <span *ngSwitchCase="'removal_pending'" matTooltip="Waiting for the removal of the key {{ key.name }} from the site">
matTooltip="Waiting for the removal of the credentials from the site">
<mat-progress-spinner diameter="24" mode="indeterminate"></mat-progress-spinner> <mat-progress-spinner diameter="24" mode="indeterminate"></mat-progress-spinner>
</span> </span>
<span *ngSwitchCase="'not_deployed'" <span *ngSwitchCase="'not_deployed'" matTooltip="The key {{ key.name }} is not deployed to this site.">
matTooltip="The credential is not deployed to this site.">
<mat-icon style="vertical-align: middle">call_received</mat-icon> <mat-icon style="vertical-align: middle">call_received</mat-icon>
</span> </span>
<span *ngSwitchCase="'failed'" <span *ngSwitchCase="'failed'" matTooltip="This site failed to deploy the credentials. The deployment will be retried.">
matTooltip="This site failed to deploy the credentials. The deployment will be retried.">
<mat-icon style="vertical-align: middle">error</mat-icon> <mat-icon style="vertical-align: middle">error</mat-icon>
</span> </span>
<span *ngSwitchCase="'rejected'" <span *ngSwitchCase="'rejected'" matTooltip="This site rejected the deployment of the key {{ key.name }}.">
matTooltip="This site rejected the deployment. You can not use this service.">
<mat-icon style="vertical-align: middle">error</mat-icon> <mat-icon style="vertical-align: middle">error</mat-icon>
</span> </span>
<span *ngSwitchDefault <span *ngSwitchDefault matTooltip="Unrecognized state">
matTooltip="Unrecognized state"> <mat-icon style="vertical-align: middle">error</mat-icon>
<mat-icon style="vertical-align: middle">details</mat-icon>
</span> </span>
</span> </span>
</div> </span>
</td> </td>
</tr> </tr>
<tr> <tr>
<td style="padding-right: 35px;" <td style="padding-right: 35px;"
*ngFor="let group of serviceData.groups" *ngFor="let group of service.groups"
matTooltip="Can be used with membership of group {{ group.name }}"> matTooltip="Can be used with membership of group {{ group.name }}">
<mat-icon style="vertical-align: middle; padding-right: 5px;">lock outline</mat-icon> <mat-icon style="vertical-align: middle; padding-right: 5px;">lock outline</mat-icon>
{{ group.name }} {{ group.name }}
......
...@@ -4,13 +4,17 @@ import { MatCheckboxChange } from '@angular/material/checkbox'; ...@@ -4,13 +4,17 @@ import { MatCheckboxChange } from '@angular/material/checkbox';
import { UserService } from '../user.service'; import { UserService } from '../user.service';
import { DialogService } from '../dialogues/dialog.service'; import { DialogService } from '../dialogues/dialog.service';
import * as t from '../types/types.module';
@Component({ @Component({
selector: 'app-service', selector: 'app-service',
templateUrl: './service.component.html', templateUrl: './service.component.html',
styleUrls: ['./service.component.css'] styleUrls: ['./service.component.css']
}) })
export class ServiceComponent implements OnInit { export class ServiceComponent implements OnInit {
@Input() serviceData: any; @Input() service: t.Service;
public sshKeys: t.SSHKeyRef[];
public deployment: t.Deployment;
constructor( constructor(
public userService: UserService, public userService: UserService,
...@@ -19,22 +23,17 @@ export class ServiceComponent implements OnInit { ...@@ -19,22 +23,17 @@ export class ServiceComponent implements OnInit {
} }
ngOnInit() { ngOnInit() {
} this.sshKeys = this.userService.user.ssh_keys;
this.deployment = this.userService.userState.deployments.find(
public getDeployment() {
const deployment = this.userService.user.deployments.find(
d => { d => {
return d.service.name === this.serviceData.name; return d.service.id === this.service.id;
} }
); );
return deployment;
} }
public isDeployed(key): boolean { public isDeployed(key: t.SSHKeyRef): boolean {
const deployment = this.getDeployment(); if (this.deployment) {
if (deployment) { return this.deployment.ssh_keys.some(k => {
return deployment.ssh_keys.some(k => {
return k.id === key.id; return k.id === key.id;
}); });
} }
...@@ -43,9 +42,9 @@ export class ServiceComponent implements OnInit { ...@@ -43,9 +42,9 @@ export class ServiceComponent implements OnInit {
public deploymentChange(key) { public deploymentChange(key) {
if (!this.isDeployed(key)) { if (!this.isDeployed(key)) {
this.userService.addDeployment(this.serviceData, key); this.userService.addDeployment(this.service, key);
} else { } else {
this.userService.removeDeployment(this.serviceData, key); this.userService.removeDeployment(this.service, key);
} }
} }
} }
...@@ -2,6 +2,7 @@ import { NgModule } from '@angular/core'; ...@@ -2,6 +2,7 @@ import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
// auth stuff
export interface IdP { export interface IdP {
id: number; id: number;
name: string; name: string;
...@@ -17,7 +18,13 @@ export interface AllAuthInfo { ...@@ -17,7 +18,13 @@ export interface AllAuthInfo {
selected: IdP; selected: IdP;
} }
interface Group { // user stuff
export interface Group {
name: string;
}
export interface Site {
id: number;
name: string; name: string;
} }
...@@ -32,35 +39,58 @@ export interface SSHKey { ...@@ -32,35 +39,58 @@ export interface SSHKey {
key: string; key: string;
} }
export interface SSHKeyRef {
id: number;
name: string;
}
export interface Service { export interface Service {
id: number; id: number;
name: string; name: string;
sites: Site[];
group: Group[];
} }
interface Deployment { export interface DeploymentStateItem {
id: number;
site: Site;
state: string;
questionnaire: any;
credentials: any;
key: SSHKeyRef;
service: Service; service: Service;
ssh_keys: SSHKey[]; }
export interface DeploymentState {
id: number;
service: Service;
state_items: DeploymentStateItem[];
}
export interface Deployment {
service: Service;
ssh_keys: SSHKeyRef[];
ssh_keys_to_withdraw: SSHKeyRef[];
states: DeploymentState[];
} }
export interface User { export interface User {
email: string; email: string;
userinfo: any; userinfo: any;
ssh_keys: SSHKey[]; ssh_keys: SSHKey[];
deployments: Deployment[]; services: Service[];
deployment_states: any[];
deployment_state_items: any[];
id: number; id: number;
} }
interface StateAPI { export interface UserState {
services: Service[]; deployments: Deployment[];
logged_in: boolean; deployment_states: DeploymentState[];
deployment_state_items: DeploymentStateItem[];
} }
export interface UserState { export interface StateAPIResult {
services: Service[];
logged_in: boolean;
user: User; user: User;
user_state: UserState;
services: Service[];
error: string;
} }
......
import { TestBed, inject } from '@angular/core/testing';
import { UserService } from './user.service';
describe('UserService', () => {
beforeEach(() => {
TestBed.configureTestingModule({
providers: [UserService]
});
});
it('should be created', inject([UserService], (service: UserService) => {
expect(service).toBeTruthy();
}));
});
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment