import { GetServerSidePropsContext } from "next"; import { useRouter } from "next/router"; import { useState } from "react"; import { HelpScout, useChat } from "react-live-chat-loader"; import { getLayout } from "@calcom/features/settings/layouts/SettingsLayout"; import { classNames } from "@calcom/lib"; import { WEBAPP_URL } from "@calcom/lib/constants"; import { useLocale } from "@calcom/lib/hooks/useLocale"; import { trpc } from "@calcom/trpc/react"; import { Button, Icon, Meta } from "@calcom/ui"; import { ssrInit } from "@server/lib/ssr"; interface CtaRowProps { title: string; description: string; children: React.ReactNode; className?: string; } const CtaRow = ({ title, description, className, children }: CtaRowProps) => { return ( <>

{title}

{description}

{children}

); }; const BillingView = () => { const { t } = useLocale(); const { data: user } = trpc.viewer.me.useQuery(); const [, loadChat] = useChat(); const [showChat, setShowChat] = useState(false); const router = useRouter(); const returnTo = router.asPath; const billingHref = `/api/integrations/stripepayment/portal?returnTo=${WEBAPP_URL}${returnTo}`; const onContactSupportClick = () => { setShowChat(true); loadChat({ open: true }); }; return ( <>
{showChat && }
); }; BillingView.getLayout = getLayout; export const getServerSideProps = async (context: GetServerSidePropsContext) => { const ssr = await ssrInit(context); return { props: { trpcState: ssr.dehydrate(), }, }; }; export default BillingView;