44 lines
1.4 KiB
TypeScript
44 lines
1.4 KiB
TypeScript
import { useTypebot } from '@/features/editor/providers/TypebotProvider'
|
|
import { useUser } from '@/features/account/hooks/useUser'
|
|
import { useWorkspace } from '@/features/workspace/WorkspaceProvider'
|
|
import React, { useEffect, useState } from 'react'
|
|
import { Bubble, BubbleProps } from '@typebot.io/nextjs'
|
|
import { planToReadable } from '@/features/billing/helpers/planToReadable'
|
|
import { Plan } from '@typebot.io/prisma'
|
|
|
|
export const SupportBubble = (props: Omit<BubbleProps, 'typebot'>) => {
|
|
const { typebot } = useTypebot()
|
|
const { user } = useUser()
|
|
const { workspace } = useWorkspace()
|
|
|
|
const [lastViewedTypebotId, setLastViewedTypebotId] = useState(typebot?.id)
|
|
|
|
useEffect(() => {
|
|
if (!typebot?.id) return
|
|
if (lastViewedTypebotId === typebot?.id) return
|
|
setLastViewedTypebotId(typebot?.id)
|
|
}, [lastViewedTypebotId, typebot?.id])
|
|
|
|
if (!workspace?.plan || workspace.plan === Plan.FREE) return null
|
|
|
|
return (
|
|
<Bubble
|
|
typebot="typebot-support"
|
|
prefilledVariables={{
|
|
'User ID': user?.id,
|
|
'First name': user?.name?.split(' ')[0] ?? undefined,
|
|
Email: user?.email ?? undefined,
|
|
'Typebot ID': lastViewedTypebotId,
|
|
'Avatar URL': user?.image ?? undefined,
|
|
Plan: planToReadable(workspace?.plan),
|
|
}}
|
|
theme={{
|
|
chatWindow: {
|
|
backgroundColor: '#fff',
|
|
},
|
|
}}
|
|
{...props}
|
|
/>
|
|
)
|
|
}
|