@duplicati/ngclient 0.0.1

package/src/app/core/pipes/duration.pipe.ts

@@ -0,0 +1,27 @@
+import { inject, Pipe, type PipeTransform } from '@angular/core';
+import { DAYJS } from '../providers/dayjs';
+
+@Pipe({
+  name: 'durationFormat',
+  standalone: true,
+})
+export class DurationFormatPipe implements PipeTransform {
+  #dayjs = inject(DAYJS);
+
+  transform(value: string | undefined | null, ...args: unknown[]): unknown {
+    if (!value) return '';
+
+    const _value = value.split('.')[0];
+    const hours = parseInt(_value.split(':')[0]) ?? 0;
+    const minutes = parseInt(_value.split(':')[1]) ?? 0;
+    const seconds = parseInt(_value.split(':')[2]) ?? 0;
+
+    return this.#dayjs
+      .duration({
+        hours,
+        minutes,
+        seconds,
+      })
+      .humanize();
+  }
+}

package/src/app/core/pipes/relative-time.pipe.ts

@@ -0,0 +1,14 @@
+import { inject, Pipe, type PipeTransform } from '@angular/core';
+import { DAYJS } from '../providers/dayjs';
+
+@Pipe({
+  name: 'appRelativeTime',
+  standalone: true,
+})
+export class RelativeTimePipe implements PipeTransform {
+  #dayjs = inject(DAYJS);
+
+  transform(value: string, ...args: unknown[]): unknown {
+    return this.#dayjs(value).fromNow();
+  }
+}

package/src/app/core/providers/dayjs.ts

@@ -0,0 +1,16 @@
+import { InjectionToken, Provider } from '@angular/core';
+import dayjs from 'dayjs';
+import duration from 'dayjs/plugin/duration';
+import relativeTime from 'dayjs/plugin/relativeTime';
+
+export const DAYJS = new InjectionToken<typeof dayjs>('Dayjs');
+
+export const DayJsProvider: Provider = {
+  provide: DAYJS,
+  useFactory: () => {
+    dayjs.extend(relativeTime);
+    dayjs.extend(duration);
+
+    return dayjs;
+  },
+};

package/src/app/core/services/dictionary.service.ts

@@ -0,0 +1,12 @@
+import { Injectable, signal } from '@angular/core';
+
+type Dictionary = {};
+
+@Injectable({
+  providedIn: 'root',
+})
+export class DictionaryService {
+  #activeDictionary = signal(null);
+
+  activeDictionary = this.#activeDictionary.asReadonly();
+}

package/src/app/core/services/localstorage.token.ts

@@ -0,0 +1,82 @@
+import { isPlatformBrowser, isPlatformServer } from '@angular/common';
+import { Injectable, PLATFORM_ID, inject } from '@angular/core';
+
+@Injectable()
+export class LOCALSTORAGE implements Storage {
+  private platformId = inject(PLATFORM_ID);
+  private STORAGE_VERSION = 'v1';
+  private APP_NAME = 'duplicati';
+
+  getItemParsed<T>(key: string, presistedThroughClear = false): T | null {
+    if (isPlatformServer(this.platformId)) return null;
+
+    return JSON.parse(
+      localStorage.getItem(
+        `${this.STORAGE_VERSION}:${presistedThroughClear ? 'presist-duplicati' : this.APP_NAME}:${key}`
+      ) ?? 'null'
+    );
+  }
+
+  setItemParsed<T>(key: string, value: T, presistThroughClear = false): void {
+    if (isPlatformServer(this.platformId)) return;
+
+    return localStorage.setItem(
+      `${this.STORAGE_VERSION}:${presistThroughClear ? 'presist-duplicati' : this.APP_NAME}:${key}`,
+      JSON.stringify(value)
+    );
+  }
+
+  get length(): number {
+    return isPlatformBrowser(this.platformId) ? localStorage.length : 0;
+  }
+
+  getItem(key: string): string | null {
+    if (isPlatformServer(this.platformId)) return null;
+
+    return localStorage.getItem(`${this.STORAGE_VERSION}:${this.APP_NAME}:${key}`) ?? null;
+  }
+
+  setItem(key: string, value: string): void {
+    if (isPlatformServer(this.platformId)) return;
+
+    return localStorage.setItem(`${this.STORAGE_VERSION}:${this.APP_NAME}:${key}`, value);
+  }
+
+  removeItem(key: string): void {
+    if (isPlatformServer(this.platformId)) return;
+
+    localStorage.removeItem(`${this.STORAGE_VERSION}:${this.APP_NAME}:${key}`);
+  }
+
+  clearAllNotCurrentVersion(): void {
+    if (isPlatformServer(this.platformId)) return;
+
+    for (var key in localStorage) {
+      if (!key.startsWith(this.STORAGE_VERSION)) {
+        localStorage.removeItem(key);
+      }
+    }
+  }
+
+  clearAll(): void {
+    if (isPlatformServer(this.platformId)) return;
+
+    localStorage.clear();
+  }
+
+  clear(): void {
+    if (isPlatformServer(this.platformId)) return;
+
+    for (var key in localStorage) {
+      if (key.includes(this.APP_NAME) && !key.includes(`presist-${this.APP_NAME}`)) {
+        localStorage.removeItem(key);
+      }
+    }
+  }
+
+  key(index: number): string | null {
+    if (isPlatformServer(this.platformId)) return null;
+
+    return localStorage.key(index);
+  }
+}

