fix: various things (#470)

* fix: various things * fix: toggle-button in menu * fix: toggle-button in menu * fix: add role filter * fix: tests * fix: tuning menu layout * fix: tuning menu layout - colors * fix: tuning menu layout - opt * fix: tuning menu layout - switch buttons * fix: tuning menu layout - translations
onecx · Dec 30, 2024 · 964b3d0 · 964b3d0
1 parent 93081cf
commit 964b3d0
Show file tree

Hide file tree

Showing 30 changed files with 641 additions and 460 deletions.
diff --git a/src/app/_ws-mixins.scss b/src/app/_ws-mixins.scss
@@ -60,6 +60,14 @@
     }
   }
 }
+@mixin readable-disabled-components {
+  :host ::ng-deep {
+    .p-component:disabled,
+    .p-disabled {
+      opacity: unset;
+    }
+  }
+}
 
 @mixin compact-dropdown-list-items {
   :host ::ng-deep {

diff --git a/src/app/shared/services/menu-item.service.ts b/src/app/shared/services/menu-item.service.ts
@@ -55,21 +55,20 @@ export class MenuItemService {
   }
 
   private expandCurrentMfeMenuItems(items: MenuItem[], currentMfePath: string): boolean {
+    let expanded = false
     for (const item of items) {
-      if (this.stripPath(item.routerLink) === currentMfePath) return true
-      else if (item.items && this.expandCurrentMfeMenuItems(item.items, currentMfePath)) {
-        item.expanded = true
-        return true
-      }
+      if (!expanded)
+        if (this.stripPath(item.routerLink) === currentMfePath) expanded = true
+        else if (item.items && this.expandCurrentMfeMenuItems(item.items, currentMfePath)) {
+          item.expanded = true
+          expanded = true
+        }
     }
-    return false
+    return expanded
   }
 
   private replaceUrlVariables(url: string | undefined): string | undefined {
-    if (!url) {
-      return
-    }
-    return url.replaceAll(
+    return url?.replaceAll(
       /\[\[(.+?)\]\]/g, //NOSONAR
       (_match, $1) => {
         return sessionStorage.getItem($1) ?? localStorage.getItem($1) ?? ''

diff --git a/src/app/workspace/workspace-create/workspace-create.component.html b/src/app/workspace/workspace-create/workspace-create.component.html
@@ -25,7 +25,7 @@
             tooltipPosition="top"
             tooltipEvent="hover"
           />
-          <label class="ocx-required-label" for="ws_create_form_name"> {{ 'WORKSPACE.NAME' | translate }} </label>
+          <label class="ocx-required-label" for="ws_create_form_name">{{ 'WORKSPACE.NAME' | translate }} </label>
         </span>
         <span class="p-float-label w-12 sm:w-7x" controlErrorAnchor>
           <input
@@ -59,7 +59,7 @@
             tooltipEvent="hover"
           >
           </p-dropdown>
-          <label class="ocx-required-label" for="ws_create_form_theme"> {{ 'WORKSPACE.THEME' | translate }} </label>
+          <label class="ocx-required-label" for="ws_create_form_theme">{{ 'WORKSPACE.THEME' | translate }} </label>
         </span>
         <span class="p-float-label w-12 sm:w-7x">
           <p-dropdown
@@ -76,7 +76,7 @@
             tooltipEvent="hover"
           >
           </p-dropdown>
-          <label for="ws_create_form_home_page"> {{ 'WORKSPACE.HOME_PAGE' | translate }} </label>
+          <label for="ws_create_form_home_page">{{ 'WORKSPACE.HOME_PAGE' | translate }} </label>
         </span>
       </div>
 
@@ -92,7 +92,7 @@
             tooltipPosition="top"
             tooltipEvent="hover"
           />
-          <label class="ocx-required-label" for="ws_create_form_baseUrl"> {{ 'WORKSPACE.BASE_URL' | translate }}</label>
+          <label class="ocx-required-label" for="ws_create_form_baseUrl">{{ 'WORKSPACE.BASE_URL' | translate }}</label>
         </span>
         <label class="ocx-control-hint block mt-1" for="ws_create_form_baseUrl">
           {{ ('VALIDATION.HINTS.FORMAT_URL' | translate) + '/base-path-to-workspace' }}
@@ -117,7 +117,7 @@
             tooltipPosition="top"
             tooltipEvent="hover"
           />
-          <label for="ws_create_form_logo"> {{ 'IMAGE.LOGO_URL' | translate }} </label>
+          <label for="ws_create_form_logo">{{ 'IMAGE.LOGO_URL' | translate }} </label>
         </span>
       </div>
 
@@ -133,7 +133,7 @@
             tooltipPosition="top"
             tooltipEvent="hover"
           />
-          <label for="ws_create_form_footerLabel"> {{ 'WORKSPACE.FOOTER_LABEL' | translate }} </label>
+          <label for="ws_create_form_footerLabel">{{ 'WORKSPACE.FOOTER_LABEL' | translate }} </label>
         </span>
       </div>
 
@@ -150,7 +150,7 @@
             tooltipPosition="top"
             tooltipEvent="hover"
           ></textarea>
-          <label for="ws_create_form_description"> {{ 'WORKSPACE.DESCRIPTION' | translate }} </label>
+          <label for="ws_create_form_description">{{ 'WORKSPACE.DESCRIPTION' | translate }} </label>
         </span>
       </div>
     </div>

diff --git a/src/app/workspace/workspace-detail/workspace-detail.component.spec.ts b/src/app/workspace/workspace-detail/workspace-detail.component.spec.ts
@@ -84,13 +84,16 @@ describe('WorkspaceDetailComponent', () => {
         { provide: UserService, useValue: mockUserService }
       ]
     }).compileComponents()
+    // to spy data: reset
+    locationSpy.back.calls.reset()
     msgServiceSpy.success.calls.reset()
     msgServiceSpy.error.calls.reset()
     apiServiceSpy.getWorkspaceByName.calls.reset()
     apiServiceSpy.deleteWorkspace.calls.reset()
     apiServiceSpy.exportWorkspaces.calls.reset()
     apiServiceSpy.updateWorkspace.calls.reset()
-    locationSpy.back.calls.reset()
+    // to spy data: refill with neutral data
+    apiServiceSpy.getWorkspaceByName.and.returnValue(of({}))
   }))
 
   function initializeComponent(): void {
@@ -128,35 +131,15 @@ describe('WorkspaceDetailComponent', () => {
         })
 
         component.onTabChange(event, component.workspace)
-
         expect(component.selectedTabIndex).toEqual(1)
-      })
-
-      it('should set workspace for roles', () => {
-        const event = { index: 3 }
-
-        component.onTabChange(event, component.workspace)
 
+        component.onTabChange({ index: 3 }, component.workspace)
         expect(component.workspaceForRoles).toBe(workspace)
-      })
-
-      it('should set workspace for slots', () => {
-        const event = {
-          index: 4
-        }
-
-        component.onTabChange(event, component.workspace)
 
+        component.onTabChange({ index: 4 }, component.workspace)
         expect(component.workspaceForSlots).toBe(workspace)
-      })
-
-      it('should set workspace for products', () => {
-        const event = {
-          index: 5
-        }
-
-        component.onTabChange(event, component.workspace)
 
+        component.onTabChange({ index: 5 }, component.workspace)
         expect(component.workspaceForProducts).toBe(workspace)
       })
     })
