Skip to main content

Analyze Liveblocks comment attachments with Anthropic Claude AI

Workflow preview

Workflow preview
100%
Analyze Liveblocks comment attachments with Anthropic Claude AI preview
Open on n8n.io

1. Workflow Overview

Analyzing uploaded Liveblocks comments attachments with AI This example uses Liveblocks Comments, collaborative commenting components for React. When an AI assista...

Best for

  • Support Chatbot automation workflows
  • AI Chatbot automation workflows
  • advanced n8n builders looking for reusable templates

Tools used

custom.liveblockstrigger, custom.liveblocks, n8n-nodes-base.if, n8n-nodes-base.stickynote, n8n-nodes-base.code, @n8n/n8n-nodes-langchain.anthropic, n8n-nodes-base.switch, n8n-nodes-base.merge

Source and attribution

This workflow is cataloged by N8N Workflows and links back to its original n8n.io source page by Liveblocks.

Original n8n.io source

1.1 Workflow description

Title
Analyze Liveblocks comment attachments with Anthropic Claude AI
Workflow name
Analyze Liveblocks comment attachments with Anthropic Claude AI

Analyzing uploaded Liveblocks comments attachments with AI

This example uses Liveblocks Comments, collaborative commenting components for React. When an AI assistant is mentioned in a thread (e.g. "@AI Assistant"), it will automatically leave a response. Additionally, it will analyze any PDf or image attachments in the comments, and use them to help it respond.

Using webhooks, this workflow is triggered when a comment is created in a thread. If the agent's ID ("__AI_AGENT") it will create a response. If a PDF or image file is uploaded, these will be analyzed by Anthropic and used as context. This response is then added, and users will see it appear in their apps in real time.

Set up

This workflow requires a Comments app installed and webhooks set up in the Liveblocks dashboard. You can try it with a demo application:

  1. Download the Next.js comments example, and run it with a secret key.
  2. Find database.ts inside the example and uncomment the AI assistant user.
  3. Insert the secret key from the project into n8n nodes: "Get a comment", "Get a thread", "Create a comment".
  4. Go to the Liveblocks dashboard, open your project and go to "Webhooks". Create a new webhook in your project using a placeholder URL, and selecting "commentCreated" events.
  5. Copy your webhook secret from this page and paste it into the "Liveblocks Trigger" node.
  6. Expose the webhook URL from the trigger, for example with localtunnel or ngrok. Copy the production URL from the "Liveblocks Trigger" and replace localhost:5678 with the new URL.
  7. Your workflow is now set up! Tag @AI Assistant in the application and add attachments to trigger it.
Localtunnel

The easiest way to expose your webhook URL:

npx localtunnel --port 5678 --subdomain your-name-here

This creates a URL like:

https://honest-months-fix.loca.lt

The URL you need for the dashboard looks like this:

https://honest-months-fix.loca.lt/webhook/9cc66974-aaaf-4720-b557-1267105ca78b/webhook

1.2 Logical Blocks

This catalog entry is organized from the workflow JSON. The node-level section below shows the executable blocks available for review before importing the template.

2. Block-by-Block Analysis

Block 1 - Liveblocks Trigger

Type / Role
CUSTOM.liveblocksTrigger - liveblocksTrigger
Config choices
Version 1

Block 2 - Get a comment

Type / Role
CUSTOM.liveblocks - liveblocks
Config choices
Version 1

Block 3 - If

Type / Role
n8n-nodes-base.if - if
Config choices
Version 2.3

Block 4 - Sticky Note

Type / Role
n8n-nodes-base.stickyNote - stickyNote
Config choices
Version 1

Block 5 - Sticky Note1

Type / Role
n8n-nodes-base.stickyNote - stickyNote
Config choices
Version 1

Block 6 - Sticky Note3

Type / Role
n8n-nodes-base.stickyNote - stickyNote
Config choices
Version 1

Block 7 - Sticky Note4

Type / Role
n8n-nodes-base.stickyNote - stickyNote
Config choices
Version 1

