diff --git a/src/app/account-app/account-app.component.html b/src/app/account-app/account-app.component.html index 8aec1ed97..06e8bbbd2 100644 --- a/src/app/account-app/account-app.component.html +++ b/src/app/account-app/account-app.component.html @@ -187,7 +187,14 @@

Settings Menu

-
+
+ + +

Settings Menu

+

Plans & Upgrades

diff --git a/src/app/account-app/account-upgrades.component.ts b/src/app/account-app/account-upgrades.component.ts index a4028a980..001a7bec5 100644 --- a/src/app/account-app/account-upgrades.component.ts +++ b/src/app/account-app/account-upgrades.component.ts @@ -28,7 +28,6 @@ import { RMM } from '../rmm'; import { DataUsageInterface } from '../rmm/account-storage'; import { RunboxTimerComponent } from './runbox-timer'; import { AsyncSubject } from 'rxjs'; -import { RunboxSidenavService } from '../runbox-components/runbox-sidenav.service'; import { ProductOrder } from './product-order'; import { Decimal } from 'decimal.js-light'; @@ -74,7 +73,6 @@ export class AccountUpgradesComponent implements OnInit { public rmmapi: RunboxWebmailAPI, private snackbar: MatSnackBar, private rmm: RMM, - public sidenavService: RunboxSidenavService, private router: Router, ) { this.router.events.subscribe(e => { diff --git a/src/app/account-app/account-welcome.component.html b/src/app/account-app/account-welcome.component.html index 3b1e472b9..d1374b881 100644 --- a/src/app/account-app/account-welcome.component.html +++ b/src/app/account-app/account-welcome.component.html @@ -1,9 +1,5 @@
- -

Account Settings

diff --git a/src/app/account-app/account-welcome.component.ts b/src/app/account-app/account-welcome.component.ts index f1808e224..0c497f389 100644 --- a/src/app/account-app/account-welcome.component.ts +++ b/src/app/account-app/account-welcome.component.ts @@ -19,7 +19,6 @@ import { Component } from '@angular/core'; import { RunboxMe, RunboxWebmailAPI } from '../rmmapi/rbwebmail'; -import { RunboxSidenavService } from '../runbox-components/runbox-sidenav.service'; @Component({ selector: 'app-account-welcome-component', @@ -30,9 +29,7 @@ export class AccountWelcomeComponent { rmm6tooltip = 'This area isn\'t upgraded to Runbox 7 yet and will open in a new tab'; isMainAccount: boolean; - constructor(rmmapi: RunboxWebmailAPI, - public sidenavService: RunboxSidenavService, -) { + constructor(rmmapi: RunboxWebmailAPI) { rmmapi.me.subscribe((me: RunboxMe) => { this.isMainAccount = !me.owner; }); diff --git a/src/app/runbox-components/runbox-container.html b/src/app/runbox-components/runbox-container.html index 82918d5a1..bf5d8a02c 100644 --- a/src/app/runbox-components/runbox-container.html +++ b/src/app/runbox-components/runbox-container.html @@ -13,6 +13,7 @@ + diff --git a/src/app/runbox-components/runbox-container.spec.ts b/src/app/runbox-components/runbox-container.spec.ts new file mode 100644 index 000000000..5939af656 --- /dev/null +++ b/src/app/runbox-components/runbox-container.spec.ts @@ -0,0 +1,91 @@ +// --------- BEGIN RUNBOX LICENSE --------- +// Copyright (C) 2016-2026 Runbox Solutions AS (runbox.com). +// +// This file is part of Runbox 7. +// +// Runbox 7 is free software: You can redistribute it and/or modify it +// under the terms of the GNU General Public License as published by the +// Free Software Foundation, either version 3 of the License, or (at your +// option) any later version. +// +// Runbox 7 is distributed in the hope that it will be useful, but +// WITHOUT ANY WARRANTY; without even the implied warranty of +// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU +// General Public License for more details. +// +// You should have received a copy of the GNU General Public License +// along with Runbox 7. If not, see . +// ---------- END RUNBOX LICENSE ---------- + +import { Component } from '@angular/core'; +import { ComponentFixture, TestBed } from '@angular/core/testing'; +import { NoopAnimationsModule } from '@angular/platform-browser/animations'; +import { RouterTestingModule } from '@angular/router/testing'; +import { Subject } from 'rxjs'; +import { MatSidenavModule } from '@angular/material/sidenav'; +import { MatListModule } from '@angular/material/list'; + +import { MobileQueryService } from '../mobile-query.service'; +import { RunboxContainerComponent } from './runbox-container'; + +@Component({ + selector: 'app-sidenav-menu', + template: '', +}) +class SidenavMenuStubComponent {} + +@Component({ + template: ` + + +
Toolbar
+
Content
+
+ `, +}) +class HostComponent {} + +describe('RunboxContainerComponent', () => { + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [ + MatListModule, + MatSidenavModule, + NoopAnimationsModule, + RouterTestingModule.withRoutes([]), + ], + declarations: [ + HostComponent, + RunboxContainerComponent, + SidenavMenuStubComponent, + ], + providers: [ + { provide: MobileQueryService, useValue: { matches: true, changed: new Subject() } }, + ], + }).compileComponents(); + + fixture = TestBed.createComponent(HostComponent); + fixture.detectChanges(); + }); + + it('projects toolbar content into the sidenav content area', () => { + const sidenavContent = fixture.nativeElement.querySelector('mat-sidenav-content'); + const toolbar = fixture.nativeElement.querySelector('#projected-toolbar'); + const mainContent = fixture.nativeElement.querySelector('#projected-content'); + + expect(toolbar).toBeTruthy(); + expect(mainContent).toBeTruthy(); + expect(sidenavContent.textContent).toContain('Toolbar'); + expect(sidenavContent.textContent).toContain('Content'); + }); + + it('keeps navigation content inside the sidenav', () => { + const sideMenu = fixture.nativeElement.querySelector('mat-sidenav'); + const nav = fixture.nativeElement.querySelector('#projected-nav'); + + expect(nav).toBeTruthy(); + expect(sideMenu.textContent).toContain('Settings nav'); + }); +});