@@ -391,15 +374,17 @@ describe('WorkspaceDetailComponent', () => {
   })
 
   describe('update workspace data', () => {
-    it('it should display error on update workspace', (done) => {
+    it('it should display success on update workspace', (done) => {
       apiServiceSpy.updateWorkspace.and.returnValue(of(workspace))
+      spyOn(console, 'error')
       component.selectedTabIndex = 99
       component.ngOnInit()
       let actions: any = []
       component.actions$!.subscribe((act) => (actions = act))
 
       actions[3].actionCallback()
 
+      expect(console.error).toHaveBeenCalledWith("Couldn't assign tab to component")
       expect(msgServiceSpy.success).toHaveBeenCalledWith({ summaryKey: 'ACTIONS.EDIT.MESSAGE.CHANGE_OK' })
       component.workspace$.subscribe((data) => {
         expect(data).toEqual(workspace)
@@ -412,10 +397,10 @@ describe('WorkspaceDetailComponent', () => {
       apiServiceSpy.updateWorkspace.and.returnValue(throwError(() => errorResponse))
       component.selectedTabIndex = 99
       spyOn(console, 'error')
+
       component.ngOnInit()
       let actions: any = []
       component.actions$!.subscribe((act) => (actions = act))
-
       actions[3].actionCallback()
 
       expect(msgServiceSpy.error).toHaveBeenCalledWith({ summaryKey: 'ACTIONS.EDIT.MESSAGE.CHANGE_NOK' })

diff --git a/src/app/workspace/workspace-detail/workspace-props/workspace-props.component.html b/src/app/workspace/workspace-detail/workspace-props/workspace-props.component.html
@@ -85,7 +85,7 @@
               tooltipPosition="top"
               tooltipEvent="hover"
             />
-            <label for="ws_detail_props_item_base_url"> {{ 'WORKSPACE.BASE_URL' | translate }} </label>
+            <label for="ws_detail_props_item_base_url">{{ 'WORKSPACE.BASE_URL' | translate }} </label>
           </span>
           <a
             tabindex="0"
@@ -127,7 +127,7 @@
             tooltipEvent="hover"
           >
           </p-dropdown>
-          <label for="ws_detail_props_item_home_page"> {{ 'WORKSPACE.HOME_PAGE' | translate }} </label>
+          <label for="ws_detail_props_item_home_page">{{ 'WORKSPACE.HOME_PAGE' | translate }} </label>
         </span>
         <a
           tabindex="0"
@@ -158,7 +158,7 @@
             tooltipPosition="top"
             tooltipEvent="hover"
           />
-          <label for="ws_detail_props_item_rssFeedUrl"> {{ 'WORKSPACE.RSS_FEED_URL' | translate }} </label>
+          <label for="ws_detail_props_item_rssFeedUrl">{{ 'WORKSPACE.RSS_FEED_URL' | translate }} </label>
         </span>
         <a
           tabindex="0"
@@ -209,7 +209,7 @@
               tooltipPosition="top"
               tooltipEvent="hover"
             />
-            <label for="ws_detail_props_item_logo_url"> {{ 'IMAGE.LOGO_URL' | translate }} </label>
+            <label for="ws_detail_props_item_logo_url">{{ 'IMAGE.LOGO_URL' | translate }} </label>
           </span>
           <label *ngIf="editMode" class="ocx-control-hint block" for="ws_detail_props_item_logo_url">
             {{ ('VALIDATION.HINTS.FORMAT_URL' | translate) + externUrlPattern }}
@@ -228,7 +228,7 @@
           tooltipPosition="top"
           tooltipEvent="hover"
         />
-        <label for="ws_detail_props_item_footer_label"> {{ 'WORKSPACE.FOOTER_LABEL' | translate }} </label>
+        <label for="ws_detail_props_item_footer_label">{{ 'WORKSPACE.FOOTER_LABEL' | translate }} </label>
       </span>
 
       <span class="p-float-label mb-1" controlErrorAnchor>
@@ -244,7 +244,7 @@
           tooltipPosition="top"
           tooltipEvent="hover"
         ></textarea>
-        <label for="ws_detail_props_item_description"> {{ 'WORKSPACE.DESCRIPTION' | translate }} </label>
+        <label for="ws_detail_props_item_description">{{ 'WORKSPACE.DESCRIPTION' | translate }} </label>
       </span>
     </div>
   </form>

diff --git a/src/app/workspace/workspace-detail/workspace-roles/workspace-roles.component.html b/src/app/workspace/workspace-detail/workspace-roles/workspace-roles.component.html
@@ -53,9 +53,9 @@
           <ng-template let-i pTemplate>{{ i.label | translate }}</ng-template>
         </p-selectButton>
         <div class="p-selectbutton-subtitle flex flex-row flex-nowrap column-gap-3 opacity-90">
-          <span> {{ 'DIALOG.ROLE.QUICK_FILTER.LABEL' | translate }}: </span>
-          <span> {{ 'DIALOG.ROLE.QUICK_FILTER.' + quickFilterValue | translate }} </span>
-          <span> {{ onGetQuickFilterCount(quickFilterValue) }} </span>
+          <span>{{ 'DIALOG.ROLE.QUICK_FILTER.LABEL' | translate }}: </span>
+          <span>{{ 'DIALOG.ROLE.QUICK_FILTER.' + quickFilterValue | translate }} </span>
+          <span>{{ onGetQuickFilterCount(quickFilterValue) }} </span>
         </div>
       </div>
       <!-- Filter & Sorting -->

diff --git a/src/app/workspace/workspace-detail/workspace-roles/workspace-roles.component.spec.ts b/src/app/workspace/workspace-detail/workspace-roles/workspace-roles.component.spec.ts
@@ -91,12 +91,15 @@ describe('WorkspaceRolesComponent', () => {
     component = fixture.componentInstance
     component.workspace = workspace
     fixture.detectChanges()
+    // to spy data: reset
     wRoleServiceSpy.searchWorkspaceRoles.calls.reset()
     wRoleServiceSpy.createWorkspaceRole.calls.reset()
     wRoleServiceSpy.deleteWorkspaceRole.calls.reset()
     iamRoleServiceSpy.searchAvailableRoles.calls.reset()
     msgServiceSpy.success.calls.reset()
     msgServiceSpy.error.calls.reset()
+    // to spy data: refill with neutral data
+    wRoleServiceSpy.searchWorkspaceRoles.and.returnValue(of({}))
   })
 
   it('should create', () => {
@@ -161,6 +164,7 @@ describe('WorkspaceRolesComponent', () => {
   it('should display error on ws search', () => {
     const errorResponse = { status: 404, statusText: 'Workspace roles not found' }
     wRoleServiceSpy.searchWorkspaceRoles.and.returnValue(throwError(() => errorResponse))
+    spyOn(console, 'error')
     const changes = {
       ['workspace']: {
         previousValue: 'ws0',
@@ -172,10 +176,11 @@ describe('WorkspaceRolesComponent', () => {
 
     component.ngOnChanges(changes as unknown as SimpleChanges)
 
+    expect(console.error).toHaveBeenCalledWith('searchAvailableRoles', errorResponse)
     expect(component.exceptionKey).toEqual('EXCEPTIONS.HTTP_STATUS_' + errorResponse.status + '.WS_ROLES')
   })
 
-  it('should populate iamRoles on search', () => {
+  it('should populate IAM roles on search', () => {
     iamRoleServiceSpy.searchAvailableRoles.and.returnValue(of({ stream: [{ name: 'role' }] as IAMRolePageResult }))
     const changes = {
       ['workspace']: {
@@ -228,9 +233,10 @@ describe('WorkspaceRolesComponent', () => {
     expect(component.roles[0]).toBeUndefined()
   })
 
-  it('should display error on iam search', () => {
+  it('should display error on IAM search', () => {
     const errorResponse = { status: 404, statusText: 'IAM roles not found' }
     iamRoleServiceSpy.searchAvailableRoles.and.returnValue(throwError(() => errorResponse))
+    spyOn(console, 'error')
     const changes = {
       ['workspace']: {
         previousValue: 'ws0',
@@ -242,6 +248,7 @@ describe('WorkspaceRolesComponent', () => {
 
     component.ngOnChanges(changes as unknown as SimpleChanges)
 
+    expect(console.error).toHaveBeenCalledWith('searchAvailableRoles', errorResponse)
     expect(component.exceptionKey).toEqual('EXCEPTIONS.HTTP_STATUS_' + errorResponse.status + '.IAM_ROLES')
   })
 
@@ -282,7 +289,7 @@ describe('WorkspaceRolesComponent', () => {
 
     component.onAddRole(mockEvent, wRole)
 
-    expect(msgServiceSpy.success).toHaveBeenCalledWith({ summaryKey: 'ACTIONS.CREATE.ROLE.MESSAGE_OK' })
+    expect(msgServiceSpy.success).toHaveBeenCalledWith({ summaryKey: 'ACTIONS.CREATE.ROLE_OK' })
   })
 
   it('should display error when creating a role onAddRole', () => {
@@ -293,7 +300,7 @@ describe('WorkspaceRolesComponent', () => {
 
     component.onAddRole(mockEvent, wRole)
 
-    expect(msgServiceSpy.error).toHaveBeenCalledWith({ summaryKey: 'ACTIONS.CREATE.ROLE.MESSAGE_NOK' })
+    expect(msgServiceSpy.error).toHaveBeenCalledWith({ summaryKey: 'ACTIONS.CREATE.ROLE_NOK' })
     expect(console.error).toHaveBeenCalledWith('createWorkspaceRole', errorResponse)
   })
 

diff --git a/src/app/workspace/workspace-detail/workspace-roles/workspace-roles.component.ts b/src/app/workspace/workspace-detail/workspace-roles/workspace-roles.component.ts
@@ -208,14 +208,14 @@ export class WorkspaceRolesComponent implements OnInit, OnChanges {
       })
       .subscribe({
         next: (data) => {
-          this.msgService.success({ summaryKey: 'ACTIONS.CREATE.ROLE.MESSAGE_OK' })
+          this.msgService.success({ summaryKey: 'ACTIONS.CREATE.ROLE_OK' })
           role.id = data.id
           role.modificationCount = data.modificationCount
           role.modificationDate = data.modificationDate
           role.isWorkspaceRole = true
         },
         error: (err) => {
-          this.msgService.error({ summaryKey: 'ACTIONS.CREATE.ROLE.MESSAGE_NOK' })
+          this.msgService.error({ summaryKey: 'ACTIONS.CREATE.ROLE_NOK' })
           console.error('createWorkspaceRole', err)
         }
       })