useWaitToken hook

Author: matt-aitken

docs/docs.json

@@ -129,7 +129,8 @@
                   "realtime/react-hooks/triggering",
                   "realtime/react-hooks/subscribe",
                   "realtime/react-hooks/streams",
-                  "realtime/react-hooks/swr"
+                  "realtime/react-hooks/swr",
+                  "realtime/react-hooks/use-wait-token"
                 ]
               },
               {

docs/realtime/react-hooks/use-wait-token.mdx

@@ -0,0 +1,34 @@
+---
+title: useWaitToken
+description: Fetch and cache data using SWR-based hooks
+---
+
+We've added a new `useWaitToken` react hook that allows you to complete a wait token from a React component, using a Public Access Token.
+
+```ts backend.ts
+import { wait } from "@trigger.dev/sdk";
+
+// Somewhere in your code, you'll need to create the token and then pass the token ID and the public token to the frontend
+const token = await wait.createToken({
+  timeout: "10m",
+});
+
+return {
+  tokenId: token.id,
+  publicToken: token.publicAccessToken, // An automatically generated public access token that expires in 1 hour
+};
+```
+
+Now you can use the `useWaitToken` hook in your frontend code:
+
+```tsx frontend.tsx
+import { useWaitToken } from "@trigger.dev/react-hooks";
+
+export function MyComponent({ publicToken, tokenId }: { publicToken: string; tokenId: string }) {
+  const { complete } = useWaitToken(tokenId, {
+    accessToken: publicToken,
+  });
+
+  return <button onClick={() => complete({ foo: "bar" })}>Complete</button>;
+}
+```