From 3042bbb9932a9c9ce76a1c5b6039fbf3c334260a Mon Sep 17 00:00:00 2001 From: Ramon Date: Mon, 17 Feb 2025 19:25:46 +0100 Subject: [PATCH] feat: Use V2 API's in Console (#9312) # Which Problems Are Solved Solves #8976 # Additional Changes I have done some intensive refactorings and we are using the new @zitadel/client package for GRPC access. # Additional Context - Closes #8976 --------- Co-authored-by: Max Peintner --- console/angular.json | 2 +- console/package.json | 4 + console/src/app/app.component.html | 2 +- console/src/app/app.component.ts | 26 +- .../features/features.component.html | 28 + .../components/features/features.component.ts | 15 +- .../directives/has-role/has-role.directive.ts | 15 +- .../accounts-card/accounts-card.component.ts | 5 +- .../app/modules/footer/footer.component.html | 4 +- .../app/modules/header/header.component.html | 6 +- .../modules/info-row/info-row.component.html | 12 +- .../modules/info-row/info-row.component.ts | 97 ++- .../metadata-dialog.component.ts | 85 +- .../metadata/metadata/metadata.component.html | 9 +- .../metadata/metadata/metadata.component.ts | 41 +- .../modules/paginator/paginator.component.ts | 3 +- .../refresh-table/refresh-table.component.ts | 3 +- .../app/modules/sidenav/sidenav.component.ts | 20 +- .../pages/signedout/signedout.component.ts | 23 +- .../user-create/user-create.component.html | 49 +- .../user-create/user-create.component.scss | 1 + .../user-create/user-create.component.ts | 458 +++++++---- .../auth-user-detail.component.html | 329 ++++---- .../auth-user-detail.component.ts | 722 ++++++++-------- .../edit-dialog/edit-dialog.component.html | 2 +- .../edit-dialog/edit-dialog.component.ts | 22 +- .../resend-email-dialog.component.html | 2 +- .../resend-email-dialog.component.ts | 14 +- .../contact/contact.component.html | 10 +- .../user-detail/contact/contact.component.ts | 22 +- .../detail-form-machine.component.html | 2 +- .../detail-form-machine.component.ts | 94 ++- .../detail-form/detail-form.component.html | 22 +- .../detail-form/detail-form.component.ts | 172 ++-- .../external-idps/external-idps.component.ts | 98 ++- .../password/password.component.html | 30 +- .../password/password.component.ts | 310 ++++--- .../passwordless/passwordless.component.html | 8 +- .../passwordless/passwordless.component.ts | 58 +- .../user-detail/user-detail.component.html | 531 ++++++------ .../user-detail/user-detail.component.ts | 768 ++++++++++-------- .../user-mfa/user-mfa.component.html | 38 +- .../user-mfa/user-mfa.component.ts | 206 ++--- .../user-table/user-table.component.html | 56 +- .../user-table/user-table.component.ts | 152 ++-- .../timestamp-to-date.pipe.ts | 10 +- console/src/app/services/feature.service.ts | 14 +- console/src/app/services/grpc-auth.service.ts | 245 +++--- console/src/app/services/grpc.service.ts | 162 ++-- .../services/interceptors/auth.interceptor.ts | 120 +-- .../exhausted.grpc.interceptor.ts | 18 +- .../services/interceptors/i18n.interceptor.ts | 10 +- .../services/interceptors/org.interceptor.ts | 26 +- console/src/app/services/new-auth.service.ts | 30 + console/src/app/services/new-mgmt.service.ts | 92 +++ console/src/app/services/user.service.ts | 302 +++++++ console/src/app/utils/formatPhone.ts | 2 +- console/src/app/utils/pairwiseStartWith.ts | 11 + console/src/assets/i18n/bg.json | 15 +- console/src/assets/i18n/cs.json | 15 +- console/src/assets/i18n/de.json | 15 +- console/src/assets/i18n/en.json | 15 +- console/src/assets/i18n/es.json | 15 +- console/src/assets/i18n/fr.json | 15 +- console/src/assets/i18n/hu.json | 15 +- console/src/assets/i18n/id.json | 15 +- console/src/assets/i18n/it.json | 15 +- console/src/assets/i18n/ja.json | 15 +- console/src/assets/i18n/ko.json | 15 +- console/src/assets/i18n/mk.json | 15 +- console/src/assets/i18n/nl.json | 15 +- console/src/assets/i18n/pl.json | 15 +- console/src/assets/i18n/pt.json | 15 +- console/src/assets/i18n/ru.json | 15 +- console/src/assets/i18n/sv.json | 15 +- console/src/assets/i18n/zh.json | 15 +- console/yarn.lock | 44 + e2e/cypress/e2e/machines/machines.cy.ts | 4 +- internal/api/grpc/feature/v2/converter.go | 2 + .../api/grpc/feature/v2/converter_test.go | 10 + internal/command/instance_features.go | 3 +- internal/command/instance_features_model.go | 5 + internal/feature/feature.go | 2 + internal/feature/key_enumer.go | 12 +- internal/query/instance_features.go | 1 + internal/query/instance_features_model.go | 3 + .../query/projection/instance_features.go | 4 + .../feature/feature_v2/eventstore.go | 1 + .../repository/feature/feature_v2/feature.go | 1 + proto/zitadel/feature/v2/instance.proto | 14 + 90 files changed, 3679 insertions(+), 2315 deletions(-) create mode 100644 console/src/app/services/new-auth.service.ts create mode 100644 console/src/app/services/new-mgmt.service.ts create mode 100644 console/src/app/services/user.service.ts create mode 100644 console/src/app/utils/pairwiseStartWith.ts diff --git a/console/angular.json b/console/angular.json index 278498ccd7..5564b2c428 100644 --- a/console/angular.json +++ b/console/angular.json @@ -63,7 +63,7 @@ { "type": "initial", "maximumWarning": "8mb", - "maximumError": "9mb" + "maximumError": "10mb" }, { "type": "anyComponentStyle", diff --git a/console/package.json b/console/package.json index fcf3a4bbf8..2c1d38da1b 100644 --- a/console/package.json +++ b/console/package.json @@ -24,6 +24,8 @@ "@angular/platform-browser-dynamic": "^16.2.5", "@angular/router": "^16.2.5", "@angular/service-worker": "^16.2.5", + "@connectrpc/connect": "^2.0.0", + "@connectrpc/connect-web": "^2.0.0", "@ctrl/ngx-codemirror": "^6.1.0", "@fortawesome/angular-fontawesome": "^0.13.0", "@fortawesome/fontawesome-svg-core": "^6.4.2", @@ -31,6 +33,8 @@ "@grpc/grpc-js": "^1.11.2", "@netlify/framework-info": "^9.8.13", "@ngx-translate/core": "^15.0.0", + "@zitadel/client": "^1.0.6", + "@zitadel/proto": "^1.0.3", "angular-oauth2-oidc": "^15.0.1", "angularx-qrcode": "^16.0.0", "buffer": "^6.0.3", diff --git a/console/src/app/app.component.html b/console/src/app/app.component.html index 5b31b33dc4..18c5c72501 100644 --- a/console/src/app/app.component.html +++ b/console/src/app/app.component.html @@ -1,5 +1,5 @@
- + { // We use navigateByUrl as our urls may have queryParams - this.router.navigateByUrl(currentUrl); + this.router.navigateByUrl(currentUrl).then(); }); } @@ -283,18 +283,16 @@ export class AppComponent implements OnDestroy { this.translate.addLangs(supportedLanguages); this.translate.setDefaultLang(fallbackLanguage); - this.authService.userSubject.pipe(takeUntil(this.destroy$)).subscribe((userprofile) => { - if (userprofile) { - const cropped = navigator.language.split('-')[0] ?? fallbackLanguage; - const fallbackLang = cropped.match(supportedLanguagesRegexp) ? cropped : fallbackLanguage; + this.authService.user.pipe(filter(Boolean), takeUntil(this.destroy$)).subscribe((userprofile) => { + const cropped = navigator.language.split('-')[0] ?? fallbackLanguage; + const fallbackLang = cropped.match(supportedLanguagesRegexp) ? cropped : fallbackLanguage; - const lang = userprofile?.human?.profile?.preferredLanguage.match(supportedLanguagesRegexp) - ? userprofile.human.profile?.preferredLanguage - : fallbackLang; - this.translate.use(lang); - this.language = lang; - this.document.documentElement.lang = lang; - } + const lang = userprofile?.human?.profile?.preferredLanguage.match(supportedLanguagesRegexp) + ? userprofile.human.profile?.preferredLanguage + : fallbackLang; + this.translate.use(lang); + this.language = lang; + this.document.documentElement.lang = lang; }); } @@ -308,7 +306,7 @@ export class AppComponent implements OnDestroy { } private setFavicon(theme: string): void { - this.authService.labelpolicy.pipe(takeUntil(this.destroy$)).subscribe((lP) => { + this.authService.labelpolicy$.pipe(startWith(undefined), takeUntil(this.destroy$)).subscribe((lP) => { if (theme === 'dark-theme' && lP?.iconUrlDark) { // Check if asset url is stable, maybe it was deleted but still wasn't applied fetch(lP.iconUrlDark).then((response) => { diff --git a/console/src/app/components/features/features.component.html b/console/src/app/components/features/features.component.html index e663569210..fdd397084a 100644 --- a/console/src/app/components/features/features.component.html +++ b/console/src/app/components/features/features.component.html @@ -403,6 +403,34 @@ 'SETTING.FEATURES.OIDCSINGLEV1SESSIONTERMINATION_DESCRIPTION' | translate }}
+ +
+ {{ 'SETTING.FEATURES.CONSOLEUSEV2USERAPI' | translate }} +
+ + +
+ {{ 'SETTING.FEATURES.STATES.DISABLED' | translate }} +
+ + +
+ {{ 'SETTING.FEATURES.STATES.ENABLED' | translate }} +
+ + +
+ {{ + 'SETTING.FEATURES.CONSOLEUSEV2USERAPI_DESCRIPTION' | translate + }} +
diff --git a/console/src/app/components/features/features.component.ts b/console/src/app/components/features/features.component.ts index 327e9d2792..0f8ff761f6 100644 --- a/console/src/app/components/features/features.component.ts +++ b/console/src/app/components/features/features.component.ts @@ -16,13 +16,14 @@ import { InfoSectionModule } from 'src/app/modules/info-section/info-section.mod import { HasRolePipeModule } from 'src/app/pipes/has-role-pipe/has-role-pipe.module'; import { Event } from 'src/app/proto/generated/zitadel/event_pb'; import { Source } from 'src/app/proto/generated/zitadel/feature/v2beta/feature_pb'; -import { - GetInstanceFeaturesResponse, - SetInstanceFeaturesRequest, -} from 'src/app/proto/generated/zitadel/feature/v2beta/instance_pb'; import { Breadcrumb, BreadcrumbService, BreadcrumbType } from 'src/app/services/breadcrumb.service'; import { FeatureService } from 'src/app/services/feature.service'; import { ToastService } from 'src/app/services/toast.service'; +import { + GetInstanceFeaturesResponse, + SetInstanceFeaturesRequest, +} from '../../proto/generated/zitadel/feature/v2/instance_pb'; +import { withIdentifier } from 'codelyzer/util/astQuery'; enum ToggleState { ENABLED = 'ENABLED', @@ -39,6 +40,7 @@ type ToggleStates = { oidcTokenExchange?: FeatureState; actions?: FeatureState; oidcSingleV1SessionTermination?: FeatureState; + consoleUseV2UserApi?: FeatureState; }; @Component({ @@ -142,6 +144,7 @@ export class FeaturesComponent implements OnDestroy { ); changed = true; } + req.setConsoleUseV2UserApi(this.toggleStates?.consoleUseV2UserApi?.state === ToggleState.ENABLED); if (changed) { this.featureService @@ -232,6 +235,10 @@ export class FeaturesComponent implements OnDestroy { ? ToggleState.ENABLED : ToggleState.DISABLED, }, + consoleUseV2UserApi: { + source: this.featureData.consoleUseV2UserApi?.source || Source.SOURCE_INSTANCE, + state: this.featureData.consoleUseV2UserApi?.enabled ? ToggleState.ENABLED : ToggleState.DISABLED, + }, }; }); } diff --git a/console/src/app/directives/has-role/has-role.directive.ts b/console/src/app/directives/has-role/has-role.directive.ts index b58e1f3a10..9ba21c1dd2 100644 --- a/console/src/app/directives/has-role/has-role.directive.ts +++ b/console/src/app/directives/has-role/has-role.directive.ts @@ -1,18 +1,17 @@ -import { Directive, Input, OnDestroy, TemplateRef, ViewContainerRef } from '@angular/core'; -import { Subject, takeUntil } from 'rxjs'; +import { DestroyRef, Directive, Input, TemplateRef, ViewContainerRef } from '@angular/core'; import { GrpcAuthService } from 'src/app/services/grpc-auth.service'; +import { takeUntilDestroyed } from '@angular/core/rxjs-interop'; @Directive({ selector: '[cnslHasRole]', }) -export class HasRoleDirective implements OnDestroy { - private destroy$: Subject = new Subject(); +export class HasRoleDirective { private hasView: boolean = false; @Input() public set hasRole(roles: string[] | RegExp[] | undefined) { if (roles && roles.length > 0) { this.authService .isAllowed(roles) - .pipe(takeUntil(this.destroy$)) + .pipe(takeUntilDestroyed(this.destroyRef)) .subscribe((isAllowed) => { if (isAllowed && !this.hasView) { if (this.viewContainerRef.length !== 0) { @@ -38,10 +37,6 @@ export class HasRoleDirective implements OnDestroy { private authService: GrpcAuthService, protected templateRef: TemplateRef, protected viewContainerRef: ViewContainerRef, + private readonly destroyRef: DestroyRef, ) {} - - ngOnDestroy(): void { - this.destroy$.next(); - this.destroy$.complete(); - } } diff --git a/console/src/app/modules/accounts-card/accounts-card.component.ts b/console/src/app/modules/accounts-card/accounts-card.component.ts index 617a41bf6d..2676a5bcf5 100644 --- a/console/src/app/modules/accounts-card/accounts-card.component.ts +++ b/console/src/app/modules/accounts-card/accounts-card.component.ts @@ -4,6 +4,7 @@ import { AuthConfig } from 'angular-oauth2-oidc'; import { Session, User, UserState } from 'src/app/proto/generated/zitadel/user_pb'; import { AuthenticationService } from 'src/app/services/authentication.service'; import { GrpcAuthService } from 'src/app/services/grpc-auth.service'; +import { toSignal } from '@angular/core/rxjs-interop'; @Component({ selector: 'cnsl-accounts-card', @@ -18,6 +19,8 @@ export class AccountsCardComponent implements OnInit { public sessions: Session.AsObject[] = []; public loadingUsers: boolean = false; public UserState: any = UserState; + private labelpolicy = toSignal(this.userService.labelpolicy$, { initialValue: undefined }); + constructor( public authService: AuthenticationService, private router: Router, @@ -68,7 +71,7 @@ export class AccountsCardComponent implements OnInit { } public logout(): void { - const lP = JSON.stringify(this.userService.labelpolicy.getValue()); + const lP = JSON.stringify(this.labelpolicy()); localStorage.setItem('labelPolicyOnSignout', lP); this.authService.signout(); diff --git a/console/src/app/modules/footer/footer.component.html b/console/src/app/modules/footer/footer.component.html index 26d863d129..b9eda2d7db 100644 --- a/console/src/app/modules/footer/footer.component.html +++ b/console/src/app/modules/footer/footer.component.html @@ -1,6 +1,6 @@
-
+
{{ 'FOOTER.LINKS.TOS' | translate }} @@ -11,7 +11,7 @@
-
+
diff --git a/console/src/app/modules/header/header.component.html b/console/src/app/modules/header/header.component.html index e4ef76dd2a..f1a3244792 100644 --- a/console/src/app/modules/header/header.component.html +++ b/console/src/app/modules/header/header.component.html @@ -4,7 +4,7 @@
- + - + - + {{ pP.customLinkText }} diff --git a/console/src/app/modules/info-row/info-row.component.html b/console/src/app/modules/info-row/info-row.component.html index db68931eeb..52bd6b93ba 100644 --- a/console/src/app/modules/info-row/info-row.component.html +++ b/console/src/app/modules/info-row/info-row.component.html @@ -9,26 +9,26 @@ inactive: user.state === UserState.USER_STATE_INACTIVE, }" > - {{ 'USER.DATA.STATE' + user.state | translate }} + {{ (isV2(user) ? 'USER.STATEV2.' : 'USER.STATE.') + user.state | translate }}

{{ 'USER.ID' | translate }}

-

{{ user.id }}

+

{{ userId }}

{{ 'USER.DETAILS.DATECREATED' | translate }}

-

- {{ user.details.creationDate | timestampToDate | localizedDate: 'dd. MMMM YYYY, HH:mm' }} +

+ {{ creationDate | timestampToDate | localizedDate: 'dd. MMMM YYYY, HH:mm' }}

{{ 'USER.DETAILS.DATECHANGED' | translate }}

-

- {{ user.details.changeDate | timestampToDate | localizedDate: 'dd. MMMM YYYY, HH:mm' }} +

+ {{ changeDate | timestampToDate | localizedDate: 'dd. MMMM YYYY, HH:mm' }}

