docs: FAQ: [atomsWithQuery]: queryKey type is always unknown (#130)

close #25

Author: ThaddeusJiang

README.md

@@ -20,6 +20,7 @@
 - [SSR Support](#ssr-support)
 - [Error Handling](#error-handling)
 - [Dev Tools](#devtools)
+- [FAQ](#faq)
 - [Migrate to v0.8.0](#migrate-to-v080)
 
 ### Support
@@ -479,6 +480,32 @@ export const Root = () => {
 }
 ```
 
+## FAQ
+
+### atomsWithQuery `queryKey` type is always `unknown`?
+
+Explicitly declare the `get:Getter` to get proper type inference for `queryKey`.
+
+```tsx
+import { Getter } from 'jotai'
+
+// ❌ Without explicit Getter type, queryKey type might be unknown
+const userAtom = atomWithQuery((get) => ({
+  queryKey: ['users', get(idAtom).toString()],
+  queryFn: async ({ queryKey: [, id] }) => {
+    // typeof id = unknown
+  },
+}))
+
+// ✅ With explicit Getter type, queryKey gets proper type inference
+const userAtom = atomWithQuery((get: Getter) => ({
+  queryKey: ['users', get(idAtom).toString()],
+  queryFn: async ({ queryKey: [, id] }) => {
+    // typeof id = string
+  },
+}))
+```
+
 ## Migrate to v0.8.0
 
 ### Change in atom signature

examples/01_query/src/App.tsx

@@ -1,11 +1,12 @@
+import { Getter } from 'jotai'
 import { useAtom } from 'jotai/react'
 import { atom } from 'jotai/vanilla'
 import { atomWithQuery } from 'jotai-tanstack-query'
 
 const idAtom = atom(1)
 
-const userAtom = atomWithQuery((get) => ({
-  queryKey: ['users', get(idAtom)],
+const userAtom = atomWithQuery((get: Getter) => ({
+  queryKey: ['users', get(idAtom).toString()],
   queryFn: async ({ queryKey: [, id] }) => {
     const res = await fetch(`https://jsonplaceholder.typicode.com/users/${id}`)
     return res.json()