Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(PublicKey):own components for modals #6290

Merged
merged 2 commits into from
Jan 8, 2025
Merged

fix(PublicKey):own components for modals #6290

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
eeed481
fix(PublicKey):own components for modals
dweinholz Jan 8, 2025
ea28782
removed logs and adjusted html
vktrrdk Jan 8, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 1 addition & 3 deletions src/app/shared/modal/abstract-base-modal/abstract-base-modal.component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@ export abstract class AbstractBaseModalComponent {
}

async hide(): Promise<void> {
console.log('close modal abstract')
this.modalService.hide(this.modalId)

//Fix when calling hide and show form within a modal -- if it is called directly after another the new modal won't open
Expand All @@ -29,8 +28,7 @@ export abstract class AbstractBaseModalComponent {
const bsModalRef: BsModalRef = this.modalService.show(modalType, { initialState })
this.bsModalRef = bsModalRef
bsModalRef.setClass('modal-lg')
this.modalId = bsModalRef.id
console.log(`new id ${this.modalId}`)
this.modalId = bsModalRef.id

return bsModalRef.content.event
}
Expand Down
55 changes: 55 additions & 0 deletions ...red_modules/public-key/generate-public-key-modal/generate-public-key-modal.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@

<div class="modal-header">
<h4 class="modal-title">Generate public key</h4>
<button
type="button"
class="btn-close"
style="cursor: pointer"
(click)="hide()"
data-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body">
<div class="alert alert-danger">
Hereby a new keypair is generated, the public key will be set automatically. A download window for the
private key will also open.
<strong
>In order to use the new key, the permissions of the key may have to be adjusted. For this purpose call the following command:<br />
<code style="color: #777777">chmod 0600 nameOfTheKey</code></strong
>
<hr>
<strong>
We do not store the private key anywhere!<br />

In case you lose your private key, it is lost permanently!
</strong>
<div class="form-check">
<input
class="form-check-input"
name="public_key_acknowledgement_checkbox"
type="checkbox"
id="public_key_acknowledgement_checkbox"
[(ngModel)]="acknowledgement_given"
data-test-id="public_key_acknowledgement_checkbox"
/>
<label class="form-check-label" for="public_key_acknowledgement_checkbox">
I hereby confirm that I am aware of the effects of generating a new SSH-key.
</label>
</div>
</div>
</div>

<div class="modal-footer">
<button
[disabled]="!acknowledgement_given"
class="btn btn-success col-md4"
type="button"
id="set_new_ssh_key_button"
data-test-id="set_new_ssh_key_button"
(click)="generateKey(); hide()"
>
Set
</button>
<button class="btn btn-primary col-md-4" type="reset" (click)="hide()">Cancel</button>
</div>
Empty file added ...red_modules/public-key/generate-public-key-modal/generate-public-key-modal.component.scss
View file
Open in desktop
Empty file.
23 changes: 23 additions & 0 deletions ..._modules/public-key/generate-public-key-modal/generate-public-key-modal.component.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';

import { GeneratePublicKeyModalComponent } from './generate-public-key-modal.component';

describe('GeneratePublicKeyModalComponent', () => {
let component: GeneratePublicKeyModalComponent;
let fixture: ComponentFixture<GeneratePublicKeyModalComponent>;

beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [GeneratePublicKeyModalComponent]
})
.compileComponents();

fixture = TestBed.createComponent(GeneratePublicKeyModalComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});

it('should create', () => {
expect(component).toBeTruthy();
});
});
48 changes: 48 additions & 0 deletions ...hared_modules/public-key/generate-public-key-modal/generate-public-key-modal.component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
import { Component, EventEmitter, Injectable, Output } from '@angular/core';

Check failure on line 1 in src/app/shared/shared_modules/public-key/generate-public-key-modal/generate-public-key-modal.component.ts

View workflow job for this annotation

GitHub Actions / tslinting-check 

'Output' is defined but never used

Check failure on line 1 in src/app/shared/shared_modules/public-key/generate-public-key-modal/generate-public-key-modal.component.ts

View workflow job for this annotation

GitHub Actions / tslinting-check 

