@angular/material/slide-toggle#MatSlideToggleChange TypeScript Examples

public onToggleAppBadge = async (evt: MatSlideToggleChange): Promise<void> => {
    await this.wowupService.setEnableAppBadge(evt.checked);
    this.enableAppBadge$.next(evt.checked);

    let count = 0;
    if (evt.checked) {
      const addons = await this._addonService.getAllAddonsAvailableForUpdate();
      count = addons.length;
    }

    await this.wowupService.updateAppBadgeCount(count);
  };

public onUseHardwareAccelerationChange = (evt: MatSlideToggleChange): void => {
    const title: string = this._translateService.instant(
      "PAGES.OPTIONS.APPLICATION.USE_HARDWARE_ACCELERATION_CONFIRMATION_LABEL"
    );
    const message: string = this._translateService.instant(
      evt.checked
        ? "PAGES.OPTIONS.APPLICATION.USE_HARDWARE_ACCELERATION_ENABLE_CONFIRMATION_DESCRIPTION"
        : "PAGES.OPTIONS.APPLICATION.USE_HARDWARE_ACCELERATION_DISABLE_CONFIRMATION_DESCRIPTION"
    );

    const dialogRef = this._dialogFactory.getConfirmDialog(title, message);

    dialogRef
      .afterClosed()
      .pipe(
        switchMap((result) => {
          if (!result) {
            evt.source.checked = !evt.source.checked;
            return of(undefined);
          }

          return from(this.wowupService.setUseHardwareAcceleration(evt.checked)).pipe(
            switchMap(() => from(this.electronService.restartApplication()))
          );
        }),
        catchError((error) => {
          console.error(error);
          return of(undefined);
        })
      )
      .subscribe();
  };

public onSymlinkModeChange = async (evt: MatSlideToggleChange): Promise<void> => {
    if (evt.checked === false) {
      await this.wowupService.setUseSymlinkMode(false);
      return;
    }

    const dialogRef = this._dialog.open(ConfirmDialogComponent, {
      data: {
        title: this._translateService.instant("PAGES.OPTIONS.APPLICATION.USE_SYMLINK_SUPPORT_CONFIRMATION_LABEL"),
        message: this._translateService.instant(
          "PAGES.OPTIONS.APPLICATION.USE_SYMLINK_SUPPORT_CONFIRMATION_DESCRIPTION"
        ),
      },
    });

    dialogRef
      .afterClosed()
      .pipe(
        switchMap((result) => {
          if (!result) {
            evt.source.checked = !evt.source.checked;
            return of(undefined);
          }

          return from(this.wowupService.setUseSymlinkMode(evt.checked)).pipe(
            map(() => this.useSymlinkMode$.next(evt.checked))
          );
        }),
        catchError((error) => {
          console.error(error);
          return of(undefined);
        })
      )
      .subscribe();
  };

public onToggleAccountPush = async (evt: MatSlideToggleChange): Promise<void> => {
    try {
      await this.sessionService.toggleAccountPush(evt.checked);
    } catch (e) {
      evt.source.checked = !evt.source.checked;
      console.error("Failed to toggle account push", e);
      this._snackbarService.showErrorSnackbar("COMMON.ERRORS.ACCOUNT_PUSH_TOGGLE_FAILED_ERROR");
    }
  };

updateTfa(change: MatSlideToggleChange) {
    const isEnabled = change.checked;
    this.isLoading = true;
    this.authService
      .getCurrentUser$()
      .pipe(
        switchMap((user) => this.accountService.toggleTfa(user.id, isEnabled)),
        tap(() => (this.isLoading = false)),
        catchError((errorResponse) => {
          this.isLoading = false;
          this.tfaEnabled = !isEnabled; // rollback the change on UI
          this.showResultSnackbar(errorResponse.error?.msg ?? "Unknown error");
          return throwError(errorResponse);
        })
      )
      .subscribe(() =>
        this.showResultSnackbar(
          `Two-factor authentication ${isEnabled ? "enabled" : "disabled"}`
        )
      );
  }

public onEnableSystemNotifications = (evt: MatSlideToggleChange): void => {
    this.wowupService
      .setEnableSystemNotifications(evt.checked)
      .then(() => {
        this.enableSystemNotifications$.next(evt.checked);
      })
      .catch(console.error);
  };

public onTelemetryChange = async (evt: MatSlideToggleChange): Promise<void> => {
    await this._analyticsService.setTelemetryEnabled(evt.checked);
  };

public onCollapseChange = async (evt: MatSlideToggleChange): Promise<void> => {
    await this.wowupService.setCollapseToTray(evt.checked);
    this.collapseToTray$.next(evt.checked);
  };

public onStartWithSystemChange = async (evt: MatSlideToggleChange): Promise<void> => {
    await this.wowupService.setStartWithSystem(evt.checked);
    this.startWithSystem$.next(evt.checked);
  };

public onStartMinimizedChange = async (evt: MatSlideToggleChange): Promise<void> => {
    await this.wowupService.setStartMinimized(evt.checked);
    this.startMinimized$.next(evt.checked);
  };

public onKeepAddonDetailTabChange = async (evt: MatSlideToggleChange): Promise<void> => {
    await this.wowupService.setKeepLastAddonDetailTab(evt.checked);
    this.keepAddonDetailTab$.next(evt.checked);
  };

public onProtocolHandlerChange = (evt: MatSlideToggleChange, protocol: string): void => {
    // If this is already enabled and the user wants to disable it, don't prompt
    if (evt.checked === false) {
      from(this.setProtocolHandler(protocol, evt.checked))
        .pipe(
          catchError((e) => {
            console.error(e);
            return of(undefined);
          })
        )
        .subscribe();
      return;
    }

    // Prompt the user that this may affect their existing CurseForge app
    const title: string = this._translateService.instant(
      "PAGES.OPTIONS.APPLICATION.USE_CURSE_PROTOCOL_CONFIRMATION_LABEL"
    );
    const message: string = this._translateService.instant(
      "PAGES.OPTIONS.APPLICATION.USE_CURSE_PROTOCOL_CONFIRMATION_DESCRIPTION"
    );

    const dialogRef = this._dialogFactory.getConfirmDialog(title, message);

    dialogRef
      .afterClosed()
      .pipe(
        switchMap((result) => {
          if (!result) {
            evt.source.checked = !evt.source.checked;
            return of(undefined);
          }

          return from(this.setProtocolHandler(protocol, evt.checked));
        }),
        catchError((error) => {
          console.error(error);
          return of(undefined);
        })
      )
      .subscribe();
  };

public onDefaultAutoUpdateChange(evt: MatSlideToggleChange): void {
    if (!this.installationModel) {
      return;
    }

    this.installationModel.defaultAutoUpdate = evt.checked;
  }