7fd89678b7
# Introduction Avoid having multiple `isDefined` definition across our pacakges Also avoid importing `isDefined` from `twenty-ui` which exposes a huge barrel for a such little util function ## In a nutshell Removed own `isDefined.ts` definition from `twenty-ui` `twenty-front` and `twenty-server` to move it to `twenty-shared`. Updated imports for each packages, and added explicit dependencies to `twenty-shared` if not already in place Related PR https://github.com/twentyhq/twenty/pull/9941
96 lines
3.0 KiB
TypeScript
96 lines
3.0 KiB
TypeScript
import { currentUserState } from '@/auth/states/currentUserState';
|
|
import { currentWorkspaceMemberState } from '@/auth/states/currentWorkspaceMemberState';
|
|
import { supportChatState } from '@/client-config/states/supportChatState';
|
|
import { useIsPrefetchLoading } from '@/prefetch/hooks/useIsPrefetchLoading';
|
|
import { isNonEmptyString } from '@sniptt/guards';
|
|
import { useCallback, useEffect, useState } from 'react';
|
|
import { useRecoilValue } from 'recoil';
|
|
import { isDefined } from 'twenty-shared';
|
|
import { User, WorkspaceMember } from '~/generated-metadata/graphql';
|
|
|
|
const insertScript = ({
|
|
src,
|
|
innerHTML,
|
|
onLoad,
|
|
}: {
|
|
src?: string;
|
|
innerHTML?: string;
|
|
onLoad?: (...args: any[]) => void;
|
|
}) => {
|
|
const script = document.createElement('script');
|
|
if (isNonEmptyString(src)) script.src = src;
|
|
if (isNonEmptyString(innerHTML)) script.innerHTML = innerHTML;
|
|
if (isDefined(onLoad)) script.onload = onLoad;
|
|
document.body.appendChild(script);
|
|
};
|
|
|
|
export const useSupportChat = () => {
|
|
const currentUser = useRecoilValue(currentUserState);
|
|
const currentWorkspaceMember = useRecoilValue(currentWorkspaceMemberState);
|
|
const supportChat = useRecoilValue(supportChatState);
|
|
const [isFrontChatLoaded, setIsFrontChatLoaded] = useState(false);
|
|
const loading = useIsPrefetchLoading();
|
|
|
|
const configureFront = useCallback(
|
|
(
|
|
chatId: string,
|
|
currentUser: Pick<User, 'email' | 'supportUserHash'>,
|
|
currentWorkspaceMember: Pick<WorkspaceMember, 'name'>,
|
|
) => {
|
|
const url = 'https://chat-assets.frontapp.com/v1/chat.bundle.js';
|
|
let script = document.querySelector(`script[src="${url}"]`);
|
|
|
|
// This function only gets called when front chat is not loaded
|
|
// If the script is already defined, but front chat is not loaded
|
|
// then there was an error loading the script; reload the script
|
|
if (isDefined(script)) {
|
|
script.parentNode?.removeChild(script);
|
|
script = null;
|
|
}
|
|
|
|
insertScript({
|
|
src: url,
|
|
onLoad: () => {
|
|
window.FrontChat?.('init', {
|
|
chatId,
|
|
useDefaultLauncher: false,
|
|
email: currentUser.email,
|
|
name:
|
|
currentWorkspaceMember.name.firstName +
|
|
' ' +
|
|
currentWorkspaceMember.name.lastName,
|
|
userHash: currentUser?.supportUserHash,
|
|
});
|
|
setIsFrontChatLoaded(true);
|
|
},
|
|
});
|
|
},
|
|
[],
|
|
);
|
|
|
|
useEffect(() => {
|
|
if (
|
|
supportChat?.supportDriver === 'front' &&
|
|
isNonEmptyString(supportChat.supportFrontChatId) &&
|
|
isNonEmptyString(currentUser?.email) &&
|
|
isDefined(currentWorkspaceMember) &&
|
|
!isFrontChatLoaded
|
|
) {
|
|
configureFront(
|
|
supportChat.supportFrontChatId,
|
|
currentUser,
|
|
currentWorkspaceMember,
|
|
);
|
|
}
|
|
}, [
|
|
configureFront,
|
|
currentUser,
|
|
isFrontChatLoaded,
|
|
supportChat?.supportDriver,
|
|
supportChat.supportFrontChatId,
|
|
currentWorkspaceMember,
|
|
]);
|
|
|
|
return { loading, isFrontChatLoaded };
|
|
};
|