package/src/app/core/services/password-generator.service.ts

@@ -0,0 +1,39 @@
+import { Injectable } from '@angular/core';
+
+const DEFAULT_PASSWORD_PATTERN = /[a-zA-Z0-9_\-\+\.]/;
+
+@Injectable({
+  providedIn: 'root',
+})
+export class PasswordGeneratorService {
+  generate(length: number, pattern = DEFAULT_PASSWORD_PATTERN) {
+    const _self = this;
+
+    return Array.apply(null, { length: length } as any)
+      .map(() => {
+        let result;
+        while (true) {
+          result = String.fromCharCode(_self.#getRandomByte());
+
+          if (pattern.test(result)) {
+            return result;
+          }
+        }
+      }, this)
+      .join('');
+  }
+
+  #getRandomByte() {
+    if (window.crypto && window.crypto.getRandomValues) {
+      const result = new Uint8Array(1);
+      window.crypto.getRandomValues(result);
+      return result[0];
+    } else if ((window as any).msCrypto && (window as any).msCrypto.getRandomValues) {
+      const result = new Uint8Array(1);
+      (window as any).msCrypto.getRandomValues(result);
+      return result[0];
+    } else {
+      return Math.floor(Math.random() * 256);
+    }
+  }
+}

package/src/app/core/services/relay-websocket.service.ts

