@one-paragon/angular-utilities 2.8.2 → 2.8.4

package/src/http-request-state/RequestStateStore.ts

@@ -0,0 +1,360 @@
+import { combineLatest, Observable, of, pipe, Subject, Subscription } from 'rxjs';
+import { RequestFactory as RequestFactory, RequestStrategy as RequestStrategy, RequestStatus, RequestState, RequestStateOptions, RequestStateCancelled } from './types';
+import { createFailure, createSuccess, inProgress, isErrorState, isSuccessOrErrorState, isSuccessState, notStarted } from './helpers';
+import { concatMap, filter, map, mergeMap, startWith, switchMap, takeUntil, tap } from 'rxjs/operators';
+import { HttpErrorResponse } from '@angular/common/http';
+import { mapError } from '../rxjs/mapError';
+import { defaultShareReplay } from '../rxjs/defaultShareReplay';
+import { assertInInjectionContext, computed, DestroyRef, effect, inject, InjectionToken, Injector, isSignal, signal, Signal, untracked } from '@angular/core';
+import { toObservable } from '@angular/core/rxjs-interop';
+import { notNull } from '../rxjs';
+
+export interface RequestResponse<TParam extends any[], T> {
+  requestParams: [...TParam];
+  response: RequestState<T>;
+}
+
+export class RequestStateStore<TParam extends any[], V, R = null, T = R extends null ? V : R> {
+  private _state = signal<RequestResponse<TParam, T>>({ requestParams: null as any, response: notStarted });
+  state = this._state.asReadonly();
+  private options?: RequestStateOptions;
+  private project?: (v: V) => R;
+  private req: RequestFactory<TParam, V>;
+  private injector = inject(Injector)
+  private destroy$ = new Subject<void>();
+  private defaultErrorHandling?: (e?: any) => void;
+  private _useDefaultErrorHandler?: boolean;
+  private defaultSuccessHandling?: (e?: T) => void;
+
+  constructor(req: RequestFactory<TParam, V>, options?: RequestStateOptions<TParam>, project?: (v: V) => R) {
+    this.assertInjectionContext();
+    this.injector.get(DestroyRef).onDestroy(() => this.destroy$.next());
+
+    this.project = project;
+    this.options = options;
+    this.req = req;
+
+    const config = inject(RequestStateStoreConfigToken, { optional: true });
+    if(config){
+      this.defaultErrorHandling = config.defaultErrorHandling;
+      this._useDefaultErrorHandler = config.useDefaultErrorHandler;
+      this.defaultSuccessHandling = config.defaultSuccessHandling;
+
+      if(this._useDefaultErrorHandler){
+        this.effectOnState('error', e => {
+          if(!this.errorHandled){
+            this.#onDefaultErrorHandling(e.error);
+          }
+        })
+      }
+    }
+
+    this.request = (this.options?.strategy === RequestStrategy.singleUse) ? this.singleUseRequest : this.flattenedRequest;
+    if(options?.autoRequest){
+      (this.request as any)();
+    }
+  }
+
+  reset() {
+    this._state.set({ requestParams: null as any, response: notStarted });
+  }
+
+  private flatteningStrategy = () => {
+    if(this.options?.strategy === RequestStrategy.concurrent)
+      return mergeMap( (params: [...TParam]) => this.createRequest(...params));
+
+    if(this.options?.strategy === RequestStrategy.sequential)
+      return concatMap( (params: [...TParam]) => this.createRequest(...params));
+
+    return switchMap( (params: [...TParam]) => ((params[0] as any) instanceof CancellationToken) ?
+      of({ requestParams: params[0], response: { status: RequestStatus.cancelled } as RequestStateCancelled } ) : this.createRequest(...params) );
+  }
+
+  private createRequestPipeline = () => {
+    const origin$ = new Subject<[...TParam]>();
+    const sub = origin$.pipe(
+      this.flatteningStrategy(),
+      tap<RequestResponse<TParam, T>>(state => this._state.set(state)),
+      pipe(takeUntil(this.destroy$))
+    ).subscribe();
+    return (params: [...TParam]) => {
+      origin$.next(params);
+      return sub;
+    }
+  }
+
+  private requestPipeLine = this.createRequestPipeline();
+
+  private flattenedRequest = (...value: [...TParam]) => {
+    return this.requestPipeLine(value);
+  }
+  private singleUseRequest = (...value: [...TParam]) => {
+    if(this.state().response.status !== RequestStatus.notStarted) {
+      throw new Error("state can not be reused. either reset the state by calling reset() or use a state requester that allows concurrent requests.");
+    }
+    return this.requestPipeLine(value);
+  }
+
+  $selectRequestState = computed(() => this.state().response);
+
+  $selectStatus = computed(() => this.$selectRequestState()?.status);
+  $isSuccess = computed(() => isSuccessState(this.$selectRequestState()));
+  $isError = computed(() => isErrorState(this.$selectRequestState()));
+  $isInProgress = computed(() => this.$selectStatus() === RequestStatus.inProgress);
+  $isNotStarted = computed(() => this.$selectStatus() === RequestStatus.notStarted);
+
+  $selectError = computed(() => {
+    const state = this.$selectRequestState();
+    if(isErrorState(state)) return state.error
+  });
+
+  $selectResponse = computed(() => {
+    const state = this.$selectRequestState();
+    if(isSuccessState(state)){
+      return state.body
+    }
+    return undefined;
+  });
+
+  errorHandled = false;
+  onError( cb: (error: HttpErrorResponse) => void) {
+    this.errorHandled = true;
+    this.effectOnState('error', cb);
+    return this;
+  }
+
+  onErrorResponse( cb: (error: HttpErrorResponse, ...requestParams: [...TParam]) => void) {
+    this.errorHandled = true;
+    this.effectOnState('error', (e, p) => cb(e, ...p));
+    return this;
+  }
+
+  onErrorRequest( cb: ( ...requestParams: [...TParam]) => void) {
+    this.errorHandled = true;
+    this.effectOnState('error', (_, p) => cb(...p));
+    return this;
+  }
+
+  onErrorWithRequest(
+    func: (state: { error: HttpErrorResponse; requestParams: [...TParam]; }) => void
+  ) {
+    this.errorHandled = true;
+    this.effectOnState('error', (error, requestParams) => func({ requestParams, error }));
+
+    return this;
+  }
+
+  #onDefaultErrorHandling = (e: any) => {
+    if(this.defaultErrorHandling) this.defaultErrorHandling(e)
+    else console.error(e)
+  }
+  /**
+   * if no handler was provided will call `console.error`
+   */
+  useDefaultErrorHandler(){
+    this.effectOnState('error', this.#onDefaultErrorHandling);
+    return this;
+  }
+
+
+  /**
+   * if no handler was provided will call `console.log` with 'Success'
+   */
+  useDefaultSuccessHandler(){
+    this.effectOnState('success', this.defaultSuccessHandling || (() => console.log('Success')));
+    return this;
+  }
+
+  onSuccess( cb: (response?: T) => void) {
+    this.effectOnState('success only', cb);
+    return this;
+  }
+
+  onSuccessResponse( cb: (response: T, ...requestParams: [...TParam]) => void) {
+    this.effectOnState('success', (response, requestParams) => cb(response, ...requestParams));
+    return this;
+  }
+
+  onSuccessWithRequest(
+    func: (state: { requestParams: [...TParam]; body: T; }) => void
+  ) {
+    this.effectOnState('success', (body, requestParams) => func({ requestParams, body }));
+    return this;
+  }
+
+  onSuccessRequest( cb: ( ...requestParams: [...TParam]) => void) {
+    this.effectOnState('success', (_, requestParams) => cb(...requestParams));
+    return this;
+  }
+
+  onSuccessOrError(cb: () => void){
+    this.effectOnState('both', cb);
+    return this;
+  }
+
+  private createRequest(...params: [...TParam]): Observable<RequestResponse<TParam, T>> {
+    return this.req(...params).pipe(
+      map(re => createSuccess((this.project ? this.project(re) : re) as T)),
+      mapError(createFailure),
+      startWith(inProgress),
+      map( state => ({ requestParams: params, response: state })),
+      defaultShareReplay()
+    );
+  }
+
+  private effectOnState(onState: 'success only', func: (obj: T) => void): void;
+  private effectOnState(onState: 'success', func: (obj: T, params: [...TParam]) => void): void;
+  private effectOnState(onState: 'error', func: (obj: any, params: [...TParam]) => void): void;
+  private effectOnState(onState: 'both', func: () => void): void;
+  private effectOnState(
+    onState: 'error' | 'success' | 'both' | 'success only',
+    func: any): void {
+    effect(() => {
+      const { requestParams, response } = this.state();
+      switch (onState) {
+        case 'error':
+          if(isErrorState(response)) untracked(() => (func as (obj: any, params?: [...TParam]) => void)(response.error, requestParams));
+          break;
+        case 'success':
+          if(isSuccessState(response)) untracked(() => (func as (obj: T, params?: [...TParam]) => void)(response.body, requestParams));
+          break;
+        case 'success only':
+          if(isSuccessState(response)) untracked(() => (func as (obj: T) => void)(response.body));
+          break;
+        case 'both':
+          if(isSuccessOrErrorState(response)) untracked(() => (func as () => void)());
+          break;
+      }
+    }, { injector: this.injector })
+  }
+
+  /**
+   * @deprecated use the standalone subscriber helper function
+   */
+  on = <V>(srcObservable: Observable<V>, func: (obj: V) => void): Subscription => {
+    return srcObservable.pipe(tap(func), takeUntil(this.destroy$)).subscribe();
+  }
+  request: (...value: [...TParam] ) => Subscription;
+
+  /**
+   * @param params An observable or signal that returns an array to be spread into the request function.
+   * If undefined is returned, the request will not be made.
+   */
+  requestWith = (params: Observable<[...TParam]> | Signal<[...TParam]>) => {
+    if(isSignal(params)){
+      params = toObservable(params, { injector: this.injector }).pipe(notNull());
+    }
+    params.pipe(takeUntil(this.destroy$)).subscribe((p) => this.request(...p));
+    return this;
+  }
+
+  /**
+   * @param params The parameters to be passed to the request function.
+   * The parameters can be either actual values or wrapped in a signal.
+   * If any of the parameters are a signal, it will be unwrapped and passed to the request.
+   * It will be tracked and the request will be made whenever its value changes.
+   * If any of the signals return undefined, the request will not be made.
+   */
+  requestOn = (...params: SignalOrValArr<TParam>) => {
+    const paramsArr = computed(() => {
+      const p = params.map(param =>
+        isSignal(param)
+          ? ({ param, isSignal: true })
+          : ({ param, isSignal: false })
+      );
+      const allVals = p.every(({ param, isSignal }) => !isSignal || param() != undefined);
+      if(allVals) return p.map(({ param, isSignal }) => isSignal ? param() : param);
+      return undefined;
+    });
+    effect(() => {
+      const vals = paramsArr();
+      untracked(() => {
+        if(vals) this.request(...vals as [...TParam]);
+      });
+    }, { injector: this.injector });
+    return this;
+  };
+
+  private assertInjectionContext(){
+    try {
+      assertInInjectionContext(RequestStateStore);
+    } catch (error) {
+      throw new Error('RequestStateStore must be created in an Injection Context');
+    }
+  }
+
+  destroy() {
+    this.destroy$.next();
+  }
+
+  state$ = toObservable(this.state);
+  selectRequestState$ = this.state$.pipe(map(s => s.response));
+  selectResponse$: Observable<T> = this.selectRequestState$.pipe(
+    filter(isSuccessState),
+    map( state => state.body)
+  );
+
+  /**
+   * @deprecated use selectRequestState$ instead
+   */
+  selectHttpState$ = this.selectRequestState$;
+  selectStatus$ = this.selectRequestState$.pipe(map(s => s.status));
+  selectError$ = this.selectRequestState$.pipe(
+    filter(isErrorState),
+    map(state => state.error)
+  );
+
+  refresh(){
+    if(this.$isNotStarted()) {
+      throw new Error("Cannot refresh a request that has not been started. Call request() first.");
+    }
+    if(this.$isError()){
+      throw new Error("Cannot refresh a request that is in error state. Call reset() and request() first.");
+    }
+    const params = this.state().requestParams;
+    this.request(...params);
+  }
+}
+export class CancellationToken {}
+
+export function wrapInArr<T extends [Signal<any>, ...Signal<any>[]]>(...sigs: T) : Signal<{ [K in keyof T]: T[K] extends Signal<infer U> ? U : never }>;
+export function wrapInArr<T extends [Observable<any>, ...Observable<any>[]]>(...obs: T): Observable<{ [K in keyof T]: T[K] extends Observable<infer U> ? U : never }>;
+/**
+ * @param sigOrObs An array of signals or observables to be wrapped in an array to be spread into the request function.
+ * If any values from the array of signals or observables are null or undefined, all values will be filtered
+ */
+export function wrapInArr<T extends Signal<any>[] | Observable<any>[]>(...sigOrObs: T){
+  if(isSignal(sigOrObs[0])){
+    return computed(() => {
+      const arr = (sigOrObs as Signal<T>[]).map(s => s()) as { [K in keyof T]: T[K] extends Signal<infer U> ? U : never };
+      if(arr.some(s => s == undefined)) return undefined;
+      return arr;
+    });
+  }
+  else {
+    return combineLatest(sigOrObs as Observable<any>[]).pipe(filter(vals => vals.every(val => val != undefined))) as Observable<{ [K in keyof T]: T[K] extends Observable<infer U> ? U : never }>;
+
+  }
+}
+
+export interface RequestStateStoreConfig {
+  /**
+   * if `useDefaultErrorHandler` is `true` this will run on each error if no other handler provided.
+   * else can be used by call `.useDefaultHandler`
+   */
+  defaultErrorHandling?: (e?: any) => void;
+  /**
+   * if `useDefaultErrorHandler` is `true` `defaultErrorHandling` will run on each error if no other handler provided.
+   */
+  useDefaultErrorHandler?: boolean;
+
+  /**
+   * will be called if `useDefaultSuccess` is used
+   */
+  defaultSuccessHandling?: <T>(e?: T) => void;
+}
+
+export const RequestStateStoreConfigToken = new InjectionToken<RequestStateStoreConfig>('RequestStateConfig');
+
+type SignalOrVal<T> = Signal<T> | T;
+type SignalOrValArr<T extends readonly any[]> = { [K in keyof T]: SignalOrVal<T[K]> };

