diff --git a/apps/builder/src/features/blocks/integrations/chatwoot/components/ChatwootBlockNodeLabel.tsx b/apps/builder/src/features/blocks/integrations/chatwoot/components/ChatwootBlockNodeLabel.tsx
index e4958290c..77f04547c 100644
--- a/apps/builder/src/features/blocks/integrations/chatwoot/components/ChatwootBlockNodeLabel.tsx
+++ b/apps/builder/src/features/blocks/integrations/chatwoot/components/ChatwootBlockNodeLabel.tsx
@@ -6,7 +6,9 @@ type Props = {
}
export const ChatwootBlockNodeLabel = ({ block }: Props) =>
- block.options.websiteToken.length === 0 ? (
+ block.options.task === 'Close widget' ? (
+ Close Chatwoot
+ ) : block.options.websiteToken.length === 0 ? (
Configure...
) : (
Open Chatwoot
diff --git a/apps/builder/src/features/blocks/integrations/chatwoot/components/ChatwootSettingsForm.tsx b/apps/builder/src/features/blocks/integrations/chatwoot/components/ChatwootSettingsForm.tsx
index bf8562970..6e3dabf9d 100644
--- a/apps/builder/src/features/blocks/integrations/chatwoot/components/ChatwootSettingsForm.tsx
+++ b/apps/builder/src/features/blocks/integrations/chatwoot/components/ChatwootSettingsForm.tsx
@@ -1,3 +1,4 @@
+import { DropdownList } from '@/components/DropdownList'
import { TextInput } from '@/components/inputs'
import {
Accordion,
@@ -7,7 +8,7 @@ import {
AccordionPanel,
Stack,
} from '@chakra-ui/react'
-import { ChatwootOptions } from 'models'
+import { ChatwootOptions, chatwootTasks } from 'models'
import React from 'react'
type Props = {
@@ -16,83 +17,100 @@ type Props = {
}
export const ChatwootSettingsForm = ({ options, onOptionsChange }: Props) => {
+ const updateTask = (task: (typeof chatwootTasks)[number]) => {
+ onOptionsChange({ ...options, task })
+ }
+
return (
- {
- onOptionsChange({ ...options, baseUrl })
- }}
- withVariableButton={false}
+
-
- onOptionsChange({ ...options, websiteToken })
- }
- moreInfoTooltip="Can be found in Chatwoot under Settings > Inboxes > Settings > Configuration, in the code snippet."
- />
-
-
-
- Set user details
-
-
-
+ {!options.task ||
+ (options.task === 'Show widget' && (
+ <>
{
- onOptionsChange({ ...options, user: { ...options.user, id } })
+ isRequired
+ label="Base URL"
+ defaultValue={options.baseUrl}
+ onChange={(baseUrl: string) => {
+ onOptionsChange({ ...options, baseUrl })
}}
+ withVariableButton={false}
/>
{
- onOptionsChange({
- ...options,
- user: { ...options.user, name },
- })
- }}
+ isRequired
+ label="Website token"
+ defaultValue={options.websiteToken}
+ onChange={(websiteToken) =>
+ onOptionsChange({ ...options, websiteToken })
+ }
+ moreInfoTooltip="Can be found in Chatwoot under Settings > Inboxes > Settings > Configuration, in the code snippet."
/>
- {
- onOptionsChange({
- ...options,
- user: { ...options.user, email },
- })
- }}
- />
- {
- onOptionsChange({
- ...options,
- user: { ...options.user, avatarUrl },
- })
- }}
- />
- {
- onOptionsChange({
- ...options,
- user: { ...options.user, phoneNumber },
- })
- }}
- />
-
-
-
+
+
+
+ Set user details
+
+
+
+ {
+ onOptionsChange({
+ ...options,
+ user: { ...options.user, id },
+ })
+ }}
+ />
+ {
+ onOptionsChange({
+ ...options,
+ user: { ...options.user, name },
+ })
+ }}
+ />
+ {
+ onOptionsChange({
+ ...options,
+ user: { ...options.user, email },
+ })
+ }}
+ />
+ {
+ onOptionsChange({
+ ...options,
+ user: { ...options.user, avatarUrl },
+ })
+ }}
+ />
+ {
+ onOptionsChange({
+ ...options,
+ user: { ...options.user, phoneNumber },
+ })
+ }}
+ />
+
+
+
+ >
+ ))}
)
}
diff --git a/apps/viewer/src/features/blocks/integrations/chatwoot/api/utils/executeChatwootBlock.ts b/apps/viewer/src/features/blocks/integrations/chatwoot/api/utils/executeChatwootBlock.ts
index ccbafa50b..445bc0b46 100644
--- a/apps/viewer/src/features/blocks/integrations/chatwoot/api/utils/executeChatwootBlock.ts
+++ b/apps/viewer/src/features/blocks/integrations/chatwoot/api/utils/executeChatwootBlock.ts
@@ -49,13 +49,25 @@ if (window.$chatwoot) {
})(document, "script");
}`
+const chatwootCloseCode = `
+if (window.$chatwoot) {
+ window.$chatwoot.toggle("close");
+ window.$chatwoot.toggleBubbleVisibility("hide");
+}
+`
+
export const executeChatwootBlock = (
{ typebot: { variables }, result }: SessionState,
block: ChatwootBlock,
lastBubbleBlockId?: string
): ExecuteIntegrationResponse => {
const isPreview = !result.id
- const chatwootCode = parseChatwootOpenCode(block.options)
+ const chatwootCode =
+ block.options.task === 'Close widget'
+ ? chatwootCloseCode
+ : isPreview
+ ? ''
+ : parseChatwootOpenCode(block.options)
return {
outgoingEdgeId: block.outgoingEdgeId,
clientSideActions: [
@@ -76,14 +88,15 @@ export const executeChatwootBlock = (
},
},
],
- logs: isPreview
- ? [
- {
- status: 'info',
- description: 'Chatwoot block is not supported in preview',
- details: null,
- },
- ]
- : undefined,
+ logs:
+ chatwootCode === ''
+ ? [
+ {
+ status: 'info',
+ description: 'Chatwoot block is not supported in preview',
+ details: null,
+ },
+ ]
+ : undefined,
}
}
diff --git a/packages/models/features/blocks/integrations/chatwoot.ts b/packages/models/features/blocks/integrations/chatwoot.ts
index d14008e0e..72fec765d 100644
--- a/packages/models/features/blocks/integrations/chatwoot.ts
+++ b/packages/models/features/blocks/integrations/chatwoot.ts
@@ -2,7 +2,10 @@ import { z } from 'zod'
import { blockBaseSchema } from '../baseSchemas'
import { IntegrationBlockType } from './enums'
+export const chatwootTasks = ['Show widget', 'Close widget'] as const
+
export const chatwootOptionsSchema = z.object({
+ task: z.enum(chatwootTasks).optional(),
baseUrl: z.string(),
websiteToken: z.string(),
user: z
@@ -24,6 +27,7 @@ export const chatwootBlockSchema = blockBaseSchema.and(
)
export const defaultChatwootOptions: ChatwootOptions = {
+ task: 'Show widget',
baseUrl: 'https://app.chatwoot.com',
websiteToken: '',
}