Docs: Provide examples for either page-based or cursor-based paginati…

…on. (#41)

docs/utils-reference/react-hooks/useCachedPromise.md

@@ -233,7 +233,7 @@ to
 const { isLoading, data, pagination } = useCachedPromise(
   (searchText: string) => async (options) => {
     const response = await fetch(`https://api.example?q=${searchText}&page=${options.page}`);
-    const data = await response.json();
+    const { data } = await response.json();
     const hasMore = options.page < 50;
     return { data, hasMore };
   },
@@ -245,13 +245,32 @@ const { isLoading, data, pagination } = useCachedPromise(
 );
 ```
 
+or, if your data source uses cursor-based pagination, you can return a `cursor` alongside `data` and `hasMore`, and the cursor will be passed as an argument the next time the function gets called:
+
+```ts
+const { isLoading, data, pagination } = useCachedPromise(
+  (searchText: string) => async (options) => {
+    const response = await fetch(`https://api.example?q=${searchText}&cursor=${options.cursor}`);
+    const { data, nextCursor } = await response.json();
+    const hasMore = nextCursor !== undefined;
+    return { data, hasMore, cursor: nextCursor };
+  },
+  [searchText],
+  {
+    // to make sure the screen isn't flickering when the searchText changes
+    keepPreviousData: true,
+  },
+);
+```
+
 You'll notice that, in the second case, the hook returns an additional item: `pagination`. This can be passed to Raycast's `List` or `Grid` components in order to enable pagination.
 Another thing to notice is that the async function receives a [PaginationOptions](#paginationoptions) argument, and returns a specific data format:
 
 ```ts
 {
   data: any[];
   hasMore: boolean;
+  cursor?: any;
 }
 ```
 

docs/utils-reference/react-hooks/useFetch.md

@@ -211,13 +211,33 @@ const { isLoading, data, pagination } = useFetch(
 );
 ```
 
+or, if your data source uses cursor-based pagination, you can return a `cursor` alongside `data` and `hasMore`, and the cursor will be passed as an argument the next time the function gets called:
+
+```ts
+const { isLoading, data, pagination } = useFetch(
+  (options) =>
+    "https://api.ycombinator.com/v0.1/companies?" +
+    new URLSearchParams({ cursor: options.cursor, q: searchText }).toString(),
+  {
+    mapResult(result: SearchResult) {
+      const { companies, nextCursor } = result;
+      const hasMore = nextCursor !== undefined;
+      return { data: companies, hasMore, cursor: nextCursor, };
+    },
+    keepPreviousData: true,
+    initialData: [],
+  },
+);
+```
+
 You'll notice that, in the second case, the hook returns an additional item: `pagination`. This can be passed to Raycast's `List` or `Grid` components in order to enable pagination.
 Another thing to notice is that `mapResult`, which is normally optional, is actually required when using pagination. Furthermore, its return type is
 
 ```ts
 {
   data: any[],
   hasMore?: boolean;
+  cursor?: any;
 }
 ```
 

docs/utils-reference/react-hooks/usePromise.md

@@ -168,12 +168,26 @@ const { isLoading, data } = usePromise(
 
 to
 
+```ts
+const { isLoading, data, pagination } = usePromise(
+  (searchText: string) =>
+    async ({ page, lastItem, cursor }) => {
+      const { data } = await getUsers(page); // or any other asynchronous logic you need to perform
+      const hasMore = page < 50;
+      return { data, hasMore };
+    },
+  [searchText],
+);
+```
+
+or, if your data source uses cursor-based pagination, you can return a `cursor` alongside `data` and `hasMore`, and the cursor will be passed as an argument the next time the function gets called:
+
 ```ts
 const { isLoading, data, pagination } = usePromise(
   (searchText: string) =>
     async ({ page, lastItem, cursor }) => {
       const { data, nextCursor } = await getUsers(cursor); // or any other asynchronous logic you need to perform
-      const hasMore = page < 50; //
+      const hasMore = nextCursor !== undefined;
       return { data, hasMore, cursor: nextCursor };
     },
   [searchText],