Anthropic Claude Block

[stergios-enchatted]

Hello @baptisteArno,

As we discussed in issue #1315 we created a basic implementation of Anthropic’s Claude AI block.
This block is based on the OpenAI block and shares a similar structure.

The most notable changes in this PR are:

• Added the Claude AI block.
• Added relevant documentation for the new block.
• Formatted some other source files in order to pass git pre-hook checks.

Some notes to be made:

• Currently there is no way to dynamically fetch the model’s versions since there is no endpoint provided by the SDK.
  • All pre version-3 Claude models are hard-coded constant variables.
  • We have opened an issue for that on the SDK repository here.
• We can implement in a new PR Claude’s new Vision system which allows for image analysis and understanding.
  • This can be done in a later phase, given that you agree of course.

Summary by CodeRabbit

• New Features
  • Introduced the Anthropic block for creating chat messages with Claude AI in Typebot.
  • Added functionality to create chat messages using Anthropic AI SDK with configurable options.
  • Implemented encrypted credentials for Anthropic account integration.
  • Added constants and helpers for better handling of chat messages with Anthropic models.
  • Included Anthropic block in the list of enabled and forged blocks for broader access.

[coderabbitai]

Important

Auto Review Skipped

Auto reviews are disabled on this repository.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository.

To trigger a single review, invoke the @coderabbitai review command.

Walkthrough

The update introduces the Anthropic block within the Forge package, enabling the creation of chat messages through the Anthropic AI SDK, specifically using Claude AI. This integration allows for passing a history of chat messages between the assistant and users to Claude AI, processing them, and displaying the responses in Typebot. It includes functionalities for message creation, secure API key storage, model selection, and message processing, along with a new Anthropic logo component.

Changes

Files	Summary
apps/docs/editor/blocks/integrations/anthropic.mdx	Introduced the Anthropic block for creating chat messages with Claude AI in Typebot.
packages/forge/blocks/anthropic/actions/createChatMessage.tsx packages/forge/blocks/anthropic/helpers/parseChatMessages.ts	Added functionality for creating chat messages and processing them with the Anthropic AI SDK.
packages/forge/blocks/anthropic/auth.ts	Introduced encrypted credentials storage for Anthropic account API key.
packages/forge/blocks/anthropic/constants.ts	Added constants related to Anthropic models and default processing options.
packages/forge/blocks/anthropic/index.ts packages/forge/blocks/anthropic/logo.tsx	Introduced the Anthropic block and logo component within the Forge package.
packages/forge/repository/index.ts packages/forge/schemas/index.ts	Enabled and added the anthropic block to the Forge package's repository and schema list.

Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?

Share

• X
• Mastodon
• Reddit
• LinkedIn

---

Tips

Chat

There are 3 ways to chat with CodeRabbit:

• Review comments: Directly reply to a review comment made by CodeRabbit. Example:
  • I pushed a fix in commit <commit_id>.
  • Generate unit-tests for this file.
  • Open a follow-up GitHub issue for this discussion.
• Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
  • @coderabbitai generate unit tests for this file.
  • @coderabbitai modularize this function.
• PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
  • @coderabbitai generate interesting stats about this repository and render them as a table.
  • @coderabbitai show all the console.log statements in this repository.
  • @coderabbitai read src/utils.ts and generate unit tests.
  • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (invoked as PR comments)

• @coderabbitai pause to pause the reviews on a PR.
• @coderabbitai resume to resume the paused reviews.
• @coderabbitai review to trigger a review. This is useful when automatic reviews are disabled for the repository.
• @coderabbitai resolve resolve all the CodeRabbit review comments.
• @coderabbitai help to get help.

Additionally, you can add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.

CodeRabbit Configration File (.coderabbit.yaml)

• You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
• The JSON schema for the configuration file is available here.
• If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/coderabbit-overrides.v2.json

CodeRabbit Discord Community

Join our Discord Community to get help, request features, and share feedback.

[vercel]

@Retr0-01 is attempting to deploy a commit to the Typebot Team on Vercel.

A member of the Team first needs to authorize it.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
builder-v2	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Mar 12, 2024 5:53pm
landing-page-v2	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Mar 12, 2024 5:53pm

[baptisteArno]