package/src/http-request-state/deprecated.ts

@@ -0,0 +1,20 @@
+/**
+ * @deprecated use RequestStateFactory
+ */
+export { RequestStateFactory as HttpRequestStateFactory } from './RequestStateFactory';
+/**
+ * @deprecated use RequestStatus
+ */
+export { RequestStatus as HttpRequestStatus } from './types';
+/**
+ * @deprecated use RequestState
+ */
+export type { RequestState as HttpRequestState } from './types'
+/**
+ * @deprecated use RequestStateStore
+ */
+export { RequestStateStore as HttpRequestStateStore } from './RequestStateStore';
+/**
+ * @deprecated use RequestStrategy
+ */
+export { RequestStrategy as HttpRequestStrategy } from './types';

package/src/http-request-state/directives/HttpStateDirectiveBase.ts

@@ -0,0 +1,29 @@
+import { Directive, inject, Injector, TemplateRef, ViewContainerRef, OnInit } from '@angular/core';
+import { RequestState } from '../types';
+import { HttpRequestStateDirective } from './request-state-directive';
+
+@Directive()
+export abstract class HttpStateDirectiveBase<V, R = null> implements OnInit {
+  hasView = false;
+  private injector = inject(Injector);
+  protected templateRef = inject(TemplateRef<{ $implicit: R extends null ? V : R }>);
+  protected viewContainer = inject(ViewContainerRef);
+  ngOnInit() {
+    const parent = this.injector.get(HttpRequestStateDirective);
+    if(parent == null) {
+      throw new Error('You can only use an http state directive as a child of the httpRequestState directive.');
+    }
+    parent.hooks.push(this.baseRender);
+    this.baseRender(parent.ViewContext.state as RequestState);
+  }
+
+  private baseRender = (state: RequestState): void => {
+    if(this.hasView) {
+      this.viewContainer.clear();
+      this.hasView = false;
+    }
+    this.hasView = this.render(state);
+  }
+
+  abstract render: (state: RequestState) => boolean;
+}

