feat(ChatlioWidget): Add user info to chatlio widget (#305)

checkmarble · Dec 13, 2023 · 824566d · 824566d
1 parent de61672
commit 824566d
Show file tree

Hide file tree

Showing 4 changed files with 25 additions and 3 deletions.
diff --git a/packages/app-builder/src/models/organization.ts b/packages/app-builder/src/models/organization.ts
@@ -3,7 +3,7 @@ import { type OrganizationDto } from 'marble-api';
 export interface Organization {
   name: string;
   databaseName: string;
-  exportScheduledExecutionS3: string | undefined;
+  exportScheduledExecutionS3?: string;
 }
 
 export const adaptOrganizationDto = (

diff --git a/packages/app-builder/src/routes/__builder.tsx b/packages/app-builder/src/routes/__builder.tsx
@@ -195,7 +195,7 @@ export default function Builder() {
                     <Sidebar.Link {...linkProps} />
                   </li>
                 ))}
-                <ChatlioWidget />
+                <ChatlioWidget user={user} organization={organization} />
               </Sidebar.Nav>
             </header>
 

diff --git a/packages/app-builder/src/services/chatlio/ChatlioWidget.tsx b/packages/app-builder/src/services/chatlio/ChatlioWidget.tsx
@@ -1,8 +1,18 @@
 import { sidebarLink } from '@app-builder/components';
+import { type CurrentUser } from '@app-builder/models';
+import { type Organization } from '@app-builder/models/organization';
 import { useTranslation } from 'react-i18next';
 import { Helpcenter } from 'ui-icons';
 
-export function ChatlioWidget() {
+import { getFullName } from '../user';
+
+export function ChatlioWidget({
+  user,
+  organization,
+}: {
+  user: CurrentUser;
+  organization: Organization;
+}) {
   const { t } = useTranslation(['navigation']);
   return (
     <>
@@ -12,6 +22,14 @@ export function ChatlioWidget() {
           window._chatlio?.configure?.({
             collapsedMode: 'hidden',
           });
+          window._chatlio?.identify?.(
+            user.actorIdentity.userId ?? `OrgID:${user.organizationId}`,
+            {
+              name: getFullName(user.actorIdentity),
+              email: user.actorIdentity.email,
+              organization: organization.name,
+            },
+          );
           window._chatlio?.showOrHide?.();
         }}
         data-chatlio-widget-button

diff --git a/packages/app-builder/types/global.d.ts b/packages/app-builder/types/global.d.ts
@@ -13,6 +13,10 @@ declare global {
     _chatlio?: {
       showOrHide?: () => void;
       configure?: (config: { [key: string]: unknown }) => void;
+      identify?: (
+        id: string,
+        customData: Record<string, string | undefined>,
+      ) => void;
     };
   }
 }