@@ -0,0 +1,268 @@
+import { effect, inject, Injectable, signal } from '@angular/core';
+import { ENVIRONMENT_TOKEN } from '../../../environments/environment-token';
+
+type SocketProtocolState = 'disconnected' | 'connect' | 'welcome' | 'authenticated' | 'error';
+
+type MessageType = 'authportal' | 'list' | 'welcome' | 'command' | 'warning' | 'auth';
+
+type MessageEnvelope = {
+  from: string;
+  to: string;
+  type: MessageType;
+  messageId: string;
+  payload: string | null;
+};
+
+type AuthRequestMessage = {
+  token: string;
+  publicKey: string;
+  clientVersion: string;
+  protocolVersion: number;
+};
+
+type AuthResponseMessage = {
+  accepted: boolean | null;
+  willReplaceToken: boolean | null;
+  newToken: string | null;
+};
+
+export type RequestMethod = 'GET' | 'POST' | 'PUT' | 'DELETE' | 'PATCH';
+
+type CommandRequest = {
+  method: RequestMethod;
+  path: string;
+  body: string | null;
+  headers: { [key: string]: string } | null;
+};
+
+type PromiseResolver = {
+  resolve: (value: CommandResponse | PromiseLike<CommandResponse>) => void;
+  reject: (reason?: any) => void;
+  timer: number;
+};
+
+export type CommandResponse = {
+  code: number;
+  body: string | null;
+  headers: { [key: string]: string } | null;
+};
+
+const ClientVersion = '1.0.0';
+const ClientId = 'portal-proxy-client';
+const ProtocolVersion = 1;
+
+@Injectable({
+  providedIn: 'root',
+})
+export class RelayWebsocketService {
+  #MIN_POLL_INTERVAL = 1000;
+  #env = inject(ENVIRONMENT_TOKEN);
+  #wsState = signal<SocketProtocolState>('disconnected');
+  #reconnectInterval = signal<number | null>(this.#MIN_POLL_INTERVAL);
+  #isReconnecting = signal(false);
+  #isConnectedToMachineServer = signal(false);
+  #reconnectToken = signal<string | null>(null);
+
+  isConnectedToMachineServer = this.#isConnectedToMachineServer.asReadonly();
+  wsState = this.#wsState.asReadonly();
+
+  // TODO:
+  // - Auto reconnect
+
+  #queuedCommands: MessageEnvelope[] = [];
+  #pendingCommands: { [key: string]: PromiseResolver } = {};
+  #ws: WebSocket | null = null;
+  #textDecoder = new TextDecoder('utf-8');
+  #activeInterval: number | null = null;
+
+  #e = effect(() => {
+    const isReconnecting = this.#isReconnecting();
+    const reconnectInterval = this.#reconnectInterval();
+    const reconnectToken = this.#reconnectToken();
+
+    if (!reconnectToken || !isReconnecting || !reconnectInterval || reconnectInterval < this.#MIN_POLL_INTERVAL) {
+      this.#activeInterval && window.clearInterval(this.#activeInterval);
+      return;
+    }
+
+    this.#activeInterval = window.setInterval(() => {
+      this.connectToMachineServer(reconnectToken);
+    }, reconnectInterval);
+  });
+
+  utf8Atob(str: string) {
+    const decodedData = Uint8Array.from(atob(str), (c) => c.charCodeAt(0));
+
+    const stringifiedJson = this.#textDecoder.decode(decodedData);
+    if (stringifiedJson)
+      return JSON.parse(stringifiedJson);
+    else
+      return null;
+  }
+
+  connectToMachineServer(token: string, options?: { reconnect?: boolean }) {
+    const reconnect = options?.reconnect ?? false;
+
+    if (this.#ws && this.wsState() === 'authenticated' && !reconnect) {
+      return;
+    }
+
+    if (this.#ws && this.wsState() !== 'authenticated') {
+      this.#ws.close();
+    }
+
+    this.#ws = new WebSocket(this.#env.machineServerUrl);
+
+    this.#ws.onopen = () => {
+      this.#wsState.set('connect');
+      this.#isConnectedToMachineServer.set(true);
+      this.#isReconnecting.set(false);
+      this.#reconnectToken.set(null);
+    };
+
+    this.#ws.onclose = () => {
+      // Should we reconnect automatically?
+      this.#wsState.set('disconnected');
+      this.#isConnectedToMachineServer.set(false);
+      this.#reconnectToken.set(token);
+      this.#isReconnecting.set(true);
+    };
+
+    this.#ws.onerror = () => {
+      this.#wsState.set('error');
+    };
+
+    this.#ws.onmessage = (event) => {
+      const data = JSON.parse(event.data) as MessageEnvelope;
+
+      if (this.wsState() === 'connect') {
+        if (data.type !== 'welcome') {
+          this.disconnectFromMachineServer(`Unexpected message type, expected 'welcome' but got '${data.type}'`);
+          return;
+        }
+
+        const authContent: AuthRequestMessage = {
+          token: token,
+          publicKey: '',
+          clientVersion: ClientVersion,
+          protocolVersion: ProtocolVersion,
+        };
+        const authRequest = this.createResponse(data, 'authportal', authContent);
+        this.#wsState.set('welcome');
+        this.#ws?.send(authRequest);
+      } else if (this.wsState() === 'welcome') {
+        if (data.type !== 'authportal') {
+          this.disconnectFromMachineServer(`Unexpected message type, expected 'authportal' but got '${data.type}'`);
+          return;
+        }
+
+        var payload = JSON.parse(data.payload ?? '') as AuthResponseMessage;
+        if (payload.accepted === false) {
+          this.disconnectFromMachineServer('Authentication failed');
+          return;
+        }
+
+        this.#wsState.set('authenticated');
+        this.#isConnectedToMachineServer.set(true);
+
+        // Send queued commands
+        while (this.#queuedCommands.length > 0) {
+          const message = this.#queuedCommands.pop();
+          // Only send if this request has not timed out yet
+          if (message && this.#pendingCommands[message.messageId]) this.activateCommand(message);
+        }
+      } else if (this.wsState() === 'authenticated') {
+        if (data.type !== 'command') {
+          console.warn(`Unexpected message type, expected 'command' but got '${data.type}'`);
+          return;
+        }
+
+        const payload = JSON.parse(data.payload ?? '') as CommandResponse;
+        payload.body = payload?.body == null ? null : this.utf8Atob(payload.body);
+        const f = this.#pendingCommands[data.messageId];
+        if (f) {
+          delete this.#pendingCommands[data.messageId];
+          window.clearTimeout(f.timer);
+          f.resolve(payload);
+        }
+      }
+    };
+  }
+
+  private disconnectFromMachineServer(errorMessage: string | null = null) {
+    if (errorMessage) console.error(errorMessage);
+
+    this.#ws?.close();
+    this.#ws = null;
+    this.#wsState.set('disconnected');
+    this.#isConnectedToMachineServer.set(false);
+  }
+
+  private createResponse(request: MessageEnvelope, type: MessageType, payload: any) {
+    const response: MessageEnvelope = {
+      from: ClientId,
+      to: request.from,
+      type: type,
+      messageId: request.messageId,
+      payload: JSON.stringify(payload),
+    };
+
+    return JSON.stringify(response);
+  }
+
+  sendCommand(
+    token: string,
+    clientId: string,
+    method: RequestMethod,
+    path: string,
+    body: string | null,
+    headers: { [key: string]: string } | null,
+    timeout: number = 5000
+  ) {
+    if (this.wsState() === 'disconnected' || this.wsState() === 'error') {
+      // Connect to the machine server if we are not connected
+      this.connectToMachineServer(token);
+    }
+
+    return new Promise<CommandResponse>((resolve, reject) => {
+      const messageId = crypto.randomUUID();
+
+      const request: CommandRequest = {
+        method,
+        path,
+        body,
+        headers,
+      };
+
+      const message: MessageEnvelope = {
+        from: ClientId,
+        to: clientId,
+        type: 'command',
+        messageId: messageId,
+        payload: JSON.stringify(request),
+      };
+
+      const f: PromiseResolver = {
+        resolve,
+        reject,
+        timer: window.setTimeout(() => {
+          const f = this.#pendingCommands[messageId];
+          if (f) {
+            delete this.#pendingCommands[messageId];
+            f.reject('Timeout');
+          }
+        }, timeout),
+      };
+
+      this.#pendingCommands[messageId] = f;
+
+      // If we are not yet connected to the machine server, queue the command
+      if (this.#isConnectedToMachineServer()) this.activateCommand(message);
+      else this.#queuedCommands.push(message);
+    });
+  }
+
+  private activateCommand(message: MessageEnvelope) {
+    this.#ws?.send(JSON.stringify(message));
+  }
+}

