You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

83 lines
2.4 KiB

<gf-dialog-header [title]="data.title" (closeButtonClicked)="onClose()" />
<div class="py-3" mat-dialog-content>
<div class="align-items-center d-flex flex-column">
<form class="w-100">
@if (data.hasPermissionToUseAuthToken) {
<mat-form-field appearance="outline" class="without-hint w-100">
<mat-label i18n>Security Token</mat-label>
<input
matInput
[formControl]="accessTokenFormControl"
[type]="isAccessTokenHidden ? 'password' : 'text'"
(keydown.enter)="onLoginWithAccessToken(); $event.preventDefault()"
/>
<button
mat-button
matSuffix
type="button"
(click)="isAccessTokenHidden = !isAccessTokenHidden"
>
<ion-icon
[name]="isAccessTokenHidden ? 'eye-outline' : 'eye-off-outline'"
/>
</button>
</mat-form-field>
}
@if (
data.hasPermissionToUseAuthGoogle && data.hasPermissionToUseAuthToken
) {
<div class="my-3 text-center text-muted" i18n>or</div>
}
@if (data.hasPermissionToUseAuthGoogle) {
<div class="d-flex flex-column">
<a
class="px-4 rounded-pill"
href="../api/v1/auth/google"
mat-stroked-button
><img
class="mr-2"
src="../assets/icons/google.svg"
style="height: 1rem"
/><span i18n>Sign in with Google</span></a
>
</div>
}
@if (data.hasPermissionToUseAuthOidc) {
<div class="d-flex flex-column mt-2">
<a
class="px-4 rounded-pill"
href="../api/auth/oidc"
mat-stroked-button
><ng-container i18n>Sign in with OIDC</ng-container></a
>
</div>
}
</form>
</div>
</div>
<div mat-dialog-actions>
<div class="flex-grow-1">
<mat-checkbox color="primary" i18n (change)="onChangeStaySignedIn($event)"
>Stay signed in</mat-checkbox
>
</div>
<div>
@if (data.hasPermissionToUseAuthToken) {
<button
color="primary"
mat-flat-button
[disabled]="
!(accessTokenFormControl.dirty && accessTokenFormControl.valid)
"
(click)="onLoginWithAccessToken()"
>
<ng-container i18n>Sign in</ng-container>
</button>
}
</div>
</div>