convex-backend PR 51: Add second workaround to circular type inference (#34901)

I added a second option to solve the circular type inference in actions: typing the handler function return type. It might be simpler than typing `runQuery` and `runMutation`, specially when there are multiple queries and mutations, so I place it first.

I also made the title an h3, to be visible in the TOC, and because I think it is more of a problem of the action constructor been part of the type generation than the context. Maybe it need to be part of another page (I don't known witch could be), because this could also happen on other functions, like mutations with partial rollback 🤔

Co-authored-by: Benjamín Vicente <[email protected]>
GitOrigin-RevId: 1e3981bfd62823d5d70bc0ef3c87a2968bfc323b

Author: 2 people

Diff for: npm-packages/docs/docs/functions/actions.mdx

@@ -9,7 +9,8 @@ import Context from "!!raw-loader!@site/../private-demos/snippets/convex/actions
 import ContextRunQuery from "!!raw-loader!@site/../private-demos/snippets/convex/myFunctions.ts";
 import ContextRunMutation from "!!raw-loader!@site/../private-demos/snippets/convex/actionsContextRunMutation.ts";
 import CircularError from "!!raw-loader!@site/../private-demos/snippets/convex/actionsCircularError.ts";
-import CircularErrorFixed from "!!raw-loader!@site/../private-demos/snippets/convex/actionsCircularErrorFixed.ts";
+import CircularErrorFixedResults from "!!raw-loader!@site/../private-demos/snippets/convex/actionsCircularErrorFixedResults.ts";
+import CircularErrorFixedReturn from "!!raw-loader!@site/../private-demos/snippets/convex/actionsCircularErrorFixedReturn.ts";
 import NPM from "!!raw-loader!@site/../private-demos/snippets/convex/actionsNPM.ts";
 import Node from "!!raw-loader!@site/../private-demos/snippets/convex/actionsNode.ts";
 import Call from "!!raw-loader!@site/../private-demos/snippets/src/actionsCall.tsx";
@@ -109,7 +110,7 @@ do:
 - To search a vector index, use the `vectorSearch` field. Read on about
   [Vector Search](/docs/search/vector-search.mdx).
 
-#### Dealing with circular type inference
+### Dealing with circular type inference
 
 <Details summary={<>
 Working around the TypeScript error: some action <code>implicitly has
@@ -127,14 +128,23 @@ infer the return type of the action. This is a minimal example of the issue:
   snippet="tsError"
 />
 
-To work around this, you should store the result of the `ctx.runQuery` or
-`ctx.runMutation` call in a variable with a type annotation:
-
-<Snippet
-  title="convex/myFunctions.ts"
-  source={CircularErrorFixed}
-  snippet="fixed"
-/>
+To work around this, there are two options:
+
+1. Type the return value of the handler function explicitly:
+   <Snippet
+     title="convex/myFunctions.ts"
+     source={CircularErrorFixedReturn}
+     snippet="fixed"
+     highlightPatterns={["null"]}
+   />
+2. Type the the result of the `ctx.runQuery` or `ctx.runMutation` call
+   explicitly:
+   <Snippet
+     title="convex/myFunctions.ts"
+     source={CircularErrorFixedResults}
+     snippet="fixed"
+     highlightPatterns={["null"]}
+   />
 
 TypeScript will check that the type annotation matches what the called query or
 mutation returns, so you don't lose any type safety.

Diff for: npm-packages/private-demos/snippets/convex/_generated/api.d.ts

@@ -15,7 +15,8 @@ import type {
 } from "convex/server";
 import type * as actionsArgsWithValidation from "../actionsArgsWithValidation.js";
 import type * as actionsCircularError from "../actionsCircularError.js";
-import type * as actionsCircularErrorFixed from "../actionsCircularErrorFixed.js";
+import type * as actionsCircularErrorFixedResults from "../actionsCircularErrorFixedResults.js";
+import type * as actionsCircularErrorFixedReturn from "../actionsCircularErrorFixedReturn.js";
 import type * as actionsConstructor from "../actionsConstructor.js";
 import type * as actionsContext from "../actionsContext.js";
 import type * as actionsContextRunMutation from "../actionsContextRunMutation.js";
@@ -110,7 +111,8 @@ import type * as writingDataReplace from "../writingDataReplace.js";
 declare const fullApi: ApiFromModules<{
   actionsArgsWithValidation: typeof actionsArgsWithValidation;
   actionsCircularError: typeof actionsCircularError;
-  actionsCircularErrorFixed: typeof actionsCircularErrorFixed;
+  actionsCircularErrorFixedResults: typeof actionsCircularErrorFixedResults;
+  actionsCircularErrorFixedReturn: typeof actionsCircularErrorFixedReturn;
   actionsConstructor: typeof actionsConstructor;
   actionsContext: typeof actionsContext;
   actionsContextRunMutation: typeof actionsContextRunMutation;

Diff for: npm-packages/private-demos/snippets/convex/actionsCircularErrorFixed.ts renamed to npm-packages/private-demos/snippets/convex/actionsCircularErrorFixedResults.ts

@@ -0,0 +1,12 @@
+import { api } from "./_generated/api";
+import { action } from "./_generated/server";
+
+// @snippet start fixed
+export const myAction = action({
+  args: {},
+  handler: async (ctx): Promise<null> => {
+    const result = await ctx.runQuery(api.myFunctions.getSomething);
+    return result;
+  },
+});
+// @snippet end fixed