NullTranslationWebsite/src/components/KofiWidget.tsx

31 lines
981 B
TypeScript

"use client"
import { useEffect } from 'react';
const KofiWidget = () => {
useEffect(() => {
// Dynamically create and append the script
const script = document.createElement('script');
script.src = 'https://storage.ko-fi.com/cdn/scripts/overlay-widget.js';
script.async = true;
script.onload = () => {
if (typeof window !== 'undefined' && window.kofiWidgetOverlay) {
window.kofiWidgetOverlay.draw('nulltranslationgroup', {
'type': 'floating-chat',
'floating-chat.donateButton.text': 'Support me',
'floating-chat.donateButton.background-color': '#00b9fe',
'floating-chat.donateButton.text-color': '#fff',
});
}
};
document.body.appendChild(script);
return () => {
// Clean up the script when the component unmounts
document.body.removeChild(script);
};
}, []);
return null; // No visible JSX; the widget is a floating overlay
};
export default KofiWidget;