'Output' is defined but never used
import { KeyService } from 'app/api-connector/key.service';
import { AbstractBaseModalComponent } from 'app/shared/modal/abstract-base-modal/abstract-base-modal.component';
import { BsModalService } from 'ngx-bootstrap/modal';
import { saveAs } from 'file-saver'

@Injectable({ providedIn: 'root' })
@Component({
selector: 'app-generate-public-key-modal',
templateUrl: './generate-public-key-modal.component.html',
styleUrl: './generate-public-key-modal.component.scss'
})
export class GeneratePublicKeyModalComponent extends AbstractBaseModalComponent {
userlogin:string;
acknowledgement_given:boolean=false

constructor(
protected modalService: BsModalService,
private keyService:KeyService
) {
super(modalService)

}
showGeneratePublicKeyModal(
userlogin:string

): EventEmitter<void> {
const initialState = {
userlogin
}

return this.showBaseModal(GeneratePublicKeyModalComponent, initialState)
}

downloadPem(data: string): void {
const blob: Blob = new Blob([data], { type: 'pem' })
const url: string = window.URL.createObjectURL(blob)
saveAs(url, `${this.userlogin}_ecdsa`)
}


generateKey(): void {
this.keyService.generateKey().subscribe((res: any): void => {
this.event.emit()
this.downloadPem(res['private_key'])
})
}
}
230 changes: 2 additions & 228 deletions src/app/shared/shared_modules/public-key/public-key.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@
class="btn btn-primary"
style="float: left; margin: 2px"
type="button"
(click)="unsetAcknowledgment();generateKeyModal.show()"
(click)="showGeneratePublicKeyModal()"
id="generateSShKey"
data-test-id="generateSShKey"
>
Expand All @@ -27,7 +27,7 @@
class="btn btn-primary"
style="float: left; margin: 2px"
type="button"
(click)="public_key = '';unsetAcknowledgment(); pubKeyModal.show()"
(click)="showSetPublicKeyModal()"
id="setPublicKeyButton"
data-test-id="setPublicKeyButton"
>
Expand Down Expand Up @@ -71,229 +71,3 @@
</td>
<td></td>

<div
bsModal
#generateKeyModal="bs-modal"
class="modal fade"
tabindex="-1"
role="dialog"
aria-labelledby="Label"
aria-hidden="true"
id="generate_key_modal"
data-test-id="generate_key_modal"
>
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Generate public key</h4>
<button
type="button"
class="btn-close"
style="cursor: pointer"
(click)="generateKeyModal.hide()"
data-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body">
<alert type="danger">
<span *ngIf="userinfo?.PublicKey !== 'None'">
<strong>Warning!</strong>
By replacing the current key, all machines started in the future can only be accessed with the new key.
Already running or created machines remain accessible with the old (and hereby replaced) key.
</span>
<br />
<br />Hereby a new keypair is generated, the public key will be set automatically. A download window for the
private key will also open.
<strong
>In order to use the new key, the permissions of the key may have to be adjusted. For this purpose call<br />
<code style="color: #777777">chmod 0600 nameOfTheKey</code>.</strong
>
<alert type="warning">
We do not store the private key anywhere!<br />

In case you lose your private key, it is lost permanently!
</alert>
<div class="form-check">
<input
class="form-check-input"
name="public_key_acknowledgement_checkbox"
type="checkbox"
id="public_key_acknowledgement_checkbox"
[(ngModel)]="acknowledgement_given"
data-test-id="public_key_acknowledgement_checkbox"
/>
<label class="form-check-label" for="public_key_acknowledgement_checkbox">
I hereby confirm that I am aware of the effects of generating a new SSH-key.
</label>
</div>
</alert>
</div>

<div class="modal-footer">
<button
[disabled]="!acknowledgement_given"
class="btn btn-success col-md4"
type="button"
id="set_new_ssh_key_button"
data-test-id="set_new_ssh_key_button"
(click)="generateKey(); generateKeyModal.hide()"
>
Set
</button>
<button class="btn btn-primary col-md-4" type="reset" (click)="generateKeyModal.hide()">Cancel</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
<!-- /.modal -->

