bandage for bug causing for Window to now show up when switching to Dock only mode

Author: nodeful

ui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eqmac",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "scripts": {
     "start": "ng serve",
     "build": "rm -rf dist/ && ng build --prod && cd dist/ && zip -r -D ui.zip * -x '*.DS_Store'",

ui/src/app/app.component.ts

@@ -12,6 +12,7 @@ import { MatDialog } from '@angular/material'
 import { TransitionService } from './services/transitions.service'
 import { AnalyticsService } from './services/analytics.service'
 import { ApplicationService } from './services/app.service'
+import { SettingsService, IconMode } from './sections/settings/settings.service'
 
 @Component({
   selector: 'app-root',
@@ -37,11 +38,13 @@ export class AppComponent implements OnInit, AfterContentInit {
     public matDialog: MatDialog,
     private transitions: TransitionService,
     private analytics: AnalyticsService,
-    private app: ApplicationService
+    private app: ApplicationService,
+    private settings: SettingsService
   ) { }
 
   async ngOnInit () {
-    this.sync()
+    await this.sync()
+    await this.fixUIMode()
     this.analytics.send()
   }
 
@@ -108,6 +111,17 @@ export class AppComponent implements OnInit, AfterContentInit {
     }
   }
 
+  async fixUIMode () {
+    const [ mode, iconMode ] = await Promise.all([
+      this.ui.getMode(),
+      this.settings.getIconMode()
+    ])
+
+    if (mode === 'popover' && iconMode === IconMode.dock) {
+      await this.ui.setMode('window')
+    }
+  }
+
   closeDropdownSection (section: string, event?: any) {
     // if (event && event.target && ['backdrop', 'mat-dialog'].some(e => event.target.className.includes(e))) return
     if (this.matDialog.openDialogs.length) return

ui/src/app/sections/header/header.component.ts

@@ -4,6 +4,7 @@ import { UIService, UIMode } from 'src/app/services/ui.service'
 import { FadeInOutAnimation } from 'src/app/modules/animations'
 import { MatDialog } from '@angular/material'
 import { ConfirmDialogComponent } from '../../components/confirm-dialog/confirm-dialog.component'
+import { SettingsService, IconMode } from '../settings/settings.service'
 
 @Component({
   selector: 'eqm-header',
@@ -22,7 +23,8 @@ export class HeaderComponent implements OnInit {
   constructor (
     private app: ApplicationService,
     private ui: UIService,
-    private dialog: MatDialog
+    private dialog: MatDialog,
+    private settings: SettingsService
     ) { }
 
   async ngOnInit () {
@@ -92,6 +94,10 @@ export class HeaderComponent implements OnInit {
 
   async toggleUIMode () {
     this.uiMode = this.uiMode === 'window' ? 'popover' : 'window'
+    const iconMode = await this.settings.getIconMode()
+    if (this.uiMode === 'popover' && iconMode === IconMode.dock) {
+      await this.settings.setIconMode(IconMode.both)
+    }
     await this.ui.setMode(this.uiMode)
   }
   // toggleMode () {

ui/src/app/sections/settings/settings.component.ts

@@ -43,7 +43,13 @@ export class SettingsComponent implements OnInit {
       label: 'Status Bar'
     }],
     selectedId: IconMode.both,
-    selected: iconMode => this.settingsService.setIconMode(iconMode as IconMode)
+    selected: async iconMode => {
+      const uiMode = await this.ui.getMode()
+      if (iconMode === IconMode.dock && uiMode === 'popover') {
+        await this.ui.setMode('window')
+      }
+      await this.settingsService.setIconMode(iconMode as IconMode)
+    }
   }
   uninstallOption: ButtonOption = {
     key: 'uninstall',

ui/src/app/sections/settings/settings.service.ts

@@ -6,7 +6,6 @@ export enum IconMode {
   dock = 'dock',
   statusBar = 'statusBar'
 }
-export type UIMode = 'window' | 'popover'
 
 @Injectable({
   providedIn: 'root'

ui/src/app/services/ui.service.ts

@@ -54,7 +54,7 @@ export class UIService extends DataService {
     return mode
   }
 
-  setMode (mode: UIMode) {
+  async setMode (mode: UIMode) {
     return this.request({ method: 'POST', endpoint: '/mode', data: { mode } })
   }