Block 8 - Sticky Note5

Type / Role
n8n-nodes-base.stickyNote - stickyNote
Config choices
Version 1

Block 9 - Code in JavaScript

Type / Role
n8n-nodes-base.code - code
Config choices
Version 2

Block 10 - Get attachment1

Type / Role
CUSTOM.liveblocks - liveblocks
Config choices
Version 1

Block 11 - Analyze document1

Type / Role
@n8n/n8n-nodes-langchain.anthropic - anthropic
Config choices
Version 1

Block 12 - Switch

Type / Role
n8n-nodes-base.switch - switch
Config choices
Version 3.4

Block 13 - Analyze image

Type / Role
@n8n/n8n-nodes-langchain.anthropic - anthropic
Config choices
Version 1

Block 14 - Merge

Type / Role
n8n-nodes-base.merge - merge
Config choices
Version 3.2

Block 15 - Edit Fields

Type / Role
n8n-nodes-base.set - set
Config choices
Version 3.4

Block 16 - AI Agent

Type / Role
@n8n/n8n-nodes-langchain.agent - agent
Config choices
Version 3.1

Block 17 - Anthropic Chat Model

Type / Role
@n8n/n8n-nodes-langchain.lmChatAnthropic - lmChatAnthropic
Config choices
Version 1.3

Block 18 - Code in JavaScript1

Type / Role
n8n-nodes-base.code - code
Config choices
Version 2

Block 19 - Create a comment1

Type / Role
CUSTOM.liveblocks - liveblocks
Config choices
Version 1

Block 20 - Sticky Note8

Type / Role
n8n-nodes-base.stickyNote - stickyNote
Config choices
Version 1

Block 21 - Sticky Note9

Type / Role
n8n-nodes-base.stickyNote - stickyNote
Config choices
Version 1

Block 22 - Sticky Note10

Type / Role
n8n-nodes-base.stickyNote - stickyNote
Config choices
Version 1

Block 23 - If1

Type / Role
n8n-nodes-base.if - if
Config choices
Version 2.3

Block 24 - AI Agent1

Type / Role
@n8n/n8n-nodes-langchain.agent - agent
Config choices
Version 3.1

Showing the first 24 of 27 workflow blocks. Download the JSON for the full node graph.

3. Summary Table

Workflow Analyze Liveblocks comment attachments with Anthropic Claude AI
Complexity advanced
Nodes 27
Categories Support Chatbot, AI Chatbot
Author Liveblocks
Published 24 Mar 2026

4. Reproducing the Workflow from Scratch

  1. 1. Download the workflow JSON

    Use the JSON export at /data/workflows/14300/14300.json as the source template for this automation.

  2. 2. Import the template into n8n

    Open n8n, import the downloaded JSON, and review each node before activating the workflow.

  3. 3. Configure credentials and variables

    Replace placeholder credentials, API keys, webhook URLs, account IDs, and environment-specific values with your own settings.

  4. 4. Test with sample data

    Run the workflow manually or in a staging workspace, inspect node output, and confirm downstream systems receive the expected data.

  5. 5. Activate and monitor

    Enable the workflow only after testing, then monitor executions, errors, and rate limits during the first production runs.

5. General Notes & Resources

Review imported nodes carefully before activation. This catalog entry is intended to help you inspect the workflow structure, understand required services, and find related templates faster.

Node names, credentials, schedules, webhook paths, and external service limits may need adjustment for your workspace.

Frequently asked questions

What does Analyze Liveblocks comment attachments with Anthropic Claude AI do?

Analyzing uploaded Liveblocks comments attachments with AI This example uses Liveblocks Comments, collaborative commenting components for React. When an AI assista...

What do I need before importing this workflow?

Review the workflow JSON, configure any required credentials in n8n, and test the automation in a safe workspace before using it in production.

Can I customize this workflow?

Yes. Use the block-by-block analysis and the downloadable JSON to inspect each node, then adjust credentials, prompts, schedules, filters, or destinations for your Support Chatbot, AI Chatbot use case.