Fix: use explicit types instead of interface inheritance for hooks

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@developmentseed/stac-react",
-  "version": "1.0.0-alpha.1",
+  "version": "1.0.0-alpha.2",
   "description": "React components and hooks for building STAC-API front-ends",
   "repository": "[email protected]:developmentseed/stac-react.git",
   "authors": [

src/hooks/useCollection.ts

@@ -1,15 +1,17 @@
-import { useQuery } from '@tanstack/react-query';
-import type { StacHook, StacRefetchFn } from '../types';
+import { useQuery, type QueryObserverResult } from '@tanstack/react-query';
 import type { Collection } from '../types/stac';
 import { handleStacResponse } from '../utils/handleStacResponse';
 import { generateCollectionQueryKey } from '../utils/queryKeys';
 import { useStacApiContext } from '../context/useStacApiContext';
 import { ApiError } from '../utils/ApiError';
 
-interface StacCollectionHook extends StacHook {
+type StacCollectionHook = {
   collection?: Collection;
-  refetch: StacRefetchFn<Collection>;
-}
+  isLoading: boolean;
+  isFetching: boolean;
+  refetch: () => Promise<QueryObserverResult<Collection, ApiError>>;
+  error: ApiError | null;
+};
 
 function useCollection(collectionId: string): StacCollectionHook {
   const { stacApi } = useStacApiContext();

src/hooks/useCollections.ts

@@ -1,15 +1,17 @@
-import { useQuery } from '@tanstack/react-query';
-import type { StacHook, StacRefetchFn } from '../types';
+import { useQuery, type QueryObserverResult } from '@tanstack/react-query';
 import type { CollectionsResponse } from '../types/stac';
 import { handleStacResponse } from '../utils/handleStacResponse';
 import { generateCollectionsQueryKey } from '../utils/queryKeys';
 import { useStacApiContext } from '../context/useStacApiContext';
 import { ApiError } from '../utils/ApiError';
 
-interface StacCollectionsHook extends StacHook {
+type StacCollectionsHook = {
   collections?: CollectionsResponse;
-  refetch: StacRefetchFn<CollectionsResponse>;
-}
+  refetch: () => Promise<QueryObserverResult<CollectionsResponse, ApiError>>;
+  isLoading: boolean;
+  isFetching: boolean;
+  error: ApiError | null;
+};
 
 function useCollections(): StacCollectionsHook {
   const { stacApi } = useStacApiContext();

src/hooks/useItem.ts

@@ -1,17 +1,19 @@
-import { useQuery } from '@tanstack/react-query';
-import type { StacHook, StacRefetchFn } from '../types';
+import { useQuery, type QueryObserverResult } from '@tanstack/react-query';
 import type { Item } from '../types/stac';
 import { useStacApiContext } from '../context/useStacApiContext';
 import { handleStacResponse } from '../utils/handleStacResponse';
 import { generateItemQueryKey } from '../utils/queryKeys';
 import { ApiError } from '../utils/ApiError';
 
-interface StacItemHook extends StacHook {
+type ItemHook = {
   item?: Item;
-  refetch: StacRefetchFn<Item>;
-}
+  isLoading: boolean;
+  isFetching: boolean;
+  error: ApiError | null;
+  refetch: () => Promise<QueryObserverResult<Item, ApiError>>;
+};
 
-function useItem(url: string): StacItemHook {
+function useItem(url: string): ItemHook {
   const { stacApi } = useStacApiContext();
 
   const fetchItem = async (): Promise<Item> => {

src/hooks/useStacSearch.ts

@@ -2,7 +2,6 @@ import { useCallback, useState, useMemo, useEffect } from 'react';
 import { useQuery, useQueryClient } from '@tanstack/react-query';
 import debounce from '../utils/debounce';
 import { generateStacSearchQueryKey } from '../utils/queryKeys';
-import type { StacHook } from '../types';
 import { handleStacResponse } from '../utils/handleStacResponse';
 import type {
   Link,
@@ -17,7 +16,7 @@ import { ApiError } from '../utils/ApiError';
 
 type PaginationHandler = () => void;
 
-interface StacSearchHook extends StacHook {
+type StacSearchHook = {
   ids?: string[];
   setIds: (ids?: string[]) => void;
   bbox?: Bbox;
@@ -34,9 +33,12 @@ interface StacSearchHook extends StacHook {
   setLimit: (limit: number) => void;
   submit: () => void;
   results?: SearchResponse;
+  isLoading: boolean;
+  isFetching: boolean;
+  error: ApiError | null;
   nextPage: PaginationHandler | undefined;
   previousPage: PaginationHandler | undefined;
-}
+};
 
 function useStacSearch(): StacSearchHook {
   const { stacApi } = useStacApiContext();
@@ -212,7 +214,7 @@ function useStacSearch(): StacSearchHook {
     results,
     isLoading,
     isFetching,
-    error,
+    error: error ?? null,
     sortby,
     setSortby,
     limit,

src/types/index.d.ts

@@ -1,26 +1,3 @@
-import type { QueryObserverResult } from '@tanstack/react-query';
-import { ApiError } from '../utils/ApiError';
-
 export type GenericObject = {
   [key: string]: any; // eslint-disable-line @typescript-eslint/no-explicit-any
 };
-
-/**
- * Base interface for all STAC hooks providing common loading state and error handling.
- * All data-fetching hooks (useCollection, useCollections, useItem, useStacSearch)
- * extend this interface with their specific data and refetch signatures.
- */
-export interface StacHook {
-  /** True during initial data fetch (no cached data available) */
-  isLoading: boolean;
-  /** True during any fetch operation (including background refetches) */
-  isFetching: boolean;
-  /** Error information if the last request was unsuccessful */
-  error: ApiError | null;
-}
-
-/**
- * Generic refetch function type for STAC hooks.
- * Returns a Promise with the query result including data and error information.
- */
-export type StacRefetchFn<T> = () => Promise<QueryObserverResult<T, ApiError>>;