refactor: remove ionic from remaining places (#2565)

web/projects/ui/src/app/app.component.ts

@@ -1,50 +1,36 @@
-import { Component, inject, OnDestroy } from '@angular/core'
-import { Router } from '@angular/router'
-import { combineLatest, map, merge, startWith } from 'rxjs'
-import { AuthService } from './services/auth.service'
-import { SplitPaneTracker } from './services/split-pane.service'
-import { PatchDataService } from './services/patch-data.service'
-import { PatchMonitorService } from './services/patch-monitor.service'
-import { ConnectionService } from './services/connection.service'
+import { Component, inject, OnInit } from '@angular/core'
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop'
 import { Title } from '@angular/platform-browser'
-import {
-  ClientStorageService,
-  WidgetDrawer,
-} from './services/client-storage.service'
-import { ThemeSwitcherService } from './services/theme-switcher.service'
 import { THEME } from '@start9labs/shared'
 import { PatchDB } from 'patch-db-client'
+import { combineLatest, map, merge, startWith } from 'rxjs'
+import { AuthService } from './services/auth.service'
+import { ConnectionService } from './services/connection.service'
+import { PatchDataService } from './services/patch-data.service'
 import { DataModel } from './services/patch-db/data-model'
-import { slideInAnimation } from './route-animation'
-
-function hasNavigation(url: string): boolean {
-  return (
-    !url.startsWith('/loading') &&
-    !url.startsWith('/diagnostic') &&
-    !url.startsWith('/portal')
-  )
-}
+import { PatchMonitorService } from './services/patch-monitor.service'
 
 @Component({
   selector: 'app-root',
   templateUrl: 'app.component.html',
   styleUrls: ['app.component.scss'],
-  animations: [slideInAnimation],
 })
-export class AppComponent implements OnDestroy {
-  readonly subscription = merge(this.patchData, this.patchMonitor).subscribe()
-  readonly sidebarOpen$ = this.splitPane.sidebarOpen$
-  readonly widgetDrawer$ = this.clientStorageService.widgetDrawer$
+export class AppComponent implements OnInit {
+  private readonly title = inject(Title)
+  private readonly patch = inject(PatchDB<DataModel>)
+
+  readonly auth = inject(AuthService)
   readonly theme$ = inject(THEME)
-  // @TODO theres a bug here disabling the side menu from appearing on first login; refresh fixes
-  readonly navigation$ = combineLatest([
-    this.authService.isVerified$,
-    this.router.events.pipe(map(() => hasNavigation(this.router.url))),
-  ]).pipe(map(([isVerified, hasNavigation]) => isVerified && hasNavigation))
+  readonly subscription = merge(
+    inject(PatchDataService),
+    inject(PatchMonitorService),
+  )
+    .pipe(takeUntilDestroyed())
+    .subscribe()
 
   readonly offline$ = combineLatest([
-    this.authService.isVerified$,
-    this.connection.connected$,
+    inject(ConnectionService).connected$,
+    this.auth.isVerified$,
     this.patch
       .watch$('server-info', 'status-info')
       .pipe(startWith({ restarting: false, 'shutting-down': false })),
@@ -56,37 +42,9 @@ export class AppComponent implements OnDestroy {
     ),
   )
 
-  constructor(
-    private readonly router: Router,
-    private readonly titleService: Title,
-    private readonly patchData: PatchDataService,
-    private readonly patchMonitor: PatchMonitorService,
-    private readonly splitPane: SplitPaneTracker,
-    private readonly patch: PatchDB<DataModel>,
-    readonly authService: AuthService,
-    readonly connection: ConnectionService,
-    readonly clientStorageService: ClientStorageService,
-    readonly themeSwitcher: ThemeSwitcherService,
-  ) {}
-
   async ngOnInit() {
     this.patch
       .watch$('ui', 'name')
-      .subscribe(name => this.titleService.setTitle(name || 'StartOS'))
-  }
-
-  splitPaneVisible({ detail }: any) {
-    this.splitPane.sidebarOpen$.next(detail.visible)
-  }
-
-  onResize(drawer: WidgetDrawer) {
-    this.clientStorageService.updateWidgetDrawer({
-      ...drawer,
-      width: drawer.width === 400 ? 600 : 400,
-    })
-  }
-
-  ngOnDestroy() {
-    this.subscription.unsubscribe()
+      .subscribe(name => this.title.setTitle(name || 'StartOS'))
   }
 }