TheArchive/zitadel
1
0
Fork 0
mirror of https://github.com/zitadel/zitadel.git synced 2025-02-28 21:27:22 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(console): SMS provider (#3949)

Browse Source 
fix: console twilio

Co-authored-by: Livio Spring <livio.a@gmail.com>
This commit is contained in:
Max Peintner 2022-07-22 13:23:13 +02:00 committed by GitHub
parent aed7010508
commit 3855ec2ab5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
11 changed files with 368 additions and 214 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
console/src/app/modules/policies/notification-settings/dialog-add-sms-provider/dialog-add-sms-provider.component.html
View File

@ -8,7 +8,7 @@
<input cnslInput name="sid" formControlName="sid" />
</cnsl-form-field>
<cnsl-form-field class="sms-form-field" label="Token">
<cnsl-form-field *ngIf="token" class="sms-form-field" label="Token">
<cnsl-label>{{ 'SETTING.SMS.TWILIO.TOKEN' | translate }}</cnsl-label>
<input cnslInput name="token" formControlName="token" />
</cnsl-form-field>

18
console/src/app/modules/policies/notification-settings/dialog-add-sms-provider/dialog-add-sms-provider.component.ts
View File

@ -1,5 +1,5 @@
import { Component, Inject } from '@angular/core';
import { AbstractControl, UntypedFormBuilder, UntypedFormGroup, Validators } from '@angular/forms';
import { AbstractControl, FormControl, UntypedFormBuilder, UntypedFormGroup, Validators } from '@angular/forms';
import { MAT_DIALOG_DATA, MatDialog, MatDialogRef } from '@angular/material/dialog';
import {
AddSMSProviderTwilioRequest,
@ -41,13 +41,14 @@ export class DialogAddSMSProviderComponent {
) {
this.twilioForm = this.fb.group({
sid: ['', [Validators.required]],
token: ['', [Validators.required]],
senderNumber: ['', [Validators.required]],
});
this.smsProviders = data.smsProviders;
if (!!this.twilio) {
this.twilioForm.patchValue(this.twilio);
} else {
this.twilioForm.addControl('token', new FormControl('', Validators.required));
}
}
@ -82,14 +83,16 @@ export class DialogAddSMSProviderComponent {
});
dialogRef.afterClosed().subscribe((token: string) => {
if (token) {
if (token && this.twilioProvider?.id) {
const tokenReq = new UpdateSMSProviderTwilioTokenRequest();
tokenReq.setToken(token);
tokenReq.setId(this.twilioProvider.id);
this.service
.updateSMSProviderTwilioToken(tokenReq)
.then(() => {
this.toast.showInfo('SETTING.SMS.TWILIO.TOKENSET', true);
this.dialogRef.close();
})
.catch((error) => {
this.toast.showError(error);
@ -110,6 +113,15 @@ export class DialogAddSMSProviderComponent {
return this.twilioForm.get('sid');
}
public get twilioProvider(): SMSProvider.AsObject | undefined {
const twilioProvider: SMSProvider.AsObject | undefined = this.smsProviders.find((p) => p.twilio);
if (twilioProvider) {
return twilioProvider;
} else {
return undefined;
}
}
public get twilio(): TwilioConfig.AsObject | undefined {
const twilioProvider: SMSProvider.AsObject | undefined = this.smsProviders.find((p) => p.twilio);
if (twilioProvider && !!twilioProvider.twilio) {

25
console/src/app/modules/policies/notification-settings/notification-settings.component.html
View File

@ -75,9 +75,32 @@
active: twilio?.state === SMSProviderConfigState.SMS_PROVIDER_CONFIG_ACTIVE,
inactive: twilio?.state === SMSProviderConfigState.SMS_PROVIDER_CONFIG_INACTIVE
}"
></span>
>{{ 'SETTING.SMS.SMSPROVIDERSTATE.' + twilio?.state | translate }}</span
>
<span class="fill-space"></span>
<button
*ngIf="twilio && twilio.id"
[disabled]="(['iam.write'] | hasRole | async) === false"
mat-stroked-button
(click)="toggleSMSProviderState(twilio.id)"
>
<span *ngIf="twilio.state === SMSProviderConfigState.SMS_PROVIDER_CONFIG_ACTIVE">{{
'ACTIONS.DEACTIVATE' | translate
}}</span>
<span *ngIf="twilio.state === SMSProviderConfigState.SMS_PROVIDER_CONFIG_INACTIVE">{{
'ACTIONS.ACTIVATE' | translate
}}</span>
</button>
<button
*ngIf="twilio && twilio.id"
color="warn"
[disabled]="(['iam.write'] | hasRole | async) === false"
mat-icon-button
(click)="removeSMSProvider(twilio.id)"
>
<i class="las la-trash"></i>
</button>
<button [disabled]="(['iam.write'] | hasRole | async) === false" mat-icon-button (click)="editSMSProvider()">
<i class="las la-pen"></i>
</button>

1
console/src/app/modules/policies/notification-settings/notification-settings.component.scss
View File

@ -49,6 +49,7 @@
display: flex;
flex-direction: row;
align-items: center;
width: 350px;
.title {
font-size: 16px;

67
console/src/app/modules/policies/notification-settings/notification-settings.component.ts
View File

@ -16,6 +16,7 @@ import { GrpcAuthService } from 'src/app/services/grpc-auth.service';
import { ToastService } from 'src/app/services/toast.service';
import { InfoSectionType } from '../../info-section/info-section.component';
import { WarnDialogComponent } from '../../warn-dialog/warn-dialog.component';
import { PolicyComponentServiceType } from '../policy-component-types.enum';
import { DialogAddSMSProviderComponent } from './dialog-add-sms-provider/dialog-add-sms-provider.component';
import { PasswordDialogComponent } from './password-dialog/password-dialog.component';
@ -185,11 +186,12 @@ export class NotificationSettingsComponent implements OnInit {
dialogRef.afterClosed().subscribe((req: AddSMSProviderTwilioRequest | UpdateSMSProviderTwilioRequest) => {
if (req) {
if (this.hasTwilio) {
if (!!this.twilio) {
this.service
.updateSMSProviderTwilio(req as UpdateSMSProviderTwilioRequest)
.then(() => {
this.toast.showInfo('SETTING.SMS.TWILIO.ADDED', true);
this.fetchData();
})
.catch((error) => {
this.toast.showError(error);
@ -199,6 +201,7 @@ export class NotificationSettingsComponent implements OnInit {
.addSMSProviderTwilio(req as AddSMSProviderTwilioRequest)
.then(() => {
this.toast.showInfo('SETTING.SMS.TWILIO.ADDED', true);
this.fetchData();
})
.catch((error) => {
this.toast.showError(error);
@ -234,6 +237,59 @@ export class NotificationSettingsComponent implements OnInit {
});
}
public toggleSMSProviderState(id: string): void {
const provider = this.smsProviders.find((p) => p.id === id);
if (provider) {
if (provider.state === SMSProviderConfigState.SMS_PROVIDER_CONFIG_ACTIVE) {
this.service
.deactivateSMSProvider(id)
.then(() => {
this.toast.showInfo('SETTING.SMS.DEACTIVATED', true);
this.fetchData();
})
.catch((error) => {
this.toast.showError(error);
});
} else if (provider.state === SMSProviderConfigState.SMS_PROVIDER_CONFIG_INACTIVE) {
this.service
.activateSMSProvider(id)
.then(() => {
this.toast.showInfo('SETTING.SMS.ACTIVATED', true);
this.fetchData();
})
.catch((error) => {
this.toast.showError(error);
});
}
}
}
public removeSMSProvider(id: string): void {
const dialogRef = this.dialog.open(WarnDialogComponent, {
data: {
confirmKey: 'ACTIONS.DELETE',
cancelKey: 'ACTIONS.CANCEL',
titleKey: 'SETTING.SMS.REMOVEPROVIDER',
descriptionKey: 'SETTING.SMS.REMOVEPROVIDER_DESC',
},
width: '400px',
});
dialogRef.afterClosed().subscribe((resp) => {
if (resp) {
this.service
.removeSMSProvider(id)
.then(() => {
this.toast.showInfo('SETTING.SMS.TWILIO.REMOVED', true);
this.fetchData();
})
.catch((error) => {
this.toast.showError(error);
});
}
});
}
public get twilio(): SMSProvider.AsObject | undefined {
return this.smsProviders.find((p) => p.twilio);
}
@ -257,13 +313,4 @@ export class NotificationSettingsComponent implements OnInit {
public get host(): AbstractControl | null {
return this.form.get('host');
}
public get hasTwilio(): boolean {
const twilioProvider: SMSProvider.AsObject | undefined = this.smsProviders.find((p) => p.twilio);
if (twilioProvider && !!twilioProvider.twilio) {
return true;
} else {
return false;
}
}
}

2
console/src/app/modules/policies/notification-settings/notification-settings.module.ts
View File

@ -13,6 +13,7 @@ import { CardModule } from '../../card/card.module';
import { FormFieldModule } from '../../form-field/form-field.module';
import { InfoSectionModule } from '../../info-section/info-section.module';
import { InputModule } from '../../input/input.module';
import { WarnDialogModule } from '../../warn-dialog/warn-dialog.module';
import { DialogAddSMSProviderComponent } from './dialog-add-sms-provider/dialog-add-sms-provider.component';
import { NotificationSettingsComponent } from './notification-settings.component';
import { PasswordDialogComponent } from './password-dialog/password-dialog.component';
@ -31,6 +32,7 @@ import { PasswordDialogComponent } from './password-dialog/password-dialog.compo
InputModule,
MatIconModule,
FormFieldModule,
WarnDialogModule,
MatSelectModule,
MatProgressSpinnerModule,
MatSelectModule,

24
console/src/app/services/admin.service.ts
View File

@ -3,6 +3,8 @@ import { Injectable } from '@angular/core';
import {
ActivateLabelPolicyRequest,
ActivateLabelPolicyResponse,
ActivateSMSProviderRequest,
ActivateSMSProviderResponse,
AddCustomDomainPolicyRequest,
AddCustomOrgIAMPolicyResponse,
AddIAMMemberRequest,
@ -23,6 +25,8 @@ import {
AddSMTPConfigResponse,
DeactivateIDPRequest,
DeactivateIDPResponse,
DeactivateSMSProviderRequest,
DeactivateSMSProviderResponse,
GetCustomDomainClaimedMessageTextRequest,
GetCustomDomainClaimedMessageTextResponse,
GetCustomDomainPolicyRequest,
@ -132,6 +136,8 @@ import {
RemoveMultiFactorFromLoginPolicyResponse,
RemoveSecondFactorFromLoginPolicyRequest,
RemoveSecondFactorFromLoginPolicyResponse,
RemoveSMSProviderRequest,
RemoveSMSProviderResponse,
ResetCustomDomainPolicyToDefaultRequest,
ResetCustomDomainPolicyToDefaultResponse,
ResetCustomLoginTextsToDefaultRequest,
@ -504,6 +510,24 @@ export class AdminService {
return this.grpcService.admin.updateSMSProviderTwilio(req, null).then((resp) => resp.toObject());
}
public removeSMSProvider(id: string): Promise<RemoveSMSProviderResponse.AsObject> {
const req = new RemoveSMSProviderRequest();
req.setId(id);
return this.grpcService.admin.removeSMSProvider(req, null).then((resp) => resp.toObject());
}
public activateSMSProvider(id: string): Promise<ActivateSMSProviderResponse.AsObject> {
const req = new ActivateSMSProviderRequest();
req.setId(id);
return this.grpcService.admin.activateSMSProvider(req, null).then((resp) => resp.toObject());
}
public deactivateSMSProvider(id: string): Promise<DeactivateSMSProviderResponse.AsObject> {
const req = new DeactivateSMSProviderRequest();
req.setId(id);
return this.grpcService.admin.deactivateSMSProvider(req, null).then((resp) => resp.toObject());
}
public updateSMSProviderTwilioToken(
req: UpdateSMSProviderTwilioTokenRequest,
): Promise<UpdateSMSProviderTwilioTokenResponse.AsObject> {

11
console/src/assets/i18n/de.json
View File

@ -106,6 +106,7 @@
"FINISHED": "Fertig",
"CHANGE": "Ändern",
"REACTIVATE": "Aktivieren",
"ACTIVATE": "Aktivieren",
"DEACTIVATE": "Deaktivieren",
"REFRESH": "Aktualisieren",
"LOGIN": "Einloggen",
@ -896,11 +897,21 @@
"PROVIDER": "SMS Anbieter",
"ADDPROVIDER": "Anbieter hinzufügen",
"ADDPROVIDERDESCRIPTION": "Wählen Sie einen der verfügbaren Anbieter und geben Sie die erforderlichen Daten ein.",
"REMOVEPROVIDER": "Anbieter entfernen",
"REMOVEPROVIDER_DESC": "Sie sind im Begriff eine Konfiguration zu löschen. Wollen Sie fortfahren?",
"SMSPROVIDERSTATE": {
"0": "Unbekannt",
"1": "Aktiv",
"2": "Inaktiv"
},
"ACTIVATED": "Anbieter aktiviert.",
"DEACTIVATED": "Anbieter deaktiviert.",
"TWILIO": {
"SID": "Sid",
"TOKEN": "Token",
"SENDERNUMBER": "Sender Number",
"ADDED": "Twilio erfolgreich hinzugefügt.",
"REMOVED": "Twilio entfernt",
"CHANGETOKEN": "Token ändern",
"SETTOKEN": "Token setzen",
"TOKENSET": "Token erfolgreich gesetzt."

14
console/src/assets/i18n/en.json
View File

@ -106,6 +106,7 @@
"FINISHED": "Close",
"CHANGE": "Change",
"REACTIVATE": "Reactivate",
"ACTIVATE": "Activate",
"DEACTIVATE": "Deactivate",
"REFRESH": "Refresh",
"LOGIN": "Login",
@ -874,7 +875,8 @@
"LANGUAGE": {
"de": "Deutsch",
"it": "Italiano",
"en": "English"
"en": "English",
"fr": "Français"
},
"SMTP": {
"TITLE": "SMTP Settings",
@ -895,11 +897,21 @@
"PROVIDER": "SMS Provider",
"ADDPROVIDER": "Add SMS Provider",
"ADDPROVIDERDESCRIPTION": "Choose one of the available providers and enter the required data.",
"REMOVEPROVIDER": "Remove Provider",
"REMOVEPROVIDER_DESC": "You are about to delete a provider configuration. Do you want to continue?",
"SMSPROVIDERSTATE": {
"0": "Unspecified",
"1": "Active",
"2": "Inactive"
},
"ACTIVATED": "Provider activated.",
"DEACTIVATED": "Provider deactivated.",
"TWILIO": {
"SID": "Sid",
"TOKEN": "Token",
"SENDERNUMBER": "Sender Number",
"ADDED": "Twilio added successfully.",
"REMOVED": "Twilio removed",
"CHANGETOKEN": "Change Token",
"SETTOKEN": "Set Token",
"TOKENSET": "Token successfully set."

11
console/src/assets/i18n/fr.json
View File

@ -106,6 +106,7 @@
"FINISHED": "Fermer",
"CHANGE": "Modifier",
"REACTIVATE": "Réactiver",
"ACTIVATE": "Activer",
"DEACTIVATE": "Désactiver",
"REFRESH": "Rafraîchir",
"LOGIN": "Connexion",
@ -896,11 +897,21 @@
"PROVIDER": "Fournisseur de SMS",
"ADDPROVIDER": "Ajouter un fournisseur de SMS",
"ADDPROVIDERDESCRIPTION": "Choisissez l'un des fournisseurs disponibles et saisissez les données requises.",
"REMOVEPROVIDER": "Supprimer le fournisseur",
"REMOVEPROVIDER_DESC": "Vous êtes sur le point de supprimer une configuration de fournisseur. Voulez-vous continuer",
"SMSPROVIDERSTATE": {
"0": "non spécifié",
"1": "Actif",
"2": "Inactif"
},
"ACTIVATED": "Fournisseur actif.",
"DEACTIVATED": "Fournisseur inactif.",
"TWILIO": {
"SID": "Sid",
"TOKEN": "Jeton",
"SENDERNUMBER": "Numéro d'expéditeur",
"ADDED": "Twilio a été ajouté avec succès.",
"REMOVED": "Twilio a été supprimé avec succès",
"CHANGETOKEN": "Changer de Token",
"SETTOKEN": "Définir le jeton",
"TOKENSET": "Le jeton a été défini avec succès."

11
console/src/assets/i18n/it.json
View File

@ -106,6 +106,7 @@
"FINISHED": "Chiudi",
"CHANGE": "Cambia",
"REACTIVATE": "Riattiva",
"ACTIVATE": "Attiva",
"DEACTIVATE": "Disattiva",
"REFRESH": "Aggiorna",
"LOGIN": "Accedi",
@ -896,11 +897,21 @@
"PROVIDER": "Fornitore SMS",
"ADDPROVIDER": "Aggiungi fornitore SMS",
"ADDPROVIDERDESCRIPTION": "Scegli uno dei provider disponibili e inserisci i dati richiesti.",
"REMOVEPROVIDER": "Elimina configurazione",
"REMOVEPROVIDER_DESC": "Stai per eliminare una configurazione. Vuoi continuare?",
"SMSPROVIDERSTATE": {
"0": "Non specificato",
"1": "Attivo",
"2": "Inattivo"
},
"ACTIVATED": "Fornitore attivato.",
"DEACTIVATED": "Fornitore disattivato.",
"TWILIO": {
"SID": "Sid",
"TOKEN": "Token",
"SENDERNUMBER": "Sender Number",
"ADDED": "Twilio aggiunto con successo.",
"REMOVED": "Twilio rimosso con successo.",
"CHANGETOKEN": "Cambia Token",
"SETTOKEN": "Cambia Token",
"TOKENSET": "Token cambiato con successo."