init

worklenz-frontend/src/components/TawkTo.tsx

@@ -0,0 +1,50 @@
+import { useEffect } from 'react';
+
+// Add TypeScript declarations for Tawk_API
+declare global {
+  interface Window {
+    Tawk_API?: any;
+    Tawk_LoadStart?: Date;
+  }
+}
+
+interface TawkToProps {
+  propertyId: string;
+  widgetId: string;
+}
+
+const TawkTo: React.FC<TawkToProps> = ({ propertyId, widgetId }) => {
+  useEffect(() => {
+    // Initialize tawk.to chat
+    const s1 = document.createElement('script');
+    s1.async = true;
+    s1.src = `https://embed.tawk.to/${propertyId}/${widgetId}`;
+    s1.setAttribute('crossorigin', '*');
+    
+    const s0 = document.getElementsByTagName('script')[0];
+    s0.parentNode?.insertBefore(s1, s0);
+
+    return () => {
+      // Clean up when the component unmounts
+      // Remove the script tag
+      const tawkScript = document.querySelector(`script[src*="tawk.to/${propertyId}"]`);
+      if (tawkScript && tawkScript.parentNode) {
+        tawkScript.parentNode.removeChild(tawkScript);
+      }
+      
+      // Remove the tawk.to iframe
+      const tawkIframe = document.getElementById('tawk-iframe');
+      if (tawkIframe) {
+        tawkIframe.remove();
+      }
+      
+      // Reset Tawk globals
+      delete window.Tawk_API;
+      delete window.Tawk_LoadStart;
+    };
+  }, [propertyId, widgetId]);
+
+  return null;
+};
+
+export default TawkTo;