fix: Social links buttons not working

podkrepi-bg · Dec 4, 2024 · 362c972 · 362c972
1 parent 668c99a
commit 362c972
Showing 1 changed file with 13 additions and 7 deletions.
diff --git a/src/components/common/SocialShareListButton.tsx b/src/components/common/SocialShareListButton.tsx
@@ -8,7 +8,7 @@ import {
   PopoverProps,
   ButtonProps,
 } from '@mui/material'
-import { ContentCopy, Facebook, LinkedIn, Share, Twitter } from '@mui/icons-material'
+import { ContentCopy, Facebook, LinkedIn, Share, Twitter, X } from '@mui/icons-material'
 
 import { AlertStore } from 'stores/AlertStore'
 import theme from 'common/theme'
@@ -25,11 +25,16 @@ export default function SocialShareListButton({
 }) {
   const { t } = useTranslation('common')
   const [anchorEl, setAnchorEl] = React.useState<HTMLButtonElement | null>(null)
-  const serializedUrl = new URLSearchParams(url).toString()
+
   const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {
+    console.log(event.currentTarget)
     setAnchorEl(event.currentTarget)
   }
 
+  React.useEffect(() => {
+    console.log(url)
+  }, [url])
+
   const handleClose = () => {
     setAnchorEl(null)
   }
@@ -56,26 +61,27 @@ export default function SocialShareListButton({
           <ListItemButton
             onClick={() => {
               navigator.clipboard.writeText(url)
+              console.log(url)
               AlertStore.show('Campaign link copied to clipboard', 'success')
               setAnchorEl(null)
             }}>
             <Typography>{t('components.social-share.copy')}</Typography>
             <ContentCopy sx={{ ml: 1, fill: theme.palette.grey[400] }} />
           </ListItemButton>
-          <ListItemButton href={`https://www.facebook.com/sharer/sharer.php?u=${serializedUrl}`}>
+          <ListItemButton href={`https://www.facebook.com/sharer/sharer.php?u=${url}`}>
             <Typography>{t('components.social-share.share')} Facebook</Typography>
             <Facebook sx={{ ml: 1, fill: '#4267B2' }} />
           </ListItemButton>
           <ListItemButton
             href={`
-            http://www.linkedin.com/shareArticle?mini=true&url=${serializedUrl}
+            http://www.linkedin.com/shareArticle?mini=true&url=${url}
           `}>
             <Typography>{t('components.social-share.share')} LinkedIn</Typography>
             <LinkedIn sx={{ ml: 1, fill: '#0077b5' }} />
           </ListItemButton>
-          <ListItemButton href={`https://twitter.com/intent/tweet?url=${serializedUrl}`}>
-            <Typography>{t('components.social-share.share')} Twitter</Typography>
-            <Twitter sx={{ ml: 1, fill: '#1DA1F2' }} />
+          <ListItemButton href={`https://x.com/intent/post?url=${url}`}>
+            <Typography>{t('components.social-share.share')} X</Typography>
+            <X sx={{ ml: 1 }} />
           </ListItemButton>
         </List>
       </Popover>