Added FAQ question about prefetching (connectrpc#185)

Add docs about prefetching. Also adds tschecks for generated files in example. Fixes connectrpc#117
gilwong00 · Oct 2, 2023 · a04327c · a04327c
1 parent fb34ca7
commit a04327c
Show file tree

Hide file tree

Showing 8 changed files with 23 additions and 14 deletions.
diff --git a/README.md b/README.md
@@ -11,6 +11,7 @@ Connect-Query is an expansion pack for [TanStack Query](https://tanstack.com/que
 
 - [Quickstart](#quickstart)
   - [Generated Code](#generated-code)
+- [Usage](#usage)
 - [Connect-Query API](#connect-query-api)
   - [`createQueryService`](#createqueryservice)
   - [`TransportProvider`](#transportprovider)
@@ -29,7 +30,6 @@ Connect-Query is an expansion pack for [TanStack Query](https://tanstack.com/que
   - [`UnaryHooks.useQuery`](#unaryhooksusequery)
   - [`ConnectQueryKey`](#connectquerykey)
   - [`ConnectPartialQueryKey`](#connectpartialquerykey)
-- [Experimental plugin](#experimental-plugin)
 - [Frequently Asked Questions](#frequently-asked-questions)
   - [How do I pass other TanStack Query options?](#how-do-i-pass-other-tanstack-query-options)
   - [Is this ready for production?](#is-this-ready-for-production)
@@ -40,7 +40,7 @@ Connect-Query is an expansion pack for [TanStack Query](https://tanstack.com/que
   - [Do I have to use a code generator?](#do-i-have-to-use-a-code-generator)
   - [What if I have a custom `Transport`?](#what-if-i-have-a-custom-transport)
   - [Does this only work with React?](#does-this-only-work-with-react)
-    - [SolidJS Example](#solidjs-example)
+  - [How do I do Prefetching?](#how-do-i-do-prefetching)
   - [What about Streaming?](#what-about-streaming)
 
 ## Quickstart
@@ -565,6 +565,20 @@ You can use Connect-Query with any TanStack variant (React, Solid, Svelte, Vue).
 
 > Tip: If you're a TanStack Query user that uses something other than React, we'd love to hear from you. Please reach out to us on the [Buf Slack](https://buf.build/links/slack).
 
+### How do I do Prefetching?
+
+When you might not have access to React context, you can use the `create` series of functions and provide a transport directly. For example:
+
+```ts
+import { say } from "./gen/eliza-ElizaService_connectquery";
+
+function prefetch() {
+  return queryClient.prefetchQuery(
+    say.createUseQueryOptions({ sentence: "Hello" }),
+  );
+}
+```
+
 ### What about Streaming?
 
 Connect-Query currently only supports Unary RPC methods, which use a simple request/response style of communication similar to GET or POST requests in REST. This is because it aligns most closely with TanStack Query's paradigms. However, we understand that there may be use cases for Server Streaming, Client Streaming, and Bidirectional Streaming, and we're eager to hear about them.

diff --git a/examples/react/basic/buf.gen.yaml b/examples/react/basic/buf.gen.yaml
@@ -14,3 +14,4 @@ plugins:
     opt:
       - target=ts
       - import_extension=none
+      - ts_nocheck=false
diff --git a/examples/react/basic/src/gen/eliza-BigIntService_connectquery.ts b/examples/react/basic/src/gen/eliza-BigIntService_connectquery.ts
@@ -12,10 +12,9 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-// @generated by protoc-gen-connect-query v0.5.1 with parameter "target=ts,import_extension=none"
+// @generated by protoc-gen-connect-query v0.5.1 with parameter "target=ts,import_extension=none,ts_nocheck=false"
 // @generated from file eliza.proto (package connectrpc.eliza.v1, syntax proto3)
 /* eslint-disable */
-// @ts-nocheck
 
 import { CountRequest, CountResponse } from "./eliza_pb";
 import { MethodKind } from "@bufbuild/protobuf";

diff --git a/examples/react/basic/src/gen/eliza-ElizaService_connectquery.ts b/examples/react/basic/src/gen/eliza-ElizaService_connectquery.ts
@@ -12,10 +12,9 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-// @generated by protoc-gen-connect-query v0.5.1 with parameter "target=ts,import_extension=none"
+// @generated by protoc-gen-connect-query v0.5.1 with parameter "target=ts,import_extension=none,ts_nocheck=false"
 // @generated from file eliza.proto (package connectrpc.eliza.v1, syntax proto3)
 /* eslint-disable */
-// @ts-nocheck
 
 import {
   ConverseRequest,

diff --git a/examples/react/basic/src/gen/eliza-Haberdasher_connectquery.ts b/examples/react/basic/src/gen/eliza-Haberdasher_connectquery.ts
@@ -12,10 +12,9 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-// @generated by protoc-gen-connect-query v0.5.1 with parameter "target=ts,import_extension=none"
+// @generated by protoc-gen-connect-query v0.5.1 with parameter "target=ts,import_extension=none,ts_nocheck=false"
 // @generated from file eliza.proto (package connectrpc.eliza.v1, syntax proto3)
 /* eslint-disable */
-// @ts-nocheck
 
 import { Nothing } from "./eliza_pb";
 import { MethodKind } from "@bufbuild/protobuf";

diff --git a/examples/react/basic/src/gen/eliza-PaginatedService_connectquery.ts b/examples/react/basic/src/gen/eliza-PaginatedService_connectquery.ts
@@ -12,10 +12,9 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-// @generated by protoc-gen-connect-query v0.5.1 with parameter "target=ts,import_extension=none"
+// @generated by protoc-gen-connect-query v0.5.1 with parameter "target=ts,import_extension=none,ts_nocheck=false"
 // @generated from file eliza.proto (package connectrpc.eliza.v1, syntax proto3)
 /* eslint-disable */
-// @ts-nocheck
 
 import { ListRequest, ListResponse } from "./eliza_pb";
 import { MethodKind } from "@bufbuild/protobuf";

diff --git a/examples/react/basic/src/gen/eliza-SecondService_connectquery.ts b/examples/react/basic/src/gen/eliza-SecondService_connectquery.ts
@@ -12,10 +12,9 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-// @generated by protoc-gen-connect-query v0.5.1 with parameter "target=ts,import_extension=none"
+// @generated by protoc-gen-connect-query v0.5.1 with parameter "target=ts,import_extension=none,ts_nocheck=false"
 // @generated from file eliza.proto (package connectrpc.eliza.v1, syntax proto3)
 /* eslint-disable */
-// @ts-nocheck
 
 import {
   ConverseRequest,

diff --git a/examples/react/basic/src/gen/eliza-Slouch_connectquery.ts b/examples/react/basic/src/gen/eliza-Slouch_connectquery.ts
@@ -12,10 +12,9 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-// @generated by protoc-gen-connect-query v0.5.1 with parameter "target=ts,import_extension=none"
+// @generated by protoc-gen-connect-query v0.5.1 with parameter "target=ts,import_extension=none,ts_nocheck=false"
 // @generated from file eliza.proto (package connectrpc.eliza.v1, syntax proto3)
 /* eslint-disable */
-// @ts-nocheck
 
 import { Nothing } from "./eliza_pb";
 import { MethodKind } from "@bufbuild/protobuf";