Update Angular (#2952)

* fix Tor logs actually fetching od logs * chore: update to Angular 18 * chore: update to Angular 19 * bump patchDB * chore: update Angular * chore: fix setup-wizard success page * chore: fix * chore: fix * chore: fix * chore: fix --------- Co-authored-by: Matt Hill <mattnine@protonmail.com> Co-authored-by: Aiden McClelland <me@drbonez.dev>
2026-03-26 18:31:52 +00:00 · 2025-05-30 21:34:24 +07:00
parent 05b8dd9ad8
commit 02413a4fac
257 changed files with 5921 additions and 9539 deletions
--- a/web/projects/setup-wizard/src/app/app.component.ts
+++ b/web/projects/setup-wizard/src/app/app.component.ts
@@ -8,6 +8,7 @@ import { DOCUMENT } from '@angular/common'
@Component({
  selector: 'app-root',
  template: '<tui-root tuiTheme="dark"><router-outlet /></tui-root>',
+  standalone: false,
 })
 export class AppComponent {
  private readonly api = inject(ApiService)
--- a/web/projects/setup-wizard/src/app/app.module.ts
+++ b/web/projects/setup-wizard/src/app/app.module.ts
@@ -1,7 +1,9 @@
-import { HttpClientModule } from '@angular/common/http'
-import { NgModule } from '@angular/core'
+import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http'
+import { inject, NgModule, provideAppInitializer } from '@angular/core'
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations'
 import { PreloadAllModules, RouterModule } from '@angular/router'
+import { WA_LOCATION } from '@ng-web-apis/common'
+import initArgon from '@start9labs/argon2'
 import {
  provideSetupLogsService,
  RELATIVE_URL,
@@ -27,7 +29,6 @@ const version = require('../../../../package.json').version
  declarations: [AppComponent],
  imports: [
    BrowserAnimationsModule,
-    HttpClientModule,
    RouterModule.forRoot(ROUTES, {
      preloadingStrategy: PreloadAllModules,
      initialNavigation: 'disabled',
@@ -50,6 +51,13 @@ const version = require('../../../../package.json').version
      provide: VERSION,
      useValue: version,
    },
+    provideHttpClient(withInterceptorsFromDi()),
+    provideAppInitializer(() => {
+      const origin = inject(WA_LOCATION).origin
+      const module_or_path = new URL('/assets/argon2_bg.wasm', origin)
+
+      initArgon({ module_or_path })
+    }),
  ],
  bootstrap: [AppComponent],
 })
--- a/web/projects/setup-wizard/src/app/components/cifs.component.ts
+++ b/web/projects/setup-wizard/src/app/components/cifs.component.ts
@@ -28,7 +28,6 @@ export interface CifsResponse {
 }

@Component({
-  standalone: true,
  template: `
    <form [formGroup]="form" (ngSubmit)="submit()">
      <tui-input formControlName="hostname">
@@ -78,10 +77,17 @@ export interface CifsResponse {
      </footer>
    </form>
  `,
-  styles: [
-    '.input { margin-top: 1rem }',
-    'footer { display: flex; gap: 1rem; margin-top: 1rem }',
-  ],
+  styles: `
+    .input {
+      margin-top: 1rem;
+    }
+
+    footer {
+      display: flex;
+      gap: 1rem;
+      margin-top: 1rem;
+    }
+  `,
  imports: [
    CommonModule,
    FormsModule,
--- a/web/projects/setup-wizard/src/app/components/documentation.component.ts
+++ b/web/projects/setup-wizard/src/app/components/documentation.component.ts
@@ -2,7 +2,6 @@ import { ChangeDetectionStrategy, Component, Input } from '@angular/core'
 import { DocsLinkDirective } from '@start9labs/shared'

@Component({
-  standalone: true,
  selector: 'app-documentation',
  template: `
    <!doctype html>
--- a/web/projects/setup-wizard/src/app/components/matrix.component.ts
+++ b/web/projects/setup-wizard/src/app/components/matrix.component.ts
@@ -5,7 +5,6 @@ import { WA_WINDOW } from '@ng-web-apis/common'
 const FADE_FACTOR = 0.07

@Component({
-  standalone: true,
  selector: 'canvas[matrix]',
  template: 'Your browser does not support the canvas element.',
  styles: ':host { position: fixed; top: 0 }',
--- a/web/projects/setup-wizard/src/app/components/password.component.ts
+++ b/web/projects/setup-wizard/src/app/components/password.component.ts
@@ -7,7 +7,7 @@ import {
  ReactiveFormsModule,
  Validators,
 } from '@angular/forms'
-import * as argon2 from '@start9labs/argon2'
+import { verify } from '@start9labs/argon2'
 import { ErrorService } from '@start9labs/shared'
 import { TuiAutoFocus, TuiMapperPipe, TuiValidator } from '@taiga-ui/cdk'
 import {
@@ -30,7 +30,6 @@ interface DialogData {
 }

@Component({
-  standalone: true,
  template: `
    @if (storageDrive) {
      Choose a password for your server.
@@ -142,7 +141,7 @@ export class PasswordComponent {
    }

    try {
-      argon2.verify(this.context.data.passwordHash || '', password)
+      verify(this.context.data.passwordHash || '', password)
      this.context.completeWith(password)
    } catch (e) {
      this.errorService.handleError('Incorrect password provided')
--- a/web/projects/setup-wizard/src/app/components/password.directive.ts
+++ b/web/projects/setup-wizard/src/app/components/password.directive.ts
@@ -5,7 +5,6 @@ import { filter, fromEvent, switchMap } from 'rxjs'
 import { PASSWORD } from 'src/app/components/password.component'

@Directive({
-  standalone: true,
  selector: 'button[server][password]',
 })
 export class PasswordDirective {
--- a/web/projects/setup-wizard/src/app/components/recover.component.ts
+++ b/web/projects/setup-wizard/src/app/components/recover.component.ts
@@ -4,7 +4,6 @@ import { Component, Input } from '@angular/core'
 import { RouterModule } from '@angular/router'

@Component({
-  standalone: true,
  selector: 'app-recover',
  template: `
    <a tuiCell [routerLink]="disabled ? null : '/attach'">
--- a/web/projects/setup-wizard/src/app/components/servers.component.ts
+++ b/web/projects/setup-wizard/src/app/components/servers.component.ts
@@ -15,7 +15,6 @@ export interface ServersResponse {
 }

@Component({
-  standalone: true,
  template: `
    @for (server of context.data.servers; track $index) {
      <button [server]="server" (password)="select($event, server.id)"></button>
--- a/web/projects/setup-wizard/src/app/pages/attach.page.ts
+++ b/web/projects/setup-wizard/src/app/pages/attach.page.ts
@@ -15,7 +15,6 @@ import { ApiService } from 'src/app/services/api.service'
 import { StateService } from 'src/app/services/state.service'

@Component({
-  standalone: true,
  template: `
    <section tuiCardLarge="compact">
      <header>Use existing drive</header>
--- a/web/projects/setup-wizard/src/app/pages/home.page.ts
+++ b/web/projects/setup-wizard/src/app/pages/home.page.ts
@@ -9,7 +9,6 @@ import { ApiService } from 'src/app/services/api.service'
 import { StateService } from 'src/app/services/state.service'

@Component({
-  standalone: true,
  template: `
    <img class="logo" src="assets/img/icon.png" alt="Start9" />
    @if (!loading) {
@@ -59,7 +58,7 @@ import { StateService } from 'src/app/services/state.service'
    }
  `,
  styles: `
-    @import '@taiga-ui/core/styles/taiga-ui-local';
+    @use '@taiga-ui/core/styles/taiga-ui-local' as taiga;

    .logo {
      width: 6rem;
@@ -88,7 +87,7 @@ import { StateService } from 'src/app/services/state.service'
    }

    .options {
-      @include transition(margin);
+      @include taiga.transition(margin);

      min-width: 100%;
      display: flex;
--- a/web/projects/setup-wizard/src/app/pages/loading.page.ts
+++ b/web/projects/setup-wizard/src/app/pages/loading.page.ts
@@ -23,9 +23,13 @@ import { ApiService } from 'src/app/services/api.service'
 import { StateService } from 'src/app/services/state.service'

@Component({
-  standalone: true,
  template: '<app-initializing [setupType]="type" [progress]="progress()" />',
-  styles: ':host { max-width: unset; align-items: stretch; }',
+  styles: `
+    :host {
+      max-width: unset;
+      align-items: stretch;
+    }
+  `,
  imports: [InitializingComponent],
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
--- a/web/projects/setup-wizard/src/app/pages/recover.page.ts
+++ b/web/projects/setup-wizard/src/app/pages/recover.page.ts
@@ -15,7 +15,6 @@ import { ApiService, StartOSDiskInfoFull } from 'src/app/services/api.service'
 import { StateService } from 'src/app/services/state.service'

@Component({
-  standalone: true,
  template: `
    <section tuiCardLarge="compact">
      <header>Restore from Backup</header>
--- a/web/projects/setup-wizard/src/app/pages/storage.page.ts
+++ b/web/projects/setup-wizard/src/app/pages/storage.page.ts
@@ -17,7 +17,6 @@ import { ApiService } from 'src/app/services/api.service'
 import { StateService } from 'src/app/services/state.service'

@Component({
-  standalone: true,
  template: `
    <section tuiCardLarge="compact">
      @if (loading || drives.length) {
--- a/web/projects/setup-wizard/src/app/pages/success.page.ts
+++ b/web/projects/setup-wizard/src/app/pages/success.page.ts
@@ -15,7 +15,6 @@ import { ApiService } from 'src/app/services/api.service'
 import { StateService } from 'src/app/services/state.service'

@Component({
-  standalone: true,
  template: `
    <canvas matrix></canvas>
    @if (stateService.kiosk) {
@@ -90,6 +89,14 @@ import { StateService } from 'src/app/services/state.service'
      color: var(--tui-text-primary);
      text-decoration: none;
      text-align: center;
+
+      &[data-appearance='floating'] {
+        background: var(--tui-background-neutral-1);
+
+        &:hover {
+          background: var(--tui-background-neutral-1-hover) !important;
+        }
+      }
    }

    a[tuiCardLarge]:not([href]) {
--- a/web/projects/setup-wizard/src/app/pages/transfer.page.ts
+++ b/web/projects/setup-wizard/src/app/pages/transfer.page.ts
@@ -19,7 +19,6 @@ import { ApiService } from 'src/app/services/api.service'
 import { StateService } from 'src/app/services/state.service'

@Component({
-  standalone: true,
  template: `
    <section tuiCardLarge="compact">
      <header>Transfer</header>