[ACS-6693] Migration to NG15 (#3959)

* [ACS-6693] Angular 15 migration initial point * [ACS-6693] Angular 15 - update ADF dependencies from the ng15-start branch (#3712) * [ACS-6693] Angular 15 - adding mat core (#3715) * Stylelint fix * Migration - added stylePrepocessor for material selectors * Skip unit tests from branch release until errors are fixed * [ACS-7285] - [ACA] Angular 15 - Left sidebar + table (#3719) * [ACS-7286] Fix topbar user info issues (#3720) * [ACS-6693] Bump peerDependencies in ACA libs * [ACS-7330] edit rules dialog fixes (#3723) * [ACS-6693] Fix peer dependencies in ACA packages * [ACS-7328] Fix searchbar display (#3729) * [ACS-7631] Fix broken filters (#3735) * [ACS-7331] - Angular 15 - Edit aspects modal [ACA] * [ACS-7449] Fix broken filter labels styling (#3745) * [ACS-7351] ng15 Manage rules fixes (#3751) * [ACS-7351] ng15 manage rules fixes * [ACS-7351] cr fix * [ACS-7351] cr fix * [ACS-7370] - [ACA] Leave library dialog misses some padding (#3749) * [ACS-6693] Bump ADF version * [ACS-7372] - user profile page issues (#3757) * [ACS-7372] - [ACA] User profile page issues * [ACS-7415] - Move file dialog (#3755) * [ACS-7452] - Small screen notification banner [ACS-7418] About page (#3760) * [ACS-7452] - Small screen notification banner * [ACS-7452] - Small screen notification banner [ACS-7418] About page * [ACS-7511] Subfont for dialogs, make darker (#3765) * [ACS-7448] Fix wrong notifications colors (#3761) * [ACS-7448] Fix notifications colors, move them from adf to aca (#3771) * [ACS-7375] - Share link dialog issues (#3774) * [ACS-7517] - Notifications box (#3775) * [ACS-7373] ng15 permission tab fixes (#3762) * [ACS-7368] Fix unit tests for aca-content (#3779) * [ACS-7410] - Locked files overflow issues (#3780) * [ACS-7528] - Notification and user icons are a bit different (#3782) * [ACS-7529] - Columns visibility dropdown has broken styles (#3783) * [ACS-7537] - Share dialog (#3789) * Use latest ADF alpha * Post rebase unit test fix * Disable stylelint * Calendar button fix * [ACS-7369] ng15 migration - fix e2es (#3796) * [ACS-7369] e2e fixes * [ACS-7369] cr fix * [ACS-7331] - Angular 15 - View details sidebar (#3731) * [ACS-7542] - Upload new version dialog (#3800) * [ACS-7575] create library dialog e2e fix (#3803) * [ACS-7534] folder dialog e2e fixes (#3804) * [ACS-7574] Rules dialog edit (#3801) * [ACS-7571] Comments (#3810) * [ACS-7555] Added blue outline to focused checkboxes (#3813) * [ACS-7582] File upload dialog, fix button weight label globally (#3814) * [ACS-7531] - Search page (#3816) * [ACS-7559] Conext menus icons (#3818) * [ACS-6693] Bump ADF * Temporary lint disable * [ACS-7572] link rules dialog (#3817) * [ACS-7533] - Advanced search chips dropdowns (#3821) * [ACS-7560] Corrected background color for info snackbar (#3824) * [ACS-7558] - Toolbar and buttons (#3833) * [ACS-7573] folder rules fixes (#3836) * [ACS-7573] folder rules fixes * [ACS-7573] cr fix * [ACS-7561] - Permissions page (#3840) * [ACS-7768] unify inputs and selects across the app (#3845) * ACS-7768 Style inputs in create from template dialog * ACS-7768 Used globally configured outline appearance for inputs * ACS-7768 Style inputs for profile page * ACS-7768 Style inputs for library metadata form * ACS-7768 Style inputs for folder rules dialog * ACS-7768 Style inputs for manage rules page * ACS-7768 Set outline appearance for input, fix small issue * ACS-7768 Addressed comment * Revert "[ACS-7768] unify inputs and selects across the app (#3845)" (#3850) This reverts commit 6a5ef73283. * [ACS-8043] fix js api dependencies (#3855) * [ACS-8020] Fixed inputs for create from template dialog (#3857) * [ACS-8027] Inputs for create rules (#3860) * [ACS-8052] inputs for general info for libraries (#3863) * [ACS-8052] Inputs for general info for libraries * Fix after CR * [ACS-8059] Inputs for view rules (#3865) * [ACS-8026] Fixed Task form rendering (#3864) * Updating to the latest package of 6.10 from ADF * Updating to the latest ADF/JS-API - updating dependency rule * Regenerated package lock * [ACS-8082] fix search e2e (#3876) * Using latest ADF with BC of ConfirmDialogComponent * [ACS-8099] [ACA] Testing Angular 15 - Accessibility for search text area (#3883) * [ACS-8100] [ACA] Testing Angular 15 - Accessibility for search facet and filter (#3887) * [ACS-8158] Resolved issue where long tag names were not getting word wrapped in ACA. Fixed alignment issue with tag chip cross button (#3890) * [ACS-8101] [ACA] Testing Angular 15 - Manage rule popup visual changes (#3891) * [ACS-8191] Updated codebase to use variables from mat-selectors.scss file (#3889) * [ACS-8191] Updated ACA codebase to use selectors from mat-selectors.scss file instead of hardcoded selectors * [ACS-8191] Resolved configuration issue where running unit test on aca-shared failed due to not finding adf-core styles * Update ADF dependencies (#3897) * Upgrading ADF packages * Use latest ADF * Updated packages version * Updated packages version * Updated packages version * Updated packages version * Updated packages version * Updated packages version * Updated packages version * [ACS-8253] viewer file name change position on navigation (#3914) * Updated ADF version * Use latest ADF * Package lock fix * Build fix * Restore release branch build and unit tests * E2Es fix * Fix SonarCloud issues * Stylelint fix * Stylelint fix * [ACS-8442] Remove additional checkbox label * First batch of E2E fixes * Bump ADF * Second round of E2E locators fixes * Locator fix * [ACS-8443] Fix incorrect focus style for checkboxes * E2Es locators fixes * E2E locator fixes * [ACS-6693] locator fix upload new version title * E2E locator fix * E2E locator fix * [ACS-6693] locator fix upload new version file --------- Co-authored-by: jacekpluta <73617938+jacekpluta@users.noreply.github.com> Co-authored-by: Vito Albano <vito.albano@hyland.com> Co-authored-by: tomson <nastalytomasz@gmail.com> Co-authored-by: Mykyta Maliarchuk <84377976+nikita-web-ua@users.noreply.github.com> Co-authored-by: Jacek Pluta <jacek.pluta@hyland.com> Co-authored-by: dominikiwanekhyland <141320833+dominikiwanekhyland@users.noreply.github.com> Co-authored-by: tomson <tomasz.nastaly@hyland.com> Co-authored-by: AleksanderSklorz <115619721+AleksanderSklorz@users.noreply.github.com> Co-authored-by: swapnil-verma-gl <92505353+swapnil-verma-gl@users.noreply.github.com> Co-authored-by: VitoAlbano <vito.albano.123@gmail.com> Co-authored-by: Akash Rathod <41251473+akashrathod28@users.noreply.github.com> Co-authored-by: Ehsan Rezaei <ehsan.rezaei@hyland.com> Co-authored-by: akash.rathod@hyland.com <akash.rathod@hyland.com>
2025-07-24 17:31:52 +00:00 · 2024-07-22 07:08:01 +02:00
parent 847fcf4c36
commit 02b6757ea3
104 changed files with 10902 additions and 9852 deletions
--- a/projects/aca-shared/src/lib/components/locked-by/locked-by.component.scss
+++ b/projects/aca-shared/src/lib/components/locked-by/locked-by.component.scss
@@ -7,6 +7,7 @@
    font-size: 14px;
    width: 14px;
    height: 14px;
+    min-width: 14px;
  }

  &--label,
--- a/projects/aca-shared/src/lib/components/open-in-app/open-in-app.component.html
+++ b/projects/aca-shared/src/lib/components/open-in-app/open-in-app.component.html
@@ -1,18 +1,22 @@
-<div class="aca-mobile-application-container">
-  <span>{{ 'APP.DIALOGS.MOBILE_APP.OPEN_ALFRESCO_MOBILE_APP' | translate }}</span>
-  <button mat-button class="aca-cross-button" (click)="onCloseDialog()">
-    <mat-icon class="aca-cross-button-icon">close</mat-icon>
-  </button>
-</div>
+<div class="aca-open-in-app">
+  <div class="aca-mobile-application-container">
+    <span>{{ 'APP.DIALOGS.MOBILE_APP.OPEN_ALFRESCO_MOBILE_APP' | translate }}</span>
+    <button mat-icon-button mat-dialog-close class="aca-cross-button" (click)="onCloseDialog()" >
+      <mat-icon class="aca-cross-button-icon">close</mat-icon>
+    </button>
+  </div>

-<div class="aca-open-in-app-container">
-  <button mat-button (click)="openInApp()" data-automation-id="open-in-app-button" class="aca-open-in-app-container-button" cdkFocusInitial>
-    <span>{{ 'APP.DIALOGS.MOBILE_APP.MOBILE_APP_BUTTON_LABEL' | translate }}</span>
-  </button>
-</div>
+  <div class="aca-open-in-app-button-container">
+    <button mat-button (click)="openInApp()"
+            data-automation-id="open-in-app-button"
+            class="aca-open-in-app-button-container" cdkFocusInitial>
+      <span>{{ 'APP.DIALOGS.MOBILE_APP.MOBILE_APP_BUTTON_LABEL' | translate }}</span>
+    </button>
+  </div>

-<div class="aca-download-app-container" *ngIf="appStoreUrl">
-  <button mat-button data-automation-id="download-app-button" class="aca-download-app-container-button" (click)="downloadIosApp()">
-    <span>{{ 'APP.DIALOGS.MOBILE_APP.DOWNLOAD_APP_BUTTON_LABEL' | translate }}</span>
-  </button>
+  <div class="aca-download-app-container" *ngIf="appStoreUrl">
+    <button mat-button data-automation-id="download-app-button" class="aca-download-app-container-button" (click)="downloadIosApp()">
+      <span>{{ 'APP.DIALOGS.MOBILE_APP.DOWNLOAD_APP_BUTTON_LABEL' | translate }}</span>
+    </button>
+  </div>
 </div>
--- a/projects/aca-shared/src/lib/components/open-in-app/open-in-app.component.scss
+++ b/projects/aca-shared/src/lib/components/open-in-app/open-in-app.component.scss
@@ -1,60 +1,65 @@
-aca-open-in-app {
-  .aca-open-in-app-container {
-    display: flex;
-    place-content: center;
-    padding: 0;
-    border-radius: 8px;
-    background-color: var(--theme-primary-color);
-    color: var(--theme-about-panel-background-color);
-    margin-top: 12px;
+@import '@alfresco/adf-core/lib/styles/mat-selectors';

-    &-button {
+aca-open-in-app {
+  .aca-open-in-app {
+    .aca-open-in-app-button-container {
+      display: flex;
+      place-content: center;
+      padding: 0;
+      border-radius: 8px;
+      background-color: var(--theme-primary-color);
+      height: 48px;
      overflow-x: hidden;
      font-size: 16px;
-      width: 100%;
-      padding: 0;
-      height: 48px;
+      color: white;
+      font-weight: 600;

      &:focus-visible {
        outline: none;
        border-radius: unset;
      }
    }
-  }

-  .aca-download-app-container {
-    display: flex;
-    place-content: center;
-    margin-top: 12px;
+    .aca-download-app-container {
+      display: flex;
+      place-content: center;
+      margin-top: 12px;
+      margin-bottom: 16px;

-    &-button {
-      background: var(--theme-dialog-background-color);
-      color: var(--theme-primary-color);
+      &-button {
+        background: var(--theme-dialog-background-color);
+        color: var(--theme-primary-color);
+        font-size: 14px;
+      }
+    }
+
+    .aca-mobile-application-container {
+      display: flex;
+      flex-direction: row;
+      justify-content: space-between;
+      align-items: center;
      font-size: 14px;
-    }
-  }
-
-  .aca-mobile-application-container {
-    display: flex;
-    flex-direction: row;
-    justify-content: space-between;
-    align-items: center;
-    font-size: 14px;
-    padding: 6px 0;
-  }
-
-  .aca-cross-button {
-    padding-right: 0;
-
-    &:focus-visible {
-      outline: none;
-      border-radius: unset;
+      padding: 6px 0;
+      margin-bottom: 12px;
    }

-    &-icon {
-      font-weight: bold;
-      font-size: 21px;
-      height: 21px;
+    .aca-cross-button {
+      padding-right: 0;
+
+      &:focus-visible {
+        outline: none;
+        border-radius: unset;
+      }
+
+      &-icon {
+        font-weight: bold;
+        font-size: 20px;
+      }
+    }
+
+    #{$mat-button} {
+      --mat-mdc-button-persistent-ripple-color: unset;
+      --mat-mdc-button-ripple-color: unset;
    }
  }
 }
--- a/projects/aca-shared/src/lib/components/open-in-app/open-in-app.component.ts
+++ b/projects/aca-shared/src/lib/components/open-in-app/open-in-app.component.ts
@@ -23,7 +23,7 @@
 */

 import { Component, Inject, ViewEncapsulation } from '@angular/core';
-import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
+import { MatDialogRef, MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
 import { CommonModule } from '@angular/common';
 import { TranslateModule } from '@ngx-translate/core';
 import { MatButtonModule } from '@angular/material/button';
@@ -36,7 +36,7 @@ export interface OpenInAppDialogOptions {
 }
@Component({
  standalone: true,
-  imports: [CommonModule, TranslateModule, MatButtonModule, MatIconModule, A11yModule],
+  imports: [CommonModule, TranslateModule, MatButtonModule, MatIconModule, A11yModule, MatDialogModule],
  selector: 'aca-open-in-app',
  templateUrl: './open-in-app.component.html',
  styleUrls: ['./open-in-app.component.scss'],
--- a/projects/aca-shared/src/lib/components/page-layout/page-layout.component.html
+++ b/projects/aca-shared/src/lib/components/page-layout/page-layout.component.html
@@ -1,6 +1,7 @@
 <div class="aca-content-header">
    <button *ngIf="(appNavNarMode$ | async) === 'collapsed'"
      mat-icon-button
+      class="aca-content-header-button"
      (click)="toggleClick()"
      title="{{'APP.TOOLTIPS.EXPAND_NAVIGATION' | translate}}">
      <mat-icon>keyboard_double_arrow_right</mat-icon>
--- a/projects/aca-shared/src/lib/components/page-layout/page-layout.component.scss
+++ b/projects/aca-shared/src/lib/components/page-layout/page-layout.component.scss
@@ -9,6 +9,10 @@
    padding: 0 24px;
    display: flex;
    align-items: center;
+
+    &-button {
+      margin-top: -1px;
+    }
  }

  .aca-page-layout-header {
--- a/projects/aca-shared/src/lib/components/toolbar/toolbar-action/toolbar-action.component.html
+++ b/projects/aca-shared/src/lib/components/toolbar/toolbar-action/toolbar-action.component.html
@@ -1,11 +1,11 @@
 <ng-container [ngSwitch]="actionRef.type">
-  <ng-container *ngSwitchCase="'default'">
+  <div *ngSwitchCase="'default'" class="aca-toolbar-action-container">
    <app-toolbar-button [type]="type" [actionRef]="actionRef" [color]="color"> </app-toolbar-button>
-  </ng-container>
+  </div>

-  <ng-container *ngSwitchCase="'button'">
+  <div *ngSwitchCase="'button'" class="aca-toolbar-action-container">
    <app-toolbar-button [type]="data?.buttonType || type" [actionRef]="actionRef" [color]="color" [data]="actionRef.data"> </app-toolbar-button>
-  </ng-container>
+  </div>

  <div *ngSwitchCase="'separator'" [id]="actionRef.id" class="aca-toolbar-divider"></div>

@@ -13,7 +13,7 @@
    <app-toolbar-menu [actionRef]="actionRef" [color]="color" [data]="actionRef.data"></app-toolbar-menu>
  </ng-container>

-  <ng-container *ngSwitchCase="'custom'">
+  <div *ngSwitchCase="'custom'" class="aca-toolbar-action-container">
    <adf-dynamic-component [data]="actionRef.data" [id]="actionRef.component"></adf-dynamic-component>
-  </ng-container>
+  </div>
 </ng-container>
--- a/projects/aca-shared/src/lib/components/toolbar/toolbar-action/toolbar-action.component.scss
+++ b/projects/aca-shared/src/lib/components/toolbar/toolbar-action/toolbar-action.component.scss
@@ -1,3 +1,7 @@
 .aca-toolbar-action {
  margin: 0 5px;
 }
+
+.aca-toolbar-action-container {
+  margin-top: 1px;
+}
--- a/projects/aca-shared/src/lib/components/toolbar/toolbar-menu-item/toolbar-menu-item.component.scss
+++ b/projects/aca-shared/src/lib/components/toolbar/toolbar-menu-item/toolbar-menu-item.component.scss
@@ -0,0 +1,5 @@
+@import '@alfresco/adf-core/lib/styles/mat-selectors';
+
+.app-toolbar-menu-item:last-child > #{$mat-divider-horizontal} {
+  display: none;
+}
--- a/projects/aca-shared/src/lib/components/toolbar/toolbar-menu-item/toolbar-menu-item.component.ts
+++ b/projects/aca-shared/src/lib/components/toolbar/toolbar-menu-item/toolbar-menu-item.component.ts
@@ -36,13 +36,7 @@ import { IconComponent } from '@alfresco/adf-core';
  imports: [CommonModule, TranslateModule, MatMenuModule, MatDividerModule, IconComponent, DynamicExtensionComponent],
  selector: 'app-toolbar-menu-item',
  templateUrl: './toolbar-menu-item.component.html',
-  styles: [
-    `
-      .app-toolbar-menu-item:last-child > .mat-divider-horizontal {
-        display: none;
-      }
-    `
-  ],
+  styleUrls: ['./toolbar-menu-item.component.scss'],
  encapsulation: ViewEncapsulation.None,
  host: { class: 'app-toolbar-menu-item' }
 })