Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
98 changes: 29 additions & 69 deletions src/components/SocialShareButton.jsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import React, { useRef, useEffect, useState } from 'react';
import { FiShare2 } from 'react-icons/fi';
import React, { useRef, useEffect } from 'react';

const DEFAULT_HASHTAGS = [];
const DEFAULT_PLATFORMS = ['whatsapp', 'facebook', 'twitter', 'linkedin', 'telegram', 'reddit', 'pinterest'];
Expand All @@ -16,7 +15,6 @@ const SocialShareButton = ({
buttonText = 'Share',
customClass = '',
onShare = null,
onCopy = null,
buttonStyle = 'default',
modalPosition = 'center',
buttonColor = '',
Expand All @@ -30,41 +28,35 @@ const SocialShareButton = ({
}) => {
const containerRef = useRef(null);
const shareButtonRef = useRef(null);
const [loadError, setLoadError] = useState(false);

useEffect(() => {
if (typeof window !== 'undefined') {
if (window.SocialShareButton) {
setLoadError(false);
shareButtonRef.current = new window.SocialShareButton({
container: containerRef.current,
url: url || 'https://orgexplorer.aossie.org/',
title: title || document.title,
description,
hashtags,
via,
platforms,
theme,
buttonText,
customClass,
onShare,
onCopy,
buttonStyle,
modalPosition,
buttonColor,
buttonHoverColor,
showButton,
analytics,
onAnalytics,
analyticsPlugins,
componentId,
debug,
});
} else {
setLoadError(true);
}
if (typeof window !== 'undefined' && window.SocialShareButton) {
shareButtonRef.current = new window.SocialShareButton({
container: containerRef.current,
url: url || 'https://orgexplorer.aossie.org/',
title: title || document.title,
description,
hashtags,
via,
platforms,
theme,
buttonText,
customClass,
onShare,
buttonStyle,
modalPosition,
buttonColor,
buttonHoverColor,
showButton,
analytics,
onAnalytics,
analyticsPlugins,
componentId,
debug,
});
} else {
console.warn('SocialShareButton widget not loaded');
}
Comment thread
amankv1234 marked this conversation as resolved.

return () => {
if (shareButtonRef.current) {
shareButtonRef.current.destroy();
Expand All @@ -73,43 +65,11 @@ const SocialShareButton = ({
};
}, [
url, title, description, hashtags, via, platforms, theme, buttonText,
customClass, onShare, onCopy, buttonStyle, modalPosition, buttonColor,
customClass, onShare, buttonStyle, modalPosition, buttonColor,
buttonHoverColor, showButton, analytics, onAnalytics, analyticsPlugins,
componentId, debug
componentId, debug,
]);

if (loadError) {
const handleFallbackCopy = async () => {
try {
if (onCopy) {
await onCopy();
} else {
const fallbackUrl = url || 'https://orgexplorer.aossie.org/';
if (navigator.clipboard && navigator.clipboard.writeText) {
await navigator.clipboard.writeText(fallbackUrl);
} else {
throw new Error("Clipboard API not available");
}
}
alert("Widget failed to load. Link copied to clipboard!");
} catch (err) {
console.error("Failed to copy link: ", err);
alert("Widget failed to load. Failed to copy link.");
}
};

return (
<button
type="button"
onClick={handleFallbackCopy}
style={{ display: 'flex', alignItems: 'center', gap: 6, fontSize: 12, border: '1px solid #ef4444', padding: '6px 12px', borderRadius: '6px', background: 'transparent', color: 'inherit', cursor: 'pointer' }}
title="Social Share widget failed to load. Click to copy link."
>
<FiShare2 size={13} /> {buttonText} (Fallback)
</button>
);
}

return <div ref={containerRef}></div>;
};

Expand Down
Loading