AI agents are
[becoming native users of software](/blog/ai-agents-are-becoming-native-users-of-software),
and today’s launch is about making that shift easier to build for. We’re
introducing new building blocks for collaborative AI workflows: new APIs for
connecting agents to realtime rooms and a new Feeds primitive. This unlocks new
workflows where agents can act as native users of software.

## New APIs for connecting agents to realtime rooms

Rooms are the core collaborative space in Liveblocks. They’re where people
already work together in realtime, and starting today, agents and back end
systems can participate more naturally too. We’re shipping new APIs that make
agents feel like first-class collaborators inside a room, rather than something
bolted on from the outside.

### Ephemeral presence

With ephemeral presence, an agent can now appear live in a room with a name,
avatar, and custom presence data. That means your product can show what an agent
is doing while it works, just like it would for a human collaborator.

<Figure>
  <Image
    src="/images/blog/unveil/agent-presence.jpg"
    alt="An AI agent using software as a native user"
    width={672}
    height={378}
    quality={90}
  />
</Figure>

To use it, call
[`setPresence`](/docs/api-reference/liveblocks-node#post-rooms-roomId-presence)
and pass your AI’s information and presence data.

```ts
await liveblocks.setPresence("my-room-id", {
  userId: "agent-123",

  userInfo: {
    name: "AI agent",
    avatar: "https://example.com/avatar.png",
  },

  data: {
    // Custom presence data
    // cursor: { x: 100, y: 200 },
  },
});
```

### JSON Patch for Liveblocks Storage

We’re also introducing support for JSON Patch in our open-source sync engine,
[Liveblocks Storage](/docs/collaboration-features/multiplayer/sync-engine/liveblocks-storage).
This is a powerful primitive which lets agents update your realtime data using a
simple, structured format.

It works especially well for AI because it is easier and quicker for a model to
generate a set of targeted changes than to rewrite an entire object.

```ts
const operations = [
  {
    op: "add",
    path: "/score",
    value: 42,
  },
  {
    op: "remove",
    path: "/oldKey",
  },
];

fetch(`https://api.liveblocks.io/v2/rooms/${roomId}/storage/json-patch`, {
  method: "PATCH",
  headers: {
    Authorization: `Bearer ${SECRET_KEY}`,
    "Content-Type": "application/json",
  },
  body: JSON.stringify(operations),
});
```

Learn more in our guide on
[modifying storage data with JSON Patch](/docs/guides/modifying-storage-via-rest-api-with-json-patch).

### Read comment attachments

Agents can now also read and analyze comment attachments, which opens the door
to richer workflows where agents process files, leave contextual feedback, and
work directly inside existing collaboration flows.

<Figure>
  <Image
    src="/images/blog/unveil/comment-attachment.jpg"
    alt="An AI agent replying to comment with attachment"
    width={672}
    height={448}
    quality={90}
  />
</Figure>

This is made possible with our new
[`getAttachment`](/docs/api-reference/liveblocks-node#get-rooms-roomId-attachments-attachmentId)
method.

```ts
const attachment = await liveblocks.getAttachment({
  roomId: "my-room-id",
  attachmentId: "at_d75sF3...",
});
```

Together, these APIs make it possible for agents to work inside the same
collaborative surface as the user. That is the real shift.

## New Feeds primitive

We’re also introducing Feeds, a new primitive for storing things like chat
messages and agent activity logs.

As agents become more active, products need more than a prompt box. They need a
timeline of what happened around the work itself. Feeds gives you a structured
place to store things like chat messages, agent logs, and workflow events, all
tied to the room where the work is happening.

### Realtime updates

Feeds contain lists of messages which update in realtime for all connected
users. In this Node.js example, we’re sending a `status` message to an existing
feed with
[`createFeedMessage`](/docs/api-reference/liveblocks-node#post-rooms-roomId-feeds-feedId-messages).

```ts title="Node.js back end"
await liveblocks.createFeedMessage({
  roomId: "my-room-id",
  feedId: "my-feed-id",

  data: {
    // +++
    status: "Fetching data…",
    // +++
  },
});
```

On the front end, we can show this message in our UI as soon as it’s created.

<Figure>
  <Image
    src="/images/blog/unveil/agent-status-feeds.jpg"
    alt="An AI agent cursor showing its status in realtime"
    width={672}
    height={378}
    quality={90}
  />
</Figure>

This works using the
[`useFeedMessages`](/docs/api-reference/liveblocks-react#useFeedMessages) hook;
it returns all messages in the feed, and automatically updates whenever a new
message is sent.

```tsx title="React front end"
import { useFeedMessages } from "@liveblocks/react/suspense";

function AgentStatus() {
  // +++
  const { messages } = useFeedMessages("my-feed-id");
  // +++
  const latestMessage = messages[messages.length - 1];

  return (
    <div>
      <span>✨ AI Agent</span>
      // +++
      {latestMessage.data.status}
      // +++
    </div>
  );
}
```

Once agents start updating state, leaving comments, or triggering workflows in
the background, products need a clean way to store and display that activity.
That is what Feeds is for.

### Comments example

We’ve set up a Feeds example that uses a workflow to analyze your comments and
leave a response. Each realtime update you see (e.g. “Thinking…”, “Writing…”) is
a new feed message sent from the back end.

Try it out by tagging `@AI Assistant` in a comment and asking a question.

<Figure
  caption={
    <>
      Our{" "}
      <Link href="/examples/ai-comments/nextjs-comments-ai">AI Comments</Link>{" "}
      example
    </>
  }
>
  <Embed
    src="https://nextjs-comments-ai.liveblocks.app/"
    className="aspect-16/10 w-full bg-white"
  />
</Figure>

Alongside feeds, this example also uses:

- [Comments](/comments) with
  [new comments customization APIs](/docs/api-reference/liveblocks-react-ui#Customize-comments)
  to insert AI responses.
- [Ephemeral presence](#ephemeral-presence) to show the agent’s avatar in the
  stack.
- [Workflow SDK](https://useworkflow.dev/) for AI with our
  [comment created webhook](/docs/platform/webhooks#CommentCreatedEvent) as a
  trigger.

### Get started now

To get started with Feeds, follow our new quickstart guide for Next.js.

<ButtonLink href="/docs/get-started/nextjs-feeds" size="lg">
  Get started now
</ButtonLink>

## What this unlocks

These building blocks make a new class of workflows possible. A user can @
mention an agent in a comment thread to trigger a workflow. The agent can review
the context, update the document, and reply in the same thread. A user can also
trigger an agent from outside the product, like in Slack or Microsoft Teams, to
start a back end workflow connected to a Liveblocks room.

Agents are becoming native users of software. They need to be able to act as a
user would, in context, on shared data, alongside people. We're building the
building blocks to make this possible in any product.

## Contributions

<Contributors gitHubUsernames={["jrowny", "ctnicholas"]} />