Thank you for this amazing work 👍

Can you provide push access to that PR? https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/working-with-forks/allowing-changes-to-a-pull-request-branch-created-from-a-fork#enabling-repository-maintainer-permissions-on-existing-pull-requests

[stergios-enchatted]

Thanks @baptisteArno
It appears that this setting is not available for Github accounts that belong to an organization (https://github.com/orgs/community/discussions/5634). Have no idea why...
Anyway, to make things easier, we are inviting you to the fork, so you can have full access.

[baptisteArno]

@coderabbitai review

[coderabbitai]

Review Status

Actionable comments generated: 1

Configuration used: CodeRabbit UI

Commits

Files that changed from the base of the PR and between 0dc276c and c09c618.

Files ignored due to path filters (9)

• apps/docs/images/blocks/integrations/anthropic/append-to-history.png is excluded by: !**/*.png
• apps/docs/images/blocks/integrations/anthropic/assistant-message.png is excluded by: !**/*.png
• apps/docs/images/blocks/integrations/anthropic/dialogue-usage.png is excluded by: !**/*.png
• apps/docs/images/blocks/integrations/anthropic/overview.png is excluded by: !**/*.png
• apps/docs/mint.json is excluded by: !**/*.json
• packages/forge/blocks/anthropic/package.json is excluded by: !**/*.json
• packages/forge/blocks/anthropic/tsconfig.json is excluded by: !**/*.json
• packages/forge/schemas/package.json is excluded by: !**/*.json
• pnpm-lock.yaml is excluded by: !**/*.yaml

Files selected for processing (9)

• apps/docs/editor/blocks/integrations/anthropic.mdx (1 hunks)
• packages/forge/blocks/anthropic/actions/createChatMessage.tsx (1 hunks)
• packages/forge/blocks/anthropic/auth.ts (1 hunks)
• packages/forge/blocks/anthropic/constants.ts (1 hunks)
• packages/forge/blocks/anthropic/helpers/parseChatMessages.ts (1 hunks)
• packages/forge/blocks/anthropic/index.ts (1 hunks)
• packages/forge/blocks/anthropic/logo.tsx (1 hunks)
• packages/forge/repository/index.ts (1 hunks)
• packages/forge/schemas/index.ts (2 hunks)

Additional comments: 8

packages/forge/repository/index.ts (1)

• 11-11: The addition of 'anthropic' to the enabledBlocks array is correctly implemented and aligns with the PR's objective to introduce the Claude AI block.

packages/forge/blocks/anthropic/constants.ts (1)

• 1-12: The constants for Anthropic models and default options are correctly defined and immutable. Consider adding a comment or documentation note about the hardcoded model versions and the process for updating them in the future.

packages/forge/blocks/anthropic/logo.tsx (1)

• 1-7: The AnthropicLogo component is correctly implemented and follows React best practices.

packages/forge/blocks/anthropic/index.ts (1)

• 1-13: The definition of the anthropic block is correctly implemented and aligns with the project's architecture and the PR's objectives.

packages/forge/blocks/anthropic/auth.ts (1)

• 1-17: The authentication schema for the Anthropic block is correctly implemented and follows best practices. Consider adding a note or documentation about security considerations for storing API keys securely.

apps/docs/editor/blocks/integrations/anthropic.mdx (1)

• 1-41: The documentation for the Anthropic block is clear and informative. Consider correcting the spelling of "typebot" to "type bot" for consistency with the rest of the documentation. Additionally, ensure that all Markdown syntax is correctly used to avoid rendering issues.

packages/forge/schemas/index.ts (1)

• 30-30: The inclusion of the anthropic block in the forgedBlocks array is correctly implemented and aligns with the PR's objectives for integrating the block into the project.

packages/forge/blocks/anthropic/helpers/parseChatMessages.ts (1)

• 7-52: The parseChatMessages function is correctly implemented and handles different message roles effectively. Consider adding comments to clarify the logic in complex sections, especially when handling dialogue messages and role-based message creation.

[baptisteArno]

Alright, I've added a few fixes, they are all separated in clear commits. Feel free to check them out. Does it look good to you?

[stergios-enchatted]

@baptisteArno the changes have been reviewed and they look good to us. I believe this is ready to be merged!