package/src/http-request-state/directives/http-error-state-directive.ts

@@ -0,0 +1,21 @@
+import { Directive, OnInit } from '@angular/core';
+import { isErrorState } from '../helpers';
+import { RequestState } from '../types';
+import { HttpStateDirectiveBase } from './HttpStateDirectiveBase';
+
+@Directive({ selector: '[httpErrorState]', })
+export class HttpErrorStateDirective<V, R = null> extends HttpStateDirectiveBase<V, R> implements OnInit {
+
+
+  render = (state: RequestState<any>) => {
+    if(isErrorState(state)) {
+      this.viewContainer.createEmbeddedView(this.templateRef, { $implicit: state.error });
+      return true;
+    }
+    return false;
+  };
+
+  ngOnInit() {
+    super.ngOnInit();
+  }
+}

package/src/http-request-state/directives/http-inProgress-state-directive.ts

@@ -0,0 +1,19 @@
+import { Directive, OnInit } from '@angular/core';
+import { HttpStateDirectiveBase } from './HttpStateDirectiveBase';
+import { RequestState, RequestStatus } from '../types'
+
+
+@Directive({ selector: '[httpInProgressState]', })
+export class HttpInProgressStateDirective<V, R = null> extends HttpStateDirectiveBase<V, R> implements OnInit {
+  render = (state: RequestState<any>) => {
+    if(state.status === RequestStatus.inProgress){
+      this.viewContainer.createEmbeddedView(this.templateRef );
+      return true;
+    }
+    return false;
+  };
+
+  ngOnInit() {
+    super.ngOnInit();
+  }
+}

