✨ Add back Make.com and implement help doc buttons

apps/builder/src/features/blocks/integrations/makeCom/components/MakeComContent.tsx

@@ -8,7 +8,7 @@ type Props = {
   block: MakeComBlock
 }
 
-export const MakeComNodeContent = ({ block }: Props) => {
+export const MakeComContent = ({ block }: Props) => {
   const { webhooks, typebot, updateWebhook } = useTypebot()
   const webhook = webhooks.find(byId(block.webhookId))
 
@@ -23,8 +23,7 @@ export const MakeComNodeContent = ({ block }: Props) => {
       } as Webhook
       updateWebhook(webhookId, newWebhook)
     }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [])
+  }, [block, typebot, updateWebhook, webhook])
 
   if (isNotDefined(webhook?.body))
     return <Text color="gray.500">Configure...</Text>

apps/builder/src/features/blocks/integrations/makeCom/components/MakeComSettings.tsx

@@ -0,0 +1,51 @@
+import {
+  Alert,
+  AlertIcon,
+  Button,
+  Input,
+  Link,
+  Stack,
+  Text,
+} from '@chakra-ui/react'
+import { ExternalLinkIcon } from '@/components/icons'
+import { useTypebot } from '@/features/editor'
+import { MakeComBlock } from 'models'
+import React from 'react'
+import { byId } from 'utils'
+
+type Props = {
+  block: MakeComBlock
+}
+
+export const MakeComSettings = ({ block }: Props) => {
+  const { webhooks } = useTypebot()
+  const webhook = webhooks.find(byId(block.webhookId))
+
+  return (
+    <Stack spacing={4}>
+      <Alert
+        status={webhook?.url ? 'success' : 'info'}
+        bgColor={webhook?.url ? undefined : 'blue.50'}
+        rounded="md"
+      >
+        <AlertIcon />
+        {webhook?.url ? (
+          <>Your scenario is correctly configured 🚀</>
+        ) : (
+          <Stack>
+            <Text>Head up to Make.com to configure this block:</Text>
+            <Button
+              as={Link}
+              href="https://www.make.com/en/integrations/typebot"
+              isExternal
+              colorScheme="blue"
+            >
+              <Text mr="2">Make.com</Text> <ExternalLinkIcon />
+            </Button>
+          </Stack>
+        )}
+      </Alert>
+      {webhook?.url && <Input value={webhook?.url} isDisabled />}
+    </Stack>
+  )
+}

apps/builder/src/features/blocks/integrations/makeCom/components/index.ts

@@ -0,0 +1,3 @@
+export * from './MakeComLogo'
+export * from './MakeComContent'
+export * from './MakeComSettings'