ACS-8221: remove internal localized role pipe (#10143)

* remove internal localized role pipe

* remove internal localized role pipe [ci:force]

* performance improvements

lib/content-services/src/lib/permission-manager/components/user-role-column/user-role-column.component.spec.ts

@@ -0,0 +1,60 @@
+/*!
+ * @license
+ * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { UserRoleColumnComponent } from './user-role-column.component';
+import { RoleModel } from '../../models/role.model';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { By } from '@angular/platform-browser';
+import { ContentTestingModule } from '@alfresco/adf-content-services';
+
+describe('UserRoleColumnComponent', () => {
+    let component: UserRoleColumnComponent;
+    let fixture: ComponentFixture<UserRoleColumnComponent>;
+
+    beforeEach(async () => {
+        await TestBed.configureTestingModule({
+            imports: [ContentTestingModule, NoopAnimationsModule, UserRoleColumnComponent]
+        }).compileComponents();
+
+        fixture = TestBed.createComponent(UserRoleColumnComponent);
+        component = fixture.componentInstance;
+        fixture.detectChanges();
+    });
+
+    it('should emit roleChanged event when a new role is selected', () => {
+        spyOn(component.roleChanged, 'emit');
+        const role: RoleModel = { role: 'admin', label: 'Admin' };
+        component.roles = [role];
+        fixture.detectChanges();
+
+        const select = fixture.debugElement.query(By.css('.adf-role-selector'));
+        select.triggerEventHandler('selectionChange', { value: role.role });
+
+        expect(component.roleChanged.emit).toHaveBeenCalledWith(role.role);
+    });
+
+    it('should display readonly role value when readonly is true', () => {
+        component.readonly = true;
+        component.value = 'admin';
+        component.i18nValue = 'ADF.ROLES.ADMIN';
+        fixture.detectChanges();
+
+        const span = fixture.debugElement.query(By.css('.adf-readonly-role'));
+        expect(span.nativeElement.textContent.trim()).toBe('ADF.ROLES.ADMIN');
+    });
+});

lib/content-services/src/lib/permission-manager/components/user-role-column/user-role-column.component.ts

@@ -15,21 +15,26 @@
  * limitations under the License.
  */
 
-import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { Component, EventEmitter, Input, OnChanges, Output, SimpleChanges } from '@angular/core';
 import { RoleModel } from '../../models/role.model';
 import { CommonModule } from '@angular/common';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatSelectModule } from '@angular/material/select';
 import { TranslateModule } from '@ngx-translate/core';
