feat(module-http): add functionality for blob query

.changeset/lazy-flowers-pull.md

@@ -0,0 +1,15 @@
+---
+'@equinor/fusion-framework-module-http': minor
+---
+
+add method for executing blob requests
+
+- added selector for extracting blob from response
+- added function for fetching blob as stream or promise on the http client
+
+
+```tsx
+const data = await client.blob('/person/photo');
+const url = URL.createObjectURL(blob);
+return <img src={url} />
+```

packages/modules/http/src/lib/client/client.ts

@@ -3,7 +3,7 @@ import { switchMap, takeUntil, tap } from 'rxjs/operators';
 import { fromFetch } from 'rxjs/fetch';
 
 import { HttpRequestHandler, HttpResponseHandler } from '../operators';
-import { jsonSelector } from '../selectors';
+import { blobSelector, jsonSelector } from '../selectors';
 
 import type { Observable, ObservableInput } from 'rxjs';
 import type { IHttpRequestHandler, IHttpResponseHandler } from '../operators';
@@ -26,8 +26,10 @@ export type HttpClientCreateOptions<
 };
 
 /** Base http client for executing requests */
-export class HttpClient<TRequest extends FetchRequest = FetchRequest, TResponse = FetchResponse>
-    implements IHttpClient<TRequest, TResponse>
+export class HttpClient<
+    TRequest extends FetchRequest = FetchRequest,
+    TResponse extends FetchResponse = FetchResponse,
+> implements IHttpClient<TRequest, TResponse>
 {
     readonly requestHandler: IHttpRequestHandler<TRequest>;
 
@@ -109,6 +111,21 @@ export class HttpClient<TRequest extends FetchRequest = FetchRequest, TResponse
         return firstValueFrom(this.json$<T>(path, args));
     }
 
+    public blob$(
+        path: string,
+        args?: FetchRequestInit<Blob, TRequest, TResponse>,
+    ): StreamResponse<Blob> {
+        const selector = args?.selector ?? blobSelector;
+        return this.fetch$(path, {
+            ...args,
+            selector,
+        } as FetchRequestInit<Blob, TRequest, TResponse>);
+    }
+
+    public blob(path: string, args?: FetchRequestInit<Blob, TRequest, TResponse>): Promise<Blob> {
+        return firstValueFrom(this.blob$(path, args));
+    }
+
     /** @deprecated */
     public jsonAsync<T = unknown>(
         path: string,

packages/modules/http/src/lib/client/types.ts

@@ -145,11 +145,22 @@ export interface IHttpClient<TRequest extends FetchRequest = FetchRequest, TResp
         init?: FetchRequestInit<T, JsonRequest<TRequest>, TResponse>,
     ): Promise<T>;
 
+    /** @deprecated */
     jsonAsync<T = unknown>(
         path: string,
         args?: FetchRequestInit<T, JsonRequest<TRequest>, TResponse>,
     ): Promise<T>;
 
+    blob(
+        path: string,
+        args?: FetchRequestInit<Blob, JsonRequest<TRequest>, TResponse>,
+    ): Promise<Blob>;
+
+    blob$(
+        path: string,
+        args?: FetchRequestInit<Blob, JsonRequest<TRequest>, TResponse>,
+    ): StreamResponse<Blob>;
+
     /**
      * Abort all ongoing request for current client
      */

packages/modules/http/src/lib/selectors/blob-selector.ts

@@ -0,0 +1,19 @@
+export const blobSelector = <TResponse extends Response = Response>(
+    response: TResponse,
+): Promise<Blob> => {
+    if (!response.ok) {
+        throw new Error('network response was not OK');
+    }
+    //Status code 204 is no content
+    if (response.status === 204) {
+        throw new Error('no content');
+    }
+
+    try {
+        return response.blob();
+    } catch (err) {
+        throw Error('failed to parse response');
+    }
+};
+
+export default blobSelector;

packages/modules/http/src/lib/selectors/index.ts

@@ -1 +1,2 @@
 export { jsonSelector } from './json-selector';
+export { blobSelector } from './blob-selector';