55 lines
1.6 KiB
TypeScript
55 lines
1.6 KiB
TypeScript
import { Flex, Heading, Stack, Wrap } from '@chakra-ui/react'
|
|
import { useTypebot } from 'contexts/TypebotContext/TypebotContext'
|
|
import React from 'react'
|
|
import { parseDefaultPublicId } from 'services/typebots'
|
|
import { isDefined } from 'utils'
|
|
import { EditableUrl } from './EditableUrl'
|
|
import { integrationsList } from './integrations/EmbedButton'
|
|
|
|
export const ShareContent = () => {
|
|
const { typebot, updateTypebot } = useTypebot()
|
|
|
|
const handlePublicIdChange = (publicId: string) => {
|
|
if (publicId === typebot?.publicId) return
|
|
updateTypebot({ publicId })
|
|
}
|
|
|
|
const publicId = typebot
|
|
? typebot?.publicId ?? parseDefaultPublicId(typebot.name, typebot.id)
|
|
: ''
|
|
const isPublished = isDefined(typebot?.publishedTypebotId)
|
|
|
|
return (
|
|
<Flex h="full" w="full" justifyContent="center" align="flex-start">
|
|
<Stack maxW="1000px" w="full" pt="10" spacing={10}>
|
|
<Stack spacing={4}>
|
|
<Heading fontSize="2xl" as="h1">
|
|
Your typebot link
|
|
</Heading>
|
|
{typebot && (
|
|
<EditableUrl
|
|
publicId={publicId}
|
|
onPublicIdChange={handlePublicIdChange}
|
|
/>
|
|
)}
|
|
</Stack>
|
|
|
|
<Stack spacing={4}>
|
|
<Heading fontSize="2xl" as="h1">
|
|
Embed your typebot
|
|
</Heading>
|
|
<Wrap spacing={7}>
|
|
{integrationsList.map((IntegrationButton, idx) => (
|
|
<IntegrationButton
|
|
key={idx}
|
|
publicId={publicId}
|
|
isPublished={isPublished}
|
|
/>
|
|
))}
|
|
</Wrap>
|
|
</Stack>
|
|
</Stack>
|
|
</Flex>
|
|
)
|
|
}
|