diff --git a/console/src/app/modules/info-row/info-row.component.ts b/console/src/app/modules/info-row/info-row.component.ts index 35e682e4a1..2689584813 100644 --- a/console/src/app/modules/info-row/info-row.component.ts +++ b/console/src/app/modules/info-row/info-row.component.ts @@ -6,6 +6,9 @@ import { Org, OrgState } from 'src/app/proto/generated/zitadel/org_pb'; import { LoginPolicy } from 'src/app/proto/generated/zitadel/policy_pb'; import { GrantedProject, Project, ProjectGrantState, ProjectState } from 'src/app/proto/generated/zitadel/project_pb'; import { User, UserState } from 'src/app/proto/generated/zitadel/user_pb'; +import { User as UserV1 } from '@zitadel/proto/zitadel/user_pb'; +import { User as UserV2 } from '@zitadel/proto/zitadel/user/v2/user_pb'; +import { LoginPolicy as LoginPolicyV2 } from '@zitadel/proto/zitadel/policy_pb'; @Component({ selector: 'cnsl-info-row', @@ -13,14 +16,14 @@ import { User, UserState } from 'src/app/proto/generated/zitadel/user_pb'; styleUrls: ['./info-row.component.scss'], }) export class InfoRowComponent { - @Input() public user!: User.AsObject; + @Input() public user?: User.AsObject | UserV2 | UserV1; @Input() public org!: Org.AsObject; @Input() public instance!: InstanceDetail.AsObject; @Input() public app!: App.AsObject; @Input() public idp!: IDP.AsObject; @Input() public project!: Project.AsObject; @Input() public grantedProject!: GrantedProject.AsObject; - @Input() public loginPolicy?: LoginPolicy.AsObject; + @Input() public loginPolicy?: LoginPolicy.AsObject | LoginPolicyV2; public UserState: any = UserState; public State: any = State; @@ -35,25 +38,77 @@ export class InfoRowComponent { constructor() {} public get loginMethods(): Set { - const methods = this.user?.loginNamesList; - let email: string = ''; - let phone: string = ''; - if (this.loginPolicy) { - if ( - !this.loginPolicy?.disableLoginWithEmail && - this.user.human?.email?.email && - this.user.human.email.isEmailVerified - ) { - email = this.user.human?.email?.email; - } - if ( - !this.loginPolicy?.disableLoginWithPhone && - this.user.human?.phone?.phone && - this.user.human.phone.isPhoneVerified - ) { - phone = this.user.human?.phone?.phone; - } + if (!this.user) { + return new Set(); } - return new Set([email, phone, ...methods].filter((method) => !!method)); + + const methods = '$typeName' in this.user ? this.user.loginNames : this.user.loginNamesList; + + const loginPolicy = this.loginPolicy; + if (!loginPolicy) { + return new Set([...methods]); + } + + let email = !loginPolicy.disableLoginWithEmail ? this.getEmail(this.user) : ''; + let phone = !loginPolicy.disableLoginWithPhone ? this.getPhone(this.user) : ''; + + return new Set([email, phone, ...methods].filter(Boolean)); + } + + public get userId() { + if (!this.user) { + return undefined; + } + if ('$typeName' in this.user && this.user.$typeName === 'zitadel.user.v2.User') { + return this.user.userId; + } + return this.user.id; + } + + public get changeDate() { + return this?.user?.details?.changeDate; + } + + public get creationDate() { + if (!this.user) { + return undefined; + } + return '$typeName' in this.user ? undefined : this.user.details?.creationDate; + } + + private getEmail(user: User.AsObject | UserV2 | UserV1) { + const human = this.human(user); + if (!human) { + return ''; + } + if ('$typeName' in human && human.$typeName === 'zitadel.user.v2.HumanUser') { + return human.email?.isVerified ? human.email.email : ''; + } + return human.email?.isEmailVerified ? human.email.email : ''; + } + + private getPhone(user: User.AsObject | UserV2 | UserV1) { + const human = this.human(user); + if (!human) { + return ''; + } + if ('$typeName' in human && human.$typeName === 'zitadel.user.v2.HumanUser') { + return human.phone?.isVerified ? human.phone.phone : ''; + } + return human.phone?.isPhoneVerified ? human.phone.phone : ''; + } + + public human(user: User.AsObject | UserV2 | UserV1) { + if (!('$typeName' in user)) { + return user.human; + } + return user.type.case === 'human' ? user.type.value : undefined; + } + + public isV2(user: User.AsObject | UserV2 | UserV1) { + if ('$typeName' in user) { + return user.$typeName === 'zitadel.user.v2.User'; + } + return false; } } diff --git a/console/src/app/modules/metadata/metadata-dialog/metadata-dialog.component.ts b/console/src/app/modules/metadata/metadata-dialog/metadata-dialog.component.ts index 599e58d937..8deff09eee 100644 --- a/console/src/app/modules/metadata/metadata-dialog/metadata-dialog.component.ts +++ b/console/src/app/modules/metadata/metadata-dialog/metadata-dialog.component.ts @@ -1,8 +1,16 @@ import { Component, Inject } from '@angular/core'; import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; import { Timestamp } from 'google-protobuf/google/protobuf/timestamp_pb'; -import { Metadata } from 'src/app/proto/generated/zitadel/metadata_pb'; import { ToastService } from 'src/app/services/toast.service'; +import { Metadata as MetadataV2 } from '@zitadel/proto/zitadel/metadata_pb'; +import { Metadata } from 'src/app/proto/generated/zitadel/metadata_pb'; +import { Buffer } from 'buffer'; + +export type MetadataDialogData = { + metadata: (Metadata.AsObject | MetadataV2)[]; + setFcn: (key: string, value: string) => Promise; + removeFcn: (key: string) => Promise; +}; @Component({ selector: 'cnsl-metadata-dialog', @@ -10,72 +18,63 @@ import { ToastService } from 'src/app/services/toast.service'; styleUrls: ['./metadata-dialog.component.scss'], }) export class MetadataDialogComponent { - public metadata: Partial[] = []; + public metadata: { key: string; value: string }[] = []; public ts!: Timestamp.AsObject | undefined; constructor( private toast: ToastService, public dialogRef: MatDialogRef, - @Inject(MAT_DIALOG_DATA) public data: any, + @Inject(MAT_DIALOG_DATA) public data: MetadataDialogData, ) { - this.metadata = data.metadata; + this.metadata = data.metadata.map(({ key, value }) => ({ + key, + value: typeof value === 'string' ? value : Buffer.from(value as unknown as string, 'base64').toString('utf8'), + })); } public addEntry(): void { - const newGroup = { + this.metadata.push({ key: '', value: '', - }; - - this.metadata.push(newGroup); + }); } - public removeEntry(index: number): void { + public async removeEntry(index: number) { const key = this.metadata[index].key; - if (key) { - this.removeMetadata(key).then(() => { - this.metadata.splice(index, 1); - if (this.metadata.length === 0) { - this.addEntry(); - } - }); - } else { + if (!key) { this.metadata.splice(index, 1); + return; + } + + try { + await this.data.removeFcn(key); + } catch (error) { + this.toast.showError(error); + return; + } + + this.toast.showInfo('METADATA.REMOVESUCCESS', true); + this.metadata.splice(index, 1); + if (this.metadata.length === 0) { + this.addEntry(); } } - public saveElement(index: number): void { - const metadataElement = this.metadata[index]; + public async saveElement(index: number) { + const { key, value } = this.metadata[index]; - if (metadataElement.key && metadataElement.value) { - this.setMetadata(metadataElement.key, metadataElement.value as string); + if (!key || !value) { + return; } - } - public setMetadata(key: string, value: string): void { - if (key && value) { - this.data - .setFcn(key, value) - .then(() => { - this.toast.showInfo('METADATA.SETSUCCESS', true); - }) - .catch((error: any) => { - this.toast.showError(error); - }); + try { + await this.data.setFcn(key, value); + this.toast.showInfo('METADATA.SETSUCCESS', true); + } catch (error) { + this.toast.showError(error); } } - public removeMetadata(key: string): Promise { - return this.data - .removeFcn(key) - .then((resp: any) => { - this.toast.showInfo('METADATA.REMOVESUCCESS', true); - }) - .catch((error: any) => { - this.toast.showError(error); - }); - } - closeDialog(): void { this.dialogRef.close(); } diff --git a/console/src/app/modules/metadata/metadata/metadata.component.html b/console/src/app/modules/metadata/metadata/metadata.component.html index acd0b407f6..4ea29728ae 100644 --- a/console/src/app/modules/metadata/metadata/metadata.component.html +++ b/console/src/app/modules/metadata/metadata/metadata.component.html @@ -1,7 +1,12 @@ - + @@ -28,7 +33,7 @@ -
+
{{ 'USER.MFA.EMPTY' | translate }}
diff --git a/console/src/app/modules/metadata/metadata/metadata.component.ts b/console/src/app/modules/metadata/metadata/metadata.component.ts index bb784ac433..7f72297c00 100644 --- a/console/src/app/modules/metadata/metadata/metadata.component.ts +++ b/console/src/app/modules/metadata/metadata/metadata.component.ts @@ -1,16 +1,26 @@ -import { Component, EventEmitter, Input, OnChanges, Output, SimpleChanges, ViewChild } from '@angular/core'; +import { Component, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core'; import { MatSort } from '@angular/material/sort'; -import { MatTable, MatTableDataSource } from '@angular/material/table'; -import { BehaviorSubject, Observable } from 'rxjs'; +import { MatTableDataSource } from '@angular/material/table'; +import { Observable, ReplaySubject } from 'rxjs'; +import { Metadata as MetadataV2 } from '@zitadel/proto/zitadel/metadata_pb'; +import { map, startWith } from 'rxjs/operators'; import { Metadata } from 'src/app/proto/generated/zitadel/metadata_pb'; +import { Buffer } from 'buffer'; + +type StringMetadata = { + key: string; + value: string; +}; @Component({ selector: 'cnsl-metadata', templateUrl: './metadata.component.html', styleUrls: ['./metadata.component.scss'], }) -export class MetadataComponent implements OnChanges { - @Input() public metadata: Metadata.AsObject[] = []; +export class MetadataComponent implements OnInit { + @Input({ required: true }) public set metadata(metadata: (Metadata.AsObject | MetadataV2)[]) { + this.metadata$.next(metadata); + } @Input() public disabled: boolean = false; @Input() public loading: boolean = false; @Input({ required: true }) public description!: string; @@ -18,18 +28,23 @@ export class MetadataComponent implements OnChanges { @Output() public refresh: EventEmitter = new EventEmitter(); public displayedColumns: string[] = ['key', 'value']; - private loadingSubject: BehaviorSubject = new BehaviorSubject(false); - public loading$: Observable = this.loadingSubject.asObservable(); + public metadata$ = new ReplaySubject<(Metadata.AsObject | MetadataV2)[]>(1); + public dataSource$?: Observable>; - @ViewChild(MatTable) public table!: MatTable; @ViewChild(MatSort) public sort!: MatSort; - public dataSource: MatTableDataSource = new MatTableDataSource([]); constructor() {} - ngOnChanges(changes: SimpleChanges): void { - if (changes['metadata']?.currentValue) { - this.dataSource = new MatTableDataSource(changes['metadata'].currentValue); - } + ngOnInit() { + this.dataSource$ = this.metadata$.pipe( + map((metadata) => + metadata.map(({ key, value }) => ({ + key, + value: Buffer.from(value as any as string, 'base64').toString('utf-8'), + })), + ), + startWith([] as StringMetadata[]), + map((metadata) => new MatTableDataSource(metadata)), + ); } } diff --git a/console/src/app/modules/paginator/paginator.component.ts b/console/src/app/modules/paginator/paginator.component.ts index 4fd62fb568..74f487dcb5 100644 --- a/console/src/app/modules/paginator/paginator.component.ts +++ b/console/src/app/modules/paginator/paginator.component.ts @@ -1,5 +1,6 @@ import { Component, EventEmitter, Input, Output } from '@angular/core'; import { Timestamp } from 'src/app/proto/generated/google/protobuf/timestamp_pb'; +import { Timestamp as ConnectTimestamp } from '@bufbuild/protobuf/wkt'; export interface PageEvent { length: number; @@ -14,7 +15,7 @@ export interface PageEvent { styleUrls: ['./paginator.component.scss'], }) export class PaginatorComponent { - @Input() public timestamp: Timestamp.AsObject | undefined = undefined; + @Input() public timestamp: Timestamp.AsObject | ConnectTimestamp | undefined = undefined; @Input() public length: number = 0; @Input() public pageSize: number = 10; @Input() public pageIndex: number = 0; diff --git a/console/src/app/modules/refresh-table/refresh-table.component.ts b/console/src/app/modules/refresh-table/refresh-table.component.ts index 6c6d46e281..08e67044f0 100644 --- a/console/src/app/modules/refresh-table/refresh-table.component.ts +++ b/console/src/app/modules/refresh-table/refresh-table.component.ts @@ -3,6 +3,7 @@ import { SelectionModel } from '@angular/cdk/collections'; import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'; import { Timestamp } from 'google-protobuf/google/protobuf/timestamp_pb'; import { RefreshService } from 'src/app/services/refresh.service'; +import { Timestamp as ConnectTimestamp } from '@bufbuild/protobuf/wkt'; import { ActionKeysType } from '../action-keys/action-keys.component'; @@ -27,7 +28,7 @@ const rotate = animation([ }) export class RefreshTableComponent implements OnInit { @Input() public selection: SelectionModel = new SelectionModel(true, []); - @Input() public timestamp: Timestamp.AsObject | undefined = undefined; + @Input() public timestamp: Timestamp.AsObject | ConnectTimestamp | undefined = undefined; @Input() public dataSize: number = 0; @Input() public emitRefreshAfterTimeoutInMs: number = 0; @Input() public loading: boolean | null = false; diff --git a/console/src/app/modules/sidenav/sidenav.component.ts b/console/src/app/modules/sidenav/sidenav.component.ts index dc7948a256..e07c82dc51 100644 --- a/console/src/app/modules/sidenav/sidenav.component.ts +++ b/console/src/app/modules/sidenav/sidenav.component.ts @@ -51,15 +51,17 @@ export class SidenavComponent implements ControlValueAccessor { } if (this.queryParam && setting) { - this.router.navigate([], { - relativeTo: this.route, - queryParams: { - [this.queryParam]: setting, - }, - replaceUrl: true, - queryParamsHandling: 'merge', - skipLocationChange: false, - }); + this.router + .navigate([], { + relativeTo: this.route, + queryParams: { + [this.queryParam]: setting, + }, + replaceUrl: true, + queryParamsHandling: 'merge', + skipLocationChange: false, + }) + .then(); } } diff --git a/console/src/app/pages/signedout/signedout.component.ts b/console/src/app/pages/signedout/signedout.component.ts index a5d41f7a60..53b88ca6d6 100644 --- a/console/src/app/pages/signedout/signedout.component.ts +++ b/console/src/app/pages/signedout/signedout.component.ts @@ -19,16 +19,21 @@ export class SignedoutComponent { const lP = localStorage.getItem(LABELPOLICY_LOCALSTORAGE_KEY); - if (lP) { - const parsed = JSON.parse(lP); - localStorage.removeItem(LABELPOLICY_LOCALSTORAGE_KEY); - if (parsed) { - this.labelpolicy = parsed; - authService.labelpolicy.next(parsed); - authService.labelPolicyLoading$.next(false); - } - } else { + if (!lP) { authService.labelPolicyLoading$.next(false); + return; } + + const parsed = JSON.parse(lP); + localStorage.removeItem(LABELPOLICY_LOCALSTORAGE_KEY); + + if (!parsed) { + return; + } + + this.labelpolicy = parsed; + // todo: figure this one out + // authService.labelpolicy.next(parsed); + authService.labelPolicyLoading$.next(false); } } diff --git a/console/src/app/pages/users/user-create/user-create.component.html b/console/src/app/pages/users/user-create/user-create.component.html index 94a42cdc98..0e878fbfa8 100644 --- a/console/src/app/pages/users/user-create/user-create.component.html +++ b/console/src/app/pages/users/user-create/user-create.component.html @@ -2,12 +2,17 @@ title="{{ 'USER.CREATE.TITLE' | translate }}" [createSteps]="1" [currentCreateStep]="1" - (closed)="close()" + (closed)="location.back()" >
-
+

{{ 'USER.CREATE.NAMEANDEMAILSECTION' | translate }}

@@ -19,12 +24,13 @@ {{ 'USER.PROFILE.USERNAME' | translate }} - {{ envSuffix }} + {{ envSuffix }} @@ -42,28 +48,39 @@
-
- +
+
- + {{ 'USER.PASSWORD.NEWINITIAL' | translate }} - + {{ 'USER.PASSWORD.CONFIRMINITIAL' | translate }}
+
+ + {{ 'USER.PROFILE.PHONE_VERIFIED' | translate }} + + + {{ 'USER.PROFILE.SEND_SMS' | translate }} + +
- - - + + + + - - -

{{ 'USER.PAGES.DELETEACCOUNT_DESC' | translate }}

+ + +

{{ 'USER.PAGES.DELETEACCOUNT_DESC' | translate }}

- +
+ +
+ +
+ diff --git a/console/src/app/pages/users/user-detail/auth-user-detail/auth-user-detail.component.ts b/console/src/app/pages/users/user-detail/auth-user-detail/auth-user-detail.component.ts index 5c79274bb0..a68bc15c89 100644 --- a/console/src/app/pages/users/user-detail/auth-user-detail/auth-user-detail.component.ts +++ b/console/src/app/pages/users/user-detail/auth-user-detail/auth-user-detail.component.ts @@ -1,45 +1,73 @@ import { MediaMatcher } from '@angular/cdk/layout'; -import { Location } from '@angular/common'; -import { Component, EventEmitter, OnDestroy } from '@angular/core'; +import { Component, DestroyRef, EventEmitter, OnInit } from '@angular/core'; import { Validators } from '@angular/forms'; import { MatDialog } from '@angular/material/dialog'; -import { ActivatedRoute, Params } from '@angular/router'; +import { ActivatedRoute, Router } from '@angular/router'; import { TranslateService } from '@ngx-translate/core'; import { Buffer } from 'buffer'; -import { from, Observable, Subscription, take } from 'rxjs'; +import { + combineLatestWith, + defer, + EMPTY, + fromEvent, + mergeWith, + Observable, + of, + shareReplay, + Subject, + switchMap, + take, +} from 'rxjs'; import { ChangeType } from 'src/app/modules/changes/changes.component'; import { phoneValidator, requiredValidator } from 'src/app/modules/form-field/validators/validators'; import { InfoDialogComponent } from 'src/app/modules/info-dialog/info-dialog.component'; -import { MetadataDialogComponent } from 'src/app/modules/metadata/metadata-dialog/metadata-dialog.component'; +import { + MetadataDialogComponent, + MetadataDialogData, +} from 'src/app/modules/metadata/metadata-dialog/metadata-dialog.component'; import { PolicyComponentServiceType } from 'src/app/modules/policies/policy-component-types.enum'; import { SidenavSetting } from 'src/app/modules/sidenav/sidenav.component'; import { UserGrantContext } from 'src/app/modules/user-grants/user-grants-datasource'; import { WarnDialogComponent } from 'src/app/modules/warn-dialog/warn-dialog.component'; -import { Metadata } from 'src/app/proto/generated/zitadel/metadata_pb'; -import { LoginPolicy } from 'src/app/proto/generated/zitadel/policy_pb'; -import { Email, Gender, Phone, Profile, User, UserState } from 'src/app/proto/generated/zitadel/user_pb'; import { AuthenticationService } from 'src/app/services/authentication.service'; import { Breadcrumb, BreadcrumbService, BreadcrumbType } from 'src/app/services/breadcrumb.service'; import { GrpcAuthService } from 'src/app/services/grpc-auth.service'; -import { ManagementService } from 'src/app/services/mgmt.service'; import { ToastService } from 'src/app/services/toast.service'; import { formatPhone } from 'src/app/utils/formatPhone'; -import { EditDialogComponent, EditDialogType } from './edit-dialog/edit-dialog.component'; -import { LanguagesService } from '../../../../services/languages.service'; +import { EditDialogComponent, EditDialogData, EditDialogResult, EditDialogType } from './edit-dialog/edit-dialog.component'; +import { LanguagesService } from 'src/app/services/languages.service'; +import { Gender, HumanProfile } from '@zitadel/proto/zitadel/user/v2/user_pb'; +import { catchError, filter, map, startWith, tap, withLatestFrom } from 'rxjs/operators'; +import { pairwiseStartWith } from 'src/app/utils/pairwiseStartWith'; +import { NewAuthService } from 'src/app/services/new-auth.service'; +import { Human, User, UserState } from '@zitadel/proto/zitadel/user_pb'; +import { takeUntilDestroyed } from '@angular/core/rxjs-interop'; +import { NewMgmtService } from 'src/app/services/new-mgmt.service'; +import { Metadata } from '@zitadel/proto/zitadel/metadata_pb'; +import { UserService } from 'src/app/services/user.service'; +import { LoginPolicy } from '@zitadel/proto/zitadel/policy_pb'; +import { query } from '@angular/animations'; + +type UserQuery = + | { state: 'success'; value: User } + | { state: 'error'; value: string } + | { state: 'loading'; value?: User } + | { state: 'notfound' }; + +type MetadataQuery = + | { state: 'success'; value: Metadata[] } + | { state: 'loading'; value: Metadata[] } + | { state: 'error'; value: string }; + +type UserWithHumanType = Omit & { type: { case: 'human'; value: Human } }; @Component({ selector: 'cnsl-auth-user-detail', templateUrl: './auth-user-detail.component.html', styleUrls: ['./auth-user-detail.component.scss'], }) -export class AuthUserDetailComponent implements OnDestroy { - public user?: User.AsObject; - public genders: Gender[] = [Gender.GENDER_MALE, Gender.GENDER_FEMALE, Gender.GENDER_DIVERSE]; - - private subscription: Subscription = new Subscription(); - - public loading: boolean = false; - public loadingMetadata: boolean = false; +export class AuthUserDetailComponent implements OnInit { + public genders: Gender[] = [Gender.MALE, Gender.FEMALE, Gender.DIVERSE]; public ChangeType: any = ChangeType; public userLoginMustBeDomain: boolean = false; @@ -47,8 +75,7 @@ export class AuthUserDetailComponent implements OnDestroy { public USERGRANTCONTEXT: UserGrantContext = UserGrantContext.AUTHUSER; public refreshChanges$: EventEmitter = new EventEmitter(); - - public metadata: Metadata.AsObject[] = []; + public refreshMetadata$ = new Subject(); public settingsList: SidenavSetting[] = [ { id: 'general', i18nKey: 'USER.SETTINGS.GENERAL' }, @@ -62,170 +89,218 @@ export class AuthUserDetailComponent implements OnDestroy { requiredRoles: { [PolicyComponentServiceType.MGMT]: ['user.read'] }, }, ]; - public currentSetting: string | undefined = this.settingsList[0].id; - public loginPolicy?: LoginPolicy.AsObject; - private savedLanguage?: string; + protected readonly user$: Observable; + protected readonly metadata$: Observable; + private readonly savedLanguage$: Observable; + protected currentSetting$: Observable; + public loginPolicy$: Observable; + protected userName$: Observable; constructor( public translate: TranslateService, private toast: ToastService, - public userService: GrpcAuthService, + public grpcAuthService: GrpcAuthService, private dialog: MatDialog, private auth: AuthenticationService, - private mgmt: ManagementService, private breadcrumbService: BreadcrumbService, private mediaMatcher: MediaMatcher, - private _location: Location, - activatedRoute: ActivatedRoute, public langSvc: LanguagesService, + private readonly route: ActivatedRoute, + private readonly newAuthService: NewAuthService, + private readonly newMgmtService: NewMgmtService, + private readonly userService: UserService, + private readonly destroyRef: DestroyRef, + private readonly router: Router, ) { - activatedRoute.queryParams.pipe(take(1)).subscribe((params: Params) => { - const { id } = params; - if (id) { - this.cleanupTranslation(); - this.currentSetting = id; - } - }); + this.currentSetting$ = this.getCurrentSetting$().pipe(shareReplay({ refCount: true, bufferSize: 1 })); + this.user$ = this.getUser$().pipe(shareReplay({ refCount: true, bufferSize: 1 })); + this.userName$ = this.getUserName(this.user$); + this.savedLanguage$ = this.getSavedLanguage$(this.user$); + this.metadata$ = this.getMetadata$(this.user$).pipe(shareReplay({ refCount: true, bufferSize: 1 })); - const mediaq: string = '(max-width: 500px)'; - const small = this.mediaMatcher.matchMedia(mediaq).matches; - if (small) { - this.changeSelection(small); - } - this.mediaMatcher.matchMedia(mediaq).onchange = (small) => { - this.changeSelection(small.matches); - }; - - this.loading = true; - this.refreshUser(); - - this.userService.getMyLoginPolicy().then((policy) => { - if (policy.policy) { - this.loginPolicy = policy.policy; - } - }); + this.loginPolicy$ = defer(() => this.newMgmtService.getLoginPolicy()).pipe( + catchError(() => EMPTY), + map(({ policy }) => policy), + filter(Boolean), + ); } - private changeSelection(small: boolean): void { - this.cleanupTranslation(); - if (small) { - this.currentSetting = undefined; - } else { - this.currentSetting = this.currentSetting === undefined ? this.settingsList[0].id : this.currentSetting; - } - } - - public navigateBack(): void { - this._location.back(); - } - - refreshUser(): void { - this.refreshChanges$.emit(); - this.userService - .getMyUser() - .then((resp) => { - if (resp.user) { - this.user = resp.user; - - this.loadMetadata(); - - this.breadcrumbService.setBreadcrumb([ - new Breadcrumb({ - type: BreadcrumbType.AUTHUSER, - name: this.user.human?.profile?.displayName, - routerLink: ['/users', 'me'], - }), - ]); + getUserName(user$: Observable) { + return user$.pipe( + map((query) => { + const user = this.user(query); + if (!user) { + return ''; } - this.savedLanguage = resp.user?.human?.profile?.preferredLanguage; - this.loading = false; - }) - .catch((error) => { - this.toast.showError(error); - this.loading = false; - }); + if (user.type.case === 'human') { + return user.type.value.profile?.displayName ?? ''; + } + if (user.type.case === 'machine') { + return user.type.value.name; + } + return ''; + }), + ); } - public ngOnDestroy(): void { - this.cleanupTranslation(); - this.subscription.unsubscribe(); + getSavedLanguage$(user$: Observable) { + return user$.pipe( + switchMap((query) => { + if (query.state !== 'success' || query.value.type.case !== 'human') { + return EMPTY; + } + return query.value.type.value.profile?.preferredLanguage ?? EMPTY; + }), + startWith(this.translate.defaultLang), + ); } - public settingChanged(): void { - this.cleanupTranslation(); + ngOnInit(): void { + this.user$.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((query) => { + if ((query.state === 'loading' || query.state === 'success') && query.value?.type.case === 'human') { + this.breadcrumbService.setBreadcrumb([ + new Breadcrumb({ + type: BreadcrumbType.AUTHUSER, + name: query.value.type.value.profile?.displayName, + routerLink: ['/users', 'me'], + }), + ]); + } + }); + this.user$.pipe(mergeWith(this.metadata$), takeUntilDestroyed(this.destroyRef)).subscribe((query) => { + if (query.state == 'error') { + this.toast.showError(query.value); + } + }); + + this.savedLanguage$ + .pipe(takeUntilDestroyed(this.destroyRef)) + .subscribe((savedLanguage) => this.translate.use(savedLanguage)); } - private cleanupTranslation(): void { - if (this?.savedLanguage) { - this.translate.use(this?.savedLanguage); - } else { - this.translate.use(this.translate.defaultLang); - } + private getCurrentSetting$(): Observable { + const mediaq: string = '(max-width: 500px)'; + const matcher = this.mediaMatcher.matchMedia(mediaq); + const small$ = fromEvent(matcher, 'change', ({ matches }: MediaQueryListEvent) => matches).pipe( + startWith(matcher.matches), + ); + + return this.route.queryParamMap.pipe( + map((params) => params.get('id')), + filter(Boolean), + startWith('general'), + withLatestFrom(small$), + map(([id, small]) => (small ? undefined : id)), + ); } - public changeUsername(): void { - const dialogRef = this.dialog.open(EditDialogComponent, { - data: { - confirmKey: 'ACTIONS.CHANGE', - cancelKey: 'ACTIONS.CANCEL', - labelKey: 'ACTIONS.NEWVALUE', - titleKey: 'USER.PROFILE.CHANGEUSERNAME_TITLE', - descriptionKey: 'USER.PROFILE.CHANGEUSERNAME_DESC', - value: this.user?.userName, - }, + private getUser$(): Observable { + return this.refreshChanges$.pipe( + startWith(true), + switchMap(() => this.getMyUser()), + pairwiseStartWith(undefined), + map(([prev, curr]) => { + if (prev?.state === 'success' && curr.state === 'loading') { + return { state: 'loading', value: prev.value } as const; + } + return curr; + }), + ); + } + + private getMyUser(): Observable { + return defer(() => this.newAuthService.getMyUser()).pipe( + map(({ user }) => { + if (user) { + return { state: 'success', value: user } as const; + } + return { state: 'notfound' } as const; + }), + catchError((error) => of({ state: 'error', value: error.message ?? '' } as const)), + startWith({ state: 'loading' } as const), + ); + } + + getMetadata$(user$: Observable): Observable { + return this.refreshMetadata$.pipe( + startWith(true), + combineLatestWith(user$), + switchMap(([_, user]) => { + if (!(user.state === 'success' || user.state === 'loading')) { + return EMPTY; + } + if (!user.value) { + return EMPTY; + } + return this.getMetadataById(user.value.id); + }), + pairwiseStartWith(undefined), + map(([prev, curr]) => { + if (prev?.state === 'success' && curr.state === 'loading') { + return { state: 'loading', value: prev.value } as const; + } + return curr; + }), + ); + } + + private getMetadataById(userId: string): Observable { + return defer(() => this.newMgmtService.listUserMetadata(userId)).pipe( + map((metadata) => ({ state: 'success', value: metadata.result }) as const), + startWith({ state: 'loading', value: [] as Metadata[] } as const), + catchError((err) => of({ state: 'error', value: err.message ?? '' } as const)), + ); + } + + public changeUsername(user: User): void { + const data = { + confirmKey: 'ACTIONS.CHANGE' as const, + cancelKey: 'ACTIONS.CANCEL' as const, + labelKey: 'ACTIONS.NEWVALUE' as const, + titleKey: 'USER.PROFILE.CHANGEUSERNAME_TITLE' as const, + descriptionKey: 'USER.PROFILE.CHANGEUSERNAME_DESC' as const, + value: user.userName, + }; + const dialogRef = this.dialog.open(EditDialogComponent, { + data, width: '400px', }); - dialogRef.afterClosed().subscribe((resp: { value: string }) => { - if (resp && resp.value && resp.value !== this.user?.userName) { - this.userService - .updateMyUserName(resp.value) - .then(() => { - this.toast.showInfo('USER.TOAST.USERNAMECHANGED', true); - this.refreshUser(); - }) - .catch((error) => { - this.toast.showError(error); - }); - } - }); - } - - public saveProfile(profileData: Profile.AsObject): void { - if (this.user?.human) { - this.user.human.profile = profileData; - - this.userService - .updateMyProfile( - this.user.human.profile?.firstName, - this.user.human.profile?.lastName, - this.user.human.profile?.nickName, - this.user.human.profile?.displayName, - this.user.human.profile?.preferredLanguage, - this.user.human.profile?.gender, - ) - .then(() => { - this.toast.showInfo('USER.TOAST.SAVED', true); - this.savedLanguage = this.user?.human?.profile?.preferredLanguage; + dialogRef + .afterClosed() + .pipe( + map((value) => value?.value), + filter(Boolean), + filter((value) => user.userName != value), + switchMap((username) => this.userService.updateUser({ userId: user.id, username })), + ) + .subscribe({ + next: () => { + this.toast.showInfo('USER.TOAST.USERNAMECHANGED', true); this.refreshChanges$.emit(); - }) - .catch((error) => { + }, + error: (error) => { this.toast.showError(error); - }); - } + }, + }); } - public saveEmail(email: string): void { + public saveProfile(user: User, profile: HumanProfile): void { this.userService - .setMyEmail(email) + .updateUser({ + userId: user.id, + profile: { + givenName: profile.givenName, + familyName: profile.familyName, + nickName: profile.nickName, + displayName: profile.displayName, + preferredLanguage: profile.preferredLanguage, + gender: profile.gender, + }, + }) .then(() => { - this.toast.showInfo('USER.TOAST.EMAILSAVED', true); - if (this.user?.human) { - const mailToSet = new Email(); - mailToSet.setEmail(email); - this.user.human.email = mailToSet.toObject(); - this.refreshUser(); - } + this.toast.showInfo('USER.TOAST.SAVED', true); + this.refreshChanges$.emit(); }) .catch((error) => { this.toast.showError(error); @@ -233,11 +308,11 @@ export class AuthUserDetailComponent implements OnDestroy { } public enteredPhoneCode(code: string): void { - this.userService + this.newAuthService .verifyMyPhone(code) .then(() => { this.toast.showInfo('USER.TOAST.PHONESAVED', true); - this.refreshUser(); + this.refreshChanges$.emit(); this.promptSetupforSMSOTP(); }) .catch((error) => { @@ -256,39 +331,26 @@ export class AuthUserDetailComponent implements OnDestroy { width: '400px', }); - dialogRef.afterClosed().subscribe((resp) => { - if (resp) { - this.userService.addMyAuthFactorOTPSMS().then(() => { - this.translate - .get('USER.MFA.OTPSMSSUCCESS') - .pipe(take(1)) - .subscribe((msg) => { - this.toast.showInfo(msg); - }); - }); - } - }); + dialogRef + .afterClosed() + .pipe( + filter(Boolean), + switchMap(() => this.newAuthService.addMyAuthFactorOTPSMS()), + switchMap(() => this.translate.get('USER.MFA.OTPSMSSUCCESS').pipe(take(1))), + ) + .subscribe({ + next: (msg) => this.toast.showInfo(msg), + error: (err) => this.toast.showError(err), + }); } public changedLanguage(language: string): void { this.translate.use(language); } - public resendPhoneVerification(): void { - this.userService - .resendMyPhoneVerification() - .then(() => { - this.toast.showInfo('USER.TOAST.PHONEVERIFICATIONSENT', true); - this.refreshChanges$.emit(); - }) - .catch((error) => { - this.toast.showError(error); - }); - } - - public resendEmailVerification(): void { - this.userService - .resendMyEmailVerification() + public resendEmailVerification(user: User): void { + this.newMgmtService + .resendHumanEmailVerification(user.id) .then(() => { this.toast.showInfo('USER.TOAST.EMAILVERIFICATIONSENT', true); this.refreshChanges$.emit(); @@ -298,161 +360,187 @@ export class AuthUserDetailComponent implements OnDestroy { }); } - public deletePhone(): void { - this.userService - .removeMyPhone() + public resendPhoneVerification(user: User): void { + this.newMgmtService + .resendHumanPhoneVerification(user.id) .then(() => { - this.toast.showInfo('USER.TOAST.PHONEREMOVED', true); - if (this.user?.human?.phone) { - const phone = new Phone(); - this.user.human.phone = phone.toObject(); - this.refreshUser(); - } + this.toast.showInfo('USER.TOAST.PHONEVERIFICATIONSENT', true); + this.refreshChanges$.emit(); }) .catch((error) => { this.toast.showError(error); }); } - public savePhone(phone: string): void { - if (this.user?.human) { - // Format phone before save (add +) - const formattedPhone = formatPhone(phone); - if (formattedPhone) { - phone = formattedPhone.phone; - } - - this.userService - .setMyPhone(phone) - .then(() => { - this.toast.showInfo('USER.TOAST.PHONESAVED', true); - if (this.user?.human) { - const phoneToSet = new Phone(); - phoneToSet.setPhone(phone); - this.user.human.phone = phoneToSet.toObject(); - this.refreshUser(); - } - }) - .catch((error) => { - this.toast.showError(error); - }); - } + public deletePhone(user: User): void { + this.userService + .removePhone(user.id) + .then(() => { + this.toast.showInfo('USER.TOAST.PHONEREMOVED', true); + this.refreshChanges$.emit(); + }) + .catch((error) => { + this.toast.showError(error); + }); } - public openEditDialog(type: EditDialogType): void { + public openEditDialog(user: UserWithHumanType, type: EditDialogType): void { switch (type) { case EditDialogType.PHONE: - const dialogRefPhone = this.dialog.open(EditDialogComponent, { - data: { - confirmKey: 'ACTIONS.SAVE', - cancelKey: 'ACTIONS.CANCEL', - labelKey: 'USER.LOGINMETHODS.PHONE.EDITVALUE', - titleKey: 'USER.LOGINMETHODS.PHONE.EDITTITLE', - descriptionKey: 'USER.LOGINMETHODS.PHONE.EDITDESC', - value: this.user?.human?.phone?.phone, - type: type, - validator: Validators.compose([phoneValidator, requiredValidator]), - }, - width: '400px', - }); - - dialogRefPhone.afterClosed().subscribe((resp: { value: string; isVerified: boolean }) => { - if (resp && resp.value) { - this.savePhone(resp.value); - } - }); - break; + this.openEditPhoneDialog(user); + return; case EditDialogType.EMAIL: - const dialogRefEmail = this.dialog.open(EditDialogComponent, { - data: { - confirmKey: 'ACTIONS.SAVE', - cancelKey: 'ACTIONS.CANCEL', - labelKey: 'ACTIONS.NEWVALUE', - titleKey: 'USER.LOGINMETHODS.EMAIL.EDITTITLE', - descriptionKey: 'USER.LOGINMETHODS.EMAIL.EDITDESC', - value: this.user?.human?.email?.email, - type: type, - }, - width: '400px', - }); - - dialogRefEmail.afterClosed().subscribe((resp: { value: string; isVerified: boolean }) => { - if (resp && resp.value) { - this.saveEmail(resp.value); - } - }); - break; + this.openEditEmailDialog(user); + return; } } - public deleteAccount(): void { - const dialogRef = this.dialog.open(WarnDialogComponent, { - data: { - confirmKey: 'USER.DIALOG.DELETE_BTN', - cancelKey: 'ACTIONS.CANCEL', - titleKey: 'USER.DIALOG.DELETE_TITLE', - descriptionKey: 'USER.DIALOG.DELETE_AUTH_DESCRIPTION', - }, + private openEditEmailDialog(user: UserWithHumanType) { + const data: EditDialogData = { + confirmKey: 'ACTIONS.SAVE', + cancelKey: 'ACTIONS.CANCEL', + labelKey: 'ACTIONS.NEWVALUE', + titleKey: 'USER.LOGINMETHODS.EMAIL.EDITTITLE', + descriptionKey: 'USER.LOGINMETHODS.EMAIL.EDITDESC', + value: user.type.value?.email?.email, + type: EditDialogType.EMAIL, + } as const; + + const dialogRefEmail = this.dialog.open(EditDialogComponent, { + data, width: '400px', }); - dialogRef.afterClosed().subscribe((resp) => { - if (resp) { - this.userService - .RemoveMyUser() - .then(() => { - this.toast.showInfo('USER.PAGES.DELETEACCOUNT_SUCCESS', true); - this.auth.signout(); - }) - .catch((error) => { - this.toast.showError(error); - }); - } + dialogRefEmail + .afterClosed() + .pipe( + filter((resp): resp is Required => !!resp?.value), + switchMap(({ value, isVerified }) => + this.userService.setEmail({ + userId: user.id, + email: value, + verification: isVerified ? { case: 'isVerified', value: isVerified } : { case: undefined }, + }), + ), + ) + .subscribe({ + next: () => { + this.toast.showInfo('USER.TOAST.EMAILSAVED', true); + this.refreshChanges$.emit(); + }, + error: (error) => this.toast.showError(error), + }); + } + + private openEditPhoneDialog(user: UserWithHumanType) { + const data = { + confirmKey: 'ACTIONS.SAVE', + cancelKey: 'ACTIONS.CANCEL', + labelKey: 'ACTIONS.NEWVALUE', + titleKey: 'USER.LOGINMETHODS.PHONE.EDITTITLE', + descriptionKey: 'USER.LOGINMETHODS.PHONE.EDITDESC', + value: user.type.value.phone?.phone, + type: EditDialogType.PHONE, + validator: Validators.compose([phoneValidator, requiredValidator]), + }; + const dialogRefPhone = this.dialog.open( + EditDialogComponent, + { data, width: '400px' }, + ); + + dialogRefPhone + .afterClosed() + .pipe( + map((resp) => formatPhone(resp?.value)), + filter(Boolean), + switchMap(({ phone }) => this.userService.setPhone({ userId: user.id, phone })), + ) + .subscribe({ + next: () => { + this.toast.showInfo('USER.TOAST.PHONESAVED', true); + this.refreshChanges$.emit(); + }, + error: (error) => { + this.toast.showError(error); + }, + }); + } + + public deleteUser(user: User): void { + const data = { + confirmKey: 'USER.DIALOG.DELETE_BTN', + cancelKey: 'ACTIONS.CANCEL', + titleKey: 'USER.DIALOG.DELETE_TITLE', + descriptionKey: 'USER.DIALOG.DELETE_AUTH_DESCRIPTION', + }; + + const dialogRef = this.dialog.open(WarnDialogComponent, { + width: '400px', + }); + + dialogRef + .afterClosed() + .pipe( + filter(Boolean), + switchMap(() => this.userService.deleteUser(user.id)), + ) + .subscribe({ + next: () => { + this.toast.showInfo('USER.PAGES.DELETEACCOUNT_SUCCESS', true); + this.auth.signout(); + }, + error: (error) => this.toast.showError(error), + }); + } + + public editMetadata(user: User, metadata: Metadata[]): void { + const setFcn = (key: string, value: string) => + this.newMgmtService.setUserMetadata({ + key, + value: Buffer.from(value), + id: user.id, + }); + const removeFcn = (key: string): Promise => this.newMgmtService.removeUserMetadata({ key, id: user.id }); + + const dialogRef = this.dialog.open(MetadataDialogComponent, { + data: { + metadata: [...metadata], + setFcn: setFcn, + removeFcn: removeFcn, + }, + }); + + dialogRef + .afterClosed() + .pipe(takeUntilDestroyed(this.destroyRef)) + .subscribe(() => { + this.refreshMetadata$.next(true); + }); + } + + protected readonly query = query; + + protected user(user: UserQuery): User | undefined { + if (user.state === 'success' || user.state === 'loading') { + return user.value; + } + return; + } + + public async goToSetting(setting: string) { + await this.router.navigate([], { + relativeTo: this.route, + queryParams: { id: setting }, + queryParamsHandling: 'merge', + skipLocationChange: true, }); } - public loadMetadata(): void { - if (this.user) { - this.userService.isAllowed(['user.read']).subscribe((allowed) => { - if (allowed) { - this.loadingMetadata = true; - this.mgmt - .listUserMetadata(this.user?.id ?? '') - .then((resp) => { - this.loadingMetadata = false; - this.metadata = resp.resultList.map((md) => { - return { - key: md.key, - value: Buffer.from(md.value as string, 'base64').toString('utf8'), - }; - }); - }) - .catch((error) => { - this.loadingMetadata = false; - this.toast.showError(error); - }); - } - }); - } - } - - public editMetadata(): void { - if (this.user && this.user.id) { - const setFcn = (key: string, value: string): Promise => - this.mgmt.setUserMetadata(key, Buffer.from(value).toString('base64'), this.user?.id ?? ''); - const removeFcn = (key: string): Promise => this.mgmt.removeUserMetadata(key, this.user?.id ?? ''); - - const dialogRef = this.dialog.open(MetadataDialogComponent, { - data: { - metadata: this.metadata, - setFcn: setFcn, - removeFcn: removeFcn, - }, - }); - - dialogRef.afterClosed().subscribe(() => { - this.loadMetadata(); - }); + public humanUser(userQuery: UserQuery): UserWithHumanType | undefined { + const user = this.user(userQuery); + if (user?.type.case === 'human') { + return { ...user, type: user.type }; } + return; } } diff --git a/console/src/app/pages/users/user-detail/auth-user-detail/edit-dialog/edit-dialog.component.html b/console/src/app/pages/users/user-detail/auth-user-detail/edit-dialog/edit-dialog.component.html index 6ab7aeabdc..13a990a38d 100644 --- a/console/src/app/pages/users/user-detail/auth-user-detail/edit-dialog/edit-dialog.component.html +++ b/console/src/app/pages/users/user-detail/auth-user-detail/edit-dialog/edit-dialog.component.html @@ -47,7 +47,7 @@ {{ data.isVerifiedTextKey | translate }} - {{ data.isVerifiedTextDescKey | translate }} + {{ data.isVerifiedTextDescKey ?? '' | translate }} diff --git a/console/src/app/pages/users/user-detail/auth-user-detail/edit-dialog/edit-dialog.component.ts b/console/src/app/pages/users/user-detail/auth-user-detail/edit-dialog/edit-dialog.component.ts index 66ae88cf21..79c35116d3 100644 --- a/console/src/app/pages/users/user-detail/auth-user-detail/edit-dialog/edit-dialog.component.ts +++ b/console/src/app/pages/users/user-detail/auth-user-detail/edit-dialog/edit-dialog.component.ts @@ -1,5 +1,5 @@ import { Component, Inject, OnInit } from '@angular/core'; -import { FormGroup, UntypedFormControl, UntypedFormGroup } from '@angular/forms'; +import { FormGroup, UntypedFormControl, UntypedFormGroup, ValidatorFn } from '@angular/forms'; import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; import { debounceTime } from 'rxjs'; import { requiredValidator } from 'src/app/modules/form-field/validators/validators'; @@ -11,6 +11,24 @@ export enum EditDialogType { EMAIL = 2, } +export type EditDialogData = { + confirmKey: 'ACTIONS.SAVE' | 'ACTIONS.CHANGE'; + cancelKey: 'ACTIONS.CANCEL'; + labelKey: 'ACTIONS.NEWVALUE'; + titleKey: 'USER.LOGINMETHODS.EMAIL.EDITTITLE'; + descriptionKey: 'USER.LOGINMETHODS.EMAIL.EDITDESC'; + isVerifiedTextKey?: 'USER.LOGINMETHODS.EMAIL.ISVERIFIED'; + isVerifiedTextDescKey?: 'USER.LOGINMETHODS.EMAIL.ISVERIFIEDDESC'; + value: string | undefined; + type: EditDialogType; + validator?: ValidatorFn; +}; + +export type EditDialogResult = { + value?: string; + isVerified: boolean; +}; + @Component({ selector: 'cnsl-edit-dialog', templateUrl: './edit-dialog.component.html', @@ -31,7 +49,7 @@ export class EditDialogComponent implements OnInit { public countryPhoneCodes: CountryPhoneCode[] = []; constructor( public dialogRef: MatDialogRef, - @Inject(MAT_DIALOG_DATA) public data: any, + @Inject(MAT_DIALOG_DATA) public data: EditDialogData, private countryCallingCodesService: CountryCallingCodesService, ) { if (data.type === EditDialogType.PHONE) { diff --git a/console/src/app/pages/users/user-detail/auth-user-detail/resend-email-dialog/resend-email-dialog.component.html b/console/src/app/pages/users/user-detail/auth-user-detail/resend-email-dialog/resend-email-dialog.component.html index cde6a0cc5f..e74edf38e0 100644 --- a/console/src/app/pages/users/user-detail/auth-user-detail/resend-email-dialog/resend-email-dialog.component.html +++ b/console/src/app/pages/users/user-detail/auth-user-detail/resend-email-dialog/resend-email-dialog.component.html @@ -1,5 +1,5 @@

- {{ 'USER.SENDEMAILDIALOG.TITLE' | translate }} {{ data?.number }} + {{ 'USER.SENDEMAILDIALOG.TITLE' | translate }}

{{ 'USER.SENDEMAILDIALOG.DESCRIPTION' | translate }}

diff --git a/console/src/app/pages/users/user-detail/auth-user-detail/resend-email-dialog/resend-email-dialog.component.ts b/console/src/app/pages/users/user-detail/auth-user-detail/resend-email-dialog/resend-email-dialog.component.ts index 6c8d7aba2a..bcead33780 100644 --- a/console/src/app/pages/users/user-detail/auth-user-detail/resend-email-dialog/resend-email-dialog.component.ts +++ b/console/src/app/pages/users/user-detail/auth-user-detail/resend-email-dialog/resend-email-dialog.component.ts @@ -1,6 +1,12 @@ import { Component, Inject } from '@angular/core'; import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; +export type ResendEmailDialogData = { + email: string | ''; +}; + +export type ResendEmailDialogResult = { send: true; email: string } | { send: false }; + @Component({ selector: 'cnsl-resend-email-dialog', templateUrl: './resend-email-dialog.component.html', @@ -9,16 +15,16 @@ import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; export class ResendEmailDialogComponent { public email: string = ''; constructor( - public dialogRef: MatDialogRef, - @Inject(MAT_DIALOG_DATA) public data: any, + public dialogRef: MatDialogRef, + @Inject(MAT_DIALOG_DATA) public data: ResendEmailDialogData, ) { if (data.email) { this.email = data.email; } } - closeDialog(email: string = ''): void { - this.dialogRef.close(email); + closeDialog(): void { + this.dialogRef.close({ send: false }); } closeDialogWithSend(email: string = ''): void { diff --git a/console/src/app/pages/users/user-detail/contact/contact.component.html b/console/src/app/pages/users/user-detail/contact/contact.component.html index cfcc60c0e3..9855185087 100644 --- a/console/src/app/pages/users/user-detail/contact/contact.component.html +++ b/console/src/app/pages/users/user-detail/contact/contact.component.html @@ -1,10 +1,10 @@ -
+
{{ 'USER.EMAIL' | translate }} {{ human.email?.email }} - {{ 'USER.EMAILVERIFIED' | translate }} -
+ {{ 'USER.EMAILVERIFIED' | translate }} +
{{ 'USER.NOTVERIFIED' | translate }} @@ -37,8 +37,8 @@
{{ 'USER.PHONE' | translate }} - {{ 'USER.PHONEVERIFIED' | translate }} -
+ {{ 'USER.PHONEVERIFIED' | translate }} +
{{ 'USER.NOTVERIFIED' | translate }} diff --git a/console/src/app/pages/users/user-detail/contact/contact.component.ts b/console/src/app/pages/users/user-detail/contact/contact.component.ts index 725bcf6ce6..fd16d40c57 100644 --- a/console/src/app/pages/users/user-detail/contact/contact.component.ts +++ b/console/src/app/pages/users/user-detail/contact/contact.component.ts @@ -1,11 +1,12 @@ import { Component, EventEmitter, Input, Output } from '@angular/core'; import { MatDialog } from '@angular/material/dialog'; import { WarnDialogComponent } from 'src/app/modules/warn-dialog/warn-dialog.component'; -import { Human, UserState } from 'src/app/proto/generated/zitadel/user_pb'; import { GrpcAuthService } from 'src/app/services/grpc-auth.service'; import { CodeDialogComponent } from '../auth-user-detail/code-dialog/code-dialog.component'; import { EditDialogType } from '../auth-user-detail/edit-dialog/edit-dialog.component'; +import { HumanUser, UserState } from '@zitadel/proto/zitadel/user/v2/user_pb'; +import { Human } from '@zitadel/proto/zitadel/user_pb'; @Component({ selector: 'cnsl-contact', @@ -15,15 +16,14 @@ import { EditDialogType } from '../auth-user-detail/edit-dialog/edit-dialog.comp export class ContactComponent { @Input() disablePhoneCode: boolean = false; @Input() canWrite: boolean | null = false; - @Input() human?: Human.AsObject; + @Input({ required: true }) human!: HumanUser | Human; @Input() username: string = ''; - @Input() state!: UserState; @Output() editType: EventEmitter = new EventEmitter(); @Output() resendEmailVerification: EventEmitter = new EventEmitter(); @Output() resendPhoneVerification: EventEmitter = new EventEmitter(); @Output() enteredPhoneCode: EventEmitter = new EventEmitter(); @Output() deletedPhone: EventEmitter = new EventEmitter(); - public UserState: any = UserState; + public UserState = UserState; public EditDialogType: any = EditDialogType; constructor( @@ -81,4 +81,18 @@ export class ContactComponent { public openEditDialog(type: EditDialogType): void { this.editType.emit(type); } + + protected get isPhoneVerified() { + if (this.human.$typeName === 'zitadel.user.v2.HumanUser') { + return !!this.human.phone?.isVerified; + } + return this.human.phone?.isPhoneVerified; + } + + protected get isEmailVerified() { + if (this.human.$typeName === 'zitadel.user.v2.HumanUser') { + return !!this.human.email?.isVerified; + } + return this.human.email?.isEmailVerified; + } } diff --git a/console/src/app/pages/users/user-detail/detail-form-machine/detail-form-machine.component.html b/console/src/app/pages/users/user-detail/detail-form-machine/detail-form-machine.component.html index d9a57d9157..8f52fc3b98 100644 --- a/console/src/app/pages/users/user-detail/detail-form-machine/detail-form-machine.component.html +++ b/console/src/app/pages/users/user-detail/detail-form-machine/detail-form-machine.component.html @@ -1,4 +1,4 @@ -
+
{{ 'USER.MACHINE.USERNAME' | translate }} diff --git a/console/src/app/pages/users/user-detail/detail-form-machine/detail-form-machine.component.ts b/console/src/app/pages/users/user-detail/detail-form-machine/detail-form-machine.component.ts index c4e2701986..1016bcc685 100644 --- a/console/src/app/pages/users/user-detail/detail-form-machine/detail-form-machine.component.ts +++ b/console/src/app/pages/users/user-detail/detail-form-machine/detail-form-machine.component.ts @@ -1,55 +1,77 @@ -import { Component, EventEmitter, Input, OnDestroy, OnInit, Output } from '@angular/core'; -import { AbstractControl, UntypedFormBuilder, UntypedFormGroup } from '@angular/forms'; -import { Subscription } from 'rxjs'; +import { Component, DestroyRef, EventEmitter, Input, Output } from '@angular/core'; +import { FormBuilder, FormControl } from '@angular/forms'; +import { combineLatestWith, distinctUntilChanged, ReplaySubject } from 'rxjs'; import { requiredValidator } from 'src/app/modules/form-field/validators/validators'; -import { AccessTokenType, Human, Machine } from 'src/app/proto/generated/zitadel/user_pb'; +import { AccessTokenType, MachineUser } from '@zitadel/proto/zitadel/user/v2/user_pb'; +import { startWith } from 'rxjs/operators'; +import { takeUntilDestroyed } from '@angular/core/rxjs-interop'; @Component({ selector: 'cnsl-detail-form-machine', templateUrl: './detail-form-machine.component.html', styleUrls: ['./detail-form-machine.component.scss'], }) -export class DetailFormMachineComponent implements OnInit, OnDestroy { - @Input() public username!: string; - @Input() public user!: Human.AsObject | Machine.AsObject; - @Input() public disabled: boolean = false; - @Output() public submitData: EventEmitter = new EventEmitter(); +export class DetailFormMachineComponent { + @Input({ required: true }) public set username(username: string) { + this.username$.next(username); + } + @Input({ required: true }) public set user(user: MachineUser) { + this.user$.next(user); + } + @Input() public set disabled(disabled: boolean) { + this.disabled$.next(disabled); + } - public machineForm!: UntypedFormGroup; + private username$ = new ReplaySubject(1); + private user$ = new ReplaySubject(1); + private disabled$ = new ReplaySubject(1); - public accessTokenTypes: AccessTokenType[] = [ - AccessTokenType.ACCESS_TOKEN_TYPE_BEARER, - AccessTokenType.ACCESS_TOKEN_TYPE_JWT, - ]; + public machineForm: ReturnType; - private sub: Subscription = new Subscription(); + @Output() public submitData = new EventEmitter>(); - constructor(private fb: UntypedFormBuilder) { - this.machineForm = this.fb.group({ - userName: [{ value: '', disabled: true }, [requiredValidator]], - name: [{ value: '', disabled: this.disabled }, requiredValidator], - description: [{ value: '', disabled: this.disabled }], - accessTokenType: [AccessTokenType.ACCESS_TOKEN_TYPE_BEARER, [requiredValidator]], + public accessTokenTypes: AccessTokenType[] = [AccessTokenType.BEARER, AccessTokenType.JWT]; + + constructor( + private readonly fb: FormBuilder, + private readonly destroyRef: DestroyRef, + ) { + this.machineForm = this.buildForm(); + } + + private buildForm() { + const form = this.fb.group({ + username: new FormControl('', { nonNullable: true, validators: [requiredValidator] }), + name: new FormControl('', { nonNullable: true, validators: [requiredValidator] }), + description: new FormControl('', { nonNullable: true, validators: [requiredValidator] }), + accessTokenType: new FormControl(AccessTokenType.BEARER, { nonNullable: true, validators: [requiredValidator] }), }); + + form.controls.username.disable(); + this.disabled$ + .pipe(startWith(false), distinctUntilChanged(), takeUntilDestroyed(this.destroyRef)) + .subscribe((disabled) => { + this.toggleFormControl(form.controls.name, disabled); + this.toggleFormControl(form.controls.description, disabled); + this.toggleFormControl(form.controls.accessTokenType, disabled); + }); + + this.username$.pipe(combineLatestWith(this.user$), takeUntilDestroyed(this.destroyRef)).subscribe(([username, user]) => { + this.machineForm.patchValue({ ...user, username }); + }); + + return form; } - public ngOnInit(): void { - this.machineForm.patchValue({ ...this.user, userName: this.username }); - } - - public ngOnDestroy(): void { - this.sub.unsubscribe(); + public toggleFormControl(control: FormControl, disabled: boolean) { + if (disabled) { + control.disable(); + return; + } + control.enable(); } public submitForm(): void { - this.submitData.emit(this.machineForm.value); - } - - public get name(): AbstractControl | null { - return this.machineForm.get('name'); - } - - public get userName(): AbstractControl | null { - return this.machineForm.get('userName'); + this.submitData.emit(this.machineForm.getRawValue()); } } diff --git a/console/src/app/pages/users/user-detail/detail-form/detail-form.component.html b/console/src/app/pages/users/user-detail/detail-form/detail-form.component.html index c802cf5cf4..00d5c9cf42 100644 --- a/console/src/app/pages/users/user-detail/detail-form/detail-form.component.html +++ b/console/src/app/pages/users/user-detail/detail-form/detail-form.component.html @@ -1,20 +1,20 @@ - +
@@ -34,11 +34,11 @@
{{ 'USER.PROFILE.FIRSTNAME' | translate }} - + {{ 'USER.PROFILE.LASTNAME' | translate }} - + {{ 'USER.PROFILE.NICKNAME' | translate }} @@ -67,7 +67,7 @@
-
diff --git a/console/src/app/pages/users/user-detail/detail-form/detail-form.component.ts b/console/src/app/pages/users/user-detail/detail-form/detail-form.component.ts index 052f5b642f..ce72f00271 100644 --- a/console/src/app/pages/users/user-detail/detail-form/detail-form.component.ts +++ b/console/src/app/pages/users/user-detail/detail-form/detail-form.component.ts @@ -1,116 +1,138 @@ -import { Component, EventEmitter, Input, OnChanges, OnDestroy, Output } from '@angular/core'; -import { AbstractControl, UntypedFormBuilder, UntypedFormGroup } from '@angular/forms'; +import { Component, DestroyRef, EventEmitter, Input, OnInit, Output } from '@angular/core'; +import { FormBuilder, FormControl } from '@angular/forms'; import { MatDialog } from '@angular/material/dialog'; -import { Subscription } from 'rxjs'; +import { combineLatestWith, distinctUntilChanged, ReplaySubject } from 'rxjs'; import { requiredValidator } from 'src/app/modules/form-field/validators/validators'; -import { Gender, Human, Profile } from 'src/app/proto/generated/zitadel/user_pb'; - import { ProfilePictureComponent } from './profile-picture/profile-picture.component'; +import { Gender, HumanProfile, HumanProfileSchema } from '@zitadel/proto/zitadel/user/v2/user_pb'; +import { filter, startWith } from 'rxjs/operators'; +import { takeUntilDestroyed } from '@angular/core/rxjs-interop'; +import { Profile } from '@zitadel/proto/zitadel/user_pb'; +import { create } from '@bufbuild/protobuf'; + +function toHumanProfile(profile: HumanProfile | Profile): HumanProfile { + if (profile.$typeName === 'zitadel.user.v2.HumanProfile') { + return profile; + } + return create(HumanProfileSchema, { + givenName: profile.firstName, + familyName: profile.lastName, + nickName: profile.nickName, + displayName: profile.displayName, + preferredLanguage: profile.preferredLanguage, + gender: profile.gender, + avatarUrl: profile.avatarUrl, + }); +} @Component({ selector: 'cnsl-detail-form', templateUrl: './detail-form.component.html', styleUrls: ['./detail-form.component.scss'], }) -export class DetailFormComponent implements OnDestroy, OnChanges { +export class DetailFormComponent implements OnInit { @Input() public showEditImage: boolean = false; @Input() public preferredLoginName: string = ''; - @Input() public username!: string; - @Input() public user!: Human.AsObject; - @Input() public disabled: boolean = true; + @Input({ required: true }) public set username(username: string) { + this.username$.next(username); + } + @Input({ required: true }) public set profile(profile: HumanProfile | Profile) { + this.profile$.next(toHumanProfile(profile)); + } + @Input() public set disabled(disabled: boolean) { + this.disabled$.next(disabled); + } @Input() public genders: Gender[] = []; @Input() public languages: string[] = ['de', 'en']; - @Output() public submitData: EventEmitter = new EventEmitter(); @Output() public changedLanguage: EventEmitter = new EventEmitter(); @Output() public changeUsernameClicked: EventEmitter = new EventEmitter(); @Output() public avatarChanged: EventEmitter = new EventEmitter(); - public profileForm!: UntypedFormGroup; - - private sub: Subscription = new Subscription(); + private username$ = new ReplaySubject(1); + public profile$ = new ReplaySubject(1); + public profileForm!: ReturnType; + public disabled$ = new ReplaySubject(1); + @Output() public submitData = new EventEmitter(); constructor( - private fb: UntypedFormBuilder, - private dialog: MatDialog, + private readonly fb: FormBuilder, + private readonly dialog: MatDialog, + private readonly destroyRef: DestroyRef, ) { - this.profileForm = this.fb.group({ - userName: [{ value: '', disabled: true }, [requiredValidator]], - firstName: [{ value: '', disabled: this.disabled }, requiredValidator], - lastName: [{ value: '', disabled: this.disabled }, requiredValidator], - nickName: [{ value: '', disabled: this.disabled }], - displayName: [{ value: '', disabled: this.disabled }, requiredValidator], - gender: [{ value: 0, disabled: this.disabled }], - preferredLanguage: [{ value: '', disabled: this.disabled }], - }); + this.profileForm = this.buildForm(); } - public ngOnChanges(): void { - this.profileForm = this.fb.group({ - userName: [{ value: '', disabled: true }, [requiredValidator]], - firstName: [{ value: '', disabled: this.disabled }, requiredValidator], - lastName: [{ value: '', disabled: this.disabled }, requiredValidator], - nickName: [{ value: '', disabled: this.disabled }], - displayName: [{ value: '', disabled: this.disabled }, requiredValidator], - gender: [{ value: 0, disabled: this.disabled }], - preferredLanguage: [{ value: '', disabled: this.disabled }], + ngOnInit(): void { + this.profileForm.controls.preferredLanguage.valueChanges + .pipe(takeUntilDestroyed(this.destroyRef)) + .subscribe((value) => this.changedLanguage.emit(value)); + } + + private buildForm() { + const form = this.fb.group({ + username: new FormControl('', { nonNullable: true, validators: [requiredValidator] }), + givenName: new FormControl('', { nonNullable: true, validators: [requiredValidator] }), + familyName: new FormControl('', { nonNullable: true, validators: [requiredValidator] }), + nickName: new FormControl('', { nonNullable: true }), + displayName: new FormControl('', { nonNullable: true, validators: [requiredValidator] }), + preferredLanguage: new FormControl('', { nonNullable: true }), + gender: new FormControl(Gender.UNSPECIFIED, { nonNullable: true }), }); - this.profileForm.patchValue({ userName: this.username, ...this.user.profile }); - - if (this.preferredLanguage) { - this.sub = this.preferredLanguage.valueChanges.subscribe((value) => { - this.changedLanguage.emit(value); + form.controls.username.disable(); + this.disabled$ + .pipe(startWith(true), distinctUntilChanged(), takeUntilDestroyed(this.destroyRef)) + .subscribe((disabled) => { + this.toggleFormControl(form.controls.givenName, disabled); + this.toggleFormControl(form.controls.familyName, disabled); + this.toggleFormControl(form.controls.nickName, disabled); + this.toggleFormControl(form.controls.displayName, disabled); + this.toggleFormControl(form.controls.gender, disabled); + this.toggleFormControl(form.controls.preferredLanguage, disabled); }); - } + + this.username$ + .pipe(combineLatestWith(this.profile$), takeUntilDestroyed(this.destroyRef)) + .subscribe(([username, profile]) => { + form.patchValue({ + username: username, + ...profile, + }); + }); + + return form; } - public ngOnDestroy(): void { - this.sub.unsubscribe(); - } - - public submitForm(): void { - this.submitData.emit(this.profileForm.value); + public submitForm(profile: HumanProfile): void { + this.submitData.emit({ ...profile, ...this.profileForm.getRawValue() }); } public changeUsername(): void { this.changeUsernameClicked.emit(); } - public openUploadDialog(): void { - const dialogRef = this.dialog.open(ProfilePictureComponent, { - data: { - profilePic: this.user.profile?.avatarUrl, - }, + public openUploadDialog(profile: HumanProfile): void { + const data = { + profilePic: profile.avatarUrl, + }; + + const dialogRef = this.dialog.open(ProfilePictureComponent, { width: '400px', }); - dialogRef.afterClosed().subscribe((shouldReload) => { - if (shouldReload) { + dialogRef + .afterClosed() + .pipe(filter(Boolean)) + .subscribe(() => { this.avatarChanged.emit(); - } - }); + }); } - public get userName(): AbstractControl | null { - return this.profileForm.get('userName'); - } - - public get firstName(): AbstractControl | null { - return this.profileForm.get('firstName'); - } - public get lastName(): AbstractControl | null { - return this.profileForm.get('lastName'); - } - public get nickName(): AbstractControl | null { - return this.profileForm.get('nickName'); - } - public get displayName(): AbstractControl | null { - return this.profileForm.get('displayName'); - } - public get gender(): AbstractControl | null { - return this.profileForm.get('gender'); - } - public get preferredLanguage(): AbstractControl | null { - return this.profileForm.get('preferredLanguage'); + public toggleFormControl(control: FormControl, disabled: boolean) { + if (disabled) { + control.disable(); + return; + } + control.enable(); } } diff --git a/console/src/app/pages/users/user-detail/external-idps/external-idps.component.ts b/console/src/app/pages/users/user-detail/external-idps/external-idps.component.ts index dddeb1627b..26f5b4235d 100644 --- a/console/src/app/pages/users/user-detail/external-idps/external-idps.component.ts +++ b/console/src/app/pages/users/user-detail/external-idps/external-idps.component.ts @@ -3,14 +3,14 @@ import { Component, Input, OnDestroy, OnInit, ViewChild } from '@angular/core'; import { MatDialog } from '@angular/material/dialog'; import { MatTableDataSource } from '@angular/material/table'; import { Timestamp } from 'google-protobuf/google/protobuf/timestamp_pb'; -import { BehaviorSubject, Observable } from 'rxjs'; +import { BehaviorSubject, firstValueFrom, Observable } from 'rxjs'; import { PageEvent, PaginatorComponent } from 'src/app/modules/paginator/paginator.component'; import { WarnDialogComponent } from 'src/app/modules/warn-dialog/warn-dialog.component'; import { IDPUserLink } from 'src/app/proto/generated/zitadel/idp_pb'; -import { GrpcAuthService } from '../../../../services/grpc-auth.service'; -import { ManagementService } from '../../../../services/mgmt.service'; -import { ToastService } from '../../../../services/toast.service'; +import { GrpcAuthService } from 'src/app/services/grpc-auth.service'; +import { ManagementService } from 'src/app/services/mgmt.service'; +import { ToastService } from 'src/app/services/toast.service'; @Component({ selector: 'cnsl-external-idps', @@ -18,7 +18,7 @@ import { ToastService } from '../../../../services/toast.service'; styleUrls: ['./external-idps.component.scss'], }) export class ExternalIdpsComponent implements OnInit, OnDestroy { - @Input() service!: GrpcAuthService | ManagementService; + @Input({ required: true }) service!: GrpcAuthService | ManagementService; @Input() userId!: string; @ViewChild(PaginatorComponent) public paginator!: PaginatorComponent; public totalResult: number = 0; @@ -41,7 +41,7 @@ export class ExternalIdpsComponent implements OnInit, OnDestroy { ) {} ngOnInit(): void { - this.getData(10, 0); + this.getData(10, 0).then(); } ngOnDestroy(): void { @@ -65,39 +65,37 @@ export class ExternalIdpsComponent implements OnInit, OnDestroy { private async getData(limit: number, offset: number): Promise { this.loadingSubject.next(true); - let promise; - if (this.service instanceof ManagementService) { - promise = (this.service as ManagementService).listHumanLinkedIDPs(this.userId, limit, offset); - } else if (this.service instanceof GrpcAuthService) { - promise = (this.service as GrpcAuthService).listMyLinkedIDPs(limit, offset); + const promise = + this.service instanceof ManagementService + ? (this.service as ManagementService).listHumanLinkedIDPs(this.userId, limit, offset) + : (this.service as GrpcAuthService).listMyLinkedIDPs(limit, offset); + + let resp; + try { + resp = await promise; + } catch (error) { + this.toast.showError(error); + this.loadingSubject.next(false); + return; } - if (promise) { - promise - .then((resp) => { - this.dataSource.data = resp.resultList; - if (resp.details?.viewTimestamp) { - this.viewTimestamp = resp.details.viewTimestamp; - } - if (resp.details?.totalResult) { - this.totalResult = resp.details?.totalResult; - } else { - this.totalResult = 0; - } - this.loadingSubject.next(false); - }) - .catch((error: any) => { - this.toast.showError(error); - this.loadingSubject.next(false); - }); + this.dataSource.data = resp.resultList; + if (resp.details?.viewTimestamp) { + this.viewTimestamp = resp.details.viewTimestamp; } + if (resp.details?.totalResult) { + this.totalResult = resp.details?.totalResult; + } else { + this.totalResult = 0; + } + this.loadingSubject.next(false); } public refreshPage(): void { - this.getData(this.paginator.pageSize, this.paginator.pageIndex * this.paginator.pageSize); + this.getData(this.paginator.pageSize, this.paginator.pageIndex * this.paginator.pageSize).then(); } - public removeExternalIdp(idp: IDPUserLink.AsObject): void { + public async removeExternalIdp(idp: IDPUserLink.AsObject): Promise { const dialogRef = this.dialog.open(WarnDialogComponent, { data: { confirmKey: 'ACTIONS.REMOVE', @@ -108,27 +106,23 @@ export class ExternalIdpsComponent implements OnInit, OnDestroy { width: '400px', }); - dialogRef.afterClosed().subscribe((resp) => { - if (resp) { - let promise; - if (this.service instanceof ManagementService) { - promise = (this.service as ManagementService).removeHumanLinkedIDP(idp.idpId, idp.providedUserId, idp.userId); - } else if (this.service instanceof GrpcAuthService) { - promise = (this.service as GrpcAuthService).removeMyLinkedIDP(idp.idpId, idp.providedUserId); - } + const resp = await firstValueFrom(dialogRef.afterClosed()); + if (!resp) { + return; + } - if (promise) { - promise - .then((_) => { - setTimeout(() => { - this.refreshPage(); - }, 1000); - }) - .catch((error: any) => { - this.toast.showError(error); - }); - } - } - }); + const promise = + this.service instanceof ManagementService + ? (this.service as ManagementService).removeHumanLinkedIDP(idp.idpId, idp.providedUserId, idp.userId) + : (this.service as GrpcAuthService).removeMyLinkedIDP(idp.idpId, idp.providedUserId); + + try { + await promise; + setTimeout(() => { + this.refreshPage(); + }, 1000); + } catch (error) { + this.toast.showError(error); + } } } diff --git a/console/src/app/pages/users/user-detail/password/password.component.html b/console/src/app/pages/users/user-detail/password/password.component.html index 43cca85fd9..10f3064f0d 100644 --- a/console/src/app/pages/users/user-detail/password/password.component.html +++ b/console/src/app/pages/users/user-detail/password/password.component.html @@ -1,9 +1,9 @@ - +

{{ 'USER.PASSWORD.DESCRIPTION' | translate }}

- - + +
-
- +
+ +
-
- -
+ + -
- +
+ +
@@ -74,9 +76,9 @@
- -
+ diff --git a/console/src/app/pages/users/user-detail/password/password.component.ts b/console/src/app/pages/users/user-detail/password/password.component.ts index 904981047a..b37d79c39b 100644 --- a/console/src/app/pages/users/user-detail/password/password.component.ts +++ b/console/src/app/pages/users/user-detail/password/password.component.ts @@ -1,7 +1,18 @@ -import { Component, OnDestroy } from '@angular/core'; +import { Component, DestroyRef, OnInit } from '@angular/core'; import { AbstractControl, UntypedFormBuilder, UntypedFormGroup, Validators } from '@angular/forms'; import { ActivatedRoute } from '@angular/router'; -import { Subject, Subscription, take, takeUntil } from 'rxjs'; +import { + take, + map, + switchMap, + firstValueFrom, + mergeWith, + Observable, + defer, + of, + shareReplay, + combineLatestWith, +} from 'rxjs'; import { containsLowerCaseValidator, containsNumberValidator, @@ -14,161 +25,200 @@ import { import { PasswordComplexityPolicy } from 'src/app/proto/generated/zitadel/policy_pb'; import { Breadcrumb, BreadcrumbService, BreadcrumbType } from 'src/app/services/breadcrumb.service'; import { GrpcAuthService } from 'src/app/services/grpc-auth.service'; -import { ManagementService } from 'src/app/services/mgmt.service'; import { ToastService } from 'src/app/services/toast.service'; +import { catchError, filter } from 'rxjs/operators'; +import { User } from 'src/app/proto/generated/zitadel/user_pb'; +import { takeUntilDestroyed } from '@angular/core/rxjs-interop'; +import { UserService } from '../../../../services/user.service'; @Component({ selector: 'cnsl-password', templateUrl: './password.component.html', styleUrls: ['./password.component.scss'], }) -export class PasswordComponent implements OnDestroy { - userId: string = ''; - public username: string = ''; - - public policy!: PasswordComplexityPolicy.AsObject; - public passwordForm!: UntypedFormGroup; - - private formSub: Subscription = new Subscription(); - private destroy$: Subject = new Subject(); +export class PasswordComponent implements OnInit { + private readonly breadcrumb$: Observable; + protected readonly username$: Observable; + protected readonly id$: Observable; + protected readonly form$: Observable; + protected readonly passwordPolicy$: Observable; + protected readonly user$: Observable; constructor( activatedRoute: ActivatedRoute, - private fb: UntypedFormBuilder, - private authService: GrpcAuthService, - private mgmtUserService: ManagementService, - private toast: ToastService, - private breadcrumbService: BreadcrumbService, + private readonly fb: UntypedFormBuilder, + private readonly authService: GrpcAuthService, + private readonly userService: UserService, + private readonly toast: ToastService, + private readonly breadcrumbService: BreadcrumbService, + private readonly destroyRef: DestroyRef, ) { - activatedRoute.queryParams.pipe(takeUntil(this.destroy$)).subscribe((data) => { - const { username } = data; - this.username = username; - }); - activatedRoute.params.pipe(takeUntil(this.destroy$)).subscribe((data) => { - const { id } = data; - if (id) { - this.userId = id; - breadcrumbService.setBreadcrumb([ + const usernameParam$ = activatedRoute.queryParamMap.pipe( + map((params) => params.get('username')), + filter(Boolean), + ); + this.id$ = activatedRoute.paramMap.pipe(map((params) => params.get('id') ?? undefined)); + + this.user$ = this.authService.user.pipe(take(1), filter(Boolean)); + this.username$ = usernameParam$.pipe(mergeWith(this.user$.pipe(map((user) => user.preferredLoginName)))); + + this.breadcrumb$ = this.getBreadcrumb$(this.id$, this.user$); + this.passwordPolicy$ = this.getPasswordPolicy$().pipe(shareReplay({ refCount: true, bufferSize: 1 })); + const validators$ = this.getValidators$(this.passwordPolicy$); + this.form$ = this.getForm$(this.id$, validators$); + } + + private getBreadcrumb$(id$: Observable, user$: Observable): Observable { + return id$.pipe( + switchMap(async (id) => { + if (id) { + return [ + new Breadcrumb({ + type: BreadcrumbType.ORG, + routerLink: ['/org'], + }), + ]; + } + const user = await firstValueFrom(user$); + if (!user) { + return []; + } + return [ new Breadcrumb({ - type: BreadcrumbType.ORG, - routerLink: ['/org'], + type: BreadcrumbType.AUTHUSER, + name: user.human?.profile?.displayName, + routerLink: ['/users', 'me'], }), - ]); - } else { - this.authService.user.pipe(take(1)).subscribe((user) => { - if (user) { - this.username = user.preferredLoginName; - this.breadcrumbService.setBreadcrumb([ - new Breadcrumb({ - type: BreadcrumbType.AUTHUSER, - name: user.human?.profile?.displayName, - routerLink: ['/users', 'me'], - }), - ]); - } - }); - } + ]; + }), + ); + } - const validators: Validators[] = [requiredValidator]; - this.authService - .getMyPasswordComplexityPolicy() - .then((resp) => { - if (resp.policy) { - this.policy = resp.policy; - } - if (this.policy.minLength) { - validators.push(minLengthValidator(this.policy.minLength)); - } - if (this.policy.hasLowercase) { - validators.push(containsLowerCaseValidator); - } - if (this.policy.hasUppercase) { - validators.push(containsUpperCaseValidator); - } - if (this.policy.hasNumber) { - validators.push(containsNumberValidator); - } - if (this.policy.hasSymbol) { - validators.push(containsSymbolValidator); - } + private getValidators$( + passwordPolicy$: Observable, + ): Observable { + return passwordPolicy$.pipe( + map((policy) => { + const validators: Validators[] = [requiredValidator]; + if (!policy) { + return validators; + } + if (policy.minLength) { + validators.push(minLengthValidator(policy.minLength)); + } + if (policy.hasLowercase) { + validators.push(containsLowerCaseValidator); + } + if (policy.hasUppercase) { + validators.push(containsUpperCaseValidator); + } + if (policy.hasNumber) { + validators.push(containsNumberValidator); + } + if (policy.hasSymbol) { + validators.push(containsSymbolValidator); + } + return validators; + }), + ); + } - this.setupForm(validators); - }) - .catch((error) => { - this.setupForm(validators); - }); + private getForm$( + id$: Observable, + validators$: Observable, + ): Observable { + return id$.pipe( + combineLatestWith(validators$), + map(([id, validators]) => { + if (id) { + return this.fb.group({ + password: ['', validators], + confirmPassword: ['', [requiredValidator, passwordConfirmValidator()]], + }); + } else { + return this.fb.group({ + currentPassword: ['', requiredValidator], + newPassword: ['', validators], + confirmPassword: ['', [requiredValidator, passwordConfirmValidator()]], + }); + } + }), + ); + } + + private getPasswordPolicy$(): Observable { + return defer(() => this.authService.getMyPasswordComplexityPolicy()).pipe( + map((resp) => resp.policy), + catchError(() => of(undefined)), + ); + } + + ngOnInit() { + this.breadcrumb$.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((breadcrumbs) => { + this.breadcrumbService.setBreadcrumb(breadcrumbs); }); } - ngOnDestroy(): void { - this.destroy$.next(); - this.destroy$.complete(); - this.formSub.unsubscribe(); - } + public async setInitialPassword(userId: string, form: UntypedFormGroup): Promise { + const password = this.password(form)?.value; - setupForm(validators: Validators[]): void { - if (this.userId) { - this.passwordForm = this.fb.group({ - password: ['', validators], - confirmPassword: ['', [requiredValidator, passwordConfirmValidator()]], + if (form.invalid || !password) { + return; + } + + try { + await this.userService.setPassword({ + userId, + newPassword: { + password, + changeRequired: false, + }, }); - } else { - this.passwordForm = this.fb.group({ - currentPassword: ['', requiredValidator], - newPassword: ['', validators], - confirmPassword: ['', [requiredValidator, passwordConfirmValidator()]], + } catch (error) { + this.toast.showError(error); + return; + } + this.toast.showInfo('USER.TOAST.INITIALPASSWORDSET', true); + window.history.back(); + } + + public async setPassword(form: UntypedFormGroup, user: User.AsObject): Promise { + const currentPassword = this.currentPassword(form); + const newPassword = this.newPassword(form); + + if (form.invalid || !currentPassword?.value || !newPassword?.value || newPassword?.invalid) { + return; + } + + try { + await this.userService.setPassword({ + userId: user.id, + newPassword: { + password: newPassword.value, + changeRequired: false, + }, + verification: { + case: 'currentPassword', + value: currentPassword.value, + }, }); + } catch (error) { + this.toast.showError(error); + return; } + this.toast.showInfo('USER.TOAST.PASSWORDCHANGED', true); + window.history.back(); } - public setInitialPassword(userId: string): void { - if (this.passwordForm.valid && this.password && this.password.value) { - this.mgmtUserService - .setHumanInitialPassword(userId, this.password.value) - .then((data: any) => { - this.toast.showInfo('USER.TOAST.INITIALPASSWORDSET', true); - window.history.back(); - }) - .catch((error) => { - this.toast.showError(error); - }); - } + public password(form: UntypedFormGroup): AbstractControl | null { + return form.get('password'); } - public setPassword(): void { - if ( - this.passwordForm.valid && - this.currentPassword && - this.currentPassword.value && - this.newPassword && - this.newPassword.value && - this.newPassword.valid - ) { - this.authService - .updateMyPassword(this.currentPassword.value, this.newPassword.value) - .then((data: any) => { - this.toast.showInfo('USER.TOAST.PASSWORDCHANGED', true); - window.history.back(); - }) - .catch((error) => { - this.toast.showError(error); - }); - } + public newPassword(form: UntypedFormGroup): AbstractControl | null { + return form.get('newPassword'); } - public get password(): AbstractControl | null { - return this.passwordForm.get('password'); - } - - public get newPassword(): AbstractControl | null { - return this.passwordForm.get('newPassword'); - } - - public get currentPassword(): AbstractControl | null { - return this.passwordForm.get('currentPassword'); - } - - public get confirmPassword(): AbstractControl | null { - return this.passwordForm.get('confirmPassword'); + public currentPassword(form: UntypedFormGroup): AbstractControl | null { + return form.get('currentPassword'); } } diff --git a/console/src/app/pages/users/user-detail/user-detail/passwordless/passwordless.component.html b/console/src/app/pages/users/user-detail/user-detail/passwordless/passwordless.component.html index 6726f98f98..507c0b929f 100644 --- a/console/src/app/pages/users/user-detail/user-detail/passwordless/passwordless.component.html +++ b/console/src/app/pages/users/user-detail/user-detail/passwordless/passwordless.component.html @@ -14,7 +14,7 @@ - - - - - - + + + + + + + + - - - + + -
-
- -
-
- -
-

{{ 'USER.PAGES.NOUSER' | translate }}

-
- -
- - -
-

{{ error }}

-
- -
- - {{ 'USER.PAGES.LOCKEDDESCRIPTION' | translate }} - {{ 'USER.PAGES.NOUSER' | translate }} - -
- -
- {{ 'USER.ISINITIAL' | translate }} - -
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
-
-
- {{ 'USER.PASSWORD.LABEL' | translate }} - ********* - - -
- -
- - - -
-
-
- - - - - - - - - - - - - - - - - - - - - - - - -
- -
- - +
+
+
- -
+
+ +
+

{{ 'USER.PAGES.NOUSER' | translate }}

+
+ + +
+ + +
+ + {{ 'USER.PAGES.LOCKEDDESCRIPTION' | translate }} +
+ +
+ {{ 'USER.ISINITIAL' | translate }} + +
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+ {{ 'USER.PASSWORD.LABEL' | translate }} + ********* + + +
+ +
+ + + +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + +
+ +
+ + +
+ +
+ + diff --git a/console/src/app/pages/users/user-detail/user-detail/user-detail.component.ts b/console/src/app/pages/users/user-detail/user-detail/user-detail.component.ts index 2418baafc4..b63c255487 100644 --- a/console/src/app/pages/users/user-detail/user-detail/user-detail.component.ts +++ b/console/src/app/pages/users/user-detail/user-detail/user-detail.component.ts @@ -1,32 +1,61 @@ import { MediaMatcher } from '@angular/cdk/layout'; import { Location } from '@angular/common'; -import { Component, EventEmitter, OnInit } from '@angular/core'; +import { Component, DestroyRef, EventEmitter, OnInit } from '@angular/core'; import { Validators } from '@angular/forms'; import { MatDialog } from '@angular/material/dialog'; import { ActivatedRoute, Params, Router } from '@angular/router'; import { TranslateService } from '@ngx-translate/core'; import { Buffer } from 'buffer'; -import { take } from 'rxjs/operators'; +import { catchError, filter, map, startWith, tap, withLatestFrom } from 'rxjs/operators'; import { ChangeType } from 'src/app/modules/changes/changes.component'; import { phoneValidator, requiredValidator } from 'src/app/modules/form-field/validators/validators'; import { InfoSectionType } from 'src/app/modules/info-section/info-section.component'; -import { MetadataDialogComponent } from 'src/app/modules/metadata/metadata-dialog/metadata-dialog.component'; +import { + MetadataDialogComponent, + MetadataDialogData, +} from 'src/app/modules/metadata/metadata-dialog/metadata-dialog.component'; import { SidenavSetting } from 'src/app/modules/sidenav/sidenav.component'; import { UserGrantContext } from 'src/app/modules/user-grants/user-grants-datasource'; import { WarnDialogComponent } from 'src/app/modules/warn-dialog/warn-dialog.component'; -import { SendHumanResetPasswordNotificationRequest, UnlockUserRequest } from 'src/app/proto/generated/zitadel/management_pb'; -import { Metadata } from 'src/app/proto/generated/zitadel/metadata_pb'; -import { LoginPolicy } from 'src/app/proto/generated/zitadel/policy_pb'; -import { Email, Gender, Machine, Phone, Profile, User, UserState } from 'src/app/proto/generated/zitadel/user_pb'; import { Breadcrumb, BreadcrumbService, BreadcrumbType } from 'src/app/services/breadcrumb.service'; -import { ManagementService } from 'src/app/services/mgmt.service'; import { ToastService } from 'src/app/services/toast.service'; import { formatPhone } from 'src/app/utils/formatPhone'; -import { EditDialogComponent, EditDialogType } from '../auth-user-detail/edit-dialog/edit-dialog.component'; -import { ResendEmailDialogComponent } from '../auth-user-detail/resend-email-dialog/resend-email-dialog.component'; +import { + EditDialogData, + EditDialogResult, + EditDialogComponent, + EditDialogType, +} from '../auth-user-detail/edit-dialog/edit-dialog.component'; +import { + ResendEmailDialogComponent, + ResendEmailDialogData, + ResendEmailDialogResult, +} from '../auth-user-detail/resend-email-dialog/resend-email-dialog.component'; import { MachineSecretDialogComponent } from './machine-secret-dialog/machine-secret-dialog.component'; -import { Observable } from 'rxjs'; -import { LanguagesService } from '../../../../services/languages.service'; +import { LanguagesService } from 'src/app/services/languages.service'; +import { UserService } from 'src/app/services/user.service'; +import { Gender, HumanProfile, HumanUser, User as UserV2, UserState } from '@zitadel/proto/zitadel/user/v2/user_pb'; +import { + combineLatestWith, + defer, + EMPTY, + fromEvent, + mergeWith, + Observable, + ObservedValueOf, + of, + shareReplay, + Subject, + switchMap, +} from 'rxjs'; +import { takeUntilDestroyed } from '@angular/core/rxjs-interop'; +import { DetailFormMachineComponent } from '../detail-form-machine/detail-form-machine.component'; +import { NewMgmtService } from 'src/app/services/new-mgmt.service'; +import { LoginPolicy } from '@zitadel/proto/zitadel/policy_pb'; +import { SendHumanResetPasswordNotificationRequest_Type } from '@zitadel/proto/zitadel/management_pb'; +import { pairwiseStartWith } from 'src/app/utils/pairwiseStartWith'; +import { Metadata } from '@zitadel/proto/zitadel/metadata_pb'; +import { ManagementService } from 'src/app/services/mgmt.service'; const GENERAL: SidenavSetting = { id: 'general', i18nKey: 'USER.SETTINGS.GENERAL' }; const GRANTS: SidenavSetting = { id: 'grants', i18nKey: 'USER.SETTINGS.USERGRANTS' }; @@ -37,22 +66,31 @@ const PERSONALACCESSTOKEN: SidenavSetting = { id: 'pat', i18nKey: 'USER.SETTINGS const KEYS: SidenavSetting = { id: 'keys', i18nKey: 'USER.SETTINGS.KEYS' }; const MEMBERSHIPS: SidenavSetting = { id: 'memberships', i18nKey: 'USER.SETTINGS.MEMBERSHIPS' }; +type UserQuery = + | { state: 'success'; value: UserV2 } + | { state: 'error'; value: string } + | { state: 'loading'; value?: UserV2 } + | { state: 'notfound' }; + +type MetadataQuery = + | { state: 'success'; value: Metadata[] } + | { state: 'loading'; value: Metadata[] } + | { state: 'error'; value: string }; + +type UserWithHumanType = Omit & { type: { case: 'human'; value: HumanUser } }; + @Component({ selector: 'cnsl-user-detail', templateUrl: './user-detail.component.html', styleUrls: ['./user-detail.component.scss'], }) export class UserDetailComponent implements OnInit { - public user!: User.AsObject; - public metadata: Metadata.AsObject[] = []; - public genders: Gender[] = [Gender.GENDER_MALE, Gender.GENDER_FEMALE, Gender.GENDER_DIVERSE]; + public user$: Observable; + public genders: Gender[] = [Gender.MALE, Gender.FEMALE, Gender.DIVERSE]; public ChangeType: any = ChangeType; - public loading: boolean = true; - public loadingMetadata: boolean = true; - - public UserState: any = UserState; + public UserState = UserState; public copied: string = ''; public USERGRANTCONTEXT: UserGrantContext = UserGrantContext.USER; @@ -60,32 +98,27 @@ export class UserDetailComponent implements OnInit { public refreshChanges$: EventEmitter = new EventEmitter(); public InfoSectionType: any = InfoSectionType; - public error: string = ''; - - public settingsList: SidenavSetting[] = [GENERAL, GRANTS, MEMBERSHIPS, METADATA]; - public currentSetting: string | undefined = 'general'; - public loginPolicy?: LoginPolicy.AsObject; + public currentSetting$: Observable; + public settingsList$: Observable; + public metadata$: Observable; + public loginPolicy$: Observable; + public refreshMetadata$ = new Subject(); constructor( public translate: TranslateService, - private route: ActivatedRoute, + private readonly route: ActivatedRoute, private toast: ToastService, - public mgmtUserService: ManagementService, private _location: Location, private dialog: MatDialog, private router: Router, - activatedRoute: ActivatedRoute, private mediaMatcher: MediaMatcher, public langSvc: LanguagesService, + private readonly userService: UserService, + private readonly newMgmtService: NewMgmtService, + public readonly mgmtService: ManagementService, breadcrumbService: BreadcrumbService, + private readonly destroyRef: DestroyRef, ) { - activatedRoute.queryParams.pipe(take(1)).subscribe((params: Params) => { - const { id } = params; - if (id) { - this.currentSetting = id; - } - }); - breadcrumbService.setBreadcrumb([ new Breadcrumb({ type: BreadcrumbType.ORG, @@ -93,63 +126,127 @@ export class UserDetailComponent implements OnInit { }), ]); + this.currentSetting$ = this.getCurrentSetting$().pipe(shareReplay({ refCount: true, bufferSize: 1 })); + this.user$ = this.getUser$().pipe(shareReplay({ refCount: true, bufferSize: 1 })); + this.settingsList$ = this.getSettingsList$(this.user$); + this.metadata$ = this.getMetadata$(this.user$).pipe(shareReplay({ refCount: true, bufferSize: 1 })); + + this.loginPolicy$ = defer(() => this.newMgmtService.getLoginPolicy()).pipe( + catchError(() => EMPTY), + map(({ policy }) => policy), + filter(Boolean), + ); + } + + private getId$(): Observable { + return this.route.paramMap.pipe( + map((params) => params.get('id')), + filter(Boolean), + ); + } + + private getUser$(): Observable { + return this.getId$().pipe( + combineLatestWith(this.refreshChanges$.pipe(startWith(undefined))), + switchMap(([id]) => this.getUserById(id)), + pairwiseStartWith(undefined), + map(([prev, curr]) => { + if (prev?.state === 'success' && curr.state === 'loading') { + return { state: 'loading', value: prev.value } as const; + } + return curr; + }), + ); + } + + private getSettingsList$(user$: Observable): Observable { + return user$.pipe( + switchMap((user) => { + if (user.state !== 'success') { + return EMPTY; + } + + if (user.value.type.case === 'human') { + return of([GENERAL, SECURITY, IDP, GRANTS, MEMBERSHIPS, METADATA]); + } else if (user.value.type.case === 'machine') { + return of([GENERAL, GRANTS, MEMBERSHIPS, PERSONALACCESSTOKEN, KEYS, METADATA]); + } + return EMPTY; + }), + startWith([GENERAL, GRANTS, MEMBERSHIPS, METADATA]), + ); + } + + private getCurrentSetting$(): Observable { const mediaq: string = '(max-width: 500px)'; - const small = this.mediaMatcher.matchMedia(mediaq).matches; - if (small) { - this.changeSelection(small); - } - this.mediaMatcher.matchMedia(mediaq).onchange = (small) => { - this.changeSelection(small.matches); - }; + const matcher = this.mediaMatcher.matchMedia(mediaq); + const small$ = fromEvent(matcher, 'change', ({ matches }: MediaQueryListEvent) => matches).pipe( + startWith(matcher.matches), + ); + + return this.route.queryParamMap.pipe( + map((params) => params.get('id')), + filter(Boolean), + startWith('general'), + withLatestFrom(small$), + map(([id, small]) => (small ? undefined : id)), + ); } - private changeSelection(small: boolean): void { - if (small) { - this.currentSetting = undefined; - } else { - this.currentSetting = this.currentSetting === undefined ? 'general' : this.currentSetting; - } - } - - refreshUser(): void { - this.refreshChanges$.emit(); - this.route.params.pipe(take(1)).subscribe((params) => { - this.loading = true; - const { id } = params; - this.mgmtUserService - .getUserByID(id) - .then((resp) => { - this.loadMetadata(id); - this.loading = false; - if (resp.user) { - this.user = resp.user; - - if (this.user.human) { - this.settingsList = [GENERAL, SECURITY, IDP, GRANTS, MEMBERSHIPS, METADATA]; - } else if (this.user.machine) { - this.settingsList = [GENERAL, GRANTS, MEMBERSHIPS, PERSONALACCESSTOKEN, KEYS, METADATA]; - } - } - }) - .catch((err) => { - this.error = err.message ?? ''; - this.loading = false; - this.toast.showError(err); - }); + public async goToSetting(setting: string) { + await this.router.navigate([], { + relativeTo: this.route, + queryParams: { id: setting }, + queryParamsHandling: 'merge', + skipLocationChange: true, }); } - public ngOnInit(): void { - this.refreshUser(); + private getUserById(userId: string): Observable { + return defer(() => this.userService.getUserById(userId)).pipe( + map(({ user }) => { + if (user) { + return { state: 'success', value: user } as const; + } + return { state: 'notfound' } as const; + }), + catchError((error) => of({ state: 'error', value: error.message ?? '' } as const)), + startWith({ state: 'loading' } as const), + ); + } - this.mgmtUserService.getLoginPolicy().then((policy) => { - if (policy.policy) { - this.loginPolicy = policy.policy; + getMetadata$(user$: Observable): Observable { + return this.refreshMetadata$.pipe( + startWith(true), + combineLatestWith(user$), + switchMap(([_, user]) => { + if (!(user.state === 'success' || user.state === 'loading')) { + return EMPTY; + } + if (!user.value) { + return EMPTY; + } + return this.getMetadataById(user.value.userId); + }), + pairwiseStartWith(undefined), + map(([prev, curr]) => { + if (prev?.state === 'success' && curr.state === 'loading') { + return { state: 'loading', value: prev.value } as const; + } + return curr; + }), + ); + } + + public ngOnInit(): void { + this.user$.pipe(mergeWith(this.metadata$), takeUntilDestroyed(this.destroyRef)).subscribe((query) => { + if (query.state == 'error') { + this.toast.showError(query.value); } }); } - public changeUsername(): void { + public changeUsername(user: UserV2): void { const dialogRef = this.dialog.open(EditDialogComponent, { data: { confirmKey: 'ACTIONS.CHANGE', @@ -157,43 +254,45 @@ export class UserDetailComponent implements OnInit { labelKey: 'ACTIONS.NEWVALUE', titleKey: 'USER.PROFILE.CHANGEUSERNAME_TITLE', descriptionKey: 'USER.PROFILE.CHANGEUSERNAME_DESC', - value: this.user.userName, + value: user.username, }, width: '400px', }); - dialogRef.afterClosed().subscribe((resp: { value: string }) => { - if (resp.value && resp.value !== this.user.userName) { - this.mgmtUserService - .updateUserName(this.user.id, resp.value) - .then(() => { - this.toast.showInfo('USER.TOAST.USERNAMECHANGED', true); - this.refreshUser(); - }) - .catch((error) => { - this.toast.showError(error); - }); - } - }); + dialogRef + .afterClosed() + .pipe( + map(({ value }: { value?: string }) => value), + filter(Boolean), + filter((value) => user.username != value), + switchMap((username) => this.userService.updateUser({ userId: user.userId, username })), + ) + .subscribe({ + next: () => { + this.toast.showInfo('USER.TOAST.USERNAMECHANGED', true); + this.refreshChanges$.emit(); + }, + error: (error) => { + this.toast.showError(error); + }, + }); } - public unlockUser(): void { - const req = new UnlockUserRequest(); - req.setId(this.user.id); - this.mgmtUserService - .unlockUser(req) + public unlockUser(user: UserV2): void { + this.userService + .unlockUser(user.userId) .then(() => { this.toast.showInfo('USER.TOAST.UNLOCKED', true); - this.refreshUser(); + this.refreshChanges$.emit(); }) .catch((error) => { this.toast.showError(error); }); } - public generateMachineSecret(): void { - this.mgmtUserService - .generateMachineSecret(this.user.id) + public generateMachineSecret(user: UserV2): void { + this.newMgmtService + .generateMachineSecret(user.userId) .then((resp) => { this.toast.showInfo('USER.TOAST.SECRETGENERATED', true); this.dialog.open(MachineSecretDialogComponent, { @@ -203,64 +302,41 @@ export class UserDetailComponent implements OnInit { }, width: '400px', }); - this.refreshUser(); + this.refreshChanges$.emit(); }) .catch((error) => { this.toast.showError(error); }); } - public removeMachineSecret(): void { - this.mgmtUserService - .removeMachineSecret(this.user.id) - .then((resp) => { + public removeMachineSecret(user: UserV2): void { + this.newMgmtService + .removeMachineSecret(user.userId) + .then(() => { this.toast.showInfo('USER.TOAST.SECRETREMOVED', true); - this.refreshUser(); + this.refreshChanges$.emit(); }) .catch((error) => { this.toast.showError(error); }); } - public changeState(newState: UserState): void { - if (newState === UserState.USER_STATE_ACTIVE) { - this.mgmtUserService - .reactivateUser(this.user.id) + public changeState(user: UserV2, newState: UserState): void { + if (newState === UserState.ACTIVE) { + this.userService + .reactivateUser(user.userId) .then(() => { this.toast.showInfo('USER.TOAST.REACTIVATED', true); - this.user.state = newState; + this.refreshChanges$.emit(); }) .catch((error) => { this.toast.showError(error); }); - } else if (newState === UserState.USER_STATE_INACTIVE) { - this.mgmtUserService - .deactivateUser(this.user.id) + } else if (newState === UserState.INACTIVE) { + this.userService + .deactivateUser(user.userId) .then(() => { this.toast.showInfo('USER.TOAST.DEACTIVATED', true); - this.user.state = newState; - }) - .catch((error) => { - this.toast.showError(error); - }); - } - } - - public saveProfile(profileData: Profile.AsObject): void { - if (this.user.human) { - this.user.human.profile = profileData; - this.mgmtUserService - .updateHumanProfile( - this.user.id, - this.user.human.profile.firstName, - this.user.human.profile.lastName, - this.user.human.profile.nickName, - this.user.human.profile.displayName, - this.user.human.profile.preferredLanguage, - this.user.human.profile.gender, - ) - .then(() => { - this.toast.showInfo('USER.TOAST.SAVED', true); this.refreshChanges$.emit(); }) .catch((error) => { @@ -269,32 +345,48 @@ export class UserDetailComponent implements OnInit { } } - public saveMachine(machineData: Machine.AsObject): void { - if (this.user.machine) { - this.user.machine.name = machineData.name; - this.user.machine.description = machineData.description; - this.user.machine.accessTokenType = machineData.accessTokenType; - - this.mgmtUserService - .updateMachine( - this.user.id, - this.user.machine.name, - this.user.machine.description, - this.user.machine.accessTokenType, - ) - .then(() => { - this.toast.showInfo('USER.TOAST.SAVED', true); - this.refreshChanges$.emit(); - }) - .catch((error) => { - this.toast.showError(error); - }); - } + public saveProfile(user: UserV2, profile: HumanProfile): void { + this.userService + .updateUser({ + userId: user.userId, + profile: { + givenName: profile.givenName, + familyName: profile.familyName, + nickName: profile.nickName, + displayName: profile.displayName, + preferredLanguage: profile.preferredLanguage, + gender: profile.gender, + }, + }) + .then(() => { + this.toast.showInfo('USER.TOAST.SAVED', true); + this.refreshChanges$.emit(); + }) + .catch((error) => { + this.toast.showError(error); + }); } - public resendEmailVerification(): void { - this.mgmtUserService - .resendHumanEmailVerification(this.user.id) + public saveMachine(user: UserV2, form: ObservedValueOf): void { + this.newMgmtService + .updateMachine({ + userId: user.userId, + name: form.name, + description: form.description, + accessTokenType: form.accessTokenType, + }) + .then(() => { + this.toast.showInfo('USER.TOAST.SAVED', true); + this.refreshChanges$.emit(); + }) + .catch((error) => { + this.toast.showError(error); + }); + } + + public resendEmailVerification(user: UserV2): void { + this.newMgmtService + .resendHumanEmailVerification(user.userId) .then(() => { this.toast.showInfo('USER.TOAST.EMAILVERIFICATIONSENT', true); this.refreshChanges$.emit(); @@ -304,9 +396,9 @@ export class UserDetailComponent implements OnInit { }); } - public resendPhoneVerification(): void { - this.mgmtUserService - .resendHumanPhoneVerification(this.user.id) + public resendPhoneVerification(user: UserV2): void { + this.newMgmtService + .resendHumanPhoneVerification(user.userId) .then(() => { this.toast.showInfo('USER.TOAST.PHONEVERIFICATIONSENT', true); this.refreshChanges$.emit(); @@ -316,79 +408,25 @@ export class UserDetailComponent implements OnInit { }); } - public deletePhone(): void { - this.mgmtUserService - .removeHumanPhone(this.user.id) + public deletePhone(user: UserV2): void { + this.userService + .removePhone(user.userId) .then(() => { this.toast.showInfo('USER.TOAST.PHONEREMOVED', true); - if (this.user.human) { - this.user.human.phone = new Phone().setPhone('').toObject(); - this.refreshUser(); - } + this.refreshChanges$.emit(); }) .catch((error) => { this.toast.showError(error); }); } - public saveEmail(email: string, isVerified: boolean): void { - if (this.user.id && email) { - this.mgmtUserService - .updateHumanEmail(this.user.id, email, isVerified) - .then(() => { - this.toast.showInfo('USER.TOAST.EMAILSAVED', true); - if (this.user.state === UserState.USER_STATE_INITIAL) { - this.mgmtUserService - .resendHumanInitialization(this.user.id, email ?? '') - .then(() => { - this.toast.showInfo('USER.TOAST.INITEMAILSENT', true); - this.refreshChanges$.emit(); - }) - .catch((error) => { - this.toast.showError(error); - }); - } - if (this.user.human) { - this.user.human.email = new Email().setEmail(email).toObject(); - this.refreshUser(); - } - }) - .catch((error) => { - this.toast.showError(error); - }); - } - } - - public savePhone(phone: string): void { - if (this.user.id && phone) { - // Format phone before save (add +) - const formattedPhone = formatPhone(phone); - if (formattedPhone) { - phone = formattedPhone.phone; - } - - this.mgmtUserService - .updateHumanPhone(this.user.id, phone) - .then(() => { - this.toast.showInfo('USER.TOAST.PHONESAVED', true); - if (this.user.human) { - this.user.human.phone = new Phone().setPhone(phone).toObject(); - this.refreshUser(); - } - }) - .catch((error) => { - this.toast.showError(error); - }); - } - } - public navigateBack(): void { this._location.back(); } - public sendSetPasswordNotification(): void { - this.mgmtUserService - .sendHumanResetPasswordNotification(this.user.id, SendHumanResetPasswordNotificationRequest.Type.TYPE_EMAIL) + public sendSetPasswordNotification(user: UserV2): void { + this.newMgmtService + .sendHumanResetPasswordNotification(user.userId, SendHumanResetPasswordNotificationRequest_Type.EMAIL) .then(() => { this.toast.showInfo('USER.TOAST.PASSWORDNOTIFICATIONSENT', true); this.refreshChanges$.emit(); @@ -398,143 +436,189 @@ export class UserDetailComponent implements OnInit { }); } - public deleteUser(): void { - const dialogRef = this.dialog.open(WarnDialogComponent, { - data: { - confirmKey: 'ACTIONS.DELETE', - cancelKey: 'ACTIONS.CANCEL', - titleKey: 'USER.DIALOG.DELETE_TITLE', - descriptionKey: 'USER.DIALOG.DELETE_DESCRIPTION', - }, + public deleteUser(user: UserV2): void { + const data = { + confirmKey: 'ACTIONS.DELETE', + cancelKey: 'ACTIONS.CANCEL', + titleKey: 'USER.DIALOG.DELETE_TITLE', + descriptionKey: 'USER.DIALOG.DELETE_DESCRIPTION', + }; + + const dialogRef = this.dialog.open(WarnDialogComponent, { width: '400px', }); - dialogRef.afterClosed().subscribe((resp) => { - if (resp) { - this.mgmtUserService - .removeUser(this.user.id) - .then(() => { - const params: Params = { - deferredReload: true, - type: this.user.human ? 'humans' : 'machines', - }; - this.router.navigate(['/users'], { queryParams: params }); - this.toast.showInfo('USER.TOAST.DELETED', true); - }) - .catch((error) => { - this.toast.showError(error); - }); - } - }); + dialogRef + .afterClosed() + .pipe( + filter(Boolean), + switchMap(() => this.userService.deleteUser(user.userId)), + ) + .subscribe({ + next: () => { + const params: Params = { + deferredReload: true, + type: user.type.case === 'human' ? 'humans' : 'machines', + }; + this.router.navigate(['/users'], { queryParams: params }).then(); + this.toast.showInfo('USER.TOAST.DELETED', true); + }, + error: (error) => this.toast.showError(error), + }); } - public resendInitEmail(): void { - const dialogRef = this.dialog.open(ResendEmailDialogComponent, { - width: '400px', - data: { - email: this.user.human?.email?.email ?? '', + public resendInitEmail(user: UserV2): void { + const dialogRef = this.dialog.open( + ResendEmailDialogComponent, + { + width: '400px', + data: { + email: user.type.case === 'human' ? (user.type.value.email?.email ?? '') : '', + }, }, - }); + ); - dialogRef.afterClosed().subscribe((resp) => { - if (resp.send && this.user.id) { - this.mgmtUserService - .resendHumanInitialization(this.user.id, resp.email ?? '') - .then(() => { - this.toast.showInfo('USER.TOAST.INITEMAILSENT', true); - this.refreshChanges$.emit(); - }) - .catch((error) => { - this.toast.showError(error); - }); - } - }); + dialogRef + .afterClosed() + .pipe( + filter((resp): resp is { send: true; email: string } => !!resp?.send && !!user.userId), + switchMap(({ email }) => this.newMgmtService.resendHumanInitialization(user.userId, email)), + ) + .subscribe({ + next: () => { + this.toast.showInfo('USER.TOAST.INITEMAILSENT', true); + this.refreshChanges$.emit(); + }, + error: (error) => this.toast.showError(error), + }); } - public openEditDialog(type: EditDialogType): void { + public openEditDialog(user: UserWithHumanType, type: EditDialogType): void { switch (type) { case EditDialogType.PHONE: - const dialogRefPhone = this.dialog.open(EditDialogComponent, { - data: { - confirmKey: 'ACTIONS.SAVE', - cancelKey: 'ACTIONS.CANCEL', - labelKey: 'ACTIONS.NEWVALUE', - titleKey: 'USER.LOGINMETHODS.PHONE.EDITTITLE', - descriptionKey: 'USER.LOGINMETHODS.PHONE.EDITDESC', - value: this.user.human?.phone?.phone, - type: EditDialogType.PHONE, - validator: Validators.compose([phoneValidator, requiredValidator]), - }, - width: '400px', - }); - - dialogRefPhone.afterClosed().subscribe((resp: { value: string; isVerified: boolean }) => { - if (resp && resp.value) { - this.savePhone(resp.value); - } - }); - break; + this.openEditPhoneDialog(user); + return; case EditDialogType.EMAIL: - const dialogRefEmail = this.dialog.open(EditDialogComponent, { - data: { - confirmKey: 'ACTIONS.SAVE', - cancelKey: 'ACTIONS.CANCEL', - labelKey: 'ACTIONS.NEWVALUE', - titleKey: 'USER.LOGINMETHODS.EMAIL.EDITTITLE', - descriptionKey: 'USER.LOGINMETHODS.EMAIL.EDITDESC', - isVerifiedTextKey: 'USER.LOGINMETHODS.EMAIL.ISVERIFIED', - isVerifiedTextDescKey: 'USER.LOGINMETHODS.EMAIL.ISVERIFIEDDESC', - value: this.user.human?.email?.email, - type: EditDialogType.EMAIL, - }, - width: '400px', - }); - - dialogRefEmail.afterClosed().subscribe((resp: { value: string; isVerified: boolean }) => { - if (resp && resp.value) { - this.saveEmail(resp.value, resp.isVerified); - } - }); - break; + this.openEditEmailDialog(user); + return; } } - public loadMetadata(id: string): Promise | void { - this.loadingMetadata = true; - return this.mgmtUserService - .listUserMetadata(id) - .then((resp) => { - this.loadingMetadata = false; - this.metadata = resp.resultList.map((md) => { - return { - key: md.key, - value: Buffer.from(md.value as string, 'base64').toString('utf-8'), - }; - }); - }) - .catch((error) => { - this.loadingMetadata = false; - this.toast.showError(error); + private openEditEmailDialog(user: UserWithHumanType) { + const data: EditDialogData = { + confirmKey: 'ACTIONS.SAVE', + cancelKey: 'ACTIONS.CANCEL', + labelKey: 'ACTIONS.NEWVALUE', + titleKey: 'USER.LOGINMETHODS.EMAIL.EDITTITLE', + descriptionKey: 'USER.LOGINMETHODS.EMAIL.EDITDESC', + isVerifiedTextKey: 'USER.LOGINMETHODS.EMAIL.ISVERIFIED', + isVerifiedTextDescKey: 'USER.LOGINMETHODS.EMAIL.ISVERIFIEDDESC', + value: user.type.value?.email?.email, + type: EditDialogType.EMAIL, + } as const; + + const dialogRefEmail = this.dialog.open(EditDialogComponent, { + data, + width: '400px', + }); + + dialogRefEmail + .afterClosed() + .pipe( + filter((resp): resp is Required => !!resp?.value), + switchMap(({ value, isVerified }) => + this.userService.setEmail({ + userId: user.userId, + email: value, + verification: isVerified ? { case: 'isVerified', value: isVerified } : { case: undefined }, + }), + ), + switchMap(() => { + this.toast.showInfo('USER.TOAST.EMAILSAVED', true); + this.refreshChanges$.emit(); + if (user.state !== UserState.INITIAL) { + return EMPTY; + } + return this.userService.resendInviteCode(user.userId); + }), + ) + .subscribe({ + next: () => this.toast.showInfo('USER.TOAST.INITEMAILSENT', true), + error: (error) => this.toast.showError(error), }); } - public editMetadata(): void { - if (this.user) { - const setFcn = (key: string, value: string): Promise => - this.mgmtUserService.setUserMetadata(key, Buffer.from(value).toString('base64'), this.user.id); - const removeFcn = (key: string): Promise => this.mgmtUserService.removeUserMetadata(key, this.user.id); + private openEditPhoneDialog(user: UserWithHumanType) { + const data = { + confirmKey: 'ACTIONS.SAVE', + cancelKey: 'ACTIONS.CANCEL', + labelKey: 'ACTIONS.NEWVALUE', + titleKey: 'USER.LOGINMETHODS.PHONE.EDITTITLE', + descriptionKey: 'USER.LOGINMETHODS.PHONE.EDITDESC', + value: user.type.value.phone?.phone, + type: EditDialogType.PHONE, + validator: Validators.compose([phoneValidator, requiredValidator]), + }; + const dialogRefPhone = this.dialog.open( + EditDialogComponent, + { data, width: '400px' }, + ); - const dialogRef = this.dialog.open(MetadataDialogComponent, { - data: { - metadata: this.metadata, - setFcn: setFcn, - removeFcn: removeFcn, + dialogRefPhone + .afterClosed() + .pipe( + map((resp) => formatPhone(resp?.value)), + filter(Boolean), + switchMap(({ phone }) => this.userService.setPhone({ userId: user.userId, phone })), + ) + .subscribe({ + next: () => { + this.toast.showInfo('USER.TOAST.PHONESAVED', true); + this.refreshChanges$.emit(); + }, + error: (error) => { + this.toast.showError(error); }, }); + } - dialogRef.afterClosed().subscribe(() => { - this.loadMetadata(this.user.id); + private getMetadataById(userId: string): Observable { + return defer(() => this.newMgmtService.listUserMetadata(userId)).pipe( + map((metadata) => ({ state: 'success', value: metadata.result }) as const), + startWith({ state: 'loading', value: [] as Metadata[] } as const), + catchError((err) => of({ state: 'error', value: err.message ?? '' } as const)), + ); + } + + public editMetadata(user: UserV2, metadata: Metadata[]): void { + const setFcn = (key: string, value: string) => + this.newMgmtService.setUserMetadata({ + key, + value: Buffer.from(value), + id: user.userId, }); + const removeFcn = (key: string): Promise => this.newMgmtService.removeUserMetadata({ key, id: user.userId }); + + const dialogRef = this.dialog.open(MetadataDialogComponent, { + data: { + metadata: [...metadata], + setFcn: setFcn, + removeFcn: removeFcn, + }, + }); + + dialogRef + .afterClosed() + .pipe(takeUntilDestroyed(this.destroyRef)) + .subscribe(() => { + this.refreshMetadata$.next(true); + }); + } + + public humanUser(user: UserV2): UserWithHumanType | undefined { + if (user.type.case === 'human') { + return { ...user, type: user.type }; } + return undefined; } } diff --git a/console/src/app/pages/users/user-detail/user-detail/user-mfa/user-mfa.component.html b/console/src/app/pages/users/user-detail/user-detail/user-mfa/user-mfa.component.html index a6d0bf652f..eca556e91d 100644 --- a/console/src/app/pages/users/user-detail/user-detail/user-mfa/user-mfa.component.html +++ b/console/src/app/pages/users/user-detail/user-detail/user-mfa/user-mfa.component.html @@ -1,8 +1,12 @@ - + - +
@@ -40,8 +44,8 @@ {{ 'USER.MFA.STATE.' + mfa.state | translate }} @@ -58,7 +62,7 @@ matTooltip="{{ 'ACTIONS.REMOVE' | translate }}" color="warn" mat-icon-button - (click)="deleteMFA(mfa)" + (click)="deleteMFA(mfaQuery.user, mfa)" > @@ -69,13 +73,13 @@
{{ 'USER.MFA.TABLETYPE' | translate }} - TOTP (Time-based One-Time Password) - U2F (Universal 2nd Factor) - One-Time Password SMS - One-Time Password Email + TOTP (Time-based One-Time Password) + U2F (Universal 2nd Factor) + One-Time Password SMS + One-Time Password Email {{ 'USER.MFA.NAME' | translate }} - - {{ mfa.u2f.name }} + + {{ mfa.type.value.name }}
-
+
{{ 'USER.MFA.EMPTY' | translate }}
- diff --git a/console/src/app/pages/users/user-detail/user-detail/user-mfa/user-mfa.component.ts b/console/src/app/pages/users/user-detail/user-detail/user-mfa/user-mfa.component.ts index 106c6697d0..1a0bbf0ae1 100644 --- a/console/src/app/pages/users/user-detail/user-detail/user-mfa/user-mfa.component.ts +++ b/console/src/app/pages/users/user-detail/user-detail/user-mfa/user-mfa.component.ts @@ -1,65 +1,104 @@ -import { Component, Input, OnDestroy, OnInit, ViewChild } from '@angular/core'; +import { Component, Input, ViewChild } from '@angular/core'; import { MatDialog } from '@angular/material/dialog'; import { MatSort } from '@angular/material/sort'; -import { MatTable, MatTableDataSource } from '@angular/material/table'; -import { BehaviorSubject, Observable } from 'rxjs'; +import { MatTableDataSource } from '@angular/material/table'; +import { combineLatestWith, defer, EMPTY, Observable, ReplaySubject, Subject, switchMap } from 'rxjs'; import { WarnDialogComponent } from 'src/app/modules/warn-dialog/warn-dialog.component'; -import { AuthFactor, AuthFactorState, User } from 'src/app/proto/generated/zitadel/user_pb'; -import { ManagementService } from 'src/app/services/mgmt.service'; import { ToastService } from 'src/app/services/toast.service'; +import { UserService } from 'src/app/services/user.service'; +import { AuthFactor, AuthFactorState, User } from '@zitadel/proto/zitadel/user/v2/user_pb'; +import { catchError, filter, map, startWith } from 'rxjs/operators'; +import { pairwiseStartWith } from 'src/app/utils/pairwiseStartWith'; export interface MFAItem { name: string; verified: boolean; } +type MFAQuery = + | { state: 'success'; value: MatTableDataSource; user: User } + | { state: 'loading'; value: MatTableDataSource; user: User }; + @Component({ selector: 'cnsl-user-mfa', templateUrl: './user-mfa.component.html', styleUrls: ['./user-mfa.component.scss'], }) -export class UserMfaComponent implements OnInit, OnDestroy { - public displayedColumns: string[] = ['type', 'name', 'state', 'actions']; - @Input() public user!: User.AsObject; - public mfaSubject: BehaviorSubject = new BehaviorSubject([]); - private loadingSubject: BehaviorSubject = new BehaviorSubject(false); - public loading$: Observable = this.loadingSubject.asObservable(); +export class UserMfaComponent { + @Input({ required: true }) public set user(user: User) { + this.user$.next(user); + } - @ViewChild(MatTable) public table!: MatTable; @ViewChild(MatSort) public sort!: MatSort; - public dataSource: MatTableDataSource = new MatTableDataSource([]); + public dataSource = new MatTableDataSource([]); - public AuthFactorState: any = AuthFactorState; + public displayedColumns: string[] = ['type', 'name', 'state', 'actions']; + private user$ = new ReplaySubject(1); + public mfaQuery$: Observable; + public refresh$ = new Subject(); + public AuthFactorState = AuthFactorState; - public error: string = ''; constructor( - private mgmtUserService: ManagementService, - private dialog: MatDialog, - private toast: ToastService, - ) {} - - public ngOnInit(): void { - this.getMFAs(); + private readonly dialog: MatDialog, + private readonly toast: ToastService, + private readonly userService: UserService, + ) { + this.mfaQuery$ = this.user$.pipe( + combineLatestWith(this.refresh$.pipe(startWith(true))), + switchMap(([user]) => this.listAuthenticationFactors(user)), + pairwiseStartWith(undefined), + map(([prev, curr]) => { + if (prev?.state === 'success' && curr.state === 'loading') { + return { ...prev, state: 'loading' } as const; + } + return curr; + }), + catchError((error) => { + this.toast.showError(error); + return EMPTY; + }), + ); } - ngOnDestroy(): void { - this.mfaSubject.complete(); - this.loadingSubject.complete(); + private listAuthenticationFactors(user: User): Observable { + return defer(() => this.userService.listAuthenticationFactors({ userId: user.userId })).pipe( + map( + ({ result }) => + ({ + state: 'success', + value: new MatTableDataSource(result), + user, + }) as const, + ), + startWith({ + state: 'loading', + value: new MatTableDataSource([]), + user, + } as const), + ); } - public getMFAs(): void { - this.mgmtUserService - .listHumanMultiFactors(this.user.id) - .then((mfas) => { - this.dataSource = new MatTableDataSource(mfas.resultList); - this.dataSource.sort = this.sort; - }) - .catch((error) => { - this.error = error.message; - }); + private async removeTOTP(user: User) { + await this.userService.removeTOTP(user.userId); + return ['USER.TOAST.OTPREMOVED', 'otp'] as const; } - public deleteMFA(factor: AuthFactor.AsObject): void { + private async removeU2F(user: User, u2fId: string) { + await this.userService.removeU2F(user.userId, u2fId); + return ['USER.TOAST.U2FREMOVED', 'u2f'] as const; + } + + private async removeOTPEmail(user: User) { + await this.userService.removeOTPEmail(user.userId); + return ['USER.TOAST.OTPREMOVED', 'otpEmail'] as const; + } + + private async removeOTPSMS(user: User) { + await this.userService.removeOTPSMS(user.userId); + return ['USER.TOAST.OTPREMOVED', 'otpSms'] as const; + } + + public deleteMFA(user: User, factor: AuthFactor): void { const dialogRef = this.dialog.open(WarnDialogComponent, { data: { confirmKey: 'ACTIONS.DELETE', @@ -70,70 +109,35 @@ export class UserMfaComponent implements OnInit, OnDestroy { width: '400px', }); - dialogRef.afterClosed().subscribe((resp) => { - if (resp) { - if (factor.otp) { - this.mgmtUserService - .removeHumanMultiFactorOTP(this.user.id) - .then(() => { - this.toast.showInfo('USER.TOAST.OTPREMOVED', true); - - const index = this.dataSource.data.findIndex((mfa) => !!mfa.otp); - if (index > -1) { - this.dataSource.data.splice(index, 1); - } - this.getMFAs(); - }) - .catch((error) => { - this.toast.showError(error); - }); - } else if (factor.u2f) { - this.mgmtUserService - .removeHumanAuthFactorU2F(this.user.id, factor.u2f.id) - .then(() => { - this.toast.showInfo('USER.TOAST.U2FREMOVED', true); - - const index = this.dataSource.data.findIndex((mfa) => !!mfa.u2f); - if (index > -1) { - this.dataSource.data.splice(index, 1); - } - this.getMFAs(); - }) - .catch((error) => { - this.toast.showError(error); - }); - } else if (factor.otpEmail) { - this.mgmtUserService - .removeHumanAuthFactorOTPEmail(this.user.id) - .then(() => { - this.toast.showInfo('USER.TOAST.OTPREMOVED', true); - - const index = this.dataSource.data.findIndex((mfa) => !!mfa.otpEmail); - if (index > -1) { - this.dataSource.data.splice(index, 1); - } - this.getMFAs(); - }) - .catch((error) => { - this.toast.showError(error); - }); - } else if (factor.otpSms) { - this.mgmtUserService - .removeHumanAuthFactorOTPSMS(this.user.id) - .then(() => { - this.toast.showInfo('USER.TOAST.OTPREMOVED', true); - - const index = this.dataSource.data.findIndex((mfa) => !!mfa.otpSms); - if (index > -1) { - this.dataSource.data.splice(index, 1); - } - this.getMFAs(); - }) - .catch((error) => { - this.toast.showError(error); - }); - } - } - }); + dialogRef + .afterClosed() + .pipe( + filter(Boolean), + switchMap(() => { + switch (factor.type.case) { + case 'otp': + return this.removeTOTP(user); + case 'u2f': + return this.removeU2F(user, factor.type.value.id); + case 'otpEmail': + return this.removeOTPEmail(user); + case 'otpSms': + return this.removeOTPSMS(user); + default: + throw new Error('Unknown MFA type'); + } + }), + ) + .subscribe({ + next: ([translation, caseId]) => { + this.toast.showInfo(translation, true); + const index = this.dataSource.data.findIndex((mfa) => mfa.type.case === caseId); + if (index > -1) { + this.dataSource.data.splice(index, 1); + } + this.refresh$.next(true); + }, + error: (error) => this.toast.showError(error), + }); } } diff --git a/console/src/app/pages/users/user-list/user-table/user-table.component.html b/console/src/app/pages/users/user-list/user-table/user-table.component.html index cc81a4d4c0..c40127dcc2 100644 --- a/console/src/app/pages/users/user-list/user-table/user-table.component.html +++ b/console/src/app/pages/users/user-list/user-table/user-table.component.html @@ -11,21 +11,20 @@

{{ - (type === Type.TYPE_HUMAN ? 'DESCRIPTIONS.USERS.HUMANS.DESCRIPTION' : 'DESCRIPTIONS.USERS.MACHINES.DESCRIPTION') - | translate + (type === Type.HUMAN ? 'DESCRIPTIONS.USERS.HUMANS.DESCRIPTION' : 'DESCRIPTIONS.USERS.MACHINES.DESCRIPTION') | translate }}

@@ -66,7 +65,7 @@ >
@@ -115,10 +114,10 @@ [checked]="selection.isSelected(user)" > @@ -142,9 +141,9 @@ > {{ 'USER.PROFILE.DISPLAYNAME' | translate }} - - {{ user.human.profile?.displayName }} - {{ user.machine.name }} + + {{ user.type.value?.profile?.displayName }} + {{ user.type.value.name }} @@ -157,8 +156,8 @@ > {{ 'USER.PROFILE.PREFERREDLOGINNAME' | translate }} - - {{ user.preferredLoginName }} + + {{ user.preferredLoginName }} @@ -171,8 +170,8 @@ > {{ 'USER.PROFILE.USERNAME' | translate }} - - {{ user.userName }} + + {{ user.username }} @@ -185,36 +184,36 @@ > {{ 'USER.EMAIL' | translate }} - - {{ user.human?.email.email }} + + {{ user.type.value.email.email }} {{ 'USER.DATA.STATE' | translate }} - + - {{ 'USER.DATA.STATE' + user.state | translate }} + {{ 'USER.STATEV2.' + user.state | translate }} {{ 'USER.TABLE.CREATIONDATE' | translate }} - + {{ user.details.creationDate | timestampToDate | localizedDate: 'regular' }} {{ 'USER.TABLE.CHANGEDATE' | translate }} - + {{ user.details.changeDate | timestampToDate | localizedDate: 'regular' }} @@ -242,11 +241,11 @@ - +
@@ -258,7 +257,6 @@ = of(false); @Input() public canDelete$: Observable = of(false); + private user: Signal = toSignal(this.authService.user, { requireSync: true }); + @ViewChild(PaginatorComponent) public paginator!: PaginatorComponent; @ViewChild(MatSort) public sort!: MatSort; public INITIAL_PAGE_SIZE: number = 20; - public viewTimestamp!: Timestamp.AsObject; + public viewTimestamp!: Timestamp; public totalResult: number = 0; - public dataSource: MatTableDataSource = new MatTableDataSource(); - public selection: SelectionModel = new SelectionModel(true, []); + public dataSource: MatTableDataSource = new MatTableDataSource(); + public selection: SelectionModel = new SelectionModel(true, []); private loadingSubject: BehaviorSubject = new BehaviorSubject(false); public loading$: Observable = this.loadingSubject.asObservable(); @Input() public displayedColumnsHuman: string[] = [ @@ -70,7 +76,7 @@ export class UserTableComponent implements OnInit { 'actions', ]; - @Output() public changedSelection: EventEmitter> = new EventEmitter(); + @Output() public changedSelection: EventEmitter> = new EventEmitter(); public UserState: any = UserState; public UserListSearchKey: any = UserListSearchKey; @@ -83,7 +89,7 @@ export class UserTableComponent implements OnInit { private router: Router, public translate: TranslateService, private authService: GrpcAuthService, - private userService: ManagementService, + private userService: UserService, private toast: ToastService, private dialog: MatDialog, private route: ActivatedRoute, @@ -97,12 +103,12 @@ export class UserTableComponent implements OnInit { ngOnInit(): void { this.route.queryParams.pipe(take(1)).subscribe((params) => { if (!params['filter']) { - this.getData(this.INITIAL_PAGE_SIZE, 0, this.type, this.searchQueries); + this.getData(this.INITIAL_PAGE_SIZE, 0, this.type, this.searchQueries).then(); } if (params['deferredReload']) { setTimeout(() => { - this.getData(this.paginator.pageSize, this.paginator.pageIndex * this.paginator.pageSize, this.type); + this.getData(this.paginator.pageSize, this.paginator.pageIndex * this.paginator.pageSize, this.type).then(); }, 2000); } }); @@ -110,16 +116,23 @@ export class UserTableComponent implements OnInit { public setType(type: Type): void { this.type = type; - this.router.navigate([], { - relativeTo: this.route, - queryParams: { - type: type === Type.TYPE_HUMAN ? 'human' : type === Type.TYPE_MACHINE ? 'machine' : 'human', - }, - replaceUrl: true, - queryParamsHandling: 'merge', - skipLocationChange: false, - }); - this.getData(this.paginator.pageSize, this.paginator.pageIndex * this.paginator.pageSize, this.type, this.searchQueries); + this.router + .navigate([], { + relativeTo: this.route, + queryParams: { + type: type === Type.HUMAN ? 'human' : type === Type.MACHINE ? 'machine' : 'human', + }, + replaceUrl: true, + queryParamsHandling: 'merge', + skipLocationChange: false, + }) + .then(); + this.getData( + this.paginator.pageSize, + this.paginator.pageIndex * this.paginator.pageSize, + this.type, + this.searchQueries, + ).then(); } public isAllSelected(): boolean { @@ -134,17 +147,17 @@ export class UserTableComponent implements OnInit { public changePage(event: PageEvent): void { this.selection.clear(); - this.getData(event.pageSize, event.pageIndex * event.pageSize, this.type, this.searchQueries); + this.getData(event.pageSize, event.pageIndex * event.pageSize, this.type, this.searchQueries).then(); } public deactivateSelectedUsers(): void { - Promise.all( - this.selection.selected - .filter((u) => u.state === UserState.USER_STATE_ACTIVE) - .map((value) => { - return this.userService.deactivateUser(value.id); - }), - ) + const usersToDeactivate = this.selection.selected + .filter((u) => u.state === UserState.ACTIVE) + .map((value) => { + return this.userService.deactivateUser(value.userId); + }); + + Promise.all(usersToDeactivate) .then(() => { this.toast.showInfo('USER.TOAST.SELECTEDDEACTIVATED', true); this.selection.clear(); @@ -158,13 +171,13 @@ export class UserTableComponent implements OnInit { } public reactivateSelectedUsers(): void { - Promise.all( - this.selection.selected - .filter((u) => u.state === UserState.USER_STATE_INACTIVE) - .map((value) => { - return this.userService.reactivateUser(value.id); - }), - ) + const usersToReactivate = this.selection.selected + .filter((u) => u.state === UserState.INACTIVE) + .map((value) => { + return this.userService.reactivateUser(value.userId); + }); + + Promise.all(usersToReactivate) .then(() => { this.toast.showInfo('USER.TOAST.SELECTEDREACTIVATED', true); this.selection.clear(); @@ -177,39 +190,43 @@ export class UserTableComponent implements OnInit { }); } - public gotoRouterLink(rL: any): void { - this.router.navigate(rL); + public gotoRouterLink(rL: any): Promise { + return this.router.navigate(rL); } private async getData(limit: number, offset: number, type: Type, searchQueries?: SearchQuery[]): Promise { this.loadingSubject.next(true); - let queryT = new SearchQuery(); - const typeQuery = new TypeQuery(); - typeQuery.setType(type); - queryT.setTypeQuery(typeQuery); + let queryT = create(SearchQuerySchema, { + query: { + case: 'typeQuery', + value: { + type, + }, + }, + }); let sortingField: UserFieldName | undefined = undefined; if (this.sort?.active && this.sort?.direction) switch (this.sort.active) { case 'displayName': - sortingField = UserFieldName.USER_FIELD_NAME_DISPLAY_NAME; + sortingField = UserFieldName.DISPLAY_NAME; break; case 'username': - sortingField = UserFieldName.USER_FIELD_NAME_USER_NAME; + sortingField = UserFieldName.USER_NAME; break; case 'preferredLoginName': // TODO: replace with preferred username sorting once implemented - sortingField = UserFieldName.USER_FIELD_NAME_USER_NAME; + sortingField = UserFieldName.USER_NAME; break; case 'email': - sortingField = UserFieldName.USER_FIELD_NAME_EMAIL; + sortingField = UserFieldName.EMAIL; break; case 'state': - sortingField = UserFieldName.USER_FIELD_NAME_STATE; + sortingField = UserFieldName.STATE; break; case 'creationDate': - sortingField = UserFieldName.USER_FIELD_NAME_CREATION_DATE; + sortingField = UserFieldName.CREATION_DATE; break; } @@ -223,14 +240,14 @@ export class UserTableComponent implements OnInit { ) .then((resp) => { if (resp.details?.totalResult) { - this.totalResult = resp.details?.totalResult; + this.totalResult = Number(resp.details.totalResult); } else { this.totalResult = 0; } - if (resp.details?.viewTimestamp) { - this.viewTimestamp = resp.details?.viewTimestamp; + if (resp.details?.timestamp) { + this.viewTimestamp = resp.details?.timestamp; } - this.dataSource.data = resp.resultList; + this.dataSource.data = resp.result; this.loadingSubject.next(false); }) .catch((error) => { @@ -240,15 +257,20 @@ export class UserTableComponent implements OnInit { } public refreshPage(): void { - this.getData(this.paginator.pageSize, this.paginator.pageIndex * this.paginator.pageSize, this.type, this.searchQueries); + this.getData( + this.paginator.pageSize, + this.paginator.pageIndex * this.paginator.pageSize, + this.type, + this.searchQueries, + ).then(); } public sortChange(sortState: Sort) { if (sortState.direction && sortState.active) { - this._liveAnnouncer.announce(`Sorted ${sortState.direction} ending`); + this._liveAnnouncer.announce(`Sorted ${sortState.direction} ending`).then(); this.refreshPage(); } else { - this._liveAnnouncer.announce('Sorting cleared'); + this._liveAnnouncer.announce('Sorting cleared').then(); } } @@ -260,10 +282,10 @@ export class UserTableComponent implements OnInit { this.paginator ? this.paginator.pageIndex * this.paginator.pageSize : 0, this.type, searchQueries, - ); + ).then(); } - public deleteUser(user: User.AsObject): void { + public deleteUser(user: UserV2): void { const authUserData = { confirmKey: 'ACTIONS.DELETE', cancelKey: 'ACTIONS.CANCEL', @@ -286,9 +308,9 @@ export class UserTableComponent implements OnInit { confirmation: user.preferredLoginName, }; - if (user && user.id) { - const authUser = this.authService.userSubject.getValue(); - const isMe = authUser?.id === user.id; + if (user?.userId) { + const authUser = this.user(); + const isMe = authUser?.id === user.userId; let dialogRef; @@ -307,7 +329,7 @@ export class UserTableComponent implements OnInit { dialogRef.afterClosed().subscribe((resp) => { if (resp) { this.userService - .removeUser(user.id) + .deleteUser(user.userId) .then(() => { setTimeout(() => { this.refreshPage(); @@ -325,11 +347,11 @@ export class UserTableComponent implements OnInit { public get multipleActivatePossible(): boolean { const selected = this.selection.selected; - return selected ? selected.findIndex((user) => user.state !== UserState.USER_STATE_ACTIVE) > -1 : false; + return selected ? selected.findIndex((user) => user.state !== UserState.ACTIVE) > -1 : false; } public get multipleDeactivatePossible(): boolean { const selected = this.selection.selected; - return selected ? selected.findIndex((user) => user.state !== UserState.USER_STATE_INACTIVE) > -1 : false; + return selected ? selected.findIndex((user) => user.state !== UserState.INACTIVE) > -1 : false; } } diff --git a/console/src/app/pipes/timestamp-to-date-pipe/timestamp-to-date.pipe.ts b/console/src/app/pipes/timestamp-to-date-pipe/timestamp-to-date.pipe.ts index 19fe058c34..8ec703230d 100644 --- a/console/src/app/pipes/timestamp-to-date-pipe/timestamp-to-date.pipe.ts +++ b/console/src/app/pipes/timestamp-to-date-pipe/timestamp-to-date.pipe.ts @@ -1,18 +1,18 @@ import { Pipe, PipeTransform } from '@angular/core'; -import { Timestamp } from 'google-protobuf/google/protobuf/timestamp_pb'; +import { Timestamp as ConnectTimestamp } from '@bufbuild/protobuf/wkt'; +import { Timestamp } from 'src/app/proto/generated/google/protobuf/timestamp_pb'; @Pipe({ name: 'timestampToDate', }) export class TimestampToDatePipe implements PipeTransform { - transform(value: Timestamp.AsObject, ...args: unknown[]): unknown { + transform(value: ConnectTimestamp | Timestamp.AsObject, ...args: unknown[]): unknown { return this.dateFromTimestamp(value); } - private dateFromTimestamp(date: Timestamp.AsObject): any { + private dateFromTimestamp(date: ConnectTimestamp | Timestamp.AsObject): any { if (date?.seconds !== undefined && date?.nanos !== undefined) { - const ts: Date = new Date(date.seconds * 1000 + date.nanos / 1000 / 1000); - return ts; + return new Date(Number(date.seconds) * 1000 + date.nanos / 1000 / 1000); } } } diff --git a/console/src/app/services/feature.service.ts b/console/src/app/services/feature.service.ts index b991971bba..f009f165d4 100644 --- a/console/src/app/services/feature.service.ts +++ b/console/src/app/services/feature.service.ts @@ -1,19 +1,19 @@ import { Injectable } from '@angular/core'; import { GrpcService } from './grpc.service'; -import { - GetInstanceFeaturesRequest, - GetInstanceFeaturesResponse, - ResetInstanceFeaturesRequest, - SetInstanceFeaturesRequest, - SetInstanceFeaturesResponse, -} from '../proto/generated/zitadel/feature/v2beta/instance_pb'; import { GetOrganizationFeaturesRequest, GetOrganizationFeaturesResponse, } from '../proto/generated/zitadel/feature/v2beta/organization_pb'; import { GetUserFeaturesRequest, GetUserFeaturesResponse } from '../proto/generated/zitadel/feature/v2beta/user_pb'; import { GetSystemFeaturesRequest, GetSystemFeaturesResponse } from '../proto/generated/zitadel/feature/v2beta/system_pb'; +import { + GetInstanceFeaturesRequest, + GetInstanceFeaturesResponse, + ResetInstanceFeaturesRequest, + SetInstanceFeaturesRequest, + SetInstanceFeaturesResponse, +} from '../proto/generated/zitadel/feature/v2/instance_pb'; @Injectable({ providedIn: 'root', diff --git a/console/src/app/services/grpc-auth.service.ts b/console/src/app/services/grpc-auth.service.ts index 24feee0ad1..131d1c35a0 100644 --- a/console/src/app/services/grpc-auth.service.ts +++ b/console/src/app/services/grpc-auth.service.ts @@ -1,8 +1,22 @@ import { Injectable } from '@angular/core'; import { SortDirection } from '@angular/material/sort'; import { OAuthService } from 'angular-oauth2-oidc'; -import { BehaviorSubject, forkJoin, from, Observable, of, Subject } from 'rxjs'; -import { catchError, distinctUntilChanged, filter, finalize, map, switchMap, timeout, withLatestFrom } from 'rxjs/operators'; +import { + BehaviorSubject, + combineLatestWith, + defer, + distinctUntilKeyChanged, + EMPTY, + forkJoin, + mergeWith, + NEVER, + Observable, + of, + shareReplay, + Subject, + TimeoutError, +} from 'rxjs'; +import { catchError, distinctUntilChanged, filter, finalize, map, startWith, switchMap, tap, timeout } from 'rxjs/operators'; import { AddMyAuthFactorOTPEmailRequest, @@ -110,41 +124,17 @@ const ORG_LIMIT = 10; }) export class GrpcAuthService { private _activeOrgChanged: Subject = new Subject(); - public user!: Observable; - public userSubject: BehaviorSubject = new BehaviorSubject(undefined); + public user: Observable; private triggerPermissionsRefresh: Subject = new Subject(); - public zitadelPermissions$: Observable = this.triggerPermissionsRefresh.pipe( - switchMap(() => - from(this.listMyZitadelPermissions()).pipe( - map((rolesResp) => rolesResp.resultList), - filter((roles) => !!roles.length), - catchError((_) => { - return of([]); - }), - distinctUntilChanged((a, b) => { - return JSON.stringify(a.sort()) === JSON.stringify(b.sort()); - }), - finalize(() => { - this.fetchedZitadelPermissions.next(true); - }), - ), - ), - ); + public zitadelPermissions: Observable; public labelpolicy$!: Observable; - public labelpolicy: BehaviorSubject = new BehaviorSubject< - LabelPolicy.AsObject | undefined - >(undefined); labelPolicyLoading$: BehaviorSubject = new BehaviorSubject(true); - public privacypolicy$!: Observable; + public privacypolicy$: Observable; public privacypolicy: BehaviorSubject = new BehaviorSubject< PrivacyPolicy.AsObject | undefined >(undefined); - privacyPolicyLoading$: BehaviorSubject = new BehaviorSubject(true); - - public zitadelPermissions: BehaviorSubject = new BehaviorSubject([]); - public readonly fetchedZitadelPermissions: BehaviorSubject = new BehaviorSubject(false); public cachedOrgs: BehaviorSubject = new BehaviorSubject([]); private cachedLabelPolicies: { [orgId: string]: LabelPolicy.AsObject } = {}; @@ -155,74 +145,63 @@ export class GrpcAuthService { private oauthService: OAuthService, private storage: StorageService, ) { - this.zitadelPermissions$.subscribe(this.zitadelPermissions); - this.labelpolicy$ = this.activeOrgChanged.pipe( - switchMap((org) => { - this.labelPolicyLoading$.next(true); - return from(this.getMyLabelPolicy(org ? org.id : '')); - }), + tap(() => this.labelPolicyLoading$.next(true)), + switchMap((org) => this.getMyLabelPolicy(org ? org.id : '')), + tap(() => this.labelPolicyLoading$.next(false)), + finalize(() => this.labelPolicyLoading$.next(false)), filter((policy) => !!policy), + shareReplay({ refCount: true, bufferSize: 1 }), ); - this.labelpolicy$.subscribe({ - next: (policy) => { - this.labelpolicy.next(policy); - this.labelPolicyLoading$.next(false); - }, - error: (error) => { - console.error(error); - this.labelPolicyLoading$.next(false); - }, - }); - this.privacypolicy$ = this.activeOrgChanged.pipe( - switchMap((org) => { - this.privacyPolicyLoading$.next(true); - return from(this.getMyPrivacyPolicy(org ? org.id : '')); - }), + switchMap((org) => this.getMyPrivacyPolicy(org ? org.id : '')), filter((policy) => !!policy), + catchError((err) => { + console.error(err); + return EMPTY; + }), + shareReplay({ refCount: true, bufferSize: 1 }), ); - this.privacypolicy$.subscribe({ - next: (policy) => { - this.privacypolicy.next(policy); - this.privacyPolicyLoading$.next(false); - }, - error: (error) => { - console.error(error); - this.privacyPolicyLoading$.next(false); - }, - }); - this.user = forkJoin([ - of(this.oauthService.getAccessToken()), + defer(() => of(this.oauthService.getAccessToken())), this.oauthService.events.pipe( filter((e) => e.type === 'token_received'), - timeout(this.oauthService.waitForTokenInMsec || 0), - catchError((_) => of(null)), // timeout is not an error + timeout(this.oauthService.waitForTokenInMsec ?? 0), + catchError((err) => { + if (err instanceof TimeoutError) { + return of(null); + } + throw err; + }), // timeout is not an error map((_) => this.oauthService.getAccessToken()), ), ]).pipe( - filter((token) => (token ? true : false)), - distinctUntilChanged(), - switchMap(() => { - return from( - this.getMyUser().then((resp) => { - return resp.user; - }), - ); - }), - finalize(() => { - this.loadPermissions(); - }), + filter(([_, token]) => !!token), + distinctUntilKeyChanged(1), + switchMap(() => this.getMyUser().then((resp) => resp.user)), + startWith(undefined), + shareReplay({ refCount: true, bufferSize: 1 }), ); - this.user.subscribe(this.userSubject); - - this.activeOrgChanged.subscribe(() => { - this.loadPermissions(); - }); + this.zitadelPermissions = this.user.pipe( + combineLatestWith(this.activeOrgChanged), + // ignore errors from observables + catchError(() => of(true)), + // make sure observable never completes + mergeWith(NEVER), + switchMap(() => + this.listMyZitadelPermissions() + .then((resp) => resp.resultList) + .catch(() => []), + ), + filter((roles) => !!roles.length), + distinctUntilChanged((a, b) => { + return JSON.stringify(a.sort()) === JSON.stringify(b.sort()); + }), + shareReplay({ refCount: true, bufferSize: 1 }), + ); } public listMyMetadata( @@ -309,7 +288,7 @@ export class GrpcAuthService { } public get activeOrgChanged(): Observable { - return this._activeOrgChanged; + return this._activeOrgChanged.asObservable(); } public setActiveOrg(org: Org.AsObject): void { @@ -328,18 +307,15 @@ export class GrpcAuthService { * @param roles roles of the user */ public isAllowed(roles: string[] | RegExp[], requiresAll: boolean = false): Observable { - if (roles && roles.length > 0) { - return this.fetchedZitadelPermissions.pipe( - withLatestFrom(this.zitadelPermissions), - filter(([hL, p]) => { - return hL === true && !!p.length; - }), - map(([_, zroles]) => this.hasRoles(zroles, roles, requiresAll)), - distinctUntilChanged(), - ); - } else { + if (!roles?.length) { return of(false); } + + return this.zitadelPermissions.pipe( + filter((permissions) => !!permissions.length), + map((permissions) => this.hasRoles(permissions, roles, requiresAll)), + distinctUntilChanged(), + ); } /** @@ -353,17 +329,14 @@ export class GrpcAuthService { mapper: (attr: any) => string[] | RegExp[], requiresAll: boolean = false, ): Observable { - return this.fetchedZitadelPermissions.pipe( - withLatestFrom(this.zitadelPermissions), - filter(([hL, p]) => { - return hL === true && !!p.length; - }), - map(([_, zroles]) => { - return objects.filter((obj) => { + return this.zitadelPermissions.pipe( + filter((permissions) => !!permissions.length), + map((permissions) => + objects.filter((obj) => { const roles = mapper(obj); - return this.hasRoles(zroles, roles, requiresAll); - }); - }), + return this.hasRoles(permissions, roles, requiresAll); + }), + ), ); } @@ -395,19 +368,6 @@ export class GrpcAuthService { .then((resp) => resp.toObject()); } - public loadMyUser(): void { - from(this.getMyUser()) - .pipe( - map((resp) => resp.user), - catchError((_) => { - return of(undefined); - }), - ) - .subscribe((user) => { - this.userSubject.next(user); - }); - } - public getMyUser(): Promise { return this.grpcService.auth.getMyUser(new GetMyUserRequest(), null).then((resp) => resp.toObject()); } @@ -728,40 +688,39 @@ export class GrpcAuthService { public getMyLabelPolicy(orgIdForCache?: string): Promise { if (orgIdForCache && this.cachedLabelPolicies[orgIdForCache]) { return Promise.resolve(this.cachedLabelPolicies[orgIdForCache]); - } else { - return this.grpcService.auth - .getMyLabelPolicy(new GetMyLabelPolicyRequest(), null) - .then((resp) => resp.toObject()) - .then((resp) => { - if (resp.policy) { - if (orgIdForCache) { - this.cachedLabelPolicies[orgIdForCache] = resp.policy; - } - return Promise.resolve(resp.policy); - } else { - return Promise.reject(); - } - }); } + + return this.grpcService.auth + .getMyLabelPolicy(new GetMyLabelPolicyRequest(), null) + .then((resp) => resp.toObject()) + .then((resp) => { + if (!resp.policy) { + return Promise.reject(); + } + if (orgIdForCache) { + this.cachedLabelPolicies[orgIdForCache] = resp.policy; + } + return resp.policy; + }); } public getMyPrivacyPolicy(orgIdForCache?: string): Promise { if (orgIdForCache && this.cachedPrivacyPolicies[orgIdForCache]) { return Promise.resolve(this.cachedPrivacyPolicies[orgIdForCache]); - } else { - return this.grpcService.auth - .getMyPrivacyPolicy(new GetMyPrivacyPolicyRequest(), null) - .then((resp) => resp.toObject()) - .then((resp) => { - if (resp.policy) { - if (orgIdForCache) { - this.cachedPrivacyPolicies[orgIdForCache] = resp.policy; - } - return Promise.resolve(resp.policy); - } else { - return Promise.reject(); - } - }); } + + return this.grpcService.auth + .getMyPrivacyPolicy(new GetMyPrivacyPolicyRequest(), null) + .then((resp) => resp.toObject()) + .then((resp) => { + if (!resp.policy) { + return Promise.reject(); + } + + if (orgIdForCache) { + this.cachedPrivacyPolicies[orgIdForCache] = resp.policy; + } + return resp.policy; + }); } } diff --git a/console/src/app/services/grpc.service.ts b/console/src/app/services/grpc.service.ts index 5c4c0fd510..e554e2b647 100644 --- a/console/src/app/services/grpc.service.ts +++ b/console/src/app/services/grpc.service.ts @@ -1,9 +1,8 @@ import { PlatformLocation } from '@angular/common'; import { Injectable } from '@angular/core'; -import { MatDialog } from '@angular/material/dialog'; import { TranslateService } from '@ngx-translate/core'; import { AuthConfig } from 'angular-oauth2-oidc'; -import { catchError, switchMap, tap, throwError } from 'rxjs'; +import { catchError, firstValueFrom, switchMap, tap } from 'rxjs'; import { AdminServiceClient } from '../proto/generated/zitadel/AdminServiceClientPb'; import { AuthServiceClient } from '../proto/generated/zitadel/AuthServiceClientPb'; @@ -12,13 +11,18 @@ import { fallbackLanguage, supportedLanguagesRegexp } from '../utils/language'; import { AuthenticationService } from './authentication.service'; import { EnvironmentService } from './environment.service'; import { ExhaustedService } from './exhausted.service'; -import { AuthInterceptor } from './interceptors/auth.interceptor'; +import { AuthInterceptor, AuthInterceptorProvider, NewConnectWebAuthInterceptor } from './interceptors/auth.interceptor'; import { ExhaustedGrpcInterceptor } from './interceptors/exhausted.grpc.interceptor'; import { I18nInterceptor } from './interceptors/i18n.interceptor'; import { OrgInterceptor } from './interceptors/org.interceptor'; import { StorageService } from './storage.service'; -import { FeatureServiceClient } from '../proto/generated/zitadel/feature/v2beta/Feature_serviceServiceClientPb'; -import { GrpcAuthService } from './grpc-auth.service'; +import { UserServiceClient } from '../proto/generated/zitadel/user/v2/User_serviceServiceClientPb'; +//@ts-ignore +import { createUserServiceClient } from '@zitadel/client/v2'; +//@ts-ignore +import { createAuthServiceClient, createManagementServiceClient } from '@zitadel/client/v1'; +import { createGrpcWebTransport } from '@connectrpc/connect-web'; +import { FeatureServiceClient } from '../proto/generated/zitadel/feature/v2/Feature_serviceServiceClientPb'; @Injectable({ providedIn: 'root', @@ -28,15 +32,20 @@ export class GrpcService { public mgmt!: ManagementServiceClient; public admin!: AdminServiceClient; public feature!: FeatureServiceClient; + public user!: UserServiceClient; + public userNew!: ReturnType; + public mgmtNew!: ReturnType; + public authNew!: ReturnType; constructor( - private envService: EnvironmentService, - private platformLocation: PlatformLocation, - private authenticationService: AuthenticationService, - private storageService: StorageService, - private dialog: MatDialog, - private translate: TranslateService, - private exhaustedService: ExhaustedService, + private readonly envService: EnvironmentService, + private readonly platformLocation: PlatformLocation, + private readonly authenticationService: AuthenticationService, + private readonly storageService: StorageService, + private readonly translate: TranslateService, + private readonly exhaustedService: ExhaustedService, + private readonly authInterceptor: AuthInterceptor, + private readonly authInterceptorProvider: AuthInterceptorProvider, ) {} public loadAppEnvironment(): Promise { @@ -44,66 +53,79 @@ export class GrpcService { const browserLanguage = this.translate.getBrowserLang(); const language = browserLanguage?.match(supportedLanguagesRegexp) ? browserLanguage : fallbackLanguage; - return this.translate - .use(language || this.translate.defaultLang) - .pipe( - switchMap(() => this.envService.env), - tap((env) => { - if (!env?.api || !env?.issuer) { - return; - } - const interceptors = { - unaryInterceptors: [ - new ExhaustedGrpcInterceptor(this.exhaustedService, this.envService), - new OrgInterceptor(this.storageService), - new AuthInterceptor(this.authenticationService, this.storageService, this.dialog), - new I18nInterceptor(this.translate), - ], - }; + const init = this.translate.use(language || this.translate.defaultLang).pipe( + switchMap(() => this.envService.env), + tap((env) => { + if (!env?.api || !env?.issuer) { + return; + } + const interceptors = { + unaryInterceptors: [ + new ExhaustedGrpcInterceptor(this.exhaustedService, this.envService), + new OrgInterceptor(this.storageService), + this.authInterceptor, + new I18nInterceptor(this.translate), + ], + }; - this.auth = new AuthServiceClient( - env.api, - null, - // @ts-ignore - interceptors, - ); - this.mgmt = new ManagementServiceClient( - env.api, - null, - // @ts-ignore - interceptors, - ); - this.admin = new AdminServiceClient( - env.api, - null, - // @ts-ignore - interceptors, - ); - this.feature = new FeatureServiceClient( - env.api, - null, - // @ts-ignore - interceptors, - ); + this.auth = new AuthServiceClient( + env.api, + null, + // @ts-ignore + interceptors, + ); + this.mgmt = new ManagementServiceClient( + env.api, + null, + // @ts-ignore + interceptors, + ); + this.admin = new AdminServiceClient( + env.api, + null, + // @ts-ignore + interceptors, + ); + this.feature = new FeatureServiceClient( + env.api, + null, + // @ts-ignore + interceptors, + ); + this.user = new UserServiceClient( + env.api, + null, + // @ts-ignore + interceptors, + ); - const authConfig: AuthConfig = { - scope: 'openid profile email', - responseType: 'code', - oidc: true, - clientId: env.clientid, - issuer: env.issuer, - redirectUri: window.location.origin + this.platformLocation.getBaseHrefFromDOM() + 'auth/callback', - postLogoutRedirectUri: window.location.origin + this.platformLocation.getBaseHrefFromDOM() + 'signedout', - requireHttps: false, - }; + const transport = createGrpcWebTransport({ + baseUrl: env.api, + interceptors: [NewConnectWebAuthInterceptor(this.authInterceptorProvider)], + }); + this.userNew = createUserServiceClient(transport); + this.mgmtNew = createManagementServiceClient(transport); + this.authNew = createAuthServiceClient(transport); - this.authenticationService.initConfig(authConfig); - }), - catchError((err) => { - console.error('Failed to load environment from assets', err); - return throwError(() => err); - }), - ) - .toPromise(); + const authConfig: AuthConfig = { + scope: 'openid profile email', + responseType: 'code', + oidc: true, + clientId: env.clientid, + issuer: env.issuer, + redirectUri: window.location.origin + this.platformLocation.getBaseHrefFromDOM() + 'auth/callback', + postLogoutRedirectUri: window.location.origin + this.platformLocation.getBaseHrefFromDOM() + 'signedout', + requireHttps: false, + }; + + this.authenticationService.initConfig(authConfig); + }), + catchError((err) => { + console.error('Failed to load environment from assets', err); + throw err; + }), + ); + + return firstValueFrom(init); } } diff --git a/console/src/app/services/interceptors/auth.interceptor.ts b/console/src/app/services/interceptors/auth.interceptor.ts index 4ccdc768c7..72c1670bce 100644 --- a/console/src/app/services/interceptors/auth.interceptor.ts +++ b/console/src/app/services/interceptors/auth.interceptor.ts @@ -1,59 +1,53 @@ -import { Injectable } from '@angular/core'; +import { DestroyRef, Injectable } from '@angular/core'; import { MatDialog } from '@angular/material/dialog'; -import { Request, UnaryInterceptor, UnaryResponse } from 'grpc-web'; -import { Subject } from 'rxjs'; -import { debounceTime, filter, first, map, take, tap } from 'rxjs/operators'; +import { Request, RpcError, UnaryInterceptor, UnaryResponse } from 'grpc-web'; +import { firstValueFrom, identity, lastValueFrom, Observable, Subject } from 'rxjs'; +import { debounceTime, filter, map } from 'rxjs/operators'; import { WarnDialogComponent } from 'src/app/modules/warn-dialog/warn-dialog.component'; import { AuthenticationService } from '../authentication.service'; import { StorageService } from '../storage.service'; import { AuthConfig } from 'angular-oauth2-oidc'; -import { GrpcAuthService } from '../grpc-auth.service'; +import { takeUntilDestroyed } from '@angular/core/rxjs-interop'; +import { ConnectError, Interceptor } from '@connectrpc/connect'; const authorizationKey = 'Authorization'; const bearerPrefix = 'Bearer'; const accessTokenStorageKey = 'access_token'; + @Injectable({ providedIn: 'root' }) -/** - * Set the authentication token - */ -export class AuthInterceptor implements UnaryInterceptor { +export class AuthInterceptorProvider { public triggerDialog: Subject = new Subject(); + constructor( private authenticationService: AuthenticationService, private storageService: StorageService, private dialog: MatDialog, + private destroyRef: DestroyRef, ) { - this.triggerDialog.pipe(debounceTime(1000)).subscribe(() => { - this.openDialog(); - }); + this.triggerDialog.pipe(debounceTime(1000), takeUntilDestroyed(this.destroyRef)).subscribe(() => this.openDialog()); } - public async intercept(request: Request, invoker: any): Promise> { - await this.authenticationService.authenticationChanged - .pipe( - filter((authed) => !!authed), - first(), - ) - .toPromise(); - - const metadata = request.getMetadata(); - const accessToken = this.storageService.getItem(accessTokenStorageKey); - metadata[authorizationKey] = `${bearerPrefix} ${accessToken}`; - - return invoker(request) - .then((response: any) => { - return response; - }) - .catch(async (error: any) => { - if (error.code === 16 || (error.code === 7 && error.message === 'mfa required (AUTHZ-Kl3p0)')) { - this.triggerDialog.next(true); - } - return Promise.reject(error); - }); + getToken(): Observable { + return this.authenticationService.authenticationChanged.pipe( + filter(identity), + map(() => this.storageService.getItem(accessTokenStorageKey)), + map((token) => `${bearerPrefix} ${token}`), + ); } - private openDialog(): void { + handleError = (error: any): never => { + if (!(error instanceof RpcError) && !(error instanceof ConnectError)) { + throw error; + } + + if (error.code === 16 || (error.code === 7 && error.message === 'mfa required (AUTHZ-Kl3p0)')) { + this.triggerDialog.next(true); + } + throw error; + }; + + private async openDialog(): Promise { const dialogRef = this.dialog.open(WarnDialogComponent, { data: { confirmKey: 'ACTIONS.LOGIN', @@ -64,19 +58,47 @@ export class AuthInterceptor implements UnaryIn width: '400px', }); - dialogRef - .afterClosed() - .pipe(take(1)) - .subscribe((resp) => { - if (resp) { - const idToken = this.authenticationService.getIdToken(); - const configWithPrompt: Partial = { - customQueryParams: { - id_token_hint: idToken, - }, - }; - this.authenticationService.authenticate(configWithPrompt, true); - } - }); + const resp = await lastValueFrom(dialogRef.afterClosed()); + if (!resp) { + return; + } + + const idToken = this.authenticationService.getIdToken(); + const configWithPrompt: Partial = { + customQueryParams: { + id_token_hint: idToken, + }, + }; + + await this.authenticationService.authenticate(configWithPrompt, true); } } + +@Injectable({ providedIn: 'root' }) +/** + * Set the authentication token + */ +export class AuthInterceptor implements UnaryInterceptor { + constructor(private readonly authInterceptorProvider: AuthInterceptorProvider) {} + + public async intercept( + request: Request, + invoker: (request: Request) => Promise>, + ): Promise> { + const metadata = request.getMetadata(); + metadata[authorizationKey] = await firstValueFrom(this.authInterceptorProvider.getToken()); + + return invoker(request).catch(this.authInterceptorProvider.handleError); + } +} + +export function NewConnectWebAuthInterceptor(authInterceptorProvider: AuthInterceptorProvider): Interceptor { + return (next) => async (req) => { + if (!req.header.get('Authorization')) { + const token = await firstValueFrom(authInterceptorProvider.getToken()); + req.header.set('Authorization', token); + } + + return next(req).catch(authInterceptorProvider.handleError); + }; +} diff --git a/console/src/app/services/interceptors/exhausted.grpc.interceptor.ts b/console/src/app/services/interceptors/exhausted.grpc.interceptor.ts index 446e7aa8dd..d1b15060c4 100644 --- a/console/src/app/services/interceptors/exhausted.grpc.interceptor.ts +++ b/console/src/app/services/interceptors/exhausted.grpc.interceptor.ts @@ -1,7 +1,8 @@ import { Injectable } from '@angular/core'; -import { Request, StatusCode, UnaryInterceptor, UnaryResponse } from 'grpc-web'; +import { Request, RpcError, StatusCode, UnaryInterceptor, UnaryResponse } from 'grpc-web'; import { EnvironmentService } from '../environment.service'; import { ExhaustedService } from '../exhausted.service'; +import { lastValueFrom } from 'rxjs'; /** * ExhaustedGrpcInterceptor shows the exhausted dialog after receiving a gRPC response status 8. @@ -17,16 +18,13 @@ export class ExhaustedGrpcInterceptor implement request: Request, invoker: (request: Request) => Promise>, ): Promise> { - return invoker(request).catch((error: any) => { - if (error.code === StatusCode.RESOURCE_EXHAUSTED) { - return this.exhaustedSvc - .showExhaustedDialog(this.envSvc.env) - .toPromise() - .then(() => { - throw error; - }); + try { + return await invoker(request); + } catch (error: any) { + if (error instanceof RpcError && error.code === StatusCode.RESOURCE_EXHAUSTED) { + await lastValueFrom(this.exhaustedSvc.showExhaustedDialog(this.envSvc.env)); } throw error; - }); + } } } diff --git a/console/src/app/services/interceptors/i18n.interceptor.ts b/console/src/app/services/interceptors/i18n.interceptor.ts index af2bb049d1..566508d178 100644 --- a/console/src/app/services/interceptors/i18n.interceptor.ts +++ b/console/src/app/services/interceptors/i18n.interceptor.ts @@ -10,7 +10,7 @@ const i18nHeader = 'Accept-Language'; export class I18nInterceptor implements UnaryInterceptor { constructor(private translate: TranslateService) {} - public async intercept(request: Request, invoker: any): Promise> { + public intercept(request: Request, invoker: any): Promise> { const metadata = request.getMetadata(); const navLang = this.translate.currentLang ?? navigator.language; @@ -18,12 +18,6 @@ export class I18nInterceptor implements UnaryIn metadata[i18nHeader] = navLang; } - return invoker(request) - .then((response: any) => { - return response; - }) - .catch((error: any) => { - return Promise.reject(error); - }); + return invoker(request); } } diff --git a/console/src/app/services/interceptors/org.interceptor.ts b/console/src/app/services/interceptors/org.interceptor.ts index 22d468edd5..2e85b8f4b9 100644 --- a/console/src/app/services/interceptors/org.interceptor.ts +++ b/console/src/app/services/interceptors/org.interceptor.ts @@ -1,5 +1,5 @@ import { Injectable } from '@angular/core'; -import { Request, UnaryInterceptor, UnaryResponse } from 'grpc-web'; +import { Request, RpcError, StatusCode, UnaryInterceptor, UnaryResponse } from 'grpc-web'; import { Org } from 'src/app/proto/generated/zitadel/org_pb'; import { StorageKey, StorageLocation, StorageService } from '../storage.service'; @@ -9,7 +9,7 @@ const ORG_HEADER_KEY = 'x-zitadel-orgid'; export class OrgInterceptor implements UnaryInterceptor { constructor(private readonly storageService: StorageService) {} - public intercept(request: Request, invoker: any): Promise> { + public async intercept(request: Request, invoker: any): Promise> { const metadata = request.getMetadata(); const org: Org.AsObject | null = this.storageService.getItem(StorageKey.organization, StorageLocation.session); @@ -18,15 +18,17 @@ export class OrgInterceptor implements UnaryInt metadata[ORG_HEADER_KEY] = `${org.id}`; } - return invoker(request) - .then((response: any) => { - return response; - }) - .catch((error: any) => { - if (error.code === 7 && error.message.startsWith("Organisation doesn't exist")) { - this.storageService.removeItem(StorageKey.organization, StorageLocation.session); - } - return Promise.reject(error); - }); + try { + return await invoker(request); + } catch (error: any) { + if ( + error instanceof RpcError && + error.code === StatusCode.PERMISSION_DENIED && + error.message.startsWith("Organisation doesn't exist") + ) { + this.storageService.removeItem(StorageKey.organization, StorageLocation.session); + } + throw error; + } } } diff --git a/console/src/app/services/new-auth.service.ts b/console/src/app/services/new-auth.service.ts new file mode 100644 index 0000000000..3e09ea7ad4 --- /dev/null +++ b/console/src/app/services/new-auth.service.ts @@ -0,0 +1,30 @@ +import { Injectable } from '@angular/core'; +import { GrpcService } from './grpc.service'; +import { create } from '@bufbuild/protobuf'; +import { + AddMyAuthFactorOTPSMSRequestSchema, + AddMyAuthFactorOTPSMSResponse, + GetMyUserRequestSchema, + GetMyUserResponse, + VerifyMyPhoneRequestSchema, + VerifyMyPhoneResponse, +} from '@zitadel/proto/zitadel/auth_pb'; + +@Injectable({ + providedIn: 'root', +}) +export class NewAuthService { + constructor(private readonly grpcService: GrpcService) {} + + public getMyUser(): Promise { + return this.grpcService.authNew.getMyUser(create(GetMyUserRequestSchema)); + } + + public verifyMyPhone(code: string): Promise { + return this.grpcService.authNew.verifyMyPhone(create(VerifyMyPhoneRequestSchema, { code })); + } + + public addMyAuthFactorOTPSMS(): Promise { + return this.grpcService.authNew.addMyAuthFactorOTPSMS(create(AddMyAuthFactorOTPSMSRequestSchema)); + } +} diff --git a/console/src/app/services/new-mgmt.service.ts b/console/src/app/services/new-mgmt.service.ts new file mode 100644 index 0000000000..21019f8c73 --- /dev/null +++ b/console/src/app/services/new-mgmt.service.ts @@ -0,0 +1,92 @@ +import { Injectable } from '@angular/core'; +import { GrpcService } from './grpc.service'; +import { + GenerateMachineSecretRequestSchema, + GenerateMachineSecretResponse, + GetLoginPolicyRequestSchema, + GetLoginPolicyResponse, + ListUserMetadataRequestSchema, + ListUserMetadataResponse, + RemoveMachineSecretRequestSchema, + RemoveMachineSecretResponse, + RemoveUserMetadataRequestSchema, + RemoveUserMetadataResponse, + ResendHumanEmailVerificationRequestSchema, + ResendHumanEmailVerificationResponse, + ResendHumanInitializationRequestSchema, + ResendHumanInitializationResponse, + ResendHumanPhoneVerificationRequestSchema, + ResendHumanPhoneVerificationResponse, + SendHumanResetPasswordNotificationRequest_Type, + SendHumanResetPasswordNotificationRequestSchema, + SendHumanResetPasswordNotificationResponse, + SetUserMetadataRequestSchema, + SetUserMetadataResponse, + UpdateMachineRequestSchema, + UpdateMachineResponse, +} from '@zitadel/proto/zitadel/management_pb'; +import { MessageInitShape, create } from '@bufbuild/protobuf'; + +@Injectable({ + providedIn: 'root', +}) +export class NewMgmtService { + constructor(private readonly grpcService: GrpcService) {} + + public getLoginPolicy(): Promise { + return this.grpcService.mgmtNew.getLoginPolicy(create(GetLoginPolicyRequestSchema)); + } + + public generateMachineSecret(userId: string): Promise { + return this.grpcService.mgmtNew.generateMachineSecret(create(GenerateMachineSecretRequestSchema, { userId })); + } + + public removeMachineSecret(userId: string): Promise { + return this.grpcService.mgmtNew.removeMachineSecret(create(RemoveMachineSecretRequestSchema, { userId })); + } + + public updateMachine(req: MessageInitShape): Promise { + return this.grpcService.mgmtNew.updateMachine(create(UpdateMachineRequestSchema, req)); + } + + public resendHumanEmailVerification(userId: string): Promise { + return this.grpcService.mgmtNew.resendHumanEmailVerification( + create(ResendHumanEmailVerificationRequestSchema, { userId }), + ); + } + + public resendHumanPhoneVerification(userId: string): Promise { + return this.grpcService.mgmtNew.resendHumanPhoneVerification( + create(ResendHumanPhoneVerificationRequestSchema, { userId }), + ); + } + + public sendHumanResetPasswordNotification( + userId: string, + type: SendHumanResetPasswordNotificationRequest_Type, + ): Promise { + return this.grpcService.mgmtNew.sendHumanResetPasswordNotification( + create(SendHumanResetPasswordNotificationRequestSchema, { userId, type }), + ); + } + + public resendHumanInitialization(userId: string, email: string = ''): Promise { + return this.grpcService.mgmtNew.resendHumanInitialization( + create(ResendHumanInitializationRequestSchema, { userId, email }), + ); + } + + public listUserMetadata(id: string): Promise { + return this.grpcService.mgmtNew.listUserMetadata(create(ListUserMetadataRequestSchema, { id })); + } + + public setUserMetadata(req: MessageInitShape): Promise { + return this.grpcService.mgmtNew.setUserMetadata(create(SetUserMetadataRequestSchema, req)); + } + + public removeUserMetadata( + req: MessageInitShape, + ): Promise { + return this.grpcService.mgmtNew.removeUserMetadata(create(RemoveUserMetadataRequestSchema, req)); + } +} diff --git a/console/src/app/services/user.service.ts b/console/src/app/services/user.service.ts new file mode 100644 index 0000000000..328d3c7e0f --- /dev/null +++ b/console/src/app/services/user.service.ts @@ -0,0 +1,302 @@ +import { Injectable } from '@angular/core'; +import { GrpcService } from './grpc.service'; +import { + AddHumanUserRequestSchema, + AddHumanUserResponse, + CreateInviteCodeRequestSchema, + CreateInviteCodeResponse, + CreatePasskeyRegistrationLinkRequestSchema, + CreatePasskeyRegistrationLinkResponse, + DeactivateUserRequestSchema, + DeactivateUserResponse, + DeleteUserRequestSchema, + DeleteUserResponse, + GetUserByIDRequestSchema, + GetUserByIDResponse, + ListAuthenticationFactorsRequestSchema, + ListAuthenticationFactorsResponse, + ListPasskeysRequestSchema, + ListPasskeysResponse, + ListUsersRequestSchema, + ListUsersResponse, + LockUserRequestSchema, + LockUserResponse, + PasswordResetRequestSchema, + ReactivateUserRequestSchema, + ReactivateUserResponse, + RemoveOTPEmailRequestSchema, + RemoveOTPEmailResponse, + RemoveOTPSMSRequestSchema, + RemoveOTPSMSResponse, + RemovePasskeyRequestSchema, + RemovePasskeyResponse, + RemovePhoneRequestSchema, + RemovePhoneResponse, + RemoveTOTPRequestSchema, + RemoveTOTPResponse, + RemoveU2FRequestSchema, + RemoveU2FResponse, + ResendInviteCodeRequestSchema, + ResendInviteCodeResponse, + SetEmailRequestSchema, + SetEmailResponse, + SetPasswordRequestSchema, + SetPasswordResponse, + SetPhoneRequestSchema, + SetPhoneResponse, + UnlockUserRequestSchema, + UnlockUserResponse, + UpdateHumanUserRequestSchema, + UpdateHumanUserResponse, +} from '@zitadel/proto/zitadel/user/v2/user_service_pb'; +import type { MessageInitShape } from '@bufbuild/protobuf'; +import { + AccessTokenType, + Gender, + HumanProfile, + HumanProfileSchema, + HumanUser, + HumanUserSchema, + MachineUser, + MachineUserSchema, + User as UserV2, + UserSchema, + UserState, +} from '@zitadel/proto/zitadel/user/v2/user_pb'; +import { create } from '@bufbuild/protobuf'; +import { Timestamp as TimestampV2, TimestampSchema } from '@bufbuild/protobuf/wkt'; +import { Details, DetailsSchema, ListQuerySchema } from '@zitadel/proto/zitadel/object/v2/object_pb'; +import { SearchQuery, UserFieldName } from '@zitadel/proto/zitadel/user/v2/query_pb'; +import { SortDirection } from '@angular/material/sort'; +import { Human, Machine, Phone, Profile, User } from '../proto/generated/zitadel/user_pb'; +import { ObjectDetails } from '../proto/generated/zitadel/object_pb'; +import { Timestamp } from '../proto/generated/google/protobuf/timestamp_pb'; +import { HumanPhone, HumanPhoneSchema } from '@zitadel/proto/zitadel/user/v2/phone_pb'; + +@Injectable({ + providedIn: 'root', +}) +export class UserService { + constructor(private readonly grpcService: GrpcService) {} + + public addHumanUser(req: MessageInitShape): Promise { + return this.grpcService.userNew.addHumanUser(create(AddHumanUserRequestSchema, req)); + } + + public listUsers( + limit: number, + offset: number, + queriesList?: SearchQuery[], + sortingColumn?: UserFieldName, + sortingDirection?: SortDirection, + ): Promise { + const query = create(ListQuerySchema); + + if (limit) { + query.limit = limit; + } + if (offset) { + query.offset = BigInt(offset); + } + if (sortingDirection) { + query.asc = sortingDirection === 'asc'; + } + + const req = create(ListUsersRequestSchema, { + query, + }); + + if (sortingColumn) { + req.sortingColumn = sortingColumn; + } + + if (queriesList) { + req.queries = queriesList; + } + + return this.grpcService.userNew.listUsers(req); + } + + public getUserById(userId: string): Promise { + return this.grpcService.userNew.getUserByID(create(GetUserByIDRequestSchema, { userId })); + } + + public deactivateUser(userId: string): Promise { + return this.grpcService.userNew.deactivateUser(create(DeactivateUserRequestSchema, { userId })); + } + + public reactivateUser(userId: string): Promise { + return this.grpcService.userNew.reactivateUser(create(ReactivateUserRequestSchema, { userId })); + } + + public deleteUser(userId: string): Promise { + return this.grpcService.userNew.deleteUser(create(DeleteUserRequestSchema, { userId })); + } + + public updateUser(req: MessageInitShape): Promise { + return this.grpcService.userNew.updateHumanUser(create(UpdateHumanUserRequestSchema, req)); + } + + public lockUser(userId: string): Promise { + return this.grpcService.userNew.lockUser(create(LockUserRequestSchema, { userId })); + } + + public unlockUser(userId: string): Promise { + return this.grpcService.userNew.unlockUser(create(UnlockUserRequestSchema, { userId })); + } + + public listAuthenticationFactors( + req: MessageInitShape, + ): Promise { + return this.grpcService.userNew.listAuthenticationFactors(create(ListAuthenticationFactorsRequestSchema, req)); + } + + public listPasskeys(req: MessageInitShape): Promise { + return this.grpcService.userNew.listPasskeys(create(ListPasskeysRequestSchema, req)); + } + + public removePasskeys(req: MessageInitShape): Promise { + return this.grpcService.userNew.removePasskey(create(RemovePasskeyRequestSchema, req)); + } + + public createPasskeyRegistrationLink( + req: MessageInitShape, + ): Promise { + return this.grpcService.userNew.createPasskeyRegistrationLink(create(CreatePasskeyRegistrationLinkRequestSchema, req)); + } + + public removePhone(userId: string): Promise { + return this.grpcService.userNew.removePhone(create(RemovePhoneRequestSchema, { userId })); + } + + public setPhone(req: MessageInitShape): Promise { + return this.grpcService.userNew.setPhone(create(SetPhoneRequestSchema, req)); + } + + public setEmail(req: MessageInitShape): Promise { + return this.grpcService.userNew.setEmail(create(SetEmailRequestSchema, req)); + } + + public removeTOTP(userId: string): Promise { + return this.grpcService.userNew.removeTOTP(create(RemoveTOTPRequestSchema, { userId })); + } + + public removeU2F(userId: string, u2fId: string): Promise { + return this.grpcService.userNew.removeU2F(create(RemoveU2FRequestSchema, { userId, u2fId })); + } + + public removeOTPSMS(userId: string): Promise { + return this.grpcService.userNew.removeOTPSMS(create(RemoveOTPSMSRequestSchema, { userId })); + } + + public removeOTPEmail(userId: string): Promise { + return this.grpcService.userNew.removeOTPEmail(create(RemoveOTPEmailRequestSchema, { userId })); + } + + public resendInviteCode(userId: string): Promise { + return this.grpcService.userNew.resendInviteCode(create(ResendInviteCodeRequestSchema, { userId })); + } + + public createInviteCode(req: MessageInitShape): Promise { + return this.grpcService.userNew.createInviteCode(create(CreateInviteCodeRequestSchema, req)); + } + + public passwordReset(req: MessageInitShape) { + return this.grpcService.userNew.passwordReset(create(PasswordResetRequestSchema, req)); + } + + public setPassword(req: MessageInitShape): Promise { + return this.grpcService.userNew.setPassword(create(SetPasswordRequestSchema, req)); + } +} + +function userToV2(user: User): UserV2 { + const details = user.getDetails(); + return create(UserSchema, { + userId: user.getId(), + details: details && detailsToV2(details), + state: user.getState() as number as UserState, + username: user.getUserName(), + loginNames: user.getLoginNamesList(), + preferredLoginName: user.getPreferredLoginName(), + type: typeToV2(user), + }); +} + +function detailsToV2(details: ObjectDetails): Details { + const changeDate = details.getChangeDate(); + return create(DetailsSchema, { + sequence: BigInt(details.getSequence()), + changeDate: changeDate && timestampToV2(changeDate), + resourceOwner: details.getResourceOwner(), + }); +} + +function timestampToV2(timestamp: Timestamp): TimestampV2 { + return create(TimestampSchema, { + seconds: BigInt(timestamp.getSeconds()), + nanos: timestamp.getNanos(), + }); +} + +function typeToV2(user: User): UserV2['type'] { + const human = user.getHuman(); + if (human) { + return { case: 'human', value: humanToV2(user, human) }; + } + + const machine = user.getMachine(); + if (machine) { + return { case: 'machine', value: machineToV2(machine) }; + } + + return { case: undefined }; +} + +function humanToV2(user: User, human: Human): HumanUser { + const profile = human.getProfile(); + const email = human.getEmail()?.getEmail(); + const phone = human.getPhone(); + const passwordChanged = human.getPasswordChanged(); + + return create(HumanUserSchema, { + userId: user.getId(), + state: user.getState() as number as UserState, + username: user.getUserName(), + loginNames: user.getLoginNamesList(), + preferredLoginName: user.getPreferredLoginName(), + profile: profile && humanProfileToV2(profile), + email: { email }, + phone: phone && humanPhoneToV2(phone), + passwordChangeRequired: false, + passwordChanged: passwordChanged && timestampToV2(passwordChanged), + }); +} + +function humanProfileToV2(profile: Profile): HumanProfile { + return create(HumanProfileSchema, { + givenName: profile.getFirstName(), + familyName: profile.getLastName(), + nickName: profile.getNickName(), + displayName: profile.getDisplayName(), + preferredLanguage: profile.getPreferredLanguage(), + gender: profile.getGender() as number as Gender, + avatarUrl: profile.getAvatarUrl(), + }); +} + +function humanPhoneToV2(phone: Phone): HumanPhone { + return create(HumanPhoneSchema, { + phone: phone.getPhone(), + isVerified: phone.getIsPhoneVerified(), + }); +} + +function machineToV2(machine: Machine): MachineUser { + return create(MachineUserSchema, { + name: machine.getName(), + description: machine.getDescription(), + hasSecret: machine.getHasSecret(), + accessTokenType: machine.getAccessTokenType() as number as AccessTokenType, + }); +} diff --git a/console/src/app/utils/formatPhone.ts b/console/src/app/utils/formatPhone.ts index d5a246667c..a55adc23bf 100644 --- a/console/src/app/utils/formatPhone.ts +++ b/console/src/app/utils/formatPhone.ts @@ -1,6 +1,6 @@ import { CountryCode, parsePhoneNumber } from 'libphonenumber-js'; -export function formatPhone(phone: string): { phone: string; country: CountryCode } | null { +export function formatPhone(phone?: string): { phone: string; country: CountryCode } | null { const defaultCountry = 'US'; if (phone) { diff --git a/console/src/app/utils/pairwiseStartWith.ts b/console/src/app/utils/pairwiseStartWith.ts new file mode 100644 index 0000000000..359394d14b --- /dev/null +++ b/console/src/app/utils/pairwiseStartWith.ts @@ -0,0 +1,11 @@ +import { Observable } from 'rxjs'; +import { map, pairwise, startWith } from 'rxjs/operators'; + +export function pairwiseStartWith(start: T) { + return (source: Observable) => + source.pipe( + startWith(start), + pairwise(), + map(([prev, curr]) => [prev, curr] as [T | R, R]), + ); +} diff --git a/console/src/assets/i18n/bg.json b/console/src/assets/i18n/bg.json index 7c39fb22b2..9571f75db3 100644 --- a/console/src/assets/i18n/bg.json +++ b/console/src/assets/i18n/bg.json @@ -808,6 +808,9 @@ "EMAIL": "Електронна поща", "PHONE": "Телефонен номер", "PHONE_HINT": "Използвайте символа +, последван от кода на държавата, на която се обаждате, или изберете държавата от падащото меню и накрая въведете телефонния номер", + "PHONE_VERIFIED": "Телефонният номер е потвърден", + "SEND_SMS": "Изпрати SMS за потвърждение", + "SEND_EMAIL": "Изпрати имейл", "USERNAME": "Потребителско име", "CHANGEUSERNAME": "променям", "CHANGEUSERNAME_TITLE": "Промяна на потребителското име", @@ -948,6 +951,14 @@ "5": "Спряно", "6": "Първоначално" }, + "STATEV2": { + "0": "неизвестен", + "1": "Активен", + "2": "Неактивен", + "3": "Изтрито", + "4": "Заключено", + "5": "Първоначално" + }, "SEARCH": { "ADDITIONAL": "Име за вход (текуща организация)", "ADDITIONAL-EXTERNAL": "Име за вход (външна организация)" @@ -1485,7 +1496,9 @@ "ENABLED": "„Активирано“ се наследява", "DISABLED": "„Деактивирано“ се наследява" }, - "RESET": "Задай всички на наследено" + "RESET": "Задай всички на наследено", + "CONSOLEUSEV2USERAPI": "Използвайте V2 API в конзолата за създаване на потребител", + "CONSOLEUSEV2USERAPI_DESCRIPTION": "Когато този флаг е активиран, конзолата използва V2 User API за създаване на нови потребители. С V2 API новосъздадените потребители започват без начален статус." }, "DIALOG": { "RESET": { diff --git a/console/src/assets/i18n/cs.json b/console/src/assets/i18n/cs.json index 09b9ac2b9f..68558efab3 100644 --- a/console/src/assets/i18n/cs.json +++ b/console/src/assets/i18n/cs.json @@ -809,6 +809,9 @@ "EMAIL": "E-mail", "PHONE": "Telefonní číslo", "PHONE_HINT": "Použijte symbol + následovaný mezinárodním kódem země, nebo ze seznamu vyberte zemi a nakonec zadejte telefonní číslo", + "PHONE_VERIFIED": "Telefonní číslo ověřeno", + "SEND_SMS": "Odeslat ověřovací SMS", + "SEND_EMAIL": "Odeslat E-mail", "USERNAME": "Uživatelské jméno", "CHANGEUSERNAME": "upravit", "CHANGEUSERNAME_TITLE": "Změna uživatelského jména", @@ -949,6 +952,14 @@ "5": "Pozastavený", "6": "Počáteční" }, + "STATEV2": { + "0": "Neznámý", + "1": "Aktivní", + "2": "Neaktivní", + "3": "Smazaný", + "4": "Uzamčený", + "5": "Počáteční" + }, "SEARCH": { "ADDITIONAL": "Přihlašovací jméno (současná organizace)", "ADDITIONAL-EXTERNAL": "Přihlašovací jméno (externí organizace)" @@ -1486,7 +1497,9 @@ "ENABLED": "„Povoleno“ je zděděno", "DISABLED": "„Zakázáno“ je zděděno" }, - "RESET": "Nastavit vše na děděné" + "RESET": "Nastavit vše na děděné", + "CONSOLEUSEV2USERAPI": "Použijte V2 API v konzoli pro vytvoření uživatele", + "CONSOLEUSEV2USERAPI_DESCRIPTION": "Když je tato příznak povolen, konzole používá V2 User API k vytvoření nových uživatelů. S V2 API nově vytvoření uživatelé začínají bez počátečního stavu." }, "DIALOG": { "RESET": { diff --git a/console/src/assets/i18n/de.json b/console/src/assets/i18n/de.json index 1a9efe8c97..af65e76365 100644 --- a/console/src/assets/i18n/de.json +++ b/console/src/assets/i18n/de.json @@ -809,6 +809,9 @@ "EMAIL": "E-Mail", "PHONE": "Telefonnummer", "PHONE_HINT": "Verwenden das Symbol + gefolgt von der Landesvorwahl des Anrufers oder wähle das Land aus der Dropdown-Liste aus und gebe anschließend die Telefonnummer ein.", + "PHONE_VERIFIED": "Telefonnummer verifiziert", + "SEND_SMS": "Bestätigungs-SMS senden", + "SEND_EMAIL": "E-Mail senden", "USERNAME": "Benutzername", "CHANGEUSERNAME": "bearbeiten", "CHANGEUSERNAME_TITLE": "Benutzername ändern", @@ -949,6 +952,14 @@ "5": "Suspendiert", "6": "Initialisiert" }, + "STATEV2": { + "0": "Unbekannt", + "1": "Aktiv", + "2": "Inaktiv", + "3": "Gelöscht", + "4": "Gesperrt", + "5": "Initialisiert" + }, "SEARCH": { "ADDITIONAL": "Benutzer Name (eigene Organisation)", "ADDITIONAL-EXTERNAL": "Loginname (externe Organisation)" @@ -1486,7 +1497,9 @@ "ENABLED": "„Aktiviert“ wird vererbt", "DISABLED": "„Deaktiviert“ wird vererbt" }, - "RESET": "Alle auf Erben setzen" + "RESET": "Alle auf Erben setzen", + "CONSOLEUSEV2USERAPI": "Verwende die V2-API in der Konsole zur Erstellung von Benutzern", + "CONSOLEUSEV2USERAPI_DESCRIPTION": "Wenn diese Option aktiviert ist, verwendet die Konsole die V2 User API, um neue Benutzer zu erstellen. Mit der V2 API starten neu erstellte Benutzer nicht im Initial Zustand." }, "DIALOG": { "RESET": { diff --git a/console/src/assets/i18n/en.json b/console/src/assets/i18n/en.json index 488ae68d7c..40c215e1bf 100644 --- a/console/src/assets/i18n/en.json +++ b/console/src/assets/i18n/en.json @@ -809,6 +809,9 @@ "EMAIL": "E-mail", "PHONE": "Phone number", "PHONE_HINT": "Use the + symbol followed by the calling country code, or select the country from the dropdown and finally enter the phone number", + "PHONE_VERIFIED": "Phone Number Verified", + "SEND_SMS": "Send Verification SMS", + "SEND_EMAIL": "Send E-Mail", "USERNAME": "User Name", "CHANGEUSERNAME": "modify", "CHANGEUSERNAME_TITLE": "Change username", @@ -949,6 +952,14 @@ "5": "Suspended", "6": "Initial" }, + "STATEV2": { + "0": "Unknown", + "1": "Active", + "2": "Inactive", + "3": "Deleted", + "4": "Locked", + "5": "Initial" + }, "SEARCH": { "ADDITIONAL": "Loginname (current organization)", "ADDITIONAL-EXTERNAL": "Loginname (external organization)" @@ -1486,7 +1497,9 @@ "ENABLED": "\"Enabled\" is inherited", "DISABLED": "\"Disabled\" is inherited" }, - "RESET": "Set all to inherit" + "RESET": "Set all to inherit", + "CONSOLEUSEV2USERAPI": "Use V2 Api in Console for User creation", + "CONSOLEUSEV2USERAPI_DESCRIPTION": "When this flag is enabled, the console uses the V2 User API to create new users. With the V2 API, newly created users start without an initial state." }, "DIALOG": { "RESET": { diff --git a/console/src/assets/i18n/es.json b/console/src/assets/i18n/es.json index 09cb87a5e6..b21b001c4d 100644 --- a/console/src/assets/i18n/es.json +++ b/console/src/assets/i18n/es.json @@ -809,6 +809,9 @@ "EMAIL": "Email", "PHONE": "Número de teléfono", "PHONE_HINT": "Usa el símbolo + seguido del prefijo del país o selecciona el país del menú desplegable y finalmente introduce el número de teléfono", + "PHONE_VERIFIED": "Número de teléfono verificado", + "SEND_SMS": "Enviar SMS de verificación", + "SEND_EMAIL": "Enviar correo electrónico", "USERNAME": "Nombre de usuario", "CHANGEUSERNAME": "modificar", "CHANGEUSERNAME_TITLE": "Cambiar nombre de usuario", @@ -949,6 +952,14 @@ "5": "Suspendido", "6": "Inicial" }, + "STATEV2": { + "0": "Desconocido", + "1": "Activo", + "2": "Inactivo", + "3": "Borrado", + "4": "Bloqueado", + "5": "Inicial" + }, "SEARCH": { "ADDITIONAL": "Nombre de inicio de sesión (organización actual)", "ADDITIONAL-EXTERNAL": "Nombre de inicio de sesión (organización externa)" @@ -1487,7 +1498,9 @@ "ENABLED": "\"Habilitado\" se hereda", "DISABLED": "\"Deshabilitado\" se hereda" }, - "RESET": "Establecer todo a heredado" + "RESET": "Establecer todo a heredado", + "CONSOLEUSEV2USERAPI": "Utilice la API V2 en la consola para la creación de usuarios", + "CONSOLEUSEV2USERAPI_DESCRIPTION": "Cuando esta opción está habilitada, la consola utiliza la API V2 de usuario para crear nuevos usuarios. Con la API V2, los usuarios recién creados comienzan sin un estado inicial." }, "DIALOG": { "RESET": { diff --git a/console/src/assets/i18n/fr.json b/console/src/assets/i18n/fr.json index c5ae8d767c..6b3cd356d1 100644 --- a/console/src/assets/i18n/fr.json +++ b/console/src/assets/i18n/fr.json @@ -809,6 +809,9 @@ "EMAIL": "Courriel", "PHONE": "Numéro de téléphone", "PHONE_HINT": "Utilisez le symbole + suivi de l'indicatif du pays de l'appelant, ou sélectionnez le pays dans la liste déroulante et saisissez enfin le numéro de téléphone.", + "PHONE_VERIFIED": "Numéro de téléphone vérifié", + "SEND_SMS": "Envoyer un SMS de vérification", + "SEND_EMAIL": "Envoyer un Courriel", "USERNAME": "Nom de l'utilisateur", "CHANGEUSERNAME": "modifier", "CHANGEUSERNAME_TITLE": "Modifier le nom d'utilisateur", @@ -949,6 +952,14 @@ "5": "Suspendu", "6": "Initial" }, + "STATEV2": { + "0": "Inconnu", + "1": "Actif", + "2": "Inactif", + "3": "Supprimé", + "4": "Verrouillé", + "5": "Initial" + }, "SEARCH": { "ADDITIONAL": "Nom de connexion (organisation actuelle)", "ADDITIONAL-EXTERNAL": "Nom de connexion (organisation externe)" @@ -1486,7 +1497,9 @@ "ENABLED": "\"Activé\" est hérité", "DISABLED": "\"Désactivé\" est hérité" }, - "RESET": "Réinitialiser tout sur hérité" + "RESET": "Réinitialiser tout sur hérité", + "CONSOLEUSEV2USERAPI": "Utilisez l'API V2 dans la console pour la création d'utilisateurs", + "CONSOLEUSEV2USERAPI_DESCRIPTION": "Lorsque ce drapeau est activé, la console utilise l'API V2 User pour créer de nouveaux utilisateurs. Avec l'API V2, les nouveaux utilisateurs commencent sans état initial." }, "DIALOG": { "RESET": { diff --git a/console/src/assets/i18n/hu.json b/console/src/assets/i18n/hu.json index e74e9eab32..dc9db9ed2f 100644 --- a/console/src/assets/i18n/hu.json +++ b/console/src/assets/i18n/hu.json @@ -809,6 +809,9 @@ "EMAIL": "E-mail", "PHONE": "Telefonszám", "PHONE_HINT": "Használd a + szimbólumot az ország hívókódja előtt, vagy válaszd ki az országot a legördülő menüből, és végül add meg a telefonszámot", + "PHONE_VERIFIED": "Telefonszám ellenőrizve", + "SEND_SMS": "Ellenőrző SMS küldése", + "SEND_EMAIL": "E-mail küldése", "USERNAME": "Felhasználónév", "CHANGEUSERNAME": "módosít", "CHANGEUSERNAME_TITLE": "Felhasználónév megváltoztatása", @@ -949,6 +952,14 @@ "5": "Felfüggesztett", "6": "Kezdeti" }, + "STATEV2": { + "0": "Ismeretlen", + "1": "Aktív", + "2": "Inaktív", + "3": "Törölt", + "4": "Zárolt", + "5": "Kezdeti" + }, "SEARCH": { "ADDITIONAL": "Belépési név (jelenlegi szervezet)", "ADDITIONAL-EXTERNAL": "Belépési név (külső szervezet)" @@ -1484,7 +1495,9 @@ "ENABLED": "\"Engedélyezve\" öröklődik", "DISABLED": "\"Letiltva\" öröklődik" }, - "RESET": "Mindent állíts öröklésre" + "RESET": "Mindent állíts öröklésre", + "CONSOLEUSEV2USERAPI": "Használja a V2 API-t a konzolban felhasználók létrehozásához", + "CONSOLEUSEV2USERAPI_DESCRIPTION": "Ha ez a jelző engedélyezve van, a konzol a V2 User API-t használja új felhasználók létrehozásához. A V2 API-val az újonnan létrehozott felhasználók kezdeti állapot nélkül indulnak." }, "DIALOG": { "RESET": { diff --git a/console/src/assets/i18n/id.json b/console/src/assets/i18n/id.json index d5dbd48128..50c897a752 100644 --- a/console/src/assets/i18n/id.json +++ b/console/src/assets/i18n/id.json @@ -749,6 +749,9 @@ "EMAIL": "E-mail", "PHONE": "Nomor telepon", "PHONE_HINT": "Gunakan simbol + diikuti dengan kode negara pemanggil, atau pilih negara dari dropdown dan terakhir masukkan nomor telepon", + "PHONE_VERIFIED": "Nomor telepon terverifikasi", + "SEND_SMS": "Kirim SMS verifikasi", + "SEND_EMAIL": "Kirim E-mail", "USERNAME": "Nama belakang", "CHANGEUSERNAME": "memodifikasi", "CHANGEUSERNAME_TITLE": "Ubah nama pengguna", @@ -878,6 +881,14 @@ "5": "Tergantung", "6": "Awal" }, + "STATEV2": { + "0": "Tidak dikenal", + "1": "Aktif", + "2": "Tidak aktif", + "3": "Dihapus", + "4": "Terkunci", + "5": "Awal" + }, "SEARCH": { "ADDITIONAL": "Nama login (organisasi saat ini)", "ADDITIONAL-EXTERNAL": "Nama login (organisasi eksternal)" @@ -1354,7 +1365,9 @@ "ENABLED": "\"Diaktifkan\" diwariskan", "DISABLED": "\"Dinonaktifkan\" diwariskan" }, - "RESET": "Tetapkan semua untuk diwarisi" + "RESET": "Tetapkan semua untuk diwarisi", + "CONSOLEUSEV2USERAPI": "Gunakan API V2 di konsol untuk pembuatan pengguna", + "CONSOLEUSEV2USERAPI_DESCRIPTION": "Ketika flag ini diaktifkan, konsol menggunakan API Pengguna V2 untuk membuat pengguna baru. Dengan API V2, pengguna yang baru dibuat dimulai tanpa keadaan awal." }, "DIALOG": { "RESET": { diff --git a/console/src/assets/i18n/it.json b/console/src/assets/i18n/it.json index 1910146698..0f8c324d3b 100644 --- a/console/src/assets/i18n/it.json +++ b/console/src/assets/i18n/it.json @@ -808,6 +808,9 @@ "EMAIL": "E-mail", "PHONE": "Numero di telefono", "PHONE_HINT": "Utilizza il simbolo + seguito dal prefisso del paese, o seleziona il paese ed inserisci il numero di telefono", + "PHONE_VERIFIED": "Numero di telefono verificato", + "SEND_SMS": "Invia SMS di verifica", + "SEND_EMAIL": "Invia E-mail", "USERNAME": "Nome utente", "CHANGEUSERNAME": "cambia", "CHANGEUSERNAME_TITLE": "Cambia nome utente", @@ -948,6 +951,14 @@ "5": "Sospeso", "6": "Initializzato" }, + "STATEV2": { + "0": "Sconosciuto", + "1": "Attivo", + "2": "Inattivo", + "3": "Rimosso", + "4": "Bloccato", + "5": "Initializzato" + }, "SEARCH": { "ADDITIONAL": "Nome (organizzazione corrente)", "ADDITIONAL-EXTERNAL": "Loginname (organizzazione esterna)" @@ -1486,7 +1497,9 @@ "ENABLED": "\"Abilitato\" viene ereditato", "DISABLED": "\"Disabilitato\" viene ereditato" }, - "RESET": "Imposta tutto su predefinito" + "RESET": "Imposta tutto su predefinito", + "CONSOLEUSEV2USERAPI": "Utilizza l'API V2 nella console per la creazione degli utenti", + "CONSOLEUSEV2USERAPI_DESCRIPTION": "Quando questa opzione è abilitata, la console utilizza l'API V2 User per creare nuovi utenti. Con l'API V2, i nuovi utenti creati iniziano senza uno stato iniziale." }, "DIALOG": { "RESET": { diff --git a/console/src/assets/i18n/ja.json b/console/src/assets/i18n/ja.json index 3e75cd94a2..18047c847e 100644 --- a/console/src/assets/i18n/ja.json +++ b/console/src/assets/i18n/ja.json @@ -809,6 +809,9 @@ "EMAIL": "Eメール", "PHONE": "電話番号", "PHONE_HINT": "+ マークに続いて電話をかけたい国コードを入力するか、ドロップダウンから国を選択して電話番号を入力します。", + "PHONE_VERIFIED": "電話番号が確認されました", + "SEND_SMS": "認証SMSを送信", + "SEND_EMAIL": "メールを送信", "USERNAME": "ユーザー名", "CHANGEUSERNAME": "変更", "CHANGEUSERNAME_TITLE": "ユーザー名の変更", @@ -949,6 +952,14 @@ "5": "停止", "6": "初期化待ち" }, + "STATEV2": { + "0": "不明", + "1": "アクティブ", + "2": "非アクティブ", + "3": "削除", + "4": "ロック", + "5": "初期化待ち" + }, "SEARCH": { "ADDITIONAL": "ログインネーム（現在の組織）", "ADDITIONAL-EXTERNAL": "ログインネーム（外部の組織）" @@ -1486,7 +1497,9 @@ "ENABLED": "有効は継承されます", "DISABLED": "無効は継承されます" }, - "RESET": "すべて継承に設定" + "RESET": "すべて継承に設定", + "CONSOLEUSEV2USERAPI": "コンソールでユーザー作成のためにV2 APIを使用してください。", + "CONSOLEUSEV2USERAPI_DESCRIPTION": "このフラグが有効化されると、コンソールはV2ユーザーAPIを使用して新しいユーザーを作成します。V2 APIでは、新しく作成されたユーザーは初期状態なしで開始します。" }, "DIALOG": { "RESET": { diff --git a/console/src/assets/i18n/ko.json b/console/src/assets/i18n/ko.json index 79fe95324a..14aec2246e 100644 --- a/console/src/assets/i18n/ko.json +++ b/console/src/assets/i18n/ko.json @@ -809,6 +809,9 @@ "EMAIL": "이메일", "PHONE": "전화번호", "PHONE_HINT": "+ 기호 다음에 국가 코드를 입력하거나 드롭다운에서 국가를 선택한 후 전화번호를 입력하세요.", + "PHONE_VERIFIED": "전화번호 확인됨", + "SEND_SMS": "인증 SMS 보내기", + "SEND_EMAIL": "이메일 보내기", "USERNAME": "사용자 이름", "CHANGEUSERNAME": "수정", "CHANGEUSERNAME_TITLE": "사용자 이름 변경", @@ -949,6 +952,14 @@ "5": "일시 중단됨", "6": "초기" }, + "STATEV2": { + "0": "알 수 없음", + "1": "활성", + "2": "비활성", + "3": "삭제됨", + "4": "잠김", + "5": "초기" + }, "SEARCH": { "ADDITIONAL": "로그인 이름 (현재 조직)", "ADDITIONAL-EXTERNAL": "로그인 이름 (외부 조직)" @@ -1486,7 +1497,9 @@ "ENABLED": "\"활성화됨\"은 상속되었습니다.", "DISABLED": "\"비활성화됨\"은 상속되었습니다." }, - "RESET": "모두 상속으로 설정" + "RESET": "모두 상속으로 설정", + "CONSOLEUSEV2USERAPI": "콘솔에서 사용자 생성을 위해 V2 API를 사용하세요", + "CONSOLEUSEV2USERAPI_DESCRIPTION": "이 플래그가 활성화되면 콘솔은 V2 사용자 API를 사용하여 새 사용자를 생성합니다. V2 API를 사용하면 새로 생성된 사용자는 초기 상태 없이 시작합니다." }, "DIALOG": { "RESET": { diff --git a/console/src/assets/i18n/mk.json b/console/src/assets/i18n/mk.json index 78d231ade7..51c645e233 100644 --- a/console/src/assets/i18n/mk.json +++ b/console/src/assets/i18n/mk.json @@ -809,6 +809,9 @@ "EMAIL": "Е-пошта", "PHONE": "Телефонски број", "PHONE_HINT": "Користете + и потоа дополнителниот број на земјата, или изберете ја земјата од листата и на крај внесете го телефонскиот број", + "PHONE_VERIFIED": "Телефонскиот број е потврден", + "SEND_SMS": "Испрати СМС за верификација", + "SEND_EMAIL": "Испрати е-пошта", "USERNAME": "Корисничко име", "CHANGEUSERNAME": "промени", "CHANGEUSERNAME_TITLE": "Промени корисничко име", @@ -949,6 +952,14 @@ "5": "Суспендирано", "6": "Иницијално" }, + "STATEV2": { + "0": "Непознато", + "1": "Активно", + "2": "Неактивно", + "3": "Избришано", + "4": "Заклучено", + "5": "Иницијално" + }, "SEARCH": { "ADDITIONAL": "Корисничко име (тековна организација)", "ADDITIONAL-EXTERNAL": "Корисничко име (надворешна организација)" @@ -1487,7 +1498,9 @@ "ENABLED": "„Овозможено“ е наследено", "DISABLED": "„Оневозможено“ е наследено" }, - "RESET": "Поставете ги сите да наследат" + "RESET": "Поставете ги сите да наследат", + "CONSOLEUSEV2USERAPI": "Користете V2 API во конзолата за креирање на корисници", + "CONSOLEUSEV2USERAPI_DESCRIPTION": "Кога ова знаме е овозможено, конзолата го користи V2 User API за креирање на нови корисници. Со V2 API, новосоздадените корисници започнуваат без почетна состојба." }, "DIALOG": { "RESET": { diff --git a/console/src/assets/i18n/nl.json b/console/src/assets/i18n/nl.json index cb1a66469a..0914858c85 100644 --- a/console/src/assets/i18n/nl.json +++ b/console/src/assets/i18n/nl.json @@ -809,6 +809,9 @@ "EMAIL": "E-mail", "PHONE": "Telefoonnummer", "PHONE_HINT": "Gebruik het + symbool gevolgd door de landcode, of selecteer het land uit de dropdown en voer ten slotte het telefoonnummer in", + "PHONE_VERIFIED": "Telefoonnummer geverifieerd", + "SEND_SMS": "Verificatie-SMS verzenden", + "SEND_EMAIL": "E-mail verzenden", "USERNAME": "Gebruikersnaam", "CHANGEUSERNAME": "wijzigen", "CHANGEUSERNAME_TITLE": "Gebruikersnaam wijzigen", @@ -949,6 +952,14 @@ "5": "Opgeschort", "6": "Initieel" }, + "STATEV2": { + "0": "Onbekend", + "1": "Actief", + "2": "Inactief", + "3": "Verwijderd", + "4": "Vergrendeld", + "5": "Initieel" + }, "SEARCH": { "ADDITIONAL": "Loginnaam (huidige organisatie)", "ADDITIONAL-EXTERNAL": "Loginnaam (externe organisatie)" @@ -1484,7 +1495,9 @@ "ENABLED": "\"Ingeschakeld\" wordt overgenomen", "DISABLED": "\"Uitgeschakeld\" wordt overgenomen" }, - "RESET": "Alles instellen op overgenomen" + "RESET": "Alles instellen op overgenomen", + "CONSOLEUSEV2USERAPI": "Gebruik de V2 API in de console voor het aanmaken van gebruikers", + "CONSOLEUSEV2USERAPI_DESCRIPTION": "Wanneer deze vlag is ingeschakeld, gebruikt de console de V2 User API om nieuwe gebruikers aan te maken. Met de V2 API beginnen nieuw aangemaakte gebruikers zonder een initiële status." }, "DIALOG": { "RESET": { diff --git a/console/src/assets/i18n/pl.json b/console/src/assets/i18n/pl.json index 934e569d9a..a8987142d7 100644 --- a/console/src/assets/i18n/pl.json +++ b/console/src/assets/i18n/pl.json @@ -808,6 +808,9 @@ "EMAIL": "E-mail", "PHONE": "Numer telefonu", "PHONE_HINT": "Użyj symbolu +, a następnie kodu kraju, z którego dzwonisz, lub wybierz kraj z listy rozwijanej i wprowadź numer telefonu.", + "PHONE_VERIFIED": "Numer telefonu zweryfikowany", + "SEND_SMS": "Wyślij SMS weryfikacyjny", + "SEND_EMAIL": "Wyślij E-mail", "USERNAME": "Nazwa użytkownika", "CHANGEUSERNAME": "modyfikuj", "CHANGEUSERNAME_TITLE": "Zmień nazwę użytkownika", @@ -948,6 +951,14 @@ "5": "Zawieszony", "6": "Początkowy" }, + "STATEV2": { + "0": "Nieznany", + "1": "Aktywny", + "2": "Nieaktywny", + "3": "Usunięty", + "4": "Zablokowany", + "5": "Początkowy" + }, "SEARCH": { "ADDITIONAL": "Nazwa użytkownika (obecna organizacja)", "ADDITIONAL-EXTERNAL": "Nazwa użytkownika (organizacja zewnętrzna)" @@ -1485,7 +1496,9 @@ "ENABLED": "„Włączony” jest dziedziczone", "DISABLED": "„Wyłączony” jest dziedziczone" }, - "RESET": "Ustaw wszystko na dziedziczone" + "RESET": "Ustaw wszystko na dziedziczone", + "CONSOLEUSEV2USERAPI": "Użyj API V2 w konsoli do tworzenia użytkowników", + "CONSOLEUSEV2USERAPI_DESCRIPTION": "Gdy ta flaga jest włączona, konsola używa API V2 User do tworzenia nowych użytkowników. W przypadku API V2 nowo utworzeni użytkownicy rozpoczynają bez stanu początkowego." }, "DIALOG": { "RESET": { diff --git a/console/src/assets/i18n/pt.json b/console/src/assets/i18n/pt.json index f6fbc826dd..cb1624ba3a 100644 --- a/console/src/assets/i18n/pt.json +++ b/console/src/assets/i18n/pt.json @@ -809,6 +809,9 @@ "EMAIL": "E-mail", "PHONE": "Número de Telefone", "PHONE_HINT": "Use o símbolo + seguido do código de chamada do país, ou selecione o país na lista suspensa e, em seguida, insira o número de telefone", + "PHONE_VERIFIED": "Número de telefone verificado", + "SEND_SMS": "Enviar SMS de verificação", + "SEND_EMAIL": "Enviar E-mail", "USERNAME": "Nome de Usuário", "CHANGEUSERNAME": "modificar", "CHANGEUSERNAME_TITLE": "Alterar nome de usuário", @@ -949,6 +952,14 @@ "5": "Suspenso", "6": "Inicial" }, + "STATEV2": { + "0": "Desconhecido", + "1": "Ativo", + "2": "Inativo", + "3": "Excluído", + "4": "Bloqueado", + "5": "Inicial" + }, "SEARCH": { "ADDITIONAL": "Nome de usuário (organização atual)", "ADDITIONAL-EXTERNAL": "Nome de usuário (organização externa)" @@ -1487,7 +1498,9 @@ "ENABLED": "\"Habilitado\" é herdado", "DISABLED": "\"Desabilitado\" é herdado" }, - "RESET": "Definir tudo para herdar" + "RESET": "Definir tudo para herdar", + "CONSOLEUSEV2USERAPI": "Use a API V2 no console para criação de usuários", + "CONSOLEUSEV2USERAPI_DESCRIPTION": "Quando esta opção está ativada, o console utiliza a API V2 de Usuários para criar novos usuários. Com a API V2, os novos usuários criados começam sem um estado inicial." }, "DIALOG": { "RESET": { diff --git a/console/src/assets/i18n/ru.json b/console/src/assets/i18n/ru.json index 8a3ca0c1de..123b00122e 100644 --- a/console/src/assets/i18n/ru.json +++ b/console/src/assets/i18n/ru.json @@ -816,6 +816,9 @@ "EMAIL": "Электронная почта", "PHONE": "Номер телефона", "PHONE_HINT": "Используйте 00 или символ +, за которым следует код страны вызываемого абонента, или выберите страну из раскрывающегося списка и введите номер телефона.", + "PHONE_VERIFIED": "Номер телефона подтвержден", + "SEND_SMS": "Отправить проверочный SMS", + "SEND_EMAIL": "Отправить e-mail", "USERNAME": "Имя пользователя", "CHANGEUSERNAME": "Изменить", "CHANGEUSERNAME_TITLE": "Изменить имя пользователя", @@ -967,6 +970,14 @@ "5": "Приостановлен", "6": "Начальный" }, + "STATEV2": { + "0": "Неизвестен", + "1": "Активен", + "2": "Неактивен", + "3": "Удалён", + "4": "Заблокирован", + "5": "Начальный" + }, "SEARCH": { "ADDITIONAL": "Логин (текущая организация)", "ADDITIONAL-EXTERNAL": "Логин (внешняя организация)" @@ -1538,7 +1549,9 @@ "ENABLED": "«Включено» наследуется", "DISABLED": "«Выключено» передается по наследству" }, - "RESET": "Установить все по умолчанию" + "RESET": "Установить все по умолчанию", + "CONSOLEUSEV2USERAPI": "Используйте V2 API в консоли для создания пользователей", + "CONSOLEUSEV2USERAPI_DESCRIPTION": "Когда этот флаг включен, консоль использует V2 User API для создания новых пользователей. С API V2 новые пользователи создаются без начального состояния." }, "DIALOG": { "RESET": { diff --git a/console/src/assets/i18n/sv.json b/console/src/assets/i18n/sv.json index fd698478fb..aeb3e31074 100644 --- a/console/src/assets/i18n/sv.json +++ b/console/src/assets/i18n/sv.json @@ -809,6 +809,9 @@ "EMAIL": "E-post", "PHONE": "Telefonnummer", "PHONE_HINT": "Använd + symbolen följt av landskoden, eller välj landet från rullgardinsmenyn och ange sedan telefonnumret", + "PHONE_VERIFIED": "Telefonnummer verifierat", + "SEND_SMS": "Skicka verifierings-SMS", + "SEND_EMAIL": "Skicka E-post", "USERNAME": "Användarnamn", "CHANGEUSERNAME": "ändra", "CHANGEUSERNAME_TITLE": "Ändra användarnamn", @@ -949,6 +952,14 @@ "5": "Suspenderad", "6": "Initial" }, + "STATEV2": { + "0": "Okänd", + "1": "Aktiv", + "2": "Inaktiv", + "3": "Raderad", + "4": "Låst", + "5": "Initial" + }, "SEARCH": { "ADDITIONAL": "Inloggningsnamn (nuvarande organisation)", "ADDITIONAL-EXTERNAL": "Inloggningsnamn (extern organisation)" @@ -1490,7 +1501,9 @@ "ENABLED": "\"Aktiverad\" ärvs", "DISABLED": "\"Inaktiverad\" ärvs" }, - "RESET": "Återställ allt till arv" + "RESET": "Återställ allt till arv", + "CONSOLEUSEV2USERAPI": "Använd V2 API i konsolen för att skapa användare", + "CONSOLEUSEV2USERAPI_DESCRIPTION": "När denna flagga är aktiverad använder konsolen V2 User API för att skapa nya användare. Med V2 API startar nyligen skapade användare utan ett initialt tillstånd." }, "DIALOG": { "RESET": { diff --git a/console/src/assets/i18n/zh.json b/console/src/assets/i18n/zh.json index 99bf053225..fb2eb1a080 100644 --- a/console/src/assets/i18n/zh.json +++ b/console/src/assets/i18n/zh.json @@ -809,6 +809,9 @@ "EMAIL": "电子邮件", "PHONE": "手机号码", "PHONE_HINT": "使用+号，后跟呼叫者的国家/地区代码，或从下拉列表中选择国家/地区，最后输入电话号码", + "PHONE_VERIFIED": "电话号码已验证", + "SEND_SMS": "发送验证短信", + "SEND_EMAIL": "发送电子邮件", "USERNAME": "用户名", "CHANGEUSERNAME": "修改", "CHANGEUSERNAME_TITLE": "修改用户名称", @@ -949,6 +952,14 @@ "5": "已暂停", "6": "初始化" }, + "STATEV2": { + "0": "未知", + "1": "启用", + "2": "停用", + "3": "已删除", + "4": "已锁定", + "5": "初始化" + }, "SEARCH": { "ADDITIONAL": "登录名 (当前组织)", "ADDITIONAL-EXTERNAL": "登录名 (外部组织)" @@ -1486,7 +1497,9 @@ "ENABLED": "“已启用” 是继承的", "DISABLED": "“已禁用” 是继承的" }, - "RESET": "全部设置为继承" + "RESET": "全部设置为继承", + "CONSOLEUSEV2USERAPI": "在控制台中使用V2 API创建用户。", + "CONSOLEUSEV2USERAPI_DESCRIPTION": "启用此标志时，控制台使用V2用户API创建新用户。使用V2 API，新创建的用户将以无初始状态开始。" }, "DIALOG": { "RESET": { diff --git a/console/yarn.lock b/console/yarn.lock index 73512cb091..67aef4201a 100644 --- a/console/yarn.lock +++ b/console/yarn.lock @@ -1501,11 +1501,31 @@ "@bufbuild/buf-win32-arm64" "1.43.0" "@bufbuild/buf-win32-x64" "1.43.0" +"@bufbuild/protobuf@^2.2.2": + version "2.2.3" + resolved "https://registry.yarnpkg.com/@bufbuild/protobuf/-/protobuf-2.2.3.tgz#9cd136f6b687e63e9b517b3a54211ece942897ee" + integrity sha512-tFQoXHJdkEOSwj5tRIZSPNUuXK3RaR7T1nUrPgbYX1pUbvqqaaZAsfo+NXBPsz5rZMSKVFrgK1WL8Q/MSLvprg== + "@colors/colors@1.5.0": version "1.5.0" resolved "https://registry.yarnpkg.com/@colors/colors/-/colors-1.5.0.tgz#bb504579c1cae923e6576a4f5da43d25f97bdbd9" integrity sha512-ooWCrlZP11i8GImSjTHYHLkvFDP48nS4+204nGb1RiX/WXYHmJA2III9/e2DWVabCESdW7hBAEzHRqUn9OUVvQ== +"@connectrpc/connect-node@^2.0.0": + version "2.0.0" + resolved "https://registry.yarnpkg.com/@connectrpc/connect-node/-/connect-node-2.0.0.tgz#1ea4eff7f2633fbe3d80378e1420bd213d9d83a4" + integrity sha512-DoI5T+SUvlS/8QBsxt2iDoUg15dSxqhckegrgZpWOtADtmGohBIVbx1UjtWmjLBrP4RdD0FeBw+XyRUSbpKnJQ== + +"@connectrpc/connect-web@^2.0.0": + version "2.0.0" + resolved "https://registry.yarnpkg.com/@connectrpc/connect-web/-/connect-web-2.0.0.tgz#14055c933bfe846e75856bce49ecd0250cbec3b2" + integrity sha512-oeCxqHXLXlWJdmcvp9L3scgAuK+FjNSn+twyhUxc8yvDbTumnt5Io+LnBzSYxAdUdYqTw5yHfTSCJ4hj0QID0g== + +"@connectrpc/connect@^2.0.0": + version "2.0.0" + resolved "https://registry.yarnpkg.com/@connectrpc/connect/-/connect-2.0.0.tgz#0a34d934bdce5fd3723f79b70aa843d4c1213df8" + integrity sha512-Usm8jgaaULANJU8vVnhWssSA6nrZ4DJEAbkNtXSoZay2YD5fDyMukCxu8NEhCvFzfHvrhxhcjttvgpyhOM7xAQ== + "@ctrl/ngx-codemirror@^6.1.0": version "6.1.0" resolved "https://registry.yarnpkg.com/@ctrl/ngx-codemirror/-/ngx-codemirror-6.1.0.tgz#9324a56e4b709be9c515364d21e05e1d7589f009" @@ -3496,6 +3516,25 @@ js-yaml "^3.10.0" tslib "^2.4.0" +"@zitadel/client@^1.0.6": + version "1.0.6" + resolved "https://registry.yarnpkg.com/@zitadel/client/-/client-1.0.6.tgz#9fe44ff7c757e8f38fa08d25083dc036afebf5cb" + integrity sha512-MG6RAApoI2Y3QGRfKByISOqGTSFsMr5YtKQYPFDAJhivYK32d7hUiMEv+WzShfGHEI38336FbKz9vg/4M961Lg== + dependencies: + "@bufbuild/protobuf" "^2.2.2" + "@connectrpc/connect" "^2.0.0" + "@connectrpc/connect-node" "^2.0.0" + "@connectrpc/connect-web" "^2.0.0" + "@zitadel/proto" "1.0.3" + jose "^5.3.0" + +"@zitadel/proto@1.0.3", "@zitadel/proto@^1.0.3": + version "1.0.3" + resolved "https://registry.yarnpkg.com/@zitadel/proto/-/proto-1.0.3.tgz#28721710d9e87009adf14f90e0c8cb9bae5275ec" + integrity sha512-95XPGgFgfTwU1A3oQYxTv4p+Qy/9yMO/o21VRtPBfVhPusFFCW0ddg4YoKTKpQl9FbIG7VYMLmRyuJBPuf3r+g== + dependencies: + "@bufbuild/protobuf" "^2.2.2" + "@zkochan/js-yaml@0.0.6": version "0.0.6" resolved "https://registry.yarnpkg.com/@zkochan/js-yaml/-/js-yaml-0.0.6.tgz#975f0b306e705e28b8068a07737fa46d3fc04826" @@ -6538,6 +6577,11 @@ jiti@^1.18.2: resolved "https://registry.yarnpkg.com/jiti/-/jiti-1.21.6.tgz#6c7f7398dd4b3142767f9a168af2f317a428d268" integrity sha512-2yTgeWTWzMWkHu6Jp9NKgePDaYHbntiwvYuuJLbbN9vl7DC9DvXKOB2BC3ZZ92D3cvV/aflH0osDfwpHepQ53w== +jose@^5.3.0: + version "5.9.6" + resolved "https://registry.yarnpkg.com/jose/-/jose-5.9.6.tgz#77f1f901d88ebdc405e57cce08d2a91f47521883" + integrity sha512-AMlnetc9+CV9asI19zHmrgS/WYsWUwCn2R7RzlbJWD7F9eWYUTGyBmU9o6PxngtLGOiDGPRu+Uc4fhKzbpteZQ== + js-tokens@^4.0.0: version "4.0.0" resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499" diff --git a/e2e/cypress/e2e/machines/machines.cy.ts b/e2e/cypress/e2e/machines/machines.cy.ts index 504dc88df2..4ffe06feea 100644 --- a/e2e/cypress/e2e/machines/machines.cy.ts +++ b/e2e/cypress/e2e/machines/machines.cy.ts @@ -56,8 +56,8 @@ describe('machines', () => { loginName = loginname(machine.removeName, Cypress.env('ORGANIZATION')); } it('should delete a machine', () => { - const rowSelector = `tr:contains(${machine.removeName})`; - cy.get(rowSelector).find('[data-e2e="enabled-delete-button"]').click({ force: true }); + const rowSelector = `tr:contains('${machine.removeName}')`; + cy.get(rowSelector).should('be.visible').find('[data-e2e="enabled-delete-button"]').click({ force: true }); cy.get('[data-e2e="confirm-dialog-input"]').focus().should('be.enabled').type(loginName); cy.get('[data-e2e="confirm-dialog-button"]').click(); cy.shouldConfirmSuccess(); diff --git a/internal/api/grpc/feature/v2/converter.go b/internal/api/grpc/feature/v2/converter.go index fee4450ce2..60cf569082 100644 --- a/internal/api/grpc/feature/v2/converter.go +++ b/internal/api/grpc/feature/v2/converter.go @@ -71,6 +71,7 @@ func instanceFeaturesToCommand(req *feature_pb.SetInstanceFeaturesRequest) (*com EnableBackChannelLogout: req.EnableBackChannelLogout, LoginV2: loginV2, PermissionCheckV2: req.PermissionCheckV2, + ConsoleUseV2UserApi: req.ConsoleUseV2UserApi, }, nil } @@ -91,6 +92,7 @@ func instanceFeaturesToPb(f *query.InstanceFeatures) *feature_pb.GetInstanceFeat EnableBackChannelLogout: featureSourceToFlagPb(&f.EnableBackChannelLogout), LoginV2: loginV2ToLoginV2FlagPb(f.LoginV2), PermissionCheckV2: featureSourceToFlagPb(&f.PermissionCheckV2), + ConsoleUseV2UserApi: featureSourceToFlagPb(&f.ConsoleUseV2UserApi), } } diff --git a/internal/api/grpc/feature/v2/converter_test.go b/internal/api/grpc/feature/v2/converter_test.go index bf87dc959b..62cf701eec 100644 --- a/internal/api/grpc/feature/v2/converter_test.go +++ b/internal/api/grpc/feature/v2/converter_test.go @@ -183,6 +183,7 @@ func Test_instanceFeaturesToCommand(t *testing.T) { Required: true, BaseUri: gu.Ptr("https://login.com"), }, + ConsoleUseV2UserApi: gu.Ptr(true), } want := &command.InstanceFeatures{ LoginDefaultOrg: gu.Ptr(true), @@ -200,6 +201,7 @@ func Test_instanceFeaturesToCommand(t *testing.T) { Required: true, BaseURI: &url.URL{Scheme: "https", Host: "login.com"}, }, + ConsoleUseV2UserApi: gu.Ptr(true), } got, err := instanceFeaturesToCommand(arg) assert.Equal(t, want, got) @@ -264,6 +266,10 @@ func Test_instanceFeaturesToPb(t *testing.T) { Level: feature.LevelInstance, Value: true, }, + ConsoleUseV2UserApi: query.FeatureSource[bool]{ + Level: feature.LevelInstance, + Value: true, + }, } want := &feature_pb.GetInstanceFeaturesResponse{ Details: &object.Details{ @@ -328,6 +334,10 @@ func Test_instanceFeaturesToPb(t *testing.T) { Enabled: true, Source: feature_pb.Source_SOURCE_INSTANCE, }, + ConsoleUseV2UserApi: &feature_pb.FeatureFlag{ + Enabled: true, + Source: feature_pb.Source_SOURCE_INSTANCE, + }, } got := instanceFeaturesToPb(arg) assert.Equal(t, want, got) diff --git a/internal/command/instance_features.go b/internal/command/instance_features.go index 1f714671bd..3e927cc0c5 100644 --- a/internal/command/instance_features.go +++ b/internal/command/instance_features.go @@ -30,6 +30,7 @@ type InstanceFeatures struct { EnableBackChannelLogout *bool LoginV2 *feature.LoginV2 PermissionCheckV2 *bool + ConsoleUseV2UserApi *bool } func (m *InstanceFeatures) isEmpty() bool { @@ -47,7 +48,7 @@ func (m *InstanceFeatures) isEmpty() bool { m.DisableUserTokenEvent == nil && m.EnableBackChannelLogout == nil && m.LoginV2 == nil && - m.PermissionCheckV2 == nil + m.PermissionCheckV2 == nil && m.ConsoleUseV2UserApi == nil } func (c *Commands) SetInstanceFeatures(ctx context.Context, f *InstanceFeatures) (*domain.ObjectDetails, error) { diff --git a/internal/command/instance_features_model.go b/internal/command/instance_features_model.go index aaa8b2e53a..954c769304 100644 --- a/internal/command/instance_features_model.go +++ b/internal/command/instance_features_model.go @@ -80,6 +80,7 @@ func (m *InstanceFeaturesWriteModel) Query() *eventstore.SearchQueryBuilder { feature_v2.InstanceEnableBackChannelLogout, feature_v2.InstanceLoginVersion, feature_v2.InstancePermissionCheckV2, + feature_v2.InstanceConsoleUseV2UserApi, ). Builder().ResourceOwner(m.ResourceOwner) } @@ -133,6 +134,9 @@ func reduceInstanceFeature(features *InstanceFeatures, key feature.Key, value an case feature.KeyPermissionCheckV2: v := value.(bool) features.PermissionCheckV2 = &v + case feature.KeyConsoleUseV2UserApi: + v := value.(bool) + features.ConsoleUseV2UserApi = &v } } @@ -153,5 +157,6 @@ func (wm *InstanceFeaturesWriteModel) setCommands(ctx context.Context, f *Instan cmds = appendFeatureUpdate(ctx, cmds, aggregate, wm.EnableBackChannelLogout, f.EnableBackChannelLogout, feature_v2.InstanceEnableBackChannelLogout) cmds = appendFeatureUpdate(ctx, cmds, aggregate, wm.LoginV2, f.LoginV2, feature_v2.InstanceLoginVersion) cmds = appendFeatureUpdate(ctx, cmds, aggregate, wm.PermissionCheckV2, f.PermissionCheckV2, feature_v2.InstancePermissionCheckV2) + cmds = appendFeatureUpdate(ctx, cmds, aggregate, wm.ConsoleUseV2UserApi, f.ConsoleUseV2UserApi, feature_v2.InstanceConsoleUseV2UserApi) return cmds } diff --git a/internal/feature/feature.go b/internal/feature/feature.go index d9a2d6352d..638917fd68 100644 --- a/internal/feature/feature.go +++ b/internal/feature/feature.go @@ -24,6 +24,7 @@ const ( KeyEnableBackChannelLogout KeyLoginV2 KeyPermissionCheckV2 + KeyConsoleUseV2UserApi ) //go:generate enumer -type Level -transform snake -trimprefix Level @@ -54,6 +55,7 @@ type Features struct { EnableBackChannelLogout bool `json:"enable_back_channel_logout,omitempty"` LoginV2 LoginV2 `json:"login_v2,omitempty"` PermissionCheckV2 bool `json:"permission_check_v2,omitempty"` + ConsoleUseV2UserApi bool `json:"console_use_v2_user_api,omitempty"` } type ImprovedPerformanceType int32 diff --git a/internal/feature/key_enumer.go b/internal/feature/key_enumer.go index 3a805df807..5a37b96270 100644 --- a/internal/feature/key_enumer.go +++ b/internal/feature/key_enumer.go @@ -7,11 +7,11 @@ import ( "strings" ) -const _KeyName = "unspecifiedlogin_default_orgtrigger_introspection_projectionslegacy_introspectionuser_schematoken_exchangeactionsimproved_performanceweb_keydebug_oidc_parent_erroroidc_single_v1_session_terminationdisable_user_token_eventenable_back_channel_logoutlogin_v2permission_check_v2" +const _KeyName = "unspecifiedlogin_default_orgtrigger_introspection_projectionslegacy_introspectionuser_schematoken_exchangeactionsimproved_performanceweb_keydebug_oidc_parent_erroroidc_single_v1_session_terminationdisable_user_token_eventenable_back_channel_logoutlogin_v2permission_check_v2console_use_v2_user_api" -var _KeyIndex = [...]uint16{0, 11, 28, 61, 81, 92, 106, 113, 133, 140, 163, 197, 221, 247, 255, 274} +var _KeyIndex = [...]uint16{0, 11, 28, 61, 81, 92, 106, 113, 133, 140, 163, 197, 221, 247, 255, 274, 297} -const _KeyLowerName = "unspecifiedlogin_default_orgtrigger_introspection_projectionslegacy_introspectionuser_schematoken_exchangeactionsimproved_performanceweb_keydebug_oidc_parent_erroroidc_single_v1_session_terminationdisable_user_token_eventenable_back_channel_logoutlogin_v2permission_check_v2" +const _KeyLowerName = "unspecifiedlogin_default_orgtrigger_introspection_projectionslegacy_introspectionuser_schematoken_exchangeactionsimproved_performanceweb_keydebug_oidc_parent_erroroidc_single_v1_session_terminationdisable_user_token_eventenable_back_channel_logoutlogin_v2permission_check_v2console_use_v2_user_api" func (i Key) String() string { if i < 0 || i >= Key(len(_KeyIndex)-1) { @@ -39,9 +39,10 @@ func _KeyNoOp() { _ = x[KeyEnableBackChannelLogout-(12)] _ = x[KeyLoginV2-(13)] _ = x[KeyPermissionCheckV2-(14)] + _ = x[KeyConsoleUseV2UserApi-(15)] } -var _KeyValues = []Key{KeyUnspecified, KeyLoginDefaultOrg, KeyTriggerIntrospectionProjections, KeyLegacyIntrospection, KeyUserSchema, KeyTokenExchange, KeyActions, KeyImprovedPerformance, KeyWebKey, KeyDebugOIDCParentError, KeyOIDCSingleV1SessionTermination, KeyDisableUserTokenEvent, KeyEnableBackChannelLogout, KeyLoginV2, KeyPermissionCheckV2} +var _KeyValues = []Key{KeyUnspecified, KeyLoginDefaultOrg, KeyTriggerIntrospectionProjections, KeyLegacyIntrospection, KeyUserSchema, KeyTokenExchange, KeyActions, KeyImprovedPerformance, KeyWebKey, KeyDebugOIDCParentError, KeyOIDCSingleV1SessionTermination, KeyDisableUserTokenEvent, KeyEnableBackChannelLogout, KeyLoginV2, KeyPermissionCheckV2, KeyConsoleUseV2UserApi} var _KeyNameToValueMap = map[string]Key{ _KeyName[0:11]: KeyUnspecified, @@ -74,6 +75,8 @@ var _KeyNameToValueMap = map[string]Key{ _KeyLowerName[247:255]: KeyLoginV2, _KeyName[255:274]: KeyPermissionCheckV2, _KeyLowerName[255:274]: KeyPermissionCheckV2, + _KeyName[274:297]: KeyConsoleUseV2UserApi, + _KeyLowerName[274:297]: KeyConsoleUseV2UserApi, } var _KeyNames = []string{ @@ -92,6 +95,7 @@ var _KeyNames = []string{ _KeyName[221:247], _KeyName[247:255], _KeyName[255:274], + _KeyName[274:297], } // KeyString retrieves an enum value from the enum constants string name. diff --git a/internal/query/instance_features.go b/internal/query/instance_features.go index 646404ce6c..911edaa606 100644 --- a/internal/query/instance_features.go +++ b/internal/query/instance_features.go @@ -23,6 +23,7 @@ type InstanceFeatures struct { EnableBackChannelLogout FeatureSource[bool] LoginV2 FeatureSource[*feature.LoginV2] PermissionCheckV2 FeatureSource[bool] + ConsoleUseV2UserApi FeatureSource[bool] } func (q *Queries) GetInstanceFeatures(ctx context.Context, cascade bool) (_ *InstanceFeatures, err error) { diff --git a/internal/query/instance_features_model.go b/internal/query/instance_features_model.go index b9839bf359..11deb30f34 100644 --- a/internal/query/instance_features_model.go +++ b/internal/query/instance_features_model.go @@ -76,6 +76,7 @@ func (m *InstanceFeaturesReadModel) Query() *eventstore.SearchQueryBuilder { feature_v2.InstanceEnableBackChannelLogout, feature_v2.InstanceLoginVersion, feature_v2.InstancePermissionCheckV2, + feature_v2.InstanceConsoleUseV2UserApi, ). Builder().ResourceOwner(m.ResourceOwner) } @@ -142,6 +143,8 @@ func reduceInstanceFeatureSet[T any](features *InstanceFeatures, event *feature_ features.LoginV2.set(level, event.Value) case feature.KeyPermissionCheckV2: features.PermissionCheckV2.set(level, event.Value) + case feature.KeyConsoleUseV2UserApi: + features.ConsoleUseV2UserApi.set(level, event.Value) } return nil } diff --git a/internal/query/projection/instance_features.go b/internal/query/projection/instance_features.go index 2cd846bf2e..798af6693c 100644 --- a/internal/query/projection/instance_features.go +++ b/internal/query/projection/instance_features.go @@ -116,6 +116,10 @@ func (*instanceFeatureProjection) Reducers() []handler.AggregateReducer { Event: feature_v2.InstancePermissionCheckV2, Reduce: reduceInstanceSetFeature[bool], }, + { + Event: feature_v2.InstanceConsoleUseV2UserApi, + Reduce: reduceInstanceSetFeature[bool], + }, { Event: instance.InstanceRemovedEventType, Reduce: reduceInstanceRemovedHelper(InstanceDomainInstanceIDCol), diff --git a/internal/repository/feature/feature_v2/eventstore.go b/internal/repository/feature/feature_v2/eventstore.go index f5e033af1c..e8d0da1ab0 100644 --- a/internal/repository/feature/feature_v2/eventstore.go +++ b/internal/repository/feature/feature_v2/eventstore.go @@ -35,4 +35,5 @@ func init() { eventstore.RegisterFilterEventMapper(AggregateType, InstanceEnableBackChannelLogout, eventstore.GenericEventMapper[SetEvent[bool]]) eventstore.RegisterFilterEventMapper(AggregateType, InstanceLoginVersion, eventstore.GenericEventMapper[SetEvent[*feature.LoginV2]]) eventstore.RegisterFilterEventMapper(AggregateType, InstancePermissionCheckV2, eventstore.GenericEventMapper[SetEvent[bool]]) + eventstore.RegisterFilterEventMapper(AggregateType, InstanceConsoleUseV2UserApi, eventstore.GenericEventMapper[SetEvent[bool]]) } diff --git a/internal/repository/feature/feature_v2/feature.go b/internal/repository/feature/feature_v2/feature.go index 331a5143f9..008986824b 100644 --- a/internal/repository/feature/feature_v2/feature.go +++ b/internal/repository/feature/feature_v2/feature.go @@ -40,6 +40,7 @@ var ( InstanceEnableBackChannelLogout = setEventTypeFromFeature(feature.LevelInstance, feature.KeyEnableBackChannelLogout) InstanceLoginVersion = setEventTypeFromFeature(feature.LevelInstance, feature.KeyLoginV2) InstancePermissionCheckV2 = setEventTypeFromFeature(feature.LevelInstance, feature.KeyPermissionCheckV2) + InstanceConsoleUseV2UserApi = setEventTypeFromFeature(feature.LevelInstance, feature.KeyConsoleUseV2UserApi) ) const ( diff --git a/proto/zitadel/feature/v2/instance.proto b/proto/zitadel/feature/v2/instance.proto index 3d2280fc0c..efd7f83e4c 100644 --- a/proto/zitadel/feature/v2/instance.proto +++ b/proto/zitadel/feature/v2/instance.proto @@ -106,6 +106,13 @@ message SetInstanceFeaturesRequest{ description: "Enable a newer, more performant, permission check used for v2 and v3 resource based APIs."; } ]; + + optional bool console_use_v2_user_api = 15 [ + (grpc.gateway.protoc_gen_openapiv2.options.openapiv2_field) = { + example: "true"; + description: "If this is enabled the console web client will use the new User v2 API for certain calls"; + } + ]; } message SetInstanceFeaturesResponse { @@ -225,4 +232,11 @@ message GetInstanceFeaturesResponse { description: "Enable a newer, more performant, permission check used for v2 and v3 resource based APIs."; } ]; + + FeatureFlag console_use_v2_user_api = 16 [ + (grpc.gateway.protoc_gen_openapiv2.options.openapiv2_field) = { + example: "true"; + description: "If this is enabled the console web client will use the new User v2 API for certain calls"; + } + ]; }