Skip to content

Commit

Permalink
Convert Client Secret Input Fields to password (#4455)
Browse files Browse the repository at this point in the history
  • Loading branch information
richard-cox authored and nwmac committed Jul 22, 2020
1 parent a4e14c1 commit 560b524
Show file tree
Hide file tree
Showing 8 changed files with 48 additions and 14 deletions.
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
<div class="connection-dialog__loading-wrapper">
<mat-progress-bar class="connection-dialog__loading" [color]="(connectingError$ | async) && !(isBusy$ | async) ? 'warn' : 'primary'" [mode]="(isBusy$ | async) ? 'indeterminate' : 'solid'">
<mat-progress-bar class="connection-dialog__loading"
[color]="(connectingError$ | async) && !(isBusy$ | async) ? 'warn' : 'primary'"
[mode]="(isBusy$ | async) ? 'indeterminate' : 'solid'">
</mat-progress-bar>
</div>
<div class="connection-dialog">
Expand All @@ -15,13 +17,19 @@ <h2 mat-dialog-title>
<input matInput placeholder="Client ID" formControlName="clientID">
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Client Secret" type="password" formControlName="clientSecret">
<input matInput placeholder="Client Secret" type="password" formControlName="clientSecret"
[type]="!showSecret ? 'password' : 'text'">
<button mat-icon-button matSuffix (click)="showSecret = !showSecret" [attr.aria-label]="'Hide Secret'"
[attr.aria-pressed]="!showSecret" type='button'>
<mat-icon>{{!showSecret ? 'visibility_off' : 'visibility'}}</mat-icon>
</button>
</mat-form-field>
</mat-dialog-content>
<app-dialog-error message="Could not connect, please try again." [show]="connectingError$ | async"></app-dialog-error>
<app-dialog-error message="Could not connect, please try again." [show]="connectingError$ | async">
</app-dialog-error>
<mat-dialog-actions class="connection-dialog__actions">
<button [mat-dialog-close]="true" mat-button color="warn">Cancel</button>
<button type="submit" [disabled]="!endpointForm.valid" mat-button color="primary">Configure</button>
</mat-dialog-actions>
</form>
</div>
</div>
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,7 @@ export class UserInviteConfigurationDialogComponent {
public connectDelay = 1000;

guid: string;
public showSecret = false;

constructor(
public fb: FormBuilder,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,11 @@ <h1 class="create-endpoint__section-title">Advanced Information (Optional)</h1>
</mat-form-field>
<mat-form-field>
<input matInput id="client_secret" name="client_secret" ngModel #clientSecretField="ngModel"
placeholder="Client Secret">
placeholder="Client Secret" [type]="!show ? 'password' : 'text'">
<button mat-icon-button matSuffix (click)="show = !show" [attr.aria-label]="'Hide Secret'"
[attr.aria-pressed]="!show">
<mat-icon>{{!show ? 'visibility_off' : 'visibility'}}</mat-icon>
</button>
</mat-form-field>
</div>
<div *ngIf="endpointTypeSupportsSSO" class="create-endpoint__sso">
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,7 @@ export class CreateEndpointCfStep1Component implements IStepperStep, AfterConten

endpointTypeSupportsSSO = false;
endpoint: StratosCatalogEndpointEntity;
show = false;

constructor(
activatedRoute: ActivatedRoute,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -15,14 +15,20 @@ <h1 class="edit-endpoint__section-title">{{definition.label}} Information</h1>
<div *ngIf="showAdvancedFields" class="edit-endpoint__section">
<h1 class="edit-endpoint__section-title">Advanced Information (Optional)</h1>

<mat-checkbox matInput name="setClientInfo" formControlName="setClientInfo">Update Client ID and Client Secret</mat-checkbox>

<mat-checkbox matInput name="setClientInfo" formControlName="setClientInfo">Update Client ID and Client Secret
</mat-checkbox>

<mat-form-field>
<input matInput id="client_id" name="client_id" formControlName="clientID" placeholder="Client ID" required>
<mat-error *ngIf="clientID.errors && clientID.errors.required">Client ID is required</mat-error>
</mat-form-field>
<mat-form-field>
<input matInput id="client_secret" name="client_secret" formControlName="clientSecret" placeholder="Client Secret">
<input matInput id="client_secret" name="client_secret" formControlName="clientSecret"
placeholder="Client Secret" [type]="!show ? 'password' : 'text'">
<button mat-icon-button matSuffix (click)="show = !show" [attr.aria-label]="'Hide Secret'"
[attr.aria-pressed]="!show">
<mat-icon>{{!show ? 'visibility_off' : 'visibility'}}</mat-icon>
</button>
</mat-form-field>
</div>
<div *ngIf="endpointTypeSupportsSSO" class="edit-endpoint__sso">
Expand All @@ -36,4 +42,4 @@ <h1 class="edit-endpoint__section-title">Advanced Information (Optional)</h1>
</div>
</div>
</form>
</div>
</div>
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,7 @@ export class EditEndpointStepComponent implements OnDestroy, IStepperStep {
existingEndpointNames$: Observable<string[]>;
formChangeSub: Subscription;
setClientInfo = false;
show = false;

constructor(
activatedRoute: ActivatedRoute,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,12 @@ <h1>{{title}} Setup with Cloud Foundry UAA</h1>
<input matInput formControlName="clientId" placeholder="Client ID">
</mat-form-field>
<mat-form-field>
<input matInput formControlName="clientSecret" placeholder="Client Secret">
<input matInput formControlName="clientSecret" placeholder="Client Secret"
[type]="!show ? 'password' : 'text'">
<button mat-icon-button matSuffix (click)="show = !show" [attr.aria-label]="'Hide password'"
[attr.aria-pressed]="!show">
<mat-icon>{{!show ? 'visibility_off' : 'visibility'}}</mat-icon>
</button>
</mat-form-field>
</div>
<p class="uaa-wizard__form-section">Enter the username and password of an admin user (this is used to
Expand All @@ -31,7 +36,12 @@ <h1>{{title}} Setup with Cloud Foundry UAA</h1>
<input matInput formControlName="adminUsername" placeholder="Admin Username">
</mat-form-field>
<mat-form-field>
<input matInput type="password" formControlName="adminPassword" placeholder="Admin Password">
<input matInput type="password" formControlName="adminPassword" placeholder="Admin Password"
[type]="!showPassword ? 'password' : 'text'">
<button mat-icon-button matSuffix (click)="showPassword = !showPassword"
[attr.aria-label]="'Hide password'" [attr.aria-pressed]="!showPassword">
<mat-icon>{{!showPassword ? 'visibility_off' : 'visibility'}}</mat-icon>
</button>
</mat-form-field>
</div>
<!-- Single Sign-on -->
Expand Down
Original file line number Diff line number Diff line change
@@ -1,16 +1,16 @@
import { Component, OnInit, ViewEncapsulation, Inject } from '@angular/core';
import { Component, Inject, OnInit, ViewEncapsulation } from '@angular/core';
import { FormControl, FormGroup, Validators } from '@angular/forms';
import { Store } from '@ngrx/store';
import { BehaviorSubject, Observable } from 'rxjs';
import { delay, filter, map, skipWhile, take } from 'rxjs/operators';

import { VerifySession } from '../../../../../store/src/actions/auth.actions';
import { SetupConsoleGetScopes, SetupSaveConfig } from '../../../../../store/src/actions/setup.actions';
import { InternalAppState } from '../../../../../store/src/app-state';
import { AuthState } from '../../../../../store/src/reducers/auth.reducer';
import { UAASetupState } from '../../../../../store/src/types/uaa-setup.types';
import { StepOnNextFunction } from '../../../shared/components/stepper/step/step.component';
import { SetupConsoleGetScopes, SetupSaveConfig } from '../../../../../store/src/actions/setup.actions';
import { APP_TITLE } from '../../../core/core.types';
import { StepOnNextFunction } from '../../../shared/components/stepper/step/step.component';
import { getSSOClientRedirectURI } from '../../endpoints/endpoint-helpers';

@Component({
Expand All @@ -35,6 +35,9 @@ export class ConsoleUaaWizardComponent implements OnInit {
selectedScope = '';
applyingSetup$ = new BehaviorSubject<boolean>(false);

public show = false;
public showPassword = false;

uaaFormNext: StepOnNextFunction = () => {
this.store.dispatch(new SetupConsoleGetScopes({
uaa_endpoint: this.uaaForm.get('apiUrl').value,
Expand Down

0 comments on commit 560b524

Please sign in to comment.