From 67cb4b4878ed80e60a88d6a260a1b4b79016de55 Mon Sep 17 00:00:00 2001 From: Baptiste Arnaud Date: Tue, 14 Mar 2023 19:22:29 +0100 Subject: [PATCH] :bug: (lp) Fix real time airtable bot MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Deleted it a long time ago without noticing 😂 --- .../components/Homepage/RealTimeResults.tsx | 23 +- .../public/typebots/realtime-airtable.json | 329 ++++++++++++++++++ 2 files changed, 349 insertions(+), 3 deletions(-) create mode 100644 apps/landing-page/public/typebots/realtime-airtable.json diff --git a/apps/landing-page/components/Homepage/RealTimeResults.tsx b/apps/landing-page/components/Homepage/RealTimeResults.tsx index 50f841637b..dc209ed3a6 100644 --- a/apps/landing-page/components/Homepage/RealTimeResults.tsx +++ b/apps/landing-page/components/Homepage/RealTimeResults.tsx @@ -1,6 +1,7 @@ import { Flex, Stack, Heading, Text, Button, VStack } from '@chakra-ui/react' import { Standard } from '@typebot.io/react' import { ArrowRight } from 'assets/icons/ArrowRight' +import { HandDrawnArrow } from 'assets/illustrations/HandDrawnArrow' import { PublicTypebot, Typebot } from 'models' import Link from 'next/link' import React, { useEffect, useRef, useState } from 'react' @@ -32,9 +33,8 @@ export const RealTimeResults = () => { } const handleAnswer = ({ blockId }: { blockId: string }) => { - if ([nameBlockId, messageBlockId].includes(blockId)) { - refreshIframeContent() - } + if ([nameBlockId, messageBlockId].includes(blockId)) + setTimeout(refreshIframeContent, 1000) } return ( @@ -110,6 +110,23 @@ export const RealTimeResults = () => { backgroundColor: 'white', }} /> + + + It's a real Airtable view! + + + diff --git a/apps/landing-page/public/typebots/realtime-airtable.json b/apps/landing-page/public/typebots/realtime-airtable.json new file mode 100644 index 0000000000..1204b4e87d --- /dev/null +++ b/apps/landing-page/public/typebots/realtime-airtable.json @@ -0,0 +1,329 @@ +{ + "id": "cl0saxjo1000009l7c4brqlo4", + "createdAt": "2022-03-15T15:41:00.241Z", + "updatedAt": "2022-03-15T17:32:29.840Z", + "name": "My typebot", + "publishedTypebotId": "pioizXgk6U9Xtz1BdyjPFy", + "folderId": null, + "groups": [ + { + "id": "dpg9fjkvZs2zhNDrXavZw2", + "blocks": [ + { + "id": "4Ez8hEpERMo48FQcH4ny8F", + "type": "start", + "label": "Start", + "groupId": "dpg9fjkvZs2zhNDrXavZw2", + "outgoingEdgeId": "hRuNVikDAguMkxd6sRgQ7b" + } + ], + "title": "Start", + "graphCoordinates": { "x": 0, "y": 0 } + }, + { + "id": "nrFcoNFtGcGJNifcjiEFya", + "blocks": [ + { + "id": "sjigBF5rKat4BForNiMfPwb", + "type": "text", + "groupId": "nrFcoNFtGcGJNifcjiEFya", + "content": { + "html": "
As you answer this chat, you'll see your result in the real Airtable spreadsheet
", + "richText": [ + { + "type": "p", + "children": [ + { + "text": "As you answer this chat, you'll see your result in the real Airtable spreadsheet" + } + ] + } + ], + "plainText": "As you answer this chat, you'll see your result in the real Airtable spreadsheet" + } + }, + { + "id": "sb8bz4NhtWF7zRLrfvDnXNY", + "type": "text", + "groupId": "nrFcoNFtGcGJNifcjiEFya", + "content": { + "html": "
You can think of it as a guestbook 😂
", + "richText": [ + { + "type": "p", + "children": [ + { "text": "You can think of it as a guestbook 😂" } + ] + } + ], + "plainText": "You can think of it as a guestbook 😂" + } + }, + { + "id": "scF3dKaGTm68y9rHSKVJVtr", + "type": "text", + "groupId": "nrFcoNFtGcGJNifcjiEFya", + "content": { + "html": "
Ready?
", + "richText": [{ "type": "p", "children": [{ "text": "Ready?" }] }], + "plainText": "Ready?" + } + }, + { + "id": "su4yR8LMVu311nKJsSj3u6q", + "type": "choice input", + "items": [ + { + "id": "ewb7uVGHNHEKmgbKoLiZA6", + "type": 0, + "blockId": "su4yR8LMVu311nKJsSj3u6q", + "content": "Yeah!" + } + ], + "groupId": "nrFcoNFtGcGJNifcjiEFya", + "options": { "buttonLabel": "Send", "isMultipleChoice": false }, + "outgoingEdgeId": "5CjxPmqfthouJL71zCWW5X" + } + ], + "title": "Block #1", + "graphCoordinates": { "x": 1, "y": 165 } + }, + { + "id": "9mz6QbFyQB1uMggt9YbweU", + "blocks": [ + { + "id": "spuZqdVh1q7kHWb9gghki7q", + "type": "text", + "groupId": "9mz6QbFyQB1uMggt9YbweU", + "content": { + "html": "
If you have anything to say...
", + "richText": [ + { + "type": "p", + "children": [{ "text": "If you have anything to say..." }] + } + ], + "plainText": "If you have anything to say..." + } + }, + { + "id": "sqvXpT1YXE3Htp6BCPvVGv3", + "type": "text input", + "groupId": "9mz6QbFyQB1uMggt9YbweU", + "options": { + "isLong": true, + "labels": { + "button": "Send", + "placeholder": "Type your answer..." + }, + "variableId": "v6NeJkZ8fSEjMVUA9D51u5k" + } + }, + { + "id": "sti9ca1hQgmQLUgghCLqDrx", + "type": "Webhook", + "groupId": "9mz6QbFyQB1uMggt9YbweU", + "options": { + "isCustomBody": true, + "isAdvancedConfig": true, + "variablesForTest": [ + { + "id": "6zpYk7SNpknQQ3pMq3VdaJ", + "variableId": "v6NeJkZ8fSEjMVUA9D51u5k", + "value": "Hello les amis" + }, + { + "id": "2RArRZu1683GvM9cYedJm6", + "variableId": "mkMg6BRLLJM69LcSo4DFLc", + "value": "recy234r8oNCFTxm7" + } + ], + "responseVariableMapping": [] + }, + "webhookId": "cl0se2gnu00002e69s26z118c" + }, + { + "id": "s5sGoeApf3QASX1bbPMve5q", + "groupId": "9mz6QbFyQB1uMggt9YbweU", + "type": "Code", + "options": { + "name": "Code snippet", + "content": "postMessage({from: \"typebot\"}, \"*\")" + }, + "outgoingEdgeId": "tiFY1tFr1u5CjGrbziEtc9" + } + ], + "title": "Block #3", + "graphCoordinates": { "x": 660, "y": 159 } + }, + { + "id": "dypuPQjb1q55tQavVzZv4e", + "blocks": [ + { + "id": "shRqQncqJb6xsKxXV9SEQsF", + "type": "image", + "groupId": "dypuPQjb1q55tQavVzZv4e", + "content": { + "url": "https://media1.giphy.com/media/l0K42u9hCg0x6XbLa/giphy.gif?cid=fe3852a3rvjsmcutyv6whx7s390gvj80b3e2rftqav11gnve&rid=giphy.gif&ct=g" + } + }, + { + "id": "s4mTU7p3Q32L2Zv6C713NAU", + "type": "text", + "groupId": "dypuPQjb1q55tQavVzZv4e", + "content": { + "html": "
Cheers!
", + "richText": [{ "type": "p", "children": [{ "text": "Cheers!" }] }], + "plainText": "Cheers!" + } + } + ], + "title": "Block #4", + "graphCoordinates": { "x": 985, "y": 149 } + }, + { + "id": "m299Kw31LhXpxZLNNb7WT5", + "blocks": [ + { + "id": "smR7LG3mAEdkxh79aBiwbkp", + "type": "text", + "groupId": "m299Kw31LhXpxZLNNb7WT5", + "content": { + "html": "
What's your name?
", + "richText": [ + { "type": "p", "children": [{ "text": "What's your name?" }] } + ], + "plainText": "What's your name?" + } + }, + { + "id": "shuUtMDMw9P4iAHbz7B5SqJ", + "type": "text input", + "groupId": "m299Kw31LhXpxZLNNb7WT5", + "options": { + "isLong": false, + "labels": { "button": "Send", "placeholder": "Type your name..." }, + "variableId": "fTRLkn4FVe83Ev9snHosfL" + } + }, + { + "id": "siZ9BsYqTZ1BCF42kLNY33G", + "type": "Webhook", + "groupId": "m299Kw31LhXpxZLNNb7WT5", + "options": { + "isCustomBody": true, + "isAdvancedConfig": true, + "variablesForTest": [ + { + "id": "39P65YyjMhqwCWz55R5rCK", + "value": "Name", + "variableId": "fTRLkn4FVe83Ev9snHosfL" + }, + { + "id": "fb5AXuzd65UqbnmrcfZj9i", + "value": "2022-03-15T16:31:44.973Z", + "variableId": "s65Gqu75c9mq9nbjN84D1S" + } + ], + "responseVariableMapping": [ + { + "id": "dpAEp1bhXyGAAJBYkt6sAK", + "bodyPath": "data.records[0].id", + "variableId": "mkMg6BRLLJM69LcSo4DFLc" + } + ] + }, + "webhookId": "cl0sco2i000002e69chfunoi0" + }, + { + "id": "ssHNtWrqhDcJNUDqd3oLj6r", + "groupId": "m299Kw31LhXpxZLNNb7WT5", + "type": "Code", + "options": { + "name": "Code snippet", + "content": "postMessage({from: \"typebot\"}, \"*\")" + }, + "outgoingEdgeId": "oHDLXGgNtGU4n4Br6QDnyB" + } + ], + "title": "Block #5", + "graphCoordinates": { "x": 335, "y": 158 } + } + ], + "variables": [ + { "id": "fTRLkn4FVe83Ev9snHosfL", "name": "Name" }, + { "id": "hVKa5kBxCrKHr2zSwa27k1", "name": "Email" }, + { "id": "v6NeJkZ8fSEjMVUA9D51u5k", "name": "Message" }, + { "id": "p9MgewxfYHHARsp13uvc9d", "name": "Chat ID" }, + { "id": "s65Gqu75c9mq9nbjN84D1S", "name": "Date" }, + { "id": "mkMg6BRLLJM69LcSo4DFLc", "name": "Airtable ID" } + ], + "edges": [ + { + "id": "hRuNVikDAguMkxd6sRgQ7b", + "to": { "groupId": "nrFcoNFtGcGJNifcjiEFya" }, + "from": { + "blockId": "4Ez8hEpERMo48FQcH4ny8F", + "groupId": "dpg9fjkvZs2zhNDrXavZw2" + } + }, + { + "id": "5CjxPmqfthouJL71zCWW5X", + "to": { "groupId": "m299Kw31LhXpxZLNNb7WT5" }, + "from": { + "blockId": "su4yR8LMVu311nKJsSj3u6q", + "groupId": "nrFcoNFtGcGJNifcjiEFya" + } + }, + { + "from": { + "groupId": "m299Kw31LhXpxZLNNb7WT5", + "blockId": "ssHNtWrqhDcJNUDqd3oLj6r" + }, + "to": { "groupId": "9mz6QbFyQB1uMggt9YbweU" }, + "id": "oHDLXGgNtGU4n4Br6QDnyB" + }, + { + "from": { + "groupId": "9mz6QbFyQB1uMggt9YbweU", + "blockId": "s5sGoeApf3QASX1bbPMve5q" + }, + "to": { "groupId": "dypuPQjb1q55tQavVzZv4e" }, + "id": "tiFY1tFr1u5CjGrbziEtc9" + } + ], + "theme": { + "chat": { + "inputs": { + "color": "#ffffff", + "backgroundColor": "#1e293b", + "placeholderColor": "#9095A0" + }, + "buttons": { "color": "#ffffff", "backgroundColor": "#1a5fff" }, + "hostBubbles": { "color": "#ffffff", "backgroundColor": "#1e293b" }, + "guestBubbles": { "color": "#FFFFFF", "backgroundColor": "#FF8E21" }, + "hostAvatar": { + "isEnabled": true, + "url": "https://s3.eu-west-3.amazonaws.com/typebot/public/typebots/cl0saxjo1000009l7c4brqlo4/me-square.png" + } + }, + "general": { + "font": "Open Sans", + "background": { "type": "Color", "content": "#171923" } + }, + "customCss": ".typebot-button {box-shadow: inset 0 1px 0 0 rgb(255 255 255/0.2)}" + }, + "settings": { + "general": { + "isBrandingEnabled": false, + "isInputPrefillEnabled": true, + "isNewResultOnRefreshEnabled": false + }, + "metadata": { + "description": "Build beautiful conversational forms and embed them directly in your applications without a line of code. Triple your response rate and collect answers that has more value compared to a traditional form." + }, + "typingEmulation": { "speed": 300, "enabled": true, "maxDelay": 1.5 } + }, + "publicId": "my-typebot-4brqlo4", + "customDomain": null +}