package/src/app/core/services/timespan-literals.service.ts

@@ -0,0 +1,25 @@
+import { Injectable } from '@angular/core';
+
+type Unit = 's' | 'm' | 'h' | 'D' | 'W' | 'M' | 'Y';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class TimespanLiteralsService {
+  fromString(str: string | null | undefined) {
+    if (!str) return null;
+
+    const res = str.match(/(\d+)([smhDWMY])/);
+
+    return (
+      res && {
+        value: parseInt(res[1]),
+        unit: res[2] as Unit,
+      }
+    );
+  }
+
+  toString(value: number, unit: Unit) {
+    return `${value}${unit}`;
+  }
+}

package/src/app/core/states/app-auth.state.ts

@@ -0,0 +1,87 @@
+import { effect, inject, Injectable, signal } from '@angular/core';
+import { Router } from '@angular/router';
+import { take, tap } from 'rxjs';
+import { DuplicatiServerService } from '../openapi';
+import { LOCALSTORAGE } from '../services/localstorage.token';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class AppAuthState {
+  #ls = inject(LOCALSTORAGE);
+  #router = inject(Router);
+  #dupServer = inject(DuplicatiServerService);
+  #token = signal<string | null>(this.#ls.getItemParsed<string>('token') ?? null);
+  #tokenSetTime = signal<number | null>(this.#ls.getItemParsed<number>('tokenSetTime') ?? null);
+
+  tokenSetTime = this.#tokenSetTime.asReadonly();
+  token = this.#token.asReadonly();
+
+  #tokenEffect = effect(
+    () => {
+      if (!this.#token()) {
+        this.#ls.clearAll();
+        this.#router.navigate(['/login']);
+        return;
+      }
+      const now = Date.now();
+      this.#ls.setItemParsed('tokenSetTime', now);
+      this.#ls.setItemParsed('token', this.#token());
+      this.#tokenSetTime.set(this.#token() ? now : null);
+    },
+    { allowSignalWrites: true }
+  );
+
+  login(pass = 'helloworld') {
+    return this.#dupServer
+      .postApiV1AuthLogin({
+        requestBody: {
+          Password: pass,
+          RememberMe: true,
+        },
+      })
+      .pipe(
+        take(1),
+        tap((res) => this.#token.set(res.AccessToken ?? null))
+      );
+  }
+
+  refreshToken() {
+    return this.#dupServer.postApiV1AuthRefresh().pipe(
+      take(1),
+      tap((res) => this.#token.set(res.AccessToken ?? null))
+    );
+  }
+
+  logout() {
+    this.#dupServer
+      .postApiV1AuthRefreshLogout()
+      .pipe(
+        take(1),
+        tap((_) => {
+          this.#token.set(null);
+          this.#ls.clearAll();
+          this.#router.navigate(['/login']);
+        })
+      )
+      .subscribe({
+        error: (_) => {
+          this.#token.set(null);
+          this.#ls.clearAll();
+          this.#router.navigate(['/login']);
+        },
+      });
+  }
+
+  // reLogin() {
+
+  //   return this.#dupServer.postApiV1AuthRefreshLogout().pipe(
+  //     take(1),
+  //     tap((_) => {
+  //       this.#token.set(null);
+  //       this.#ls.clearAll();
+  //     })
+  //     .
+  //   );
+  // }
+}

