1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-09-05 17:53:12 +02:00

feat: lazy load kapa

This commit is contained in:
FredrikOseberg 2025-08-11 14:16:53 +02:00
parent ab74031daf
commit 2d9f5748f3
No known key found for this signature in database
GPG Key ID: 282FD8A6D8F9BCF0
2 changed files with 91 additions and 21 deletions

View File

@ -903,27 +903,7 @@ class="header-github-link"
'@docusaurus/theme-mermaid',
],
scripts: [
{
src: 'https://widget.kapa.ai/kapa-widget.bundle.js', // See configuration: https://docs.kapa.ai/integrations/website-widget/configuration
'data-website-id': '1d187510-1726-4011-b0f7-62742ae064ee',
'data-project-name': 'Unleash',
'data-project-color': '#1A4049',
'data-project-logo':
'https://cdn.getunleash.io/uploads/2024/05/logo-unleash-white.svg',
'data-modal-image':
'https://cdn.getunleash.io/uploads/2022/05/logo.png',
'data-button-position-right': '0',
'data-button-border-radius': '10px 0px 0px 10px',
'data-button-width': '80px',
'data-button-height': '100px',
'data-button-image-height': '55px',
'data-button-image-width': '55px',
'data-button-text-font-weight': '400',
'data-button-text-font-size': '16px',
'data-button-text-font-family': '"Sen", sans-serif',
'data-button-text': 'ASK AI',
defer: true,
},
// Kapa AI widget is now lazy-loaded via src/theme/Root.tsx
],
clientModules: ['./global.js'],
};

View File

@ -0,0 +1,90 @@
import React, { useEffect } from 'react';
import ExecutionEnvironment from '@docusaurus/ExecutionEnvironment';
export default function Root({ children }: { children: React.ReactNode }) {
useEffect(() => {
if (!ExecutionEnvironment.canUseDOM) {
return;
}
const loadKapaWidget = () => {
if (
document.querySelector('script[src*="kapa-widget.bundle.js"]')
) {
return;
}
const script = document.createElement('script');
script.src = 'https://widget.kapa.ai/kapa-widget.bundle.js';
script.async = true;
script.defer = true;
script.setAttribute(
'data-website-id',
'1d187510-1726-4011-b0f7-62742ae064ee',
);
script.setAttribute('data-project-name', 'Unleash');
script.setAttribute('data-project-color', '#1A4049');
script.setAttribute(
'data-project-logo',
'https://cdn.getunleash.io/uploads/2024/05/logo-unleash-white.svg',
);
script.setAttribute(
'data-modal-image',
'https://cdn.getunleash.io/uploads/2022/05/logo.png',
);
script.setAttribute('data-button-position-right', '0');
script.setAttribute(
'data-button-border-radius',
'10px 0px 0px 10px',
);
script.setAttribute('data-button-width', '80px');
script.setAttribute('data-button-height', '100px');
script.setAttribute('data-button-image-height', '55px');
script.setAttribute('data-button-image-width', '55px');
script.setAttribute('data-button-text-font-weight', '400');
script.setAttribute('data-button-text-font-size', '16px');
script.setAttribute(
'data-button-text-font-family',
'"Sen", sans-serif',
);
script.setAttribute('data-button-text', 'ASK AI');
document.head.appendChild(script);
};
const timeoutId = setTimeout(loadKapaWidget, 3000);
const handleUserInteraction = () => {
loadKapaWidget();
window.removeEventListener('scroll', handleUserInteraction);
window.removeEventListener('click', handleUserInteraction);
window.removeEventListener('touchstart', handleUserInteraction);
window.removeEventListener('mousemove', handleUserInteraction);
};
window.addEventListener('scroll', handleUserInteraction, {
once: true,
passive: true,
});
window.addEventListener('click', handleUserInteraction, { once: true });
window.addEventListener('touchstart', handleUserInteraction, {
once: true,
passive: true,
});
window.addEventListener('mousemove', handleUserInteraction, {
once: true,
passive: true,
});
return () => {
clearTimeout(timeoutId);
window.removeEventListener('scroll', handleUserInteraction);
window.removeEventListener('click', handleUserInteraction);
window.removeEventListener('touchstart', handleUserInteraction);
window.removeEventListener('mousemove', handleUserInteraction);
};
}, []);
return <>{children}</>;
}