package/src/http-request-state/directives/http-notStarted-state-directive.ts

@@ -0,0 +1,19 @@
+import { Directive, OnInit } from '@angular/core';
+import { RequestState, RequestStatus } from '../types';
+import { HttpStateDirectiveBase } from './HttpStateDirectiveBase';
+
+
+@Directive({ selector: '[httpNotStartedState]', })
+export class HttpNotStartedStateDirective<V, R = null> extends HttpStateDirectiveBase<V, R> implements OnInit {
+  render = (state: RequestState<any>) => {
+    if(state.status === RequestStatus.notStarted){
+      this.viewContainer.createEmbeddedView(this.templateRef );
+      return true;
+    }
+    return false;
+  };
+
+  ngOnInit() {
+    super.ngOnInit();
+  }
+}

package/src/http-request-state/directives/http-success-state-directive.ts

@@ -0,0 +1,29 @@
+import { Directive, Input, OnInit } from '@angular/core';
+import { isSuccessState } from '../helpers';
+import { HttpStateDirectiveBase } from './HttpStateDirectiveBase';
+import { RequestState } from '../types';
+import { RequestStateStore } from '../RequestStateStore';
+import { Observable } from 'rxjs';
+
+export interface HttpSuccessStateViewContext<T> {
+  $implicit: T;
+}
+@Directive({ selector: '[httpSuccessState]', })
+export class HttpSuccessStateDirective<V, R = null> extends HttpStateDirectiveBase<V, R> implements OnInit {
+  @Input() httpSuccessStateTypeSafety?: RequestStateStore<any, V, R> | Observable<RequestState<V>>;
+  render = (state: RequestState<R extends null ? V : R>) => {
+    if(isSuccessState(state)) {
+      this.viewContainer.createEmbeddedView(this.templateRef, { $implicit: state.body });
+      return true;
+    }
+    return false;
+  };
+
+  ngOnInit() {
+    super.ngOnInit();
+  }
+
+  static ngTemplateContextGuard<V, R>(dir: HttpSuccessStateDirective<V, R>, ctx: any): ctx is HttpSuccessStateViewContext<R extends null ? V : R> {
+    return true;
+  }
+}