package/src/app/core/states/backups.state.ts

@@ -0,0 +1,71 @@
+import { inject, Injectable, signal } from '@angular/core';
+import { finalize, take } from 'rxjs';
+import { DuplicatiServerService } from '../openapi';
+import { Subscribed } from '../types/subscribed';
+
+export type BackupRes = Subscribed<ReturnType<DuplicatiServerService['getApiV1Backups']>>;
+export type Backup = BackupRes[0];
+
+@Injectable({
+  providedIn: 'root',
+})
+export class BackupsState {
+  #dupServer = inject(DuplicatiServerService);
+  #timestamp: number | null = null;
+
+  backups = signal<BackupRes>([]);
+  backupsLoading = signal(false);
+
+  getBackupById(id: string) {
+    return this.backups().find((x) => x.Backup?.ID === id) ?? null;
+  }
+
+  getBackups(refresh = false) {
+    if (this.#timestamp && Date.now() - this.#timestamp < 100) {
+      return;
+    }
+
+    this.#timestamp = Date.now();
+
+    this.backupsLoading.set(true);
+
+    this.#dupServer
+      .getApiV1Backups()
+      .pipe(
+        take(1),
+        finalize(() => this.backupsLoading.set(false))
+      )
+      .subscribe({
+        next: (res) => {
+          this.backups.set(res);
+        },
+        error: (err) => {
+          console.error(err);
+        },
+      });
+  }
+
+  startBackup(id: string) {
+    this.#dupServer
+      .postApiV1BackupByIdStart({
+        id,
+      })
+      .subscribe({
+        next: () => {
+          this.getBackups();
+        },
+      });
+  }
+
+  deleteBackup(id: string) {
+    this.#dupServer
+      .deleteApiV1BackupById({
+        id,
+      })
+      .subscribe({
+        next: () => {
+          this.getBackups();
+        },
+      });
+  }
+}

package/src/app/core/states/relayconfig.state.ts

@@ -0,0 +1,23 @@
+import { Injectable, signal } from '@angular/core';
+
+export type Relayconfig = {
+  accessToken: string;
+  clientId: string;
+};
+
+@Injectable({
+  providedIn: 'root',
+})
+export class RelayconfigState {
+  #config = signal<Relayconfig | null>(null);
+
+  config = this.#config.asReadonly();
+
+  setConfig(config: Relayconfig) {
+    this.#config.set(config);
+  }
+
+  clearConfig() {
+    this.#config.set(null);
+  }
+}