refactor: break routing down to apps level (#2285)

frontend/projects/ui/src/app/app.module.ts

@@ -19,10 +19,9 @@ import {
 } from '@start9labs/shared'
 
 import { AppComponent } from './app.component'
-import { AppRoutingModule } from './app-routing.module'
+import { RoutingModule } from './routing.module'
 import { OSWelcomePageModule } from './modals/os-welcome/os-welcome.module'
 import { GenericInputComponentModule } from './modals/generic-input/generic-input.component.module'
-import { MarketplaceModule } from './marketplace.module'
 import { PreloaderModule } from './app/preloader/preloader.module'
 import { FooterModule } from './app/footer/footer.module'
 import { MenuModule } from './app/menu/menu.module'
@@ -31,7 +30,7 @@ import { APP_PROVIDERS } from './app.providers'
 import { PatchDbModule } from './services/patch-db/patch-db.module'
 import { ToastContainerModule } from './components/toast-container/toast-container.module'
 import { ConnectionBarComponentModule } from './components/connection-bar/connection-bar.component.module'
-import { WidgetsPageModule } from './pages/widgets/widgets.module'
+import { WidgetsPageModule } from 'src/app/apps/ui/pages/widgets/widgets.module'
 import { ServiceWorkerModule } from '@angular/service-worker'
 import { environment } from '../environments/environment'
 import { LoadingModule } from './modals/loading/loading.module'
@@ -45,7 +44,7 @@ import { FormPageModule } from './modals/form/form.module'
     IonicModule.forRoot({
       mode: 'md',
     }),
-    AppRoutingModule,
+    RoutingModule,
     MenuModule,
     PreloaderModule,
     FooterModule,
@@ -55,7 +54,6 @@ import { FormPageModule } from './modals/form/form.module'
     GenericInputComponentModule,
     MonacoEditorModule,
     SharedPipesModule,
-    MarketplaceModule,
     PatchDbModule,
     ToastContainerModule,
     ConnectionBarComponentModule,

frontend/projects/ui/src/app/app.providers.ts

@@ -13,6 +13,7 @@ import {
   TUI_DATE_VALUE_TRANSFORMER,
 } from '@taiga-ui/kit'
 import { RELATIVE_URL, THEME, WorkspaceConfig } from '@start9labs/shared'
+import { AbstractMarketplaceService } from '@start9labs/marketplace'
 import { ApiService } from './services/api/embassy-api.service'
 import { MockApiService } from './services/api/embassy-mock-api.service'
 import { LiveApiService } from './services/api/embassy-live-api.service'
@@ -22,6 +23,7 @@ import { FilterPackagesPipe } from '../../../marketplace/src/pipes/filter-packag
 import { ThemeSwitcherService } from './services/theme-switcher.service'
 import { DateTransformerService } from './services/date-transformer.service'
 import { DatetimeTransformerService } from './services/datetime-transformer.service'
+import { MarketplaceService } from './services/marketplace.service'
 
 const {
   useMocks,
@@ -73,6 +75,10 @@ export const APP_PROVIDERS: Provider[] = [
     provide: THEME,
     useExisting: ThemeSwitcherService,
   },
+  {
+    provide: AbstractMarketplaceService,
+    useClass: MarketplaceService,
+  },
 ]
 
 export function appInitializer(

frontend/projects/ui/src/app/app/footer/footer.component.ts

@@ -1,8 +1,8 @@
 import { ChangeDetectionStrategy, Component } from '@angular/core'
-import { heightCollapse } from '../../util/animations'
+import { heightCollapse } from 'src/app/util/animations'
 import { PatchDB } from 'patch-db-client'
 import { map } from 'rxjs/operators'
-import { DataModel } from '../../services/patch-db/data-model'
+import { DataModel } from 'src/app/services/patch-db/data-model'
 
 @Component({
   selector: 'footer[appFooter]',

frontend/projects/ui/src/app/app/menu/menu.component.ts

@@ -4,7 +4,7 @@ import {
   inject,
   Inject,
 } from '@angular/core'
-import { EOSService } from '../../services/eos.service'
+import { EOSService } from 'src/app/services/eos.service'
 import { PatchDB } from 'patch-db-client'
 import {
   combineLatest,

frontend/projects/ui/src/app/app/snek/snek.directive.ts

@@ -1,8 +1,8 @@
 import { Directive, HostListener, Input } from '@angular/core'
 import { LoadingController, ModalController } from '@ionic/angular'
 import { ErrorToastService } from '@start9labs/shared'
-import { SnakePage } from '../../modals/snake/snake.page'
-import { ApiService } from '../../services/api/embassy-api.service'
+import { SnakePage } from 'src/app/modals/snake/snake.page'
+import { ApiService } from 'src/app/services/api/embassy-api.service'
 
 @Directive({
   selector: 'img[appSnek]',

frontend/projects/ui/src/app/app/snek/snek.module.ts

@@ -1,6 +1,6 @@
 import { NgModule } from '@angular/core'
 
-import { SnakePageModule } from '../../modals/snake/snake.module'
+import { SnakePageModule } from 'src/app/modals/snake/snake.module'
 import { SnekDirective } from './snek.directive'
 
 @NgModule({

frontend/projects/ui/src/app/apps/loading/loading.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core'
+import { RouterModule, Routes } from '@angular/router'
+import { LoadingModule } from '@start9labs/shared'
+import { LoadingPage } from './loading.page'
+
+const routes: Routes = [
+  {
+    path: '',
+    component: LoadingPage,
+  },
+]
+
+@NgModule({
+  imports: [LoadingModule, RouterModule.forChild(routes)],
+  declarations: [LoadingPage],
+})
+export class LoadingPageModule {}

frontend/projects/ui/src/app/apps/loading/loading.page.html

@@ -0,0 +1,4 @@
+<app-loading
+  class="ion-page"
+  (finished)="navCtrl.navigateForward('/login')"
+></app-loading>

frontend/projects/ui/src/app/apps/loading/loading.page.ts

@@ -0,0 +1,19 @@
+import { Component, inject } from '@angular/core'
+import { NavController } from '@ionic/angular'
+import {
+  provideSetupLogsService,
+  provideSetupService,
+} from '@start9labs/shared'
+
+import { ApiService } from 'src/app/services/api/embassy-api.service'
+
+@Component({
+  templateUrl: 'loading.page.html',
+  providers: [
+    provideSetupService(ApiService),
+    provideSetupLogsService(ApiService),
+  ],
+})
+export class LoadingPage {
+  readonly navCtrl = inject(NavController)
+}

frontend/projects/ui/src/app/apps/login/login.module.ts

@@ -3,8 +3,8 @@ import { RouterModule, Routes } from '@angular/router'
 import { CommonModule } from '@angular/common'
 import { FormsModule } from '@angular/forms'
 import { IonicModule } from '@ionic/angular'
-import { LoginPage } from './login.page'
 import { SharedPipesModule } from '@start9labs/shared'
+import { LoginPage } from './login.page'
 
 const routes: Routes = [
   {

frontend/projects/ui/src/app/apps/ui/pages/apps-routes/app-list/package-info.pipe.ts

@@ -5,7 +5,7 @@ import {
   DataModel,
   PackageDataEntry,
 } from 'src/app/services/patch-db/data-model'
-import { getPackageInfo, PkgInfo } from '../../../util/get-package-info'
+import { getPackageInfo, PkgInfo } from 'src/app/util/get-package-info'
 import { PatchDB } from 'patch-db-client'
 
 @Pipe({

frontend/projects/ui/src/app/apps/ui/pages/apps-routes/app-properties/app-properties.page.html

@@ -24,10 +24,9 @@
     <ion-item *ngIf="stopped$ | async" class="ion-margin-bottom">
       <ion-label>
         <p>
-          <ion-text color="warning"
-            >Service is stopped. Information on this page could be
-            inaccurate.</ion-text
-          >
+          <ion-text color="warning">
+            Service is stopped. Information on this page could be inaccurate.
+          </ion-text>
         </p>
       </ion-label>
     </ion-item>

frontend/projects/ui/src/app/apps/ui/pages/apps-routes/app-show/components/app-show-health-checks/app-show-health-checks.component.html

@@ -43,8 +43,8 @@
               <span *ngIf="result === 'loading'">
                 {{ $any(check).message }}
               </span>
-              <span *ngIf="result === 'success'"
-                >:
+              <span *ngIf="result === 'success'">
+                :
                 {{ $any(check).message }}
               </span>
             </p>

frontend/projects/ui/src/app/apps/ui/pages/backups-routes/directives/backup-create.directive.ts

@@ -1,7 +1,7 @@
 import { Directive, HostListener } from '@angular/core'
 import { LoadingController, ModalController } from '@ionic/angular'
 import { ApiService } from 'src/app/services/api/embassy-api.service'
-import { BackupSelectPage } from 'src/app/pages/backups-routes/modals/backup-select/backup-select.page'
+import { BackupSelectPage } from 'src/app/apps/ui/pages/backups-routes/modals/backup-select/backup-select.page'
 import { TargetSelectPage } from '../modals/target-select/target-select.page'
 import {
   CifsBackupTarget,

frontend/projects/ui/src/app/apps/ui/pages/backups-routes/directives/backup-restore.directive.ts

@@ -10,7 +10,7 @@ import {
   GenericInputOptions,
 } from 'src/app/modals/generic-input/generic-input.component'
 import { BackupInfo, BackupTarget } from 'src/app/services/api/api.types'
-import { RecoverSelectPage } from 'src/app/pages/backups-routes/modals/recover-select/recover-select.page'
+import { RecoverSelectPage } from 'src/app/apps/ui/pages/backups-routes/modals/recover-select/recover-select.page'
 import * as argon2 from '@start9labs/argon2'
 import { TargetSelectPage } from '../modals/target-select/target-select.page'
 

frontend/projects/ui/src/app/apps/ui/pages/backups-routes/modals/target-select/target-select.page.html

@@ -1,8 +1,8 @@
 <ion-header>
   <ion-toolbar>
-    <ion-title
-      >Select Backup {{ type === 'create' ? 'Target' : 'Source' }}</ion-title
-    >
+    <ion-title>
+      Select Backup {{ type === 'create' ? 'Target' : 'Source' }}
+    </ion-title>
     <ion-buttons slot="end">
       <ion-button (click)="dismiss()">
         <ion-icon slot="icon-only" name="close"></ion-icon>
@@ -48,7 +48,7 @@
 
       <div *ngIf="!targets.length" class="ion-text-center ion-padding-top">
         <h2 class="ion-padding-bottom">No saved targets</h2>
-        <ion-button (click)="goToTargets()"> Go to Targets </ion-button>
+        <ion-button (click)="goToTargets()">Go to Targets</ion-button>
       </div>
     </ion-item-group>
   </ng-template>