LESSON 57 / 215·2 min readIntermediate

Practical TypeScript graph with an approval pause

Must knowConcept lesson
01 Understand02 Recall03 Prepare

Words made simple

A few useful meanings before you read the explanation.

API
A way for one piece of software to ask another for data or an action. A claims API might return the current status of a claim.
Orchestration
Coordinating tasks: deciding their order, passing data between them, and handling waiting or failures.
State
The data describing where a workflow is now, what it already knows, and what still needs to happen.
More words from this lesson
Persistence
Saving information so it remains available after a request ends or a process restarts.
Authentication
Checking who a user or service is, such as by verifying a login session.
Authorization
Checking what that identity is allowed to read or do. Being logged in does not grant access to every record.
HTTP
The request-and-response protocol used on the web. HTTPS adds encryption to protect information in transit.
Dependency
A library or package that your application relies on. Compatible versions help the application run as expected.
  • This is a minimal orchestration demonstration, not an insurance backend.
  • Dependencies are @langchain/langgraph and zod.
  • It uses the documented StateSchema style; older tutorials may use Annotation.Root.
  • Select compatible package versions before adopting either API.
TypeScript
import {
  StateGraph, StateSchema, START, END,
  MemorySaver, interrupt, Command,
} from "@langchain/langgraph";
import { z } from "zod";

const State = new StateSchema({
  claimId: z.string(),
  draftSummary: z.string(),
  approved: z.boolean().default(false),
  outcome: z.string().default("pending"),
});

const graph = new StateGraph(State)
  .addNode("prepare", (state) => ({
    draftSummary: `Review draft for claim ${state.claimId}`,
  }))
  .addNode("review", (state) => {
    // No external side effects before this pause.
    const choice = interrupt({
      action: "review_claim_draft",
      summary: state.draftSummary,
    });
    const decision = z.object({ approved: z.boolean() }).parse(choice);
    return { approved: decision.approved };
  })
  .addNode("accepted", () => ({ outcome: "ready_for_business_validation" }))
  .addNode("rejected", () => ({ outcome: "cancelled" }))
  .addEdge(START, "prepare")
  .addEdge("prepare", "review")
  .addConditionalEdges("review", (state) =>
    state.approved ? "accepted" : "rejected"
  )
  .addEdge("accepted", END)
  .addEdge("rejected", END)
  .compile({ checkpointer: new MemorySaver() });

// Demo only: production derives the thread through authorized server-side lookup.
const config = { configurable: { thread_id: "demo-claim-review-42" } };
const paused = await graph.invoke({
  claimId: "C42",
  draftSummary: "",
}, config);
console.log(paused.__interrupt__); // Display the review proposal safely.

// Simulates a person's decision. A real resume endpoint must authenticate it.
const resumed = await graph.invoke(
  new Command({ resume: { approved: true } }), config,
);
console.log(resumed.outcome); // ready_for_business_validation

StateSchema declares data. Nodes return partial updates. interrupt pauses at review; Command({resume: ...}) supplies the answer for that pause using the same thread. MemorySaver is process memory for learning, so restart loses progress. The accepted branch deliberately reports readiness; actual submission belongs in an authorized business service.

  • The demo's approved flag illustrates routing.
  • In production, a forged flag must never authorize an operation: the commit service verifies the persisted approval record, reviewer identity, exact draft hash, expiry, and current permissions.
  • LangGraph interrupts.
PAUSE & RECALL

Can you explain it without the notes?

Practical TypeScript graph with an approval pause

Use your own words. Explain an example and one limitation before checking the explanation.

Check your explanation

This is a minimal orchestration demonstration, not an insurance backend. Dependencies are @langchain/langgraph and zod. It uses the documented StateSchema style; older tutorials may use Annotation.Root. Select compatible package versions before adopting…

CONNECT IT TO YOUR INTERVIEW

Turn this concept into a clear answer.

Practice this concept
YOUR NEXT STEP

Keep connecting the ideas.

Next lesson: Checkpoints, persistence, and memory

Adapted from 13_AI.MD · “Practical TypeScript graph with an approval pause”. Examples are study fragments; framework behavior can depend on your version.