4.8.13. Multiple Step Usage in Workflow

In this chapter, you'll learn how to use a step multiple times in a workflow.

Problem Reusing a Step in a Workflow#

In some cases, you may need to use a step multiple times in the same workflow.

The most common example is using the useQueryGraphStep multiple times in a workflow to retrieve multiple unrelated data, such as customers and products.

Each workflow step must have a unique ID, which is the ID passed as a first parameter when creating the step:

Code
1const useQueryGraphStep = createStep(2  "use-query-graph"3  // ...4)

This causes an error when you use the same step multiple times in a workflow, as it's registered in the workflow as two steps having the same ID:

Code
1const helloWorkflow = createWorkflow(2  "hello",3  () => {4    const { data: products } = useQueryGraphStep({5      entity: "product",6      fields: ["id"],7    })8
9    // ERROR OCCURS HERE: A STEP HAS THE SAME ID AS ANOTHER IN THE WORKFLOW10    const { data: customers } = useQueryGraphStep({11      entity: "customer",12      fields: ["id"],13    })14  }15)

The next section explains how to fix this issue to use the same step multiple times in a workflow.

---

How to Use a Step Multiple Times in a Workflow?#

When you execute a step in a workflow, you can chain a config method to it to change the step's config.

Use the config method to change a step's ID for a single execution.

So, this is the correct way to write the example above:

Code
1const helloWorkflow = createWorkflow(2  "hello",3  () => {4    const { data: products } = useQueryGraphStep({5      entity: "product",6      fields: ["id"],7    })8
9    // ✓ No error occurs, the step has a different ID.10    const { data: customers } = useQueryGraphStep({11      entity: "customer",12      fields: ["id"],13    }).config({ name: "fetch-customers" })14  }15)

The config method accepts an object with a name property. Its value is a new ID of the step to use for this execution only.

The first useQueryGraphStep usage has the ID use-query-graph, and the second useQueryGraphStep usage has the ID fetch-customers.

Edit this page