@comapeo/core-react 11.0.2 → 11.0.3

package/dist/commonjs/hooks/maps.d.ts

@@ -2,26 +2,12 @@ import type { AbortMapShareOptions, CancelMapShareOptions, CreateAndSendMapShare
 /**
  * Get a URL that points to a StyleJSON resource served by the embedded HTTP server.
  *
- * If `opts.refreshToken` is specified, it will be appended to the returned URL as a search param. This is useful for forcing cache busting
- * due to hidden internal details by consuming components (e.g. map component from MapLibre).
- *
- * @param opts.refreshToken String to append to the returned value as a search param
- *
  * @example
  * ```tsx
  * function ExampleWithoutRefreshToken() {
  *   const { data, isRefetching } = useMapStyleUrl()
  *
- *   console.log(data) // logs something like 'http://localhost:...'
- * }
- * ```
- *
- * ```tsx
- * function ExampleWithRefreshToken() {
- *   const [refreshToken] = useState('foo')
- *   const { data } = useMapStyleUrl({ refreshToken })
- *
- *   console.log(data) // logs something like 'http://localhost:...?refresh_token=foo'
+ *   console.log(data) // logs something like 'http://127.0.0.1:...'
  * }
  * ```
  */
@@ -104,15 +90,61 @@ export declare function useRemoveCustomMapFile(): Pick<import("@tanstack/react-q
 }> & {
     mutateAsync: import("@tanstack/react-query").UseMutateAsyncFunction<Response, Error, void, unknown>;
 }, "error" | "status" | "mutate" | "reset" | "mutateAsync">;
-export declare function useGetCustomMapInfo(): {
-    data: {
-        name: string;
-        size: number;
-        created: number;
-    } | undefined;
-    error: Error | null;
-    isRefetching: boolean;
-};
+/**
+ * Get the map info for the custom map.
+ *
+ * Note that this is _not_ a suspenseful hook. The different read states should be explicitly handled at usage.
+ *
+ * @example
+ * ```tsx
+ * import { getErrorCode } from '@comapeo/core-react'
+ *
+ * function Example() {
+ *   const mapInfo = useGetCustomMapInfo()
+ *
+ *   if (mapInfo.status === 'pending') {
+ *     // handle pending...
+ *   }
+ *
+ *   if (mapInfo.status === 'error') {
+ *     if (getErrorCode(mapInfo.error) === 'MAP_NOT_FOUND') {
+ *       // handle not found error...
+ *     } else {
+ *       // handle all other errors...
+ *     }
+ *   }
+ *
+ *   // Handle success state...
+ *   console.log(mapInfo.data)
+ * }
+ * ```
+ *
+ */
+export declare function useGetCustomMapInfo(): Pick<import("@tanstack/react-query").QueryObserverRefetchErrorResult<{
+    name: string;
+    size: number;
+    created: number;
+}, Error>, "data" | "error" | "status" | "isRefetching"> | Pick<import("@tanstack/react-query").QueryObserverSuccessResult<{
+    name: string;
+    size: number;
+    created: number;
+}, Error>, "data" | "error" | "status" | "isRefetching"> | Pick<import("@tanstack/react-query").QueryObserverLoadingErrorResult<{
+    name: string;
+    size: number;
+    created: number;
+}, Error>, "data" | "error" | "status" | "isRefetching"> | Pick<import("@tanstack/react-query").QueryObserverLoadingResult<{
+    name: string;
+    size: number;
+    created: number;
+}, Error>, "data" | "error" | "status" | "isRefetching"> | Pick<import("@tanstack/react-query").QueryObserverPendingResult<{
+    name: string;
+    size: number;
+    created: number;
+}, Error>, "data" | "error" | "status" | "isRefetching"> | Pick<import("@tanstack/react-query").QueryObserverPlaceholderResult<{
+    name: string;
+    size: number;
+    created: number;
+}, Error>, "data" | "error" | "status" | "isRefetching">;
 /**
  * Get all map shares that the device has received. Automatically updates when
  * new shares arrive or share states change.

package/dist/commonjs/hooks/maps.js

@@ -22,26 +22,12 @@ const react_query_js_1 = require("../lib/react-query.js");
 /**
  * Get a URL that points to a StyleJSON resource served by the embedded HTTP server.
  *
- * If `opts.refreshToken` is specified, it will be appended to the returned URL as a search param. This is useful for forcing cache busting
- * due to hidden internal details by consuming components (e.g. map component from MapLibre).
- *
- * @param opts.refreshToken String to append to the returned value as a search param
- *
  * @example
  * ```tsx
  * function ExampleWithoutRefreshToken() {
  *   const { data, isRefetching } = useMapStyleUrl()
  *
- *   console.log(data) // logs something like 'http://localhost:...'
- * }
- * ```
- *
- * ```tsx
- * function ExampleWithRefreshToken() {
- *   const [refreshToken] = useState('foo')
- *   const { data } = useMapStyleUrl({ refreshToken })
- *
- *   console.log(data) // logs something like 'http://localhost:...?refresh_token=foo'
+ *   console.log(data) // logs something like 'http://127.0.0.1:...'
  * }
  * ```
  */
@@ -114,11 +100,41 @@ function useRemoveCustomMapFile() {
         },
     }));
 }