package/src/http-request-state/directives/index.ts

@@ -0,0 +1,5 @@
+export * from './http-error-state-directive';
+export * from './http-inProgress-state-directive';
+export * from './http-notStarted-state-directive';
+export * from './http-success-state-directive';
+export * from './request-state-directive';

package/src/http-request-state/directives/request-state-directive.spec.ts

@@ -0,0 +1,73 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { Component, inject } from '@angular/core';
+import { HttpRequestModule } from '../http-state-module';
+import { RequestStateStore } from '../RequestStateStore';
+import { Subject } from 'rxjs';
+import { RequestStateOptions } from '../types';
+
+
+@Component({
+  template: `
+    <div *httpRequestState='requestState;let state;'>
+        <ng-container *httpNotStartedState>not started</ng-container>
+        <ng-container *httpInProgressState>in progress</ng-container>
+        <ng-container *httpSuccessState='let body' >success {{body}}</ng-container>
+        <ng-container *httpErrorState='let error' >error {{error}}</ng-container>
+    </div>
+    `,
+}) export class TestHttpRequestStateDirectiveComponent {
+  requestState = inject<RequestStateStore<any, any>>(RequestStateStore);
+
+}
+
+export class MockHttpRequestState<T> extends RequestStateStore<[], T> {
+  subject = new Subject<T>();
+  constructor(options?: RequestStateOptions) {
+    super(() => {
+      return this.subject;
+    }, options );
+  }
+}
+
+let requestState: MockHttpRequestState<string>;
+let fixture: ComponentFixture<TestHttpRequestStateDirectiveComponent>;
+
+describe('Request State Directive', () => {
+
+  beforeEach(() => {
+    requestState = new MockHttpRequestState<string>();
+    fixture = TestBed.configureTestingModule({
+      declarations: [TestHttpRequestStateDirectiveComponent],
+      providers: [{ provide: RequestStateStore, useValue: requestState }],
+      imports: [HttpRequestModule]
+    }).createComponent(TestHttpRequestStateDirectiveComponent);
+  });
+
+  it('should begin with the state of not started', () => {
+    verifyText('not started');
+  });
+
+  it('should be in progress while in progress', () => {
+    requestState.request();
+    verifyText('in progress');
+  });
+
+  it('should be success when success', () => {
+    requestState.request();
+    requestState.subject.next('yay')
+    verifyText('success yay');
+  });
+
+  it('should be error when error', () => {
+    requestState.request();
+    requestState.subject.error('ouch');
+    verifyText('error ouch');
+  });
+
+  function verifyText(text:string) {
+    fixture.detectChanges();
+    const node: HTMLElement = fixture.nativeElement;
+    expect(node.innerText).toBe(text);
+  }
+
+});