<div
bsModal
#pubKeyModal="bs-modal"
class="modal fade"
tabindex="-1"
role="dialog"
aria-labelledby="Label"
aria-hidden="true"
>
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Change public key</h4>
<button
type="button"
class="btn-close"
style="cursor: pointer"
(click)="pubKeyModal.hide()"
data-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body">
<alert type="info" *ngIf="public_key?.length === 0">
<strong>Info: </strong> Please enter a valid public key!
</alert>

<alert type="success" *ngIf="(public_key | isValidKeyPipe) && validated_key">
<strong>Info: </strong> This is a valid public key!
</alert>
<alert type="danger" *ngIf="(!(public_key | isValidKeyPipe) || !validated_key) && public_key?.length > 0">
<strong>Warning</strong> This is not a valid public key!
</alert>
<alert type="danger" *ngIf="(!(public_key | isValidKeyPipe) || blocked_key) && validated_key">
<strong>Warning: </strong>Due to security concerns, your key has been blocked permanently, and you won't be
able to use it anymore. It's highly recommended that you change your key immediately to prevent any further
security breaches.
<p>
If you have questions or need help, please E-Mail us at
<a class="alert-link" href="mailto: {{ CLOUD_PORTAL_SUPPORT_MAIL }}">{{ CLOUD_PORTAL_SUPPORT_MAIL }}</a
>.
</p>
</alert>
<alert type="info">
Currently supported public key formats are RSA and ECDSA (SHA2, NIST P256, P384 or P521).
</alert>
<textarea
rows="8"
type="text"
class="form-control input-lg"
id="public_key_enter_area"
data-test-id="public_key_enter_area"
placeholder="Please enter a new valid public key."
name="public_key"
[(ngModel)]="public_key"
(ngModelChange)="public_key = $event.trim(); isKeyBlocked(); validateKey()"
[ngClass]="(public_key | isValidKeyPipe) && validated_key ? 'is-valid' : 'is-invalid'"
#publickey
></textarea>

<br />

<div
class="alert"
*ngIf="(public_key | isValidKeyPipe) && validated_key && !blocked_key"
[ngClass]="acknowledgement_given ? 'alert-info' : 'alert-danger'"
>
<strong>Warning!</strong> Replacing your current public key with a different one will render all your
currently running machines inaccessible.
<div class="form-check">
<input
class="form-check-input"
name="public_key_acknowledgement_checkbox_replace"
type="checkbox"
[ngClass]="acknowledgement_given ? '' : 'is-invalid'"
id="public_key_acknowledgement_checkbox_replace"
data-test-id="public_key_acknowledgement_checkbox_replace"
[(ngModel)]="acknowledgement_given"
/>
<label class="form-check-label" for="public_key_acknowledgement_checkbox_replace">
I hereby confirm that I am aware of the effects of entering a new SSH-key.
</label>
</div>
</div>
</div>

<div class="modal-footer">
<button
[disabled]="!(public_key | isValidKeyPipe) || !validated_key || !acknowledgement_given || blocked_key"
class="btn btn-success col-md4"
type="button"
id="set_new_public_key_button"
data-test-id="set_new_public_key_button"
(click)="importKey(); pubKeyModal.hide()"
>
Set
</button>
<button class="btn btn-primary col-md-4" type="reset" (click)="pubKeyModal.hide()">Cancel</button>
</div>
</div>
<!-- /.modal-content -->L
</div>
<!-- /.modal-dialog -->
</div>
<!-- /.modal -->

<div
bsModal
#pubKeyResponseModal="bs-modal"
class="modal fade"
tabindex="-1"
role="dialog"
aria-labelledby="Label"
aria-hidden="true"
>
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Setting of public key of public key</h4>
<button
type="button"
class="btn-close"
style="cursor: pointer"
(click)="pubKeyResponseModal.hide()"
data-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body"></div>

<div class="modal-footer">
<button
class="btn btn-success"
type="button"
id="close_new_public_key_response_modal_button"
data-test-id="close_new_public_key_response_modal_button"
(click)="pubKeyResponseModal.hide()"
>
OK
</button>
<button class="btn btn-primary col-md-4" type="reset" (click)="pubKeyResponseModal.hide()">Cancel</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
Loading
Loading