Eric Bower
·
15 Feb 24
dependent.md
1---
2title: Dependent Queries
3slug: dependent-queries
4description: How to call other thunks and endpoints within one
5---
6
7In this context, thunks and endpoints are identical, so I will just talk about
8thunks throughout this guide.
9
10There are two ways to call a thunk within another thunk.
11
12# Dispatch the thunk as an action
13
14Features:
15
16- Non-blocking
17- Thunk is still controlled by supervisor
18- Works identical to `dispatch(action)`
19
20```ts
21import { put } from "starfx";
22const fetchMailboxes = api.get("/mailboxes");
23const fetchMail = thunks.create("fetch-mail", function* (ctx, next) {
24 yield* put(fetchMailboxes());
25});
26```
27
28This is the equivalent of using `useDispatch` in your view. As a result, it is
29also controlled by the thunk's supervisor task. If that thunk has a supervisor
30that might drop the middleware stack from activating (e.g. `takeLeading` or
31`timer`) then it might not actually get called. Further, this operation
32completes immediately, it does **not** wait for the thunk to complete before
33moving to the next yield point.
34
35If you want to make a blocking call to the thunk and wait for it to complete
36then you want to call the thunk's middleware stack directly.
37
38# Call the middleware stack directly
39
40Features:
41
42- Blocking
43- Middleware stack guarenteed to run
44- Does **not** go through supervisor task
45
46What do we mean by "middleware stack"? That is the stack of functions that you
47define for a thunk. It does **not** include the supervisor task that manages the
48thunk. Because a supervisor task could drop, pause, or delay the execution of a
49thunk, we need a way to escape hatch out of it and just call the middleware
50stack directly.
51
52```ts
53import { parallel, put } from "starfx";
54// imaginary schema
55import { schema } from "./schema";
56
57const fetchMailboxes = api.get("/mailboxes");
58const fetchMessages = api.get<{ id: string }>("/mailboxes/:id/messages");
59const fetchMail = thunks.create("fetch-mail", function* (ctx, next) {
60 const boxesCtx = yield* fetchMailboxes.run();
61 if (!boxesCtx.json.ok) {
62 return;
63 }
64
65 const boxes = yield* select(schema.mailboxes.selectTableAsList);
66 const group = yield* parallel(boxes.map((box) => {
67 return fetchMessages.run({ id: box.id });
68 }));
69 const messages = yield* select(schema.messages.selectTableAsList);
70 console.log(messages);
71});
72```