Typescript decorator example for unsubscribe

typescript-decorator-example

import { Component, EventEmitter, Input, Output } from '@angular/core';
import { ProductDto } from '@ev-customer-portal/frontend/api-client';
import { interval, Subject, takeUntil } from 'rxjs';

@AddDestroy$()
@Component({...})
export class RequestAccessDialogComponent {
  public sub = interval(1000)
    .pipe(untilDestroy$(this))
    .subscribe((v) => {
      console.log(`interval is ticking`, v);
    });
}

export function AddDestroy$(): ClassDecorator {
  return (componentClass: any) => {
    const ngOnDestroy = componentClass.prototype.ngOnDestroy;
    componentClass.prototype.destroy$ = new Subject<void>();
    componentClass.prototype.ngOnDestroy = function (this: any) {
      ngOnDestroy && ngOnDestroy.call(this);
      componentClass.prototype.destroy$.next();
    };
  };
}

export function untilDestroy$(component: any) {
  return takeUntil(component.destroy$);
}