From 91e1c47724258164d6dd835e6c7e52fcc4494251 Mon Sep 17 00:00:00 2001
From: tamaragruszka <156320606+tamaragruszka@users.noreply.github.com>
Date: Wed, 3 Apr 2024 13:02:57 +0200
Subject: [PATCH] [ACS-7380][ADF] Break Context Menu dependency on Material
 Module (#9487)

* [ACS-7380] convert context menu to standalone

* [ACS-7380] convert context menu to standalone

* [ACS-7380] convert context menu to standalone
---
 .../context-menu-list.component.html          | 14 ++++++++
 .../context-menu-list.component.ts            | 32 ++++++-------------
 .../context-menu/context-menu.directive.ts    |  3 +-
 .../lib/context-menu/context-menu.module.ts   | 18 ++---------
 lib/core/src/lib/context-menu/public-api.ts   |  2 +-
 5 files changed, 29 insertions(+), 40 deletions(-)
 create mode 100644 lib/core/src/lib/context-menu/context-menu-list.component.html

diff --git a/lib/core/src/lib/context-menu/context-menu-list.component.html b/lib/core/src/lib/context-menu/context-menu-list.component.html
new file mode 100644
index 00000000000..2aa2ddfd37d
--- /dev/null
+++ b/lib/core/src/lib/context-menu/context-menu-list.component.html
@@ -0,0 +1,14 @@
+<div mat-menu class="mat-menu-panel" @panelAnimation>
+    <div id="adf-context-menu-content" class="mat-menu-content">
+        <ng-container *ngFor="let link of links">
+            <button *ngIf="link.model?.visible"
+                    [attr.data-automation-id]="'context-' + (link.title || link.model?.title | translate)"
+                    mat-menu-item
+                    [disabled]="link.model?.disabled"
+                    (click)="onMenuItemClick($event, link)">
+                <mat-icon *ngIf="link.model?.icon">{{ link.model.icon }}</mat-icon>
+                <span>{{ link.title || link.model?.title | translate }}</span>
+            </button>
+        </ng-container>
+    </div>
+</div>
diff --git a/lib/core/src/lib/context-menu/context-menu-list.component.ts b/lib/core/src/lib/context-menu/context-menu-list.component.ts
index 676cafe2825..b83f47021e8 100644
--- a/lib/core/src/lib/context-menu/context-menu-list.component.ts
+++ b/lib/core/src/lib/context-menu/context-menu-list.component.ts
@@ -15,40 +15,28 @@
  * limitations under the License.
  */
 
-import { Component, ViewEncapsulation, HostListener, AfterViewInit, Optional, Inject, QueryList, ViewChildren } from '@angular/core';
 import { trigger } from '@angular/animations';
-import { DOWN_ARROW, UP_ARROW } from '@angular/cdk/keycodes';
 import { FocusKeyManager } from '@angular/cdk/a11y';
-import { MatMenuItem } from '@angular/material/menu';
-import { ContextMenuOverlayRef } from './context-menu-overlay';
+import { DOWN_ARROW, UP_ARROW } from '@angular/cdk/keycodes';
+import { NgForOf, NgIf } from '@angular/common';
+import { AfterViewInit, Component, HostListener, Inject, Optional, QueryList, ViewChildren, ViewEncapsulation } from '@angular/core';
+import { MatIconModule } from '@angular/material/icon';
+import { MatMenuItem, MatMenuModule } from '@angular/material/menu';
+import { TranslateModule } from '@ngx-translate/core';
 import { contextMenuAnimation } from './animations';
+import { ContextMenuOverlayRef } from './context-menu-overlay';
 import { CONTEXT_MENU_DATA } from './context-menu.tokens';
 
 @Component({
     selector: 'adf-context-menu',
-    template: `
-        <div mat-menu class="mat-menu-panel" @panelAnimation>
-            <div id="adf-context-menu-content" class="mat-menu-content">
-                <ng-container *ngFor="let link of links">
-                    <button
-                        *ngIf="link.model?.visible"
-                        [attr.data-automation-id]="'context-' + (link.title || link.model?.title | translate)"
-                        mat-menu-item
-                        [disabled]="link.model?.disabled"
-                        (click)="onMenuItemClick($event, link)"
-                    >
-                        <mat-icon *ngIf="link.model?.icon">{{ link.model.icon }}</mat-icon>
-                        <span>{{ link.title || link.model?.title | translate }}</span>
-                    </button>
-                </ng-container>
-            </div>
-        </div>
-    `,
+    standalone: true,
+    templateUrl: './context-menu-list.component.html',
     host: {
         role: 'menu',
         class: 'adf-context-menu'
     },
     encapsulation: ViewEncapsulation.None,
+    imports: [MatIconModule, MatMenuModule, NgForOf, NgIf, TranslateModule],
     animations: [trigger('panelAnimation', contextMenuAnimation)]
 })
 export class ContextMenuListComponent implements AfterViewInit {
diff --git a/lib/core/src/lib/context-menu/context-menu.directive.ts b/lib/core/src/lib/context-menu/context-menu.directive.ts
index bfa40c7456b..8bc57aff867 100644
--- a/lib/core/src/lib/context-menu/context-menu.directive.ts
+++ b/lib/core/src/lib/context-menu/context-menu.directive.ts
@@ -21,7 +21,8 @@ import { Directive, HostListener, Input } from '@angular/core';
 import { ContextMenuOverlayService } from './context-menu-overlay.service';
 
 @Directive({
-    selector: '[adf-context-menu]'
+    selector: '[adf-context-menu]',
+    standalone: true
 })
 export class ContextMenuDirective {
     /** Items for the menu. */
diff --git a/lib/core/src/lib/context-menu/context-menu.module.ts b/lib/core/src/lib/context-menu/context-menu.module.ts
index a40fc5844d1..73c35a2385b 100644
--- a/lib/core/src/lib/context-menu/context-menu.module.ts
+++ b/lib/core/src/lib/context-menu/context-menu.module.ts
@@ -15,26 +15,12 @@
  * limitations under the License.
  */
 
-import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
-import { MaterialModule } from '../material.module';
-import { TranslateModule } from '@ngx-translate/core';
-
 import { ContextMenuDirective } from './context-menu.directive';
 import { ContextMenuListComponent } from './context-menu-list.component';
 
 @NgModule({
-    imports: [
-        CommonModule,
-        MaterialModule,
-        TranslateModule
-    ],
-    declarations: [
-        ContextMenuDirective,
-        ContextMenuListComponent
-    ],
-    exports: [
-        ContextMenuDirective
-    ]
+    imports: [ContextMenuListComponent, ContextMenuDirective],
+    exports: [ContextMenuListComponent, ContextMenuDirective]
 })
 export class ContextMenuModule {}
diff --git a/lib/core/src/lib/context-menu/public-api.ts b/lib/core/src/lib/context-menu/public-api.ts
index 0873571a64f..2196c1a84a5 100644
--- a/lib/core/src/lib/context-menu/public-api.ts
+++ b/lib/core/src/lib/context-menu/public-api.ts
@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
+export * from './context-menu-list.component';
 export * from './context-menu.directive';
 export * from './context-menu-overlay.service';
-
 export * from './context-menu.module';