Expose internal methods used to create query options (#343)

Ideally we'd be able to create an opinionated version of `useQueries`
but due to the complexity of those recursive types and there still being
other queryClient methods that can benefit from these APIs, I propose we
expose these internal APIs as helpers.

Fixes #333
Fixes #296

README.md

@@ -25,6 +25,8 @@ Connect-Query is an wrapper around [TanStack Query](https://tanstack.com/query)
   - [`createConnectQueryKey`](#createconnectquerykey)
   - [`callUnaryMethod`](#callunarymethod)
   - [`createProtobufSafeUpdater`](#createprotobufsafeupdater)
+  - [`createQueryOptions`](#createqueryoptions)
+  - [`createInfiniteQueryOptions`](#createinfinitequeryoptions)
   - [`ConnectQueryKey`](#connectquerykey)
 
 ## Quickstart
@@ -313,6 +315,80 @@ queryClient.setQueryData(
 
 ```
 
+### `createQueryOptions`
+
+```ts
+function createQueryOptions<I extends Message<I>, O extends Message<O>>(
+  methodSig: MethodUnaryDescriptor<I, O>,
+  input: DisableQuery | PartialMessage<I> | undefined,
+  {
+    transport,
+    callOptions,
+  }: ConnectQueryOptions & {
+    transport: Transport;
+  },
+): {
+  queryKey: ConnectQueryKey<I>;
+  queryFn: QueryFunction<O, ConnectQueryKey<I>>;
+  enabled: boolean;
+};
+```
+
+A functional version of the options that can be passed to the `useQuery` hook from `@tanstack/react-query`. When called, it will return the appropriate `queryKey`, `queryFn`, and `enabled` flag. This is useful when interacting with `useQueries` API or queryClient methods (like [ensureQueryData](https://tanstack.com/query/latest/docs/reference/QueryClient#queryclientensurequerydata), etc).
+
+An example of how to use this function with `useQueries`:
+
+```ts
+import { useQueries } from "@tanstack/react-query";
+import { createQueryOptions, useTransport } from "@connectrpc/connect-query";
+import { example } from "your-generated-code/example-ExampleService_connectquery";
+
+const MyComponent = () => {
+  const transport = useTransport();
+  const [query1, query2] = useQueries([
+    createQueryOptions(example, { sentence: "First query" }, { transport }),
+    createQueryOptions(example, { sentence: "Second query" }, { transport }),
+  ]);
+  ...
+};
+```
+
+### `createInfiniteQueryOptions`
+
+```ts
+function createInfiniteQueryOptions<
+  I extends Message<I>,
+  O extends Message<O>,
+  ParamKey extends keyof PartialMessage<I>,
+  Input extends PartialMessage<I> & Required<Pick<PartialMessage<I>, ParamKey>>,
+>(
+  methodSig: MethodUnaryDescriptor<I, O>,
+  input: DisableQuery | Input,
+  {
+    transport,
+    getNextPageParam,
+    pageParamKey,
+    callOptions,
+  }: ConnectInfiniteQueryOptions<I, O, ParamKey>,
+): {
+  getNextPageParam: ConnectInfiniteQueryOptions<
+    I,
+    O,
+    ParamKey
+  >["getNextPageParam"];
+  queryKey: ConnectInfiniteQueryKey<I>;
+  queryFn: QueryFunction<
+    O,
+    ConnectInfiniteQueryKey<I>,
+    PartialMessage<I>[ParamKey]
+  >;
+  initialPageParam: PartialMessage<I>[ParamKey];
+  enabled: boolean;
+};
+```
+
+A functional version of the options that can be passed to the `useInfiniteQuery` hook from `@tanstack/react-query`.When called, it will return the appropriate `queryKey`, `queryFn`, and `enabled` flags, as well as a few other parameters required for `useInfiniteQuery`. This is useful when interacting with some queryClient methods (like [ensureQueryData](https://tanstack.com/query/latest/docs/reference/QueryClient#queryclientensurequerydata), etc).
+
 ### `ConnectQueryKey`
 
 ```ts

packages/connect-query/src/index.ts

@@ -35,3 +35,5 @@ export { defaultOptions } from "./default-options.js";
 export type { DisableQuery, ConnectUpdater } from "./utils.js";
 export { callUnaryMethod } from "./call-unary-method.js";
 export type { MethodUnaryDescriptor } from "./method-unary-descriptor.js";
+export { createUseInfiniteQueryOptions as createInfiniteQueryOptions } from "./create-use-infinite-query-options.js";
+export { createUseQueryOptions as createQueryOptions } from "./create-use-query-options.js";