update/alpha.9 (#2988)

* import marketplac preview for sideload

* fix: improve state service (#2977)

* fix: fix sideload DI

* fix: update Angular

* fix: cleanup

* fix: fix version selection

* Bump node version to fix build for Angular

* misc fixes
- update node to v22
- fix chroot-and-upgrade access to prune-images
- don't self-migrate legacy packages
- #2985
- move dataVersion to volume folder
- remove "instructions.md" from s9pk
- add "docsUrl" to manifest

* version bump

* include flavor when clicking view listing from updates tab

* closes #2980

* fix: fix select button

* bring back ssh keys

* fix: drop 'portal' from all routes

* fix: implement longtap action to select table rows

* fix description for ssh page

* replace instructions with docsLink and refactor marketplace preview

* delete unused translations

* fix patchdb diffing algorithm

* continue refactor of marketplace lib show components

* Booting StartOS instead of Setting up your server on init

* misc fixes
- closes #2990
- closes #2987

* fix build

* docsUrl and clickable service headers

* don't cleanup after update until new service install succeeds

* update types

* misc fixes

* beta.35

* sdkversion, githash for sideload, correct logs for init, startos pubkey display

* bring back reboot button on install

* misc fixes

* beta.36

* better handling of setup and init for websocket errors

* reopen init and setup logs even on graceful closure

* better logging, misc fixes

* fix build

* dont let package stats hang

* dont show docsurl in marketplace if no docsurl

* re-add needs-config

* show error if init fails, shorten hover state on header icons

* fix operator precedemce

---------

Co-authored-by: Matt Hill <mattnine@protonmail.com>
Co-authored-by: Alex Inkin <alexander@inkin.ru>
Co-authored-by: Mariusz Kogen <k0gen@pm.me>

web/projects/setup-wizard/src/app/app.component.ts

@@ -1,9 +1,8 @@
-import { Component, inject } from '@angular/core'
+import { Component, inject, DOCUMENT } from '@angular/core'
 import { Router } from '@angular/router'
 import { ErrorService } from '@start9labs/shared'
 import { ApiService } from 'src/app/services/api.service'
 import { StateService } from './services/state.service'
-import { DOCUMENT } from '@angular/common'
 
 @Component({
   selector: 'app-root',

web/projects/setup-wizard/src/app/components/documentation.component.ts

@@ -65,8 +65,8 @@ import { DocsLinkDirective } from '@start9labs/shared'
               text-align: center;
               border-radius: clamp(2rem, 3rem, 4rem);
               cursor: pointer;
-              box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px,
-                rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
+              box-shadow: rgba(0, 0, 0, 0.1) 0 4px 6px -1px,
+                rgba(0, 0, 0, 0.06) 0 2px 4px -1px;
               background: #6866cc;
               color: #f4f4f5;
             "

web/projects/setup-wizard/src/app/pages/home.page.ts

@@ -1,4 +1,3 @@
-import { CommonModule } from '@angular/common'
 import { Component, inject, OnInit } from '@angular/core'
 import { RouterModule } from '@angular/router'
 import { ErrorService } from '@start9labs/shared'
@@ -102,7 +101,6 @@ import { StateService } from 'src/app/services/state.service'
     }
   `,
   imports: [
-    CommonModule,
     RouterModule,
     TuiCardLarge,
     TuiButton,

web/projects/setup-wizard/src/app/pages/loading.page.ts

@@ -1,29 +1,33 @@
-import { ChangeDetectionStrategy, Component, inject } from '@angular/core'
+import {
+  ChangeDetectionStrategy,
+  Component,
+  inject,
+  signal,
+} from '@angular/core'
 import { toSignal } from '@angular/core/rxjs-interop'
 import { Router } from '@angular/router'
 import {
-  ErrorService,
   formatProgress,
+  getErrorMessage,
   InitializingComponent,
 } from '@start9labs/shared'
 import { T } from '@start9labs/start-sdk'
 import {
   catchError,
-  EMPTY,
   filter,
   from,
-  interval,
   map,
   startWith,
   switchMap,
-  take,
   tap,
+  timer,
 } from 'rxjs'
 import { ApiService } from 'src/app/services/api.service'
 import { StateService } from 'src/app/services/state.service'
 
 @Component({
-  template: '<app-initializing [setupType]="type" [progress]="progress()" />',
+  template:
+    '<app-initializing [setupType]="type" [progress]="progress()" [error]="error()" />',
   styles: `
     :host {
       max-width: unset;
@@ -35,25 +39,15 @@ import { StateService } from 'src/app/services/state.service'
 })
 export default class LoadingPage {
   private readonly api = inject(ApiService)
-  private readonly errorService = inject(ErrorService)
 
   readonly type = inject(StateService).setupType
   readonly router = inject(Router)
   readonly progress = toSignal(
     from(this.getStatus()).pipe(
       filter(Boolean),
-      take(1),
       switchMap(({ guid, progress }) =>
         this.api.openWebsocket$<T.FullProgress>(guid).pipe(
           startWith(progress),
-          catchError((_, watch$) =>
-            interval(2000).pipe(
-              switchMap(() => from(this.api.getStatus())),
-              catchError(() => EMPTY),
-              take(1),
-              switchMap(() => watch$),
-            ),
-          ),
           tap(({ overall }) => {
             if (overall === true) {
               this.getStatus()
@@ -62,29 +56,32 @@ export default class LoadingPage {
         ),
       ),
       map(formatProgress),
-      catchError(e => {
-        this.errorService.handleError(e)
-        return EMPTY
-      }),
+      catchError((_, caught$) => timer(500).pipe(switchMap(() => caught$))),
     ),
     { initialValue: { total: 0, message: '' } },
   )
 
+  error = signal('')
+
   private async getStatus(): Promise<{
     status: 'running'
     guid: string
     progress: T.FullProgress
   } | null> {
-    const res = await this.api.getStatus()
+    try {
+      const res = await this.api.getStatus()
 
-    if (!res) {
-      this.router.navigate(['home'])
-      return null
-    } else if (res.status === 'complete') {
-      this.router.navigate(['success'])
-      return null
-    } else {
-      return res
+      if (!res) {
+        this.router.navigate(['home'])
+      } else if (res.status === 'complete') {
+        this.router.navigate(['success'])
+      } else {
+        return res
+      }
+    } catch (e: any) {
+      this.error.set(getErrorMessage(e))
     }
+
+    return null
   }
 }

web/projects/setup-wizard/src/app/pages/success.page.ts

@@ -1,10 +1,10 @@
-import { DOCUMENT } from '@angular/common'
 import {
   AfterViewInit,
   Component,
   ElementRef,
   inject,
   ViewChild,
+  DOCUMENT,
 } from '@angular/core'
 import { DownloadHTMLService, ErrorService } from '@start9labs/shared'
 import { TuiButton, TuiIcon, TuiSurface } from '@taiga-ui/core'

web/projects/setup-wizard/src/app/services/api.service.ts

@@ -23,7 +23,7 @@ export abstract class ApiService {
   abstract execute(setupInfo: T.SetupExecuteParams): Promise<T.SetupProgress> // setup.execute
   abstract complete(): Promise<T.SetupResult> // setup.complete
   abstract exit(): Promise<void> // setup.exit
-  abstract followServerLogs(): Promise<FollowLogsRes> // setup.logs.follow
+  abstract initFollowLogs(): Promise<FollowLogsRes> // setup.logs.follow
   abstract openWebsocket$<T>(guid: string): Observable<T>
 
   async encrypt(toEncrypt: string): Promise<T.EncryptedWire> {

web/projects/setup-wizard/src/app/services/live-api.service.ts

@@ -1,5 +1,4 @@
-import { DOCUMENT } from '@angular/common'
-import { Inject, Injectable } from '@angular/core'
+import { Inject, Injectable, DOCUMENT } from '@angular/core'
 import {
   DiskListResponse,
   encodeBase64,
@@ -98,7 +97,7 @@ export class LiveApiService extends ApiService {
     })
   }
 
-  async followServerLogs(): Promise<FollowLogsRes> {
+  async initFollowLogs(): Promise<FollowLogsRes> {
     return this.rpcRequest({ method: 'setup.logs.follow', params: {} })
   }
 

web/projects/setup-wizard/src/app/services/mock-api.service.ts

@@ -302,7 +302,7 @@ export class MockApiService extends ApiService {
     }
   }
 
-  async followServerLogs(): Promise<FollowLogsRes> {
+  async initFollowLogs(): Promise<FollowLogsRes> {
     await pauseFor(1000)
     return {
       startCursor: 'fakestartcursor',