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>

web/projects/shared/src/components/drive.component.ts

@@ -3,7 +3,6 @@ import { Component, Input } from '@angular/core'
 import { UnitConversionPipesModule } from '../pipes/unit-conversion/unit-conversion.module'
 
 @Component({
-  standalone: true,
   selector: 'button[drive]',
   template: `
     <tui-icon icon="@tui.save" />

web/projects/shared/src/components/initializing.component.ts

@@ -5,7 +5,6 @@ import { LogsWindowComponent } from './logs-window.component'
 import { i18nPipe } from '../i18n/i18n.pipe'
 
 @Component({
-  standalone: true,
   selector: 'app-initializing',
   template: `
     <section>

web/projects/shared/src/components/logs-window.component.ts

@@ -1,16 +1,15 @@
-import { TuiScrollbar } from '@taiga-ui/core'
 import { AsyncPipe } from '@angular/common'
 import { Component, ElementRef, inject } from '@angular/core'
 import {
-  WaIntersectionObserver,
   INTERSECTION_ROOT,
+  WaIntersectionObserver,
 } from '@ng-web-apis/intersection-observer'
 import { WaMutationObserver } from '@ng-web-apis/mutation-observer'
-import { NgDompurifyModule } from '@tinkoff/ng-dompurify'
+import { TuiScrollbar } from '@taiga-ui/core'
+import { NgDompurifyPipe } from '@taiga-ui/dompurify'
 import { SetupLogsService } from '../services/setup-logs.service'
 
 @Component({
-  standalone: true,
   selector: 'logs-window',
   template: `
     <tui-scrollbar childList subtree (waMutationObserver)="scrollTo(bottom)">
@@ -25,11 +24,16 @@ import { SetupLogsService } from '../services/setup-logs.service'
       ></section>
     </tui-scrollbar>
   `,
+  styles: `
+    pre {
+      white-space: normal;
+    }
+  `,
   imports: [
     AsyncPipe,
     WaMutationObserver,
     WaIntersectionObserver,
-    NgDompurifyModule,
+    NgDompurifyPipe,
     TuiScrollbar,
   ],
   providers: [

web/projects/shared/src/components/markdown.component.ts

@@ -2,8 +2,8 @@ import { ChangeDetectionStrategy, Component, inject } from '@angular/core'
 import { toSignal } from '@angular/core/rxjs-interop'
 import { ActivatedRoute } from '@angular/router'
 import { TuiDialogContext, TuiLoader, TuiNotification } from '@taiga-ui/core'
+import { NgDompurifyPipe } from '@taiga-ui/dompurify'
 import { injectContext, PolymorpheusComponent } from '@taiga-ui/polymorpheus'
-import { NgDompurifyModule } from '@tinkoff/ng-dompurify'
 import { catchError, ignoreElements, Observable, of } from 'rxjs'
 import { SafeLinksDirective } from '../directives/safe-links.directive'
 import { MarkdownPipe } from '../pipes/markdown.pipe'
@@ -24,12 +24,11 @@ import { getErrorMessage } from '../services/error.service'
     }
   `,
   changeDetection: ChangeDetectionStrategy.OnPush,
-  standalone: true,
   host: { class: 'g-subpage' },
   imports: [
     TuiNotification,
     TuiLoader,
-    NgDompurifyModule,
+    NgDompurifyPipe,
     MarkdownPipe,
     SafeLinksDirective,
   ],

web/projects/shared/src/components/prompt.component.ts

@@ -12,7 +12,6 @@ import { i18nPipe } from '../i18n/i18n.pipe'
 import { i18nKey } from '../i18n/i18n.providers'
 
 @Component({
-  standalone: true,
   template: `
     <p>{{ options.message }}</p>
     <p *ngIf="options.warning" class="warning">{{ options.warning }}</p>
@@ -60,22 +59,20 @@ import { i18nKey } from '../i18n/i18n.providers'
       ></button>
     </ng-template>
   `,
-  styles: [
-    `
-      .warning {
-        color: var(--tui-status-warning);
-      }
+  styles: `
+    .warning {
+      color: var(--tui-status-warning);
+    }
 
-      .button {
-        pointer-events: auto;
-        margin-left: 0.25rem;
-      }
+    .button {
+      pointer-events: auto;
+      margin-left: 0.25rem;
+    }
 
-      .masked {
-        -webkit-text-security: disc;
-      }
-    `,
-  ],
+    .masked {
+      -webkit-text-security: disc;
+    }
+  `,
   imports: [
     CommonModule,
     FormsModule,

web/projects/shared/src/components/server.component.ts

@@ -5,7 +5,6 @@ import { TuiCell } from '@taiga-ui/layout'
 import { StartOSDiskInfo } from '../types/api'
 
 @Component({
-  standalone: true,
   selector: 'button[server]',
   template: `
     <tui-icon icon="@tui.save" />
@@ -21,7 +20,12 @@ import { StartOSDiskInfo } from '../types/api'
       </span>
     </span>
   `,
-  styles: ':host { width: stretch; border-radius: var(--tui-radius-l); }',
+  styles: `
+    :host {
+      border-radius: var(--tui-radius-l);
+    }
+  `,
+  host: { class: 'g-stretch' },
   hostDirectives: [TuiCell],
   imports: [DatePipe, TuiIcon, TuiTitle],
 })

web/projects/shared/src/components/ticker.component.ts

@@ -7,7 +7,6 @@ import {
 } from '@angular/core'
 
 @Component({
-  standalone: true,
   selector: '[ticker]',
   template: '<ng-content />',
   styles: `

web/projects/shared/src/directives/docs-link.directive.ts

@@ -10,7 +10,6 @@ export const VERSION = new InjectionToken<string>('VERSION')
 
 @Directive({
   selector: '[docsLink]',
-  standalone: true,
   host: {
     target: '_blank',
     rel: 'noreferrer',

web/projects/shared/src/directives/drag-scroller.directive.ts

@@ -1,59 +0,0 @@
-import {
-  Directive,
-  ElementRef,
-  HostListener,
-  inject,
-  NgZone,
-} from '@angular/core'
-import { ANIMATION_FRAME } from '@ng-web-apis/common'
-import { takeUntilDestroyed } from '@angular/core/rxjs-interop'
-import { tuiZonefree } from '@taiga-ui/cdk'
-import { filter } from 'rxjs'
-
-const SIZE = 100
-const SPEED = 15
-
-@Directive({
-  selector: '[dragScroller]',
-  standalone: true,
-})
-export class DragScrollerDirective {
-  private readonly element: HTMLElement = inject(ElementRef).nativeElement
-  private dragging = false
-  private x = 0
-  private y = 0
-
-  private readonly sub = inject(ANIMATION_FRAME)
-    .pipe(
-      filter(() => this.dragging),
-      tuiZonefree(inject(NgZone)),
-      takeUntilDestroyed(),
-    )
-    .subscribe(() => {
-      this.element.scrollTop += this.y * SPEED
-      this.element.scrollLeft += this.x * SPEED
-    })
-
-  @HostListener('document:pointerdown.silent', ['true'])
-  @HostListener('document:pointerup.silent', ['false'])
-  onPointer(dragging: boolean) {
-    this.dragging = dragging
-    this.x = 0
-    this.y = 0
-  }
-
-  @HostListener('pointermove.silent', ['$event'])
-  onPointerMove(event: PointerEvent) {
-    if (!this.dragging) {
-      return
-    }
-
-    const { clientX, clientY } = event
-    const { top, left, right, bottom } = this.element.getBoundingClientRect()
-    const x = Math.min(clientX - left, SIZE) - Math.min(right - clientX, SIZE)
-    const y = Math.min(clientY - top, SIZE) - Math.min(bottom - clientY, SIZE)
-
-    this.x = x / SIZE
-    this.y = y / SIZE
-  }
-}

web/projects/shared/src/directives/safe-links.directive.ts

@@ -16,7 +16,6 @@ import { tuiInjectElement } from '@taiga-ui/cdk'
       subtree: true,
     }),
   ],
-  standalone: true,
 })
 export class SafeLinksDirective {
   private readonly doc = inject(DOCUMENT)

web/projects/shared/src/i18n/dictionaries/de.ts

@@ -519,4 +519,5 @@ export default {
   517: 'Möchten Sie diese Aufgabe wirklich verwerfen?',
   518: 'Verwerfen',
   519: 'Um Clearnet-Domains zu veröffentlichen, musst du oben auf „Öffentlich machen“ klicken.',
+  520: 'Update verfügbar',
 } satisfies i18n

web/projects/shared/src/i18n/dictionaries/en.ts

@@ -518,4 +518,5 @@ export const ENGLISH = {
   'Are you sure you want to dismiss this task?': 517,
   'Dismiss': 518, // as in, dismiss or delete a task
   'To publish clearnet domains, you must click "Make Public", above.': 519,
+  'Update available': 520,
 } as const

web/projects/shared/src/i18n/dictionaries/es.ts

@@ -519,4 +519,5 @@ export default {
   517: '¿Estás seguro de que deseas descartar esta tarea?',
   518: 'Descartar',
   519: 'Para publicar dominios en clearnet, debes hacer clic en "Hacer público" arriba.',
+  520: 'Actualización disponible',
 } satisfies i18n

web/projects/shared/src/i18n/dictionaries/fr.ts

@@ -519,4 +519,5 @@ export default {
   517: 'Êtes-vous sûr de vouloir ignorer cette tâche ?',
   518: 'Ignorer',
   519: 'Pour publier des domaines clearnet, vous devez cliquer sur « Rendre public » ci-dessus.',
+  520: 'Mise à jour disponible',
 } satisfies i18n

web/projects/shared/src/i18n/dictionaries/pl.ts

@@ -519,4 +519,5 @@ export default {
   517: 'Czy na pewno chcesz odrzucić to zadanie?',
   518: 'Odrzuć',
   519: 'Aby opublikować domeny w clearnet, kliknij „Upublicznij” powyżej.',
+  520: 'Aktualizacja dostępna',
 } satisfies i18n

web/projects/shared/src/i18n/i18n.pipe.ts

@@ -3,7 +3,6 @@ import { ENGLISH } from './dictionaries/en'
 import { I18N, i18nKey } from './i18n.providers'
 
 @Pipe({
-  standalone: true,
   name: 'i18n',
   pure: false,
 })

web/projects/shared/src/pipes/exver/exver.pipe.ts

@@ -3,6 +3,7 @@ import { Exver } from '../../services/exver.service'
 
 @Pipe({
   name: 'satisfiesExver',
+  standalone: false,
 })
 export class ExverSatisfiesPipe implements PipeTransform {
   constructor(private readonly exver: Exver) {}
@@ -18,6 +19,7 @@ export class ExverSatisfiesPipe implements PipeTransform {
 
 @Pipe({
   name: 'compareExver',
+  standalone: false,
 })
 export class ExverComparesPipe implements PipeTransform {
   constructor(private readonly exver: Exver) {}

web/projects/shared/src/pipes/markdown.pipe.ts

@@ -2,7 +2,6 @@ import { Pipe, PipeTransform } from '@angular/core'
 import { marked } from 'marked'
 
 @Pipe({
-  standalone: true,
   name: 'markdown',
 })
 export class MarkdownPipe implements PipeTransform {

web/projects/shared/src/pipes/shared/empty.pipe.ts

@@ -3,6 +3,7 @@ import { isEmptyObject } from '../../util/misc.util'
 
 @Pipe({
   name: 'empty',
+  standalone: false,
 })
 export class EmptyPipe implements PipeTransform {
   transform(val: object | [] = {}): boolean {

web/projects/shared/src/pipes/shared/includes.pipe.ts

@@ -2,6 +2,7 @@ import { Pipe, PipeTransform } from '@angular/core'
 
 @Pipe({
   name: 'includes',
+  standalone: false,
 })
 export class IncludesPipe implements PipeTransform {
   transform<T>(list: T[], val: T): boolean {

web/projects/shared/src/pipes/shared/sort.pipe.ts

@@ -2,6 +2,7 @@ import { Pipe, PipeTransform } from '@angular/core'
 
 @Pipe({
   name: 'sort',
+  standalone: false,
 })
 export class SortPipe implements PipeTransform {
   transform(

web/projects/shared/src/pipes/shared/trust.pipe.ts

@@ -3,6 +3,7 @@ import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser'
 
 @Pipe({
   name: 'trustUrl',
+  standalone: false,
 })
 export class TrustUrlPipe implements PipeTransform {
   constructor(private readonly sanitizer: DomSanitizer) {}

web/projects/shared/src/pipes/unit-conversion/unit-conversion.pipe.ts

@@ -3,6 +3,7 @@ import { Pipe, PipeTransform } from '@angular/core'
 // converts bytes to gigabytes
 @Pipe({
   name: 'convertBytes',
+  standalone: false,
 })
 export class ConvertBytesPipe implements PipeTransform {
   transform(bytes: number): string {
@@ -21,6 +22,7 @@ export function convertBytes(bytes: number): string {
 
 @Pipe({
   name: 'durationToSeconds',
+  standalone: false,
 })
 export class DurationToSecondsPipe implements PipeTransform {
   transform(duration?: string | null): number {

web/projects/shared/src/public-api.ts

@@ -14,7 +14,6 @@ export * from './components/prompt.component'
 export * from './components/server.component'
 
 export * from './directives/docs-link.directive'
-export * from './directives/drag-scroller.directive'
 export * from './directives/safe-links.directive'
 
 export * from './i18n/i18n.pipe'

web/projects/shared/src/services/loading.service.ts

@@ -6,7 +6,6 @@ import { i18nPipe } from '../i18n/i18n.pipe'
 import { i18nKey } from '../i18n/i18n.providers'
 
 @Component({
-  standalone: true,
   template: '<tui-loader [textContent]="content | i18n" />',
   styles: `
     :host {