package/src/http-request-state/directives/request-state-directive.ts

@@ -0,0 +1,78 @@
+import { Directive, Input, TemplateRef, ViewContainerRef, OnDestroy } from '@angular/core';
+import { defaultShareReplay } from '../../rxjs/defaultShareReplay';
+import { isObservable, Observable, Subject, Unsubscribable } from 'rxjs';
+import { map, switchAll } from 'rxjs/operators';
+import { RequestStateStore } from '../RequestStateStore';
+import { RequestState, RequestStatus } from '../types';
+
+export interface HttpRequestStateViewContext<T> {
+  $implicit?: HttpRequestStateAny<T>;
+  state?: HttpRequestStateAny<T>;
+  status: {
+    inProgress: boolean;
+    notStarted: boolean;
+    success: boolean;
+    error: boolean;
+  };
+}
+
+@Directive({ selector: '[httpRequestState]', })
+export class HttpRequestStateDirective<TParam extends any[], V, R, T = R extends null ? V : R> implements OnDestroy {
+  private viewContainer: ViewContainerRef;
+
+  readonly ViewContext: HttpRequestStateViewContext<T> = {
+    $implicit: undefined,
+    state: undefined,
+    status: {
+      inProgress: false,
+      notStarted: true,
+      success: false,
+      error: false,
+    }
+  };
+
+
+  subject = new Subject<Observable<RequestState<T>>>();
+  state = this.subject.pipe(switchAll(), defaultShareReplay());
+  subscription: Unsubscribable;
+  hooks: ((state: RequestState<T>) => void)[] = [];
+
+  @Input('httpRequestState') set stateStore(store: RequestStateStore<TParam, V, R, T> | Observable<RequestState<T>>) {
+    if(isObservable(store)) {
+      this.subject.next(store);
+    } else {
+      this.subject.next(store.state$.pipe(map(state => state.response)));
+    }
+
+  }
+  constructor(templateRef: TemplateRef<any>, viewContainer: ViewContainerRef) {
+    this.viewContainer = viewContainer;
+    this.viewContainer.createEmbeddedView(templateRef, this.ViewContext);
+    this.subscription = this.state.subscribe(state => {
+      this.ViewContext.$implicit = state;
+      this.ViewContext.state = state;
+      this.ViewContext.status.inProgress = state.status === RequestStatus.inProgress;
+      this.ViewContext.status.notStarted = state.status === RequestStatus.notStarted;
+      this.ViewContext.status.success = state.status === RequestStatus.success;
+      this.ViewContext.status.error = state.status === RequestStatus.fail;
+      this.hooks.forEach(hook => hook(state));
+    });
+  }
+
+
+  ngOnDestroy() {
+    this.viewContainer.clear();
+    this.subscription.unsubscribe();
+  }
+
+  static ngTemplateContextGuard<V, R>(dir: HttpRequestStateDirective<any, V, R>, ctx: any): ctx is HttpRequestStateViewContext<R extends null ? V : R> {
+    return true;
+  }
+
+}
+
+export type HttpRequestStateAny<T> = {
+  status: RequestStatus;
+  body?: T;
+  error?: any;
+}