fix: metadata decoding and encoding #9816 (#10024)

# Which Problems Are Solved
Metadata encoding and decoding on the organization detail page was
broken due to use of the old, generated gRPC client.

# How the Problems Are Solved
The metadata values are now correctly base64 decoded and encoded on the
organization detail page.

# Additional Changes
Refactored parts of the code to remove the dependency on the buffer npm
package, replacing it with the browser-native TextEncoder and
TextDecoder APIs.

# Additional Context
- Closes [#9816](https://github.com/zitadel/zitadel/issues/9816)

console/src/app/pages/orgs/org-detail/org-detail.component.ts

@@ -1,7 +1,6 @@
 import { Component, OnDestroy, OnInit } from '@angular/core';
 import { MatDialog } from '@angular/material/dialog';
 import { Router } from '@angular/router';
-import { Buffer } from 'buffer';
 import { BehaviorSubject, from, Observable, of, Subject, takeUntil } from 'rxjs';
 import { catchError, finalize, map } from 'rxjs/operators';
 import { CreationType, MemberCreateDialogComponent } from 'src/app/modules/add-member-dialog/member-create-dialog.component';
@@ -266,10 +265,11 @@ export class OrgDetailComponent implements OnInit, OnDestroy {
       .listOrgMetadata()
       .then((resp) => {
         this.loadingMetadata = false;
-        this.metadata = resp.resultList.map((md) => {
+        const decoder = new TextDecoder();
+        this.metadata = resp.resultList.map(({ key, value }) => {
           return {
-            key: md.key,
-            value: Buffer.from(md.value as string, 'base64').toString('utf-8'),
+            key,
+            value: atob(typeof value === 'string' ? value : decoder.decode(value)),
           };
         });
       })

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

@@ -4,7 +4,6 @@ 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 { catchError, filter, map, startWith, take } from 'rxjs/operators';
 import { ChangeType } from 'src/app/modules/changes/changes.component';
 import { phoneValidator, requiredValidator } from 'src/app/modules/form-field/validators/validators';
@@ -582,7 +581,7 @@ export class UserDetailComponent implements OnInit {
     const setFcn = (key: string, value: string) =>
       this.newMgmtService.setUserMetadata({
         key,
-        value: Buffer.from(value),
+        value: new TextEncoder().encode(value),
         id: user.userId,
       });
     const removeFcn = (key: string): Promise<any> => this.newMgmtService.removeUserMetadata({ key, id: user.userId });