'use client'; declare global { interface Window { // eslint-disable-next-line @typescript-eslint/no-explicit-any chatbase: any; } } import { FC, useCallback, useEffect, useState } from 'react'; import Script from 'next/script'; import { useVariables } from '@gitroom/react/helpers/variable.context'; import { useFetch } from '@gitroom/helpers/utils/custom.fetch'; import { deleteDialog } from '@gitroom/react/helpers/delete.dialog'; import useSWR from 'swr'; export const ChatbaseComponent: FC = () => { const { isChatBase } = useVariables(); if (!isChatBase) { return null; } return ; }; export const ChatbaseComponentLoad: FC = () => { const fetch = useFetch(); const { data } = useSWR( 'chatbase-token', async () => { const { token } = await (await fetch('/user/chatbase-token')).json(); return token; }, { revalidateOnFocus: false, revalidateOnReconnect: false, revalidateIfStale: false, refreshWhenHidden: false, refreshWhenOffline: false, refreshInterval: 0, } ); if (!data) { return null; } return ; }; const ChatBaseCode: FC<{ token: string }> = ({ token }) => { const fetch = useFetch(); useEffect(() => { if (!window.chatbase || window.chatbase('getState') !== 'initialized') { // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore window.chatbase = (...arg) => { if (!window.chatbase.q) { window.chatbase.q = []; } window.chatbase.q.push(arg); }; window.chatbase = new Proxy(window.chatbase, { get(target, prop) { if (prop === 'q') { return target.q; } // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore return (...args) => target(prop, ...args); }, }); } const onLoad = function () { const script = document.createElement('script'); script.src = 'https://www.chatbase.co/embed.min.js'; script.id = '1zVZuOz0vgFE_NLumfPPj'; // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore script.domain = 'www.chatbase.co'; document.body.appendChild(script); }; if (document.readyState === 'complete') { onLoad(); } else { window.addEventListener('load', onLoad); } window.chatbase('identify', { token }); window.chatbase('registerTools', { stripe_refund: async () => { try { const previewResponse = await fetch('/billing/chatbase-refund/preview'); if (!previewResponse.ok) { return { status: 'error', error: 'Could not process the refund request', }; } const preview = await previewResponse.json(); if (!preview.eligible) { return { status: 'success', data: { refunded: false, reason: preview.reason }, }; } const approved = await deleteDialog( `You are cancelling your ${ preview.tier || '' } subscription and will receive a refund of ${preview.amount} ${( preview.currency || '' ).toUpperCase()}. Do you approve?`, 'Yes, cancel and refund', 'Cancel subscription' ); if (!approved) { return { status: 'success', data: { refunded: false, reason: 'The user declined the refund confirmation', }, }; } const response = await fetch('/billing/chatbase-refund', { method: 'POST', }); if (!response.ok) { return { status: 'error', error: 'Could not process the refund request', }; } return { status: 'success', data: await response.json(), }; } catch (err) { return { status: 'error', error: 'Could not process the refund request', }; } }, }); }, []); return null; };