2
0
Files
bot/apps/builder/components/editor/BoardMenuButton.tsx
Baptiste Arnaud 8a350eee6c refactor(editor): ♻️ Undo / Redo buttons + structure refacto
Yet another huge refacto... While implementing undo and redo features I understood that I updated the stored typebot too many times (i.e. on each key input) so I had to rethink it entirely. I also moved around some files.
2022-02-02 08:05:02 +01:00

52 lines
1.4 KiB
TypeScript

import {
IconButton,
Menu,
MenuButton,
MenuButtonProps,
MenuItem,
MenuList,
} from '@chakra-ui/react'
import { DownloadIcon, MoreVerticalIcon } from 'assets/icons'
import { useTypebot } from 'contexts/TypebotContext'
import React, { useState } from 'react'
import { parseDefaultPublicId } from 'services/typebots'
export const BoardMenuButton = (props: MenuButtonProps) => {
const { typebot } = useTypebot()
const [isDownloading, setIsDownloading] = useState(false)
const downloadFlow = () => {
if (!typebot) return
setIsDownloading(true)
const data =
'data:application/json;charset=utf-8,' +
encodeURIComponent(JSON.stringify(typebot))
const fileName = `typebot-export-${parseDefaultPublicId(
typebot.name,
typebot.id
)}.json`
const linkElement = document.createElement('a')
linkElement.setAttribute('href', data)
linkElement.setAttribute('download', fileName)
linkElement.click()
setIsDownloading(false)
}
return (
<Menu>
<MenuButton
as={IconButton}
variant="outline"
colorScheme="blue"
icon={<MoreVerticalIcon transform={'rotate(90deg)'} />}
isLoading={isDownloading}
{...props}
/>
<MenuList>
<MenuItem icon={<DownloadIcon />} onClick={downloadFlow}>
Export flow
</MenuItem>
</MenuList>
</Menu>
)
}