+/**
+ * Get the map info for the custom map.
+ *
+ * Note that this is _not_ a suspenseful hook. The different read states should be explicitly handled at usage.
+ *
+ * @example
+ * ```tsx
+ * import { getErrorCode } from '@comapeo/core-react'
+ *
+ * function Example() {
+ *   const mapInfo = useGetCustomMapInfo()
+ *
+ *   if (mapInfo.status === 'pending') {
+ *     // handle pending...
+ *   }
+ *
+ *   if (mapInfo.status === 'error') {
+ *     if (getErrorCode(mapInfo.error) === 'MAP_NOT_FOUND') {
+ *       // handle not found error...
+ *     } else {
+ *       // handle all other errors...
+ *     }
+ *   }
+ *
+ *   // Handle success state...
+ *   console.log(mapInfo.data)
+ * }
+ * ```
+ *
+ */
 function useGetCustomMapInfo() {
     const mapServerApi = (0, MapServer_js_1.useMapServerApi)();
     // TODO: Support custom maps
     const mapId = constants_js_1.CUSTOM_MAP_ID;
-    const { data, error, isRefetching } = (0, react_query_1.useQuery)({
+    const result = (0, react_query_1.useQuery)({
         ...(0, react_query_js_1.baseQueryOptions)(),
         queryKey: (0, react_query_js_1.getMapInfoQueryKey)({ mapId }),
         queryFn: async () => {
@@ -128,7 +144,7 @@ function useGetCustomMapInfo() {
         staleTime: Infinity,
         gcTime: Infinity,
     });
-    return { data, error, isRefetching };
+    return (0, react_query_js_1.filterQueryResult)(result);
 }
 // ============================================
 // RECEIVER HOOKS

package/dist/commonjs/lib/react-query.d.ts

@@ -1,4 +1,4 @@
-import type { QueryClient, UseMutationResult } from '@tanstack/react-query';
+import type { QueryClient, UseMutationResult, UseQueryResult } from '@tanstack/react-query';
 import { DistributedPick } from 'type-fest';
 import type { WriteableDocumentType } from './types.js';
 export declare function baseQueryOptions(): {
@@ -17,6 +17,9 @@ export type FilteredMutationResult<TResult extends UseMutationResult<any, any, a
  * result based on the `status` property.
  */
 export declare function filterMutationResult<TResult extends UseMutationResult<any, any, any, any>>(mutationResult: TResult): DistributedPick<TResult, "error" | "status" | "mutate" | "reset" | "mutateAsync">;
+declare const PICKED_QUERY_RESULT_KEYS: readonly ["data", "error", "isRefetching", "status"];
+export type FilteredQueryResult<TResult extends UseQueryResult<any, any>> = DistributedPick<TResult, (typeof PICKED_QUERY_RESULT_KEYS)[number]>;
+export declare function filterQueryResult<TResult extends UseQueryResult<any, any>>(queryResult: TResult): DistributedPick<TResult, "data" | "error" | "status" | "isRefetching">;
 export declare function getDeviceInfoQueryKey(): readonly ["@comapeo/core-react", "client", "device_info"];
 export declare function getIsArchiveDeviceQueryKey(): readonly ["@comapeo/core-react", "client", "is_archive_device"];
 export declare function getInvitesQueryKey(): readonly ["@comapeo/core-react", "invites"];

package/dist/commonjs/lib/react-query.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.baseQueryOptions = baseQueryOptions;
 exports.baseMutationOptions = baseMutationOptions;
 exports.filterMutationResult = filterMutationResult;
+exports.filterQueryResult = filterQueryResult;
 exports.getDeviceInfoQueryKey = getDeviceInfoQueryKey;
 exports.getIsArchiveDeviceQueryKey = getIsArchiveDeviceQueryKey;
 exports.getInvitesQueryKey = getInvitesQueryKey;
@@ -62,6 +63,19 @@ function filterMutationResult(mutationResult) {
     }
     return filteredResult;
 }
+const PICKED_QUERY_RESULT_KEYS = [
+    'data',
+    'error',
+    'isRefetching',
+    'status',
+];
+function filterQueryResult(queryResult) {
+    const filteredResult = {};
+    for (const key of PICKED_QUERY_RESULT_KEYS) {
+        filteredResult[key] = queryResult[key];
+    }
+    return filteredResult;
+}
 // #endregion
 // #region Client
 function getClientQueryKey() {

package/dist/esm/hooks/maps.d.ts

@@ -2,26 +2,12 @@ import type { AbortMapShareOptions, CancelMapShareOptions, CreateAndSendMapShare
 /**
  * Get a URL that points to a StyleJSON resource served by the embedded HTTP server.
  *
- * If `opts.refreshToken` is specified, it will be appended to the returned URL as a search param. This is useful for forcing cache busting
- * due to hidden internal details by consuming components (e.g. map component from MapLibre).
- *
- * @param opts.refreshToken String to append to the returned value as a search param
- *
  * @example
  * ```tsx
  * function ExampleWithoutRefreshToken() {
  *   const { data, isRefetching } = useMapStyleUrl()
  *
- *   console.log(data) // logs something like 'http://localhost:...'
- * }
- * ```
- *
- * ```tsx
- * function ExampleWithRefreshToken() {
- *   const [refreshToken] = useState('foo')
- *   const { data } = useMapStyleUrl({ refreshToken })
- *
- *   console.log(data) // logs something like 'http://localhost:...?refresh_token=foo'
+ *   console.log(data) // logs something like 'http://127.0.0.1:...'
  * }
  * ```
  */
@@ -104,15 +90,61 @@ export declare function useRemoveCustomMapFile(): Pick<import("@tanstack/react-q
 }> & {
     mutateAsync: import("@tanstack/react-query").UseMutateAsyncFunction<Response, Error, void, unknown>;
 }, "error" | "status" | "mutate" | "reset" | "mutateAsync">;
-export declare function useGetCustomMapInfo(): {
-    data: {
-        name: string;
-        size: number;
-        created: number;
-    } | undefined;
-    error: Error | null;
-    isRefetching: boolean;
-};
+/**
+ * Get the map info for the custom map.
+ *
+ * Note that this is _not_ a suspenseful hook. The different read states should be explicitly handled at usage.
+ *
+ * @example
+ * ```tsx
+ * import { getErrorCode } from '@comapeo/core-react'
+ *
+ * function Example() {
+ *   const mapInfo = useGetCustomMapInfo()
+ *
+ *   if (mapInfo.status === 'pending') {
+ *     // handle pending...
+ *   }
+ *
+ *   if (mapInfo.status === 'error') {
+ *     if (getErrorCode(mapInfo.error) === 'MAP_NOT_FOUND') {
+ *       // handle not found error...
+ *     } else {
+ *       // handle all other errors...
+ *     }
+ *   }
+ *
+ *   // Handle success state...
+ *   console.log(mapInfo.data)
+ * }
+ * ```
+ *
+ */
+export declare function useGetCustomMapInfo(): Pick<import("@tanstack/react-query").QueryObserverRefetchErrorResult<{
+    name: string;
+    size: number;
+    created: number;
+}, Error>, "data" | "error" | "status" | "isRefetching"> | Pick<import("@tanstack/react-query").QueryObserverSuccessResult<{
+    name: string;
+    size: number;
+    created: number;
+}, Error>, "data" | "error" | "status" | "isRefetching"> | Pick<import("@tanstack/react-query").QueryObserverLoadingErrorResult<{
+    name: string;
+    size: number;
+    created: number;
+}, Error>, "data" | "error" | "status" | "isRefetching"> | Pick<import("@tanstack/react-query").QueryObserverLoadingResult<{
+    name: string;
+    size: number;
+    created: number;
+}, Error>, "data" | "error" | "status" | "isRefetching"> | Pick<import("@tanstack/react-query").QueryObserverPendingResult<{
+    name: string;
+    size: number;
+    created: number;
+}, Error>, "data" | "error" | "status" | "isRefetching"> | Pick<import("@tanstack/react-query").QueryObserverPlaceholderResult<{
+    name: string;
+    size: number;
+    created: number;
+}, Error>, "data" | "error" | "status" | "isRefetching">;
 /**
  * Get all map shares that the device has received. Automatically updates when
  * new shares arrive or share states change.

package/dist/esm/hooks/maps.js

@@ -4,30 +4,16 @@ import { useMutation, useQuery, useQueryClient, useSuspenseQuery, } from '@tanst
 import { useCallback } from 'react';
 import { useMapServerApi } from '../contexts/MapServer.js';
 import { useReceivedMapSharesActions, useReceivedMapSharesState, useSentMapSharesActions, useSentMapSharesState, } from '../contexts/MapShares.js';
-import { baseMutationOptions, baseQueryOptions, filterMutationResult, getMapInfoQueryKey, getStyleJsonUrlQueryKey, invalidateMapQueries, } from '../lib/react-query.js';
+import { baseMutationOptions, baseQueryOptions, filterMutationResult, filterQueryResult, getMapInfoQueryKey, getStyleJsonUrlQueryKey, invalidateMapQueries, } from '../lib/react-query.js';
 /**
  * Get a URL that points to a StyleJSON resource served by the embedded HTTP server.
  *
- * If `opts.refreshToken` is specified, it will be appended to the returned URL as a search param. This is useful for forcing cache busting
- * due to hidden internal details by consuming components (e.g. map component from MapLibre).
- *
- * @param opts.refreshToken String to append to the returned value as a search param
- *
  * @example
  * ```tsx
  * function ExampleWithoutRefreshToken() {
  *   const { data, isRefetching } = useMapStyleUrl()
  *
- *   console.log(data) // logs something like 'http://localhost:...'
- * }
- * ```
- *
- * ```tsx
- * function ExampleWithRefreshToken() {
- *   const [refreshToken] = useState('foo')
- *   const { data } = useMapStyleUrl({ refreshToken })
- *
- *   console.log(data) // logs something like 'http://localhost:...?refresh_token=foo'
+ *   console.log(data) // logs something like 'http://127.0.0.1:...'
  * }
  * ```
  */
@@ -100,11 +86,41 @@ export function useRemoveCustomMapFile() {
         },
     }));
 }
+/**
+ * Get the map info for the custom map.
+ *
+ * Note that this is _not_ a suspenseful hook. The different read states should be explicitly handled at usage.
+ *
+ * @example
+ * ```tsx
+ * import { getErrorCode } from '@comapeo/core-react'
+ *
+ * function Example() {
+ *   const mapInfo = useGetCustomMapInfo()
+ *
+ *   if (mapInfo.status === 'pending') {
+ *     // handle pending...
+ *   }
+ *
+ *   if (mapInfo.status === 'error') {
+ *     if (getErrorCode(mapInfo.error) === 'MAP_NOT_FOUND') {
+ *       // handle not found error...
+ *     } else {
+ *       // handle all other errors...
+ *     }
+ *   }
+ *
+ *   // Handle success state...
+ *   console.log(mapInfo.data)
+ * }
+ * ```
+ *
+ */
 export function useGetCustomMapInfo() {
     const mapServerApi = useMapServerApi();
     // TODO: Support custom maps
     const mapId = CUSTOM_MAP_ID;
-    const { data, error, isRefetching } = useQuery({
+    const result = useQuery({
         ...baseQueryOptions(),
         queryKey: getMapInfoQueryKey({ mapId }),
         queryFn: async () => {
@@ -114,7 +130,7 @@ export function useGetCustomMapInfo() {
         staleTime: Infinity,
         gcTime: Infinity,
     });
-    return { data, error, isRefetching };
+    return filterQueryResult(result);
 }
 // ============================================
 // RECEIVER HOOKS

package/dist/esm/lib/react-query.d.ts

@@ -1,4 +1,4 @@
-import type { QueryClient, UseMutationResult } from '@tanstack/react-query';
+import type { QueryClient, UseMutationResult, UseQueryResult } from '@tanstack/react-query';
 import { DistributedPick } from 'type-fest';
 import type { WriteableDocumentType } from './types.js';
 export declare function baseQueryOptions(): {
@@ -17,6 +17,9 @@ export type FilteredMutationResult<TResult extends UseMutationResult<any, any, a
  * result based on the `status` property.
  */
 export declare function filterMutationResult<TResult extends UseMutationResult<any, any, any, any>>(mutationResult: TResult): DistributedPick<TResult, "error" | "status" | "mutate" | "reset" | "mutateAsync">;
+declare const PICKED_QUERY_RESULT_KEYS: readonly ["data", "error", "isRefetching", "status"];
+export type FilteredQueryResult<TResult extends UseQueryResult<any, any>> = DistributedPick<TResult, (typeof PICKED_QUERY_RESULT_KEYS)[number]>;
+export declare function filterQueryResult<TResult extends UseQueryResult<any, any>>(queryResult: TResult): DistributedPick<TResult, "data" | "error" | "status" | "isRefetching">;
 export declare function getDeviceInfoQueryKey(): readonly ["@comapeo/core-react", "client", "device_info"];
 export declare function getIsArchiveDeviceQueryKey(): readonly ["@comapeo/core-react", "client", "is_archive_device"];
 export declare function getInvitesQueryKey(): readonly ["@comapeo/core-react", "invites"];

package/dist/esm/lib/react-query.js

@@ -37,6 +37,19 @@ export function filterMutationResult(mutationResult) {
     }
     return filteredResult;
 }
+const PICKED_QUERY_RESULT_KEYS = [
+    'data',
+    'error',
+    'isRefetching',
+    'status',
+];
+export function filterQueryResult(queryResult) {
+    const filteredResult = {};
+    for (const key of PICKED_QUERY_RESULT_KEYS) {
+        filteredResult[key] = queryResult[key];
+    }
+    return filteredResult;
+}
 // #endregion
 // #region Client
 function getClientQueryKey() {

package/docs/API.md

@@ -1111,34 +1111,17 @@ Parameters:
 
 Get a URL that points to a StyleJSON resource served by the embedded HTTP server.
 
-If `opts.refreshToken` is specified, it will be appended to the returned URL as a search param. This is useful for forcing cache busting
-due to hidden internal details by consuming components (e.g. map component from MapLibre).
-
 | Function | Type |
 | ---------- | ---------- |
 | `useMapStyleUrl` | `() => { data: string; error: Error or null; isRefetching: boolean; }` |
 
-Parameters:
-
-* `opts.refreshToken`: String to append to the returned value as a search param
-
-
 Examples:
 
 ```tsx
 function ExampleWithoutRefreshToken() {
   const { data, isRefetching } = useMapStyleUrl()
 
-  console.log(data) // logs something like 'http://localhost:...'
-}
-```
-
-```tsx
-function ExampleWithRefreshToken() {
-  const [refreshToken] = useState('foo')
-  const { data } = useMapStyleUrl({ refreshToken })
-
-  console.log(data) // logs something like 'http://localhost:...?refresh_token=foo'
+  console.log(data) // logs something like 'http://127.0.0.1:...'
 }
 ```
 
@@ -1170,9 +1153,39 @@ function MapImportExample() {
 
 ### useGetCustomMapInfo
 
+Get the map info for the custom map.
+
+Note that this is _not_ a suspenseful hook. The different read states should be explicitly handled at usage.
+
 | Function | Type |
 | ---------- | ---------- |
-| `useGetCustomMapInfo` | `() => { data: any; error: Error or null; isRefetching: boolean; }` |
+| `useGetCustomMapInfo` | `() => Pick<QueryObserverRefetchErrorResult<MapInfoResponse, Error>, "data" or "error" or "status" or "isRefetching"> or Pick<QueryObserverSuccessResult<MapInfoResponse, Error>, "data" or ... 2 more ... or "isRefetching"> or Pick<...> or Pick<...> or Pick<...> or Pick<...>` |
+
+Examples:
+
+```tsx
+import { getErrorCode } from '@comapeo/core-react'
+
+function Example() {
+  const mapInfo = useGetCustomMapInfo()
+
+  if (mapInfo.status === 'pending') {
+    // handle pending...
+  }
+
+  if (mapInfo.status === 'error') {
+    if (getErrorCode(mapInfo.error) === 'MAP_NOT_FOUND') {
+      // handle not found error...
+    } else {
+      // handle all other errors...
+    }
+  }
+
+  // Handle success state...
+  console.log(mapInfo.data)
+}
+```
+
 
 ### useManyReceivedMapShares
 

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@comapeo/core-react",
-	"version": "11.0.2",
+	"version": "11.0.3",
 	"description": "React wrapper for working with @comapeo/core",
 	"repository": {
 		"type": "git",