fix(packages): cjs, and module resolution fix (#10322)

This PR introduces CJS support for @zitadel/client and @zitadel/proto
from https://github.com/zitadel/zitadel/pull/10290
and fixes a module resolution error of @zitadel/client

---------

Co-authored-by: reluc <relu.cri@gmail.com>

console/package.json

@@ -26,7 +26,7 @@
     "@angular/platform-browser-dynamic": "^16.2.12",
     "@angular/router": "^16.2.12",
     "@angular/service-worker": "^16.2.12",
-    "@bufbuild/protobuf": "^2.2.2",
+    "@bufbuild/protobuf": "^2.6.1",
     "@connectrpc/connect": "^2.0.0",
     "@connectrpc/connect-web": "^2.0.0",
     "@ctrl/ngx-codemirror": "^6.1.0",
@@ -67,7 +67,7 @@
     "@angular/cli": "^16.2.15",
     "@angular/compiler-cli": "^16.2.5",
     "@angular/language-service": "^18.2.4",
-    "@bufbuild/buf": "^1.41.0",
+    "@bufbuild/buf": "^1.55.1",
     "@netlify/framework-info": "^9.8.13",
     "@types/file-saver": "^2.0.7",
     "@types/google-protobuf": "^3.15.3",

console/src/app/modules/policies/oidc-webkeys/oidc-webkeys.component.ts

@@ -12,8 +12,6 @@ import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { State, WebKey } from '@zitadel/proto/zitadel/webkey/v2beta/key_pb';
 import { CreateWebKeyRequestSchema } from '@zitadel/proto/zitadel/webkey/v2beta/webkey_service_pb';
 import { RSAHasher, RSABits, ECDSACurve } from '@zitadel/proto/zitadel/webkey/v2beta/key_pb';
-import { NewFeatureService } from 'src/app/services/new-feature.service';
-import { ActivatedRoute, Router } from '@angular/router';
 
 const CACHE_WARNING_MS = 5 * 60 * 1000; // 5 minutes
 

console/src/app/pages/users/user-detail/user-detail/user-detail.component.ts

@@ -412,7 +412,10 @@ export class UserDetailComponent implements OnInit {
 
   public sendSetPasswordNotification(user: UserV2): void {
     this.newMgmtService
-      .sendHumanResetPasswordNotification(user.userId, SendHumanResetPasswordNotificationRequest_Type.EMAIL)
+      .sendHumanResetPasswordNotification({
+        userId: user.userId,
+        type: SendHumanResetPasswordNotificationRequest_Type.EMAIL,
+      })
       .then(() => {
         this.toast.showInfo('USER.TOAST.PASSWORDNOTIFICATIONSENT', true);
         this.refreshChanges$.emit();

console/src/app/services/action.service.ts

@@ -5,6 +5,7 @@ import {
   CreateTargetRequestSchema,
   CreateTargetResponse,
   DeleteTargetRequestSchema,
+  DeleteTargetResponse,
   GetTargetRequestSchema,
   GetTargetResponse,
   ListExecutionFunctionsRequestSchema,
@@ -37,7 +38,7 @@ export class ActionService {
     return this.grpcService.actionNew.createTarget(req);
   }
 
-  public deleteTarget(req: MessageInitShape<typeof DeleteTargetRequestSchema>): Promise<CreateTargetResponse> {
+  public deleteTarget(req: MessageInitShape<typeof DeleteTargetRequestSchema>): Promise<DeleteTargetResponse> {
     return this.grpcService.actionNew.deleteTarget(req);
   }
 

console/src/app/services/grpc.service.ts

@@ -16,12 +16,9 @@ import { ExhaustedGrpcInterceptor } from './interceptors/exhausted.grpc.intercep
 import { I18nInterceptor } from './interceptors/i18n.interceptor';
 import { NewConnectWebOrgInterceptor, OrgInterceptor, OrgInterceptorProvider } from './interceptors/org.interceptor';
 import { UserServiceClient } from '../proto/generated/zitadel/user/v2/User_serviceServiceClientPb';
-//@ts-ignore
 import { createFeatureServiceClient, createUserServiceClient, createSessionServiceClient } from '@zitadel/client/v2';
-//@ts-ignore
 import { createAuthServiceClient, createManagementServiceClient } from '@zitadel/client/v1';
 import { createGrpcWebTransport } from '@connectrpc/connect-web';
-// @ts-ignore
 import { createClientFor } from '@zitadel/client';
 
 import { WebKeyService } from '@zitadel/proto/zitadel/webkey/v2beta/webkey_service_pb';
@@ -77,30 +74,10 @@ export class GrpcService {
           ],
         };
 
-        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.user = new UserServiceClient(
-          env.api,
-          null,
-          // @ts-ignore
-          interceptors,
-        );
+        this.auth = new AuthServiceClient(env.api, null, interceptors);
+        this.mgmt = new ManagementServiceClient(env.api, null, interceptors);
+        this.admin = new AdminServiceClient(env.api, null, interceptors);
+        this.user = new UserServiceClient(env.api, null, interceptors);
 
         const transport = createGrpcWebTransport({
           baseUrl: env.api,

console/src/app/services/new-auth.service.ts

@@ -44,27 +44,27 @@ export class NewAuthService {
   }
 
   public listMyMultiFactors(): Promise<ListMyAuthFactorsResponse> {
-    return this.grpcService.authNew.listMyAuthFactors(create(ListMyAuthFactorsRequestSchema), null);
+    return this.grpcService.authNew.listMyAuthFactors(create(ListMyAuthFactorsRequestSchema));
   }
 
   public removeMyAuthFactorOTPSMS(): Promise<RemoveMyAuthFactorOTPSMSResponse> {
-    return this.grpcService.authNew.removeMyAuthFactorOTPSMS(create(RemoveMyAuthFactorOTPSMSRequestSchema), null);
+    return this.grpcService.authNew.removeMyAuthFactorOTPSMS(create(RemoveMyAuthFactorOTPSMSRequestSchema));
   }
 
   public getMyLoginPolicy(): Promise<GetMyLoginPolicyResponse> {
-    return this.grpcService.authNew.getMyLoginPolicy(create(GetMyLoginPolicyRequestSchema), null);
+    return this.grpcService.authNew.getMyLoginPolicy(create(GetMyLoginPolicyRequestSchema));
   }
 
   public removeMyMultiFactorOTP(): Promise<RemoveMyAuthFactorOTPResponse> {
-    return this.grpcService.authNew.removeMyAuthFactorOTP(create(RemoveMyAuthFactorOTPRequestSchema), null);
+    return this.grpcService.authNew.removeMyAuthFactorOTP(create(RemoveMyAuthFactorOTPRequestSchema));
   }
 
   public removeMyMultiFactorU2F(tokenId: string): Promise<RemoveMyAuthFactorU2FResponse> {
-    return this.grpcService.authNew.removeMyAuthFactorU2F(create(RemoveMyAuthFactorU2FRequestSchema, { tokenId }), null);
+    return this.grpcService.authNew.removeMyAuthFactorU2F(create(RemoveMyAuthFactorU2FRequestSchema, { tokenId }));
   }
 
   public removeMyAuthFactorOTPEmail(): Promise<RemoveMyAuthFactorOTPEmailResponse> {
-    return this.grpcService.authNew.removeMyAuthFactorOTPEmail(create(RemoveMyAuthFactorOTPEmailRequestSchema), null);
+    return this.grpcService.authNew.removeMyAuthFactorOTPEmail(create(RemoveMyAuthFactorOTPEmailRequestSchema));
   }
 
   public getMyPasswordComplexityPolicy(): Promise<GetMyPasswordComplexityPolicyResponse> {

console/src/app/services/new-mgmt.service.ts

@@ -64,11 +64,10 @@ export class NewMgmtService {
   }
 
   public sendHumanResetPasswordNotification(
-    userId: string,
-    type: SendHumanResetPasswordNotificationRequest_Type,
+    req: MessageInitShape<typeof SendHumanResetPasswordNotificationRequestSchema>,
   ): Promise<SendHumanResetPasswordNotificationResponse> {
     return this.grpcService.mgmtNew.sendHumanResetPasswordNotification(
-      create(SendHumanResetPasswordNotificationRequestSchema, { userId, type }),
+      create(SendHumanResetPasswordNotificationRequestSchema, req),
     );
   }
 

console/src/app/services/webkeys.service.ts

@@ -16,18 +16,18 @@ export class WebKeysService {
   constructor(private readonly grpcService: GrpcService) {}
 
   public ListWebKeys(): Promise<ListWebKeysResponse> {
-    return this.grpcService.webKey.listWebKeys({});
+    return this.grpcService.webKey['listWebKeys']({});
   }
 
   public DeleteWebKey(id: string): Promise<DeleteWebKeyResponse> {
-    return this.grpcService.webKey.deleteWebKey({ id });
+    return this.grpcService.webKey['deleteWebKey']({ id });
   }
 
   public CreateWebKey(req: MessageInitShape<typeof CreateWebKeyRequestSchema>): Promise<CreateWebKeyResponse> {
-    return this.grpcService.webKey.createWebKey(req);
+    return this.grpcService.webKey['createWebKey'](req);
   }
 
   public ActivateWebKey(id: string): Promise<ActivateWebKeyResponse> {
-    return this.grpcService.webKey.activateWebKey({ id });
+    return this.grpcService.webKey['activateWebKey']({ id });
   }
 }