From 4f13dcc3e2289d0166ed647a0c80771377c947da Mon Sep 17 00:00:00 2001
From: Cilibiu Bogdan <pionnegru@users.noreply.github.com>
Date: Tue, 14 May 2019 14:43:53 +0300
Subject: [PATCH] [ADF-4545] Context Menu - RTL support (#4722)

* set overlay direction

* test
---
 .../context-menu-overlay.service.spec.ts      | 102 ++++++++++++++++++
 .../context-menu-overlay.service.ts           |  16 ++-
 2 files changed, 116 insertions(+), 2 deletions(-)
 create mode 100644 lib/core/context-menu/context-menu-overlay.service.spec.ts

diff --git a/lib/core/context-menu/context-menu-overlay.service.spec.ts b/lib/core/context-menu/context-menu-overlay.service.spec.ts
new file mode 100644
index 0000000000..abc33c37ea
--- /dev/null
+++ b/lib/core/context-menu/context-menu-overlay.service.spec.ts
@@ -0,0 +1,102 @@
+/*!
+ * @license
+ * Copyright 2019 Alfresco Software, Ltd.
+ *
+ * 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 { TestBed } from '@angular/core/testing';
+import { Overlay } from '@angular/cdk/overlay';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { CoreTestingModule } from '../testing/core.testing.module';
+import { ContextMenuOverlayService } from './context-menu-overlay.service';
+import { UserPreferencesService } from '../services/user-preferences.service';
+import { Injector } from '@angular/core';
+import { of } from 'rxjs';
+
+describe('ContextMenuService', () => {
+    let userPreferencesService: UserPreferencesService;
+    let contextMenuOverlayService: ContextMenuOverlayService;
+    let overlay: Overlay;
+    let injector: Injector;
+    const overlayConfig = {
+        panelClass: 'test-panel',
+        source: <MouseEvent> {
+            clientY: 1,
+            clientX: 1
+        }
+    };
+
+    beforeEach(() => {
+        TestBed.configureTestingModule({
+            imports: [NoopAnimationsModule, CoreTestingModule],
+            providers: [
+                Overlay,
+                UserPreferencesService
+            ]
+        });
+
+        userPreferencesService = TestBed.get(UserPreferencesService);
+        overlay = TestBed.get(Overlay);
+        injector = TestBed.get(Injector);
+    });
+
+    describe('Overlay', () => {
+        beforeEach(() => {
+            contextMenuOverlayService = new ContextMenuOverlayService(
+                injector,
+                overlay,
+                userPreferencesService
+            );
+        });
+
+        it('should should create a custom overlay', () => {
+            contextMenuOverlayService.open(overlayConfig);
+
+            expect(document.querySelector('.test-panel')).not.toBe(null);
+        });
+
+        it('should render component', () => {
+            contextMenuOverlayService.open(overlayConfig);
+
+            expect(document.querySelector('adf-context-menu')).not.toBe(null);
+        });
+
+    });
+
+    describe('Overlay direction', () => {
+        it('should have default LTR direction value', () => {
+            contextMenuOverlayService = new ContextMenuOverlayService(
+                injector,
+                overlay,
+                userPreferencesService
+            );
+            contextMenuOverlayService.open(overlayConfig);
+
+            expect(document.body.querySelector('div[dir="ltr"]')).not.toBe(null);
+        });
+
+        it('should be created with textOrientation event value', () => {
+            spyOn(userPreferencesService, 'select').and.returnValue(of('rtl'));
+
+            contextMenuOverlayService = new ContextMenuOverlayService(
+                injector,
+                overlay,
+                userPreferencesService
+            );
+            contextMenuOverlayService.open(overlayConfig);
+
+            expect(document.body.querySelector('div[dir="rtl"]')).not.toBe(null);
+        });
+    });
+});
diff --git a/lib/core/context-menu/context-menu-overlay.service.ts b/lib/core/context-menu/context-menu-overlay.service.ts
index 6b886dafb7..117c987eaa 100644
--- a/lib/core/context-menu/context-menu-overlay.service.ts
+++ b/lib/core/context-menu/context-menu-overlay.service.ts
@@ -22,6 +22,8 @@ import { ContextMenuOverlayRef } from './context-menu-overlay';
 import { ContextMenuOverlayConfig } from './interfaces';
 import { CONTEXT_MENU_DATA } from './context-menu.tokens';
 import { ContextMenuListComponent } from './context-menu-list.component';
+import { UserPreferencesService } from '../services/user-preferences.service';
+import { Direction } from '@angular/cdk/bidi';
 
 const DEFAULT_CONFIG: ContextMenuOverlayConfig = {
     panelClass: 'cdk-overlay-pane',
@@ -33,8 +35,17 @@ const DEFAULT_CONFIG: ContextMenuOverlayConfig = {
     providedIn: 'root'
 })
 export class ContextMenuOverlayService {
+    private direction: Direction;
 
-    constructor( private injector: Injector, private overlay: Overlay) { }
+    constructor(
+        private injector: Injector,
+        private overlay: Overlay,
+        private userPreferencesService: UserPreferencesService
+    ) {
+        this.userPreferencesService.select('textOrientation').subscribe((textOrientation) => {
+            this.direction = textOrientation;
+        });
+     }
 
     open(config: ContextMenuOverlayConfig): ContextMenuOverlayRef {
         const overlayConfig = { ...DEFAULT_CONFIG, ...config };
@@ -123,7 +134,8 @@ export class ContextMenuOverlayService {
             backdropClass: config.backdropClass,
             panelClass: config.panelClass,
             scrollStrategy: this.overlay.scrollStrategies.close(),
-            positionStrategy
+            positionStrategy,
+            direction: this.direction
         });
 
         return overlayConfig;