76 lines
1.8 KiB
TypeScript
76 lines
1.8 KiB
TypeScript
import {
|
|
Button,
|
|
HStack,
|
|
IconButton,
|
|
Stack,
|
|
Tooltip,
|
|
Text,
|
|
Menu,
|
|
MenuButton,
|
|
MenuList,
|
|
MenuItem,
|
|
} from '@chakra-ui/react'
|
|
import { ChevronLeftIcon } from 'assets/icons'
|
|
import { useTypebot } from 'contexts/TypebotContext/TypebotContext'
|
|
import { timeSince } from 'services/utils'
|
|
import { isNotDefined } from 'utils'
|
|
|
|
export const PublishButton = () => {
|
|
const {
|
|
isPublishing,
|
|
isPublished,
|
|
publishTypebot,
|
|
publishedTypebot,
|
|
restorePublishedTypebot,
|
|
} = useTypebot()
|
|
|
|
return (
|
|
<HStack spacing="1px">
|
|
<Tooltip
|
|
borderRadius="md"
|
|
hasArrow
|
|
placement="bottom-end"
|
|
label={
|
|
<Stack>
|
|
<Text>There are non published changes.</Text>
|
|
<Text fontStyle="italic">
|
|
Published version from{' '}
|
|
{publishedTypebot &&
|
|
timeSince(publishedTypebot.updatedAt.toString())}{' '}
|
|
ago
|
|
</Text>
|
|
</Stack>
|
|
}
|
|
isDisabled={isNotDefined(publishedTypebot)}
|
|
>
|
|
<Button
|
|
colorScheme="blue"
|
|
isLoading={isPublishing}
|
|
isDisabled={isPublished}
|
|
onClick={publishTypebot}
|
|
borderRightRadius={publishedTypebot && !isPublished ? 0 : undefined}
|
|
>
|
|
{isPublished ? 'Published' : 'Publish'}
|
|
</Button>
|
|
</Tooltip>
|
|
|
|
{publishedTypebot && !isPublished && (
|
|
<Menu>
|
|
<MenuButton
|
|
as={IconButton}
|
|
colorScheme="blue"
|
|
borderLeftRadius={0}
|
|
icon={<ChevronLeftIcon transform="rotate(-90deg)" />}
|
|
aria-label="Show published version"
|
|
/>
|
|
<MenuList>
|
|
<MenuItem onClick={restorePublishedTypebot}>
|
|
Restore published version
|
|
</MenuItem>
|
|
</MenuList>
|
|
</Menu>
|
|
)}
|
|
</HStack>
|
|
)
|
|
}
|