feat: Include pagination headers in search

Author: oliverroick

src/hooks/useStacSearch.test.ts

@@ -297,4 +297,41 @@ describe('useStacSearch', () => {
       ...response.links[0].body
     });
   });
+
+  it('sends pagination header', async () => {
+    const response = {
+      links: [{
+        rel: 'previous',
+        type: 'application/geo+json',
+        method: 'POST',
+        href: 'https://example.com/stac/search',
+        body: {
+          limit: 25,
+          token: 'prev:abc123'
+        },
+        headers: {
+          next: '123abc'
+        }
+      }]
+    };
+    fetch.mockResponseOnce(JSON.stringify(response));
+
+    const { result, waitForNextUpdate } = renderHook(
+      () => useStacSearch(stacApi)
+    );
+
+    act(() => result.current.setBbox([-0.59, 51.24, 0.30, 51.74]));
+    act(() => result.current.submit());
+    await waitForNextUpdate(); // wait to set results
+    expect(result.current.results).toEqual(response);
+    expect(result.current.previousPage).toBeDefined();
+
+    fetch.mockResponseOnce(JSON.stringify({ data: '12345' }));
+    act(() => result.current.previousPage && result.current.previousPage());
+    await waitForNextUpdate();
+
+    expect(result.current.results).toEqual({ data: '12345' });
+    const postHeader = fetch.mock.calls[1][1]?.headers;
+    expect(postHeader).toEqual({ 'Content-Type': 'application/json', next: '123abc' });
+  });
 });

src/hooks/useStacSearch.ts

@@ -67,14 +67,14 @@ function useStacSearch(stacApi: StacApi): StacSearchHook {
   );
 
   const executeSearch = useCallback(
-    (payload: SearchPayload) => {
+    (payload: SearchPayload, headers = {}) => {
       setResults(undefined);
       setState('LOADING');
       setError(undefined);
       setNextPageConfig(undefined);
       setPreviousPageConfig(undefined);
 
-      stacApi.search(payload)
+      stacApi.search(payload, headers)
         .then(response => response.json())
         .then(data => {
           setResults(data);
@@ -96,7 +96,7 @@ function useStacSearch(stacApi: StacApi): StacSearchHook {
             ...getSearchPayload()
           };
         }
-        executeSearch(payload);
+        executeSearch(payload, link.headers);
       }
     },
     [executeSearch, getSearchPayload]

src/stac-api/index.ts

@@ -1,6 +1,11 @@
-import type { Bbox, SearchPayload, DateRange, ApiError } from '../types';
+import type { Bbox, SearchPayload, DateRange, ApiError, GenericObject } from '../types';
 
 type RequestPayload = SearchPayload;
+type FetchOptions = {
+  method: string,
+  payload: RequestPayload,
+  headers: GenericObject
+}
 
 class StacApi {
   baseUrl: string;
@@ -62,13 +67,15 @@ class StacApi {
     return Promise.reject(e);
   }
 
-  fetch(url: string, method: string, payload: RequestPayload): Promise<Response> {
+  fetch(url: string, options: FetchOptions): Promise<Response> {
+    const { method, payload, headers } = options;
     const { bbox, dateRange, ...restPayload } = payload;
 
     return fetch(url, {
       method,
       headers: {
-        'Content-Type': 'application/json'
+        'Content-Type': 'application/json',
+        ...headers
       },
       body: JSON.stringify({
         ...restPayload,
@@ -85,8 +92,8 @@ class StacApi {
     });
   }
 
-  search(payload: SearchPayload): Promise<Response> {
-    return this.fetch(`${this.baseUrl}/search`, 'POST', payload);
+  search(payload: SearchPayload, headers = {}): Promise<Response> {
+    return this.fetch(`${this.baseUrl}/search`, { method: 'POST', payload, headers });
   }
 }
 

src/types.ts

@@ -1,6 +1,6 @@
 import type { Geometry } from 'geojson';
 
-type GenericObject = {
+export type GenericObject = {
   [key: string]: any  // eslint-disable-line @typescript-eslint/no-explicit-any
 }