-import { LocalizedRolePipe } from '@alfresco/adf-core';
+
+export interface RoleModelOption {
+    label: string;
+    role: string;
+}
 
 @Component({
     selector: 'adf-user-role-column',
     standalone: true,
-    imports: [CommonModule, MatFormFieldModule, MatSelectModule, TranslateModule, LocalizedRolePipe],
+    imports: [CommonModule, MatFormFieldModule, MatSelectModule, TranslateModule],
     template: `
         <mat-form-field class="adf-role-selector-field" *ngIf="!readonly">
             <mat-select
+                class="adf-role-selector"
                 (click)="$event.stopPropagation()"
                 [placeholder]="placeholder | translate"
                 [value]="value"
@@ -37,14 +42,14 @@ import { LocalizedRolePipe } from '@alfresco/adf-core';
                 (keyup.arrowdown)="$event.stopPropagation()"
                 (keyup.arrowup)="$event.stopPropagation()"
             >
-                <mat-option *ngFor="let role of roles" [value]="role.role">
-                    {{ role.label | adfLocalizedRole }}
+                <mat-option *ngFor="let option of options" [value]="option.role">
+                    {{ option.label | translate }}
                 </mat-option>
             </mat-select>
         </mat-form-field>
 
-        <span class="adf-datatable-cell-value adf-readonly-role" [title]="value | adfLocalizedRole" *ngIf="readonly">
-            {{ value | adfLocalizedRole }}
+        <span class="adf-datatable-cell-value adf-readonly-role" [title]="i18nValue | translate" *ngIf="readonly">
+            {{ i18nValue | translate }}
         </span>
     `,
     host: { class: 'adf-user-role-column adf-datatable-content-cell adf-expand-cell-4' },
@@ -66,7 +71,7 @@ import { LocalizedRolePipe } from '@alfresco/adf-core';
         `
     ]
 })
-export class UserRoleColumnComponent {
+export class UserRoleColumnComponent implements OnChanges {
     @Input()
     roles: RoleModel[];
 
@@ -80,10 +85,33 @@ export class UserRoleColumnComponent {
     placeholder: string = 'PERMISSION_MANAGER.LABELS.SELECT-ROLE';
 
     @Output()
-    roleChanged: EventEmitter<string> = new EventEmitter<string>();
+    roleChanged = new EventEmitter<string>();
+
+    i18nValue: string;
+
+    /* dropdown options, including i18n support */
+    options: RoleModelOption[] = [];
 
     onRoleChanged(newRole: string) {
         this.value = newRole;
         this.roleChanged.emit(newRole);
     }
+
+    private i18nRoleValue(value: string): string {
+        if (value) {
+            return `ADF.ROLES.${value.toUpperCase()}`;
+        }
+        return value;
+    }
+
+    ngOnChanges(changes: SimpleChanges) {
+        if (changes.value) {
+            this.i18nValue = this.i18nRoleValue(changes.value.currentValue);
+        }
+
+        if (changes.roles) {
+            const roles: RoleModel[] = changes.roles.currentValue || [];
+            this.options = roles.map((role) => ({ label: this.i18nRoleValue(role.label), role: role.role }));
+        }
+    }
 }

lib/core/src/lib/pipes/localized-role.pipe.spec.ts

@@ -1,50 +0,0 @@
-/*!
- * @license
- * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { LocalizedRolePipe } from './localized-role.pipe';
-
-describe('LocalizedRolePipe', () => {
-    let translationService: any;
-    let pipe: LocalizedRolePipe;
-
-    beforeEach(() => {
-        translationService = jasmine.createSpyObj('TranslationService', ['instant']);
-        pipe = new LocalizedRolePipe(translationService);
-    });
-
-    it('should return null', () => {
-        expect(pipe.transform(null)).toBeNull();
-    });
-
-    it('should translate value', () => {
-        translationService.instant.and.returnValue('Consumer');
-        expect(pipe.transform('ADF.ROLES.CONSUMER')).toEqual('Consumer');
-    });
-
-    it('should return the key when translation not present', () => {
-        translationService.instant.and.callFake((value) => {
-            if (value === 'ADF.ROLES.CONSUMER') {
-                return 'Consumer';
-            } else {
-                return value;
-            }
-        });
-
-        expect(pipe.transform('Contributor')).toBe('ADF.ROLES.CONTRIBUTOR');
-        expect(pipe.transform('Consumer')).toEqual('Consumer');
-    });
-});

lib/core/src/lib/pipes/localized-role.pipe.ts

@@ -1,39 +0,0 @@
-/*!
- * @license
- * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { Pipe, PipeTransform } from '@angular/core';
-import { TranslationService } from '../translation/translation.service';
-
-@Pipe({
-    name: 'adfLocalizedRole',
-    standalone: true
-})
-export class LocalizedRolePipe implements PipeTransform {
-    constructor(private translationService: TranslationService) {}
-
-    transform(value: string): any {
-        if (value) {
-            const key = `ADF.ROLES.${value.toUpperCase()}`;
-            const translation = this.translationService.instant(key);
-
-            if (translation) {
-                return translation;
-            }
-        }
-        return value;
-    }
-}

lib/core/src/lib/pipes/pipe.module.ts

@@ -28,7 +28,6 @@ import { FileTypePipe } from './file-type.pipe';
 import { MultiValuePipe } from './multi-value.pipe';
 import { LocalizedDatePipe } from './localized-date.pipe';
 import { DecimalNumberPipe } from './decimal-number.pipe';
-import { LocalizedRolePipe } from './localized-role.pipe';
 import { MomentDatePipe } from './moment-date.pipe';
 import { MomentDateTimePipe } from './moment-datetime.pipe';
 import { FilterStringPipe } from './filter-string.pipe';
@@ -45,7 +44,6 @@ export const CORE_PIPES = [
     FileTypePipe,
     MultiValuePipe,
     DecimalNumberPipe,
-    LocalizedRolePipe,
     MomentDatePipe,
     MomentDateTimePipe,
     DateTimePipe,

lib/core/src/lib/pipes/public-api.ts

@@ -26,7 +26,6 @@ export * from './multi-value.pipe';
 export * from './text-highlight.pipe';
 export * from './time-ago.pipe';
 export * from './user-initial.pipe';
-export * from './localized-role.pipe';
 export * from './pipe.module';
 export * from './moment-date.pipe';
 export * from './moment-datetime.pipe';