From fd822251278f79365aa580f56f13a0cb45f920f2 Mon Sep 17 00:00:00 2001
From: Volker Theile <vtheile@suse.com>
Date: Mon, 14 May 2018 15:14:16 +0200
Subject: [PATCH] mgr/dashboard: Navbar dropdown button does not respond for
 mobile-like browsers

Signed-off-by: Volker Theile <vtheile@suse.com>
(cherry picked from commit b3175d9fa777ea4d7437f0c6d0f281b2b36d7560)
---
 .../app/core/navigation/navigation.module.ts  |  4 +-
 .../navigation/navigation.component.html      |  6 +--
 .../navigation/navigation.component.spec.ts   | 39 +++++++++----------
 .../navigation/navigation.component.ts        |  1 +
 4 files changed, 25 insertions(+), 25 deletions(-)

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/navigation.module.ts b/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/navigation.module.ts
index 6965506256b67..acac6adce0247 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/navigation.module.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/navigation.module.ts
@@ -2,8 +2,7 @@ import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 import { RouterModule } from '@angular/router';
 
-import { BsDropdownModule } from 'ngx-bootstrap/dropdown';
-import { PopoverModule } from 'ngx-bootstrap/popover';
+import { BsDropdownModule, CollapseModule, PopoverModule } from 'ngx-bootstrap';
 
 import { AppRoutingModule } from '../../app-routing.module';
 import { SharedModule } from '../../shared/shared.module';
@@ -16,6 +15,7 @@ import { TaskManagerComponent } from './task-manager/task-manager.component';
   imports: [
     CommonModule,
     AuthModule,
+    CollapseModule.forRoot(),
     BsDropdownModule.forRoot(),
     PopoverModule.forRoot(),
     AppRoutingModule,
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/navigation/navigation.component.html b/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/navigation/navigation.component.html
index 0a3d8fa5471f7..6444f8be56cfd 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/navigation/navigation.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/navigation/navigation.component.html
@@ -10,8 +10,7 @@
 
     <button type="button"
             class="navbar-toggle collapsed"
-            data-toggle="collapse"
-            data-target="#bs-example-navbar-collapse-1">
+            (click)="isCollapsed = !isCollapsed">
       <span i18n
             class="sr-only">Toggle navigation
       </span>
@@ -23,7 +22,8 @@
 
   <!-- Collect the nav links, forms, and other content for toggling -->
   <div class="collapse navbar-collapse"
-       id="bs-example-navbar-collapse-1">
+       id="bs-example-navbar-collapse-1"
+       [collapse]="isCollapsed">
     <ul class="nav navbar-nav navbar-primary">
 
       <!-- Dashboard -->
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/navigation/navigation.component.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/navigation/navigation.component.spec.ts
index c54bab6eeafc4..0c75aab50d04e 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/navigation/navigation.component.spec.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/navigation/navigation.component.spec.ts
@@ -2,7 +2,7 @@ import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 import { RouterTestingModule } from '@angular/router/testing';
 
-import { PopoverModule } from 'ngx-bootstrap/popover';
+import { CollapseModule, PopoverModule } from 'ngx-bootstrap';
 
 import { NotificationService } from '../../../shared/services/notification.service';
 import { SharedModule } from '../../../shared/shared.module';
@@ -17,25 +17,24 @@ describe('NavigationComponent', () => {
 
   const fakeService = new NotificationService(null, null);
 
-  beforeEach(
-    async(() => {
-      TestBed.configureTestingModule({
-        imports: [
-          SharedModule,
-          RouterTestingModule,
-          HttpClientTestingModule,
-          PopoverModule.forRoot()
-        ],
-        declarations: [
-          NavigationComponent,
-          NotificationsComponent,
-          LogoutComponent,
-          TaskManagerComponent
-        ],
-        providers: [{ provide: NotificationService, useValue: fakeService }]
-      }).compileComponents();
-    })
-  );
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [
+        SharedModule,
+        RouterTestingModule,
+        HttpClientTestingModule,
+        CollapseModule.forRoot(),
+        PopoverModule.forRoot()
+      ],
+      declarations: [
+        NavigationComponent,
+        NotificationsComponent,
+        LogoutComponent,
+        TaskManagerComponent
+      ],
+      providers: [{ provide: NotificationService, useValue: fakeService }]
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(NavigationComponent);
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/navigation/navigation.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/navigation/navigation.component.ts
index ee61c41134fa2..05727f1f0a6e7 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/navigation/navigation.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/navigation/navigation.component.ts
@@ -9,6 +9,7 @@ import { SummaryService } from '../../../shared/services/summary.service';
 export class NavigationComponent implements OnInit {
   summaryData: any;
   rbdPools: Array<any> = [];
+  isCollapsed = true;
 
   constructor(private summaryService: SummaryService) {}
 
-- 
2.39.5