From 5928b743d59e4d8285b52920f92ab5205fe90877 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?C=C3=A9dric=20FAMIBELLE-PRONZOLA?= <c.pronzola@live.fr>
Date: Wed, 23 Feb 2022 00:28:31 +0400
Subject: [PATCH] Add new share buttons

---
 components/teks/pataje.js | 51 ++++++++++++++++++++++++++++++---------
 1 file changed, 40 insertions(+), 11 deletions(-)

diff --git a/components/teks/pataje.js b/components/teks/pataje.js
index 1748dd7..ba3174c 100644
--- a/components/teks/pataje.js
+++ b/components/teks/pataje.js
@@ -8,8 +8,16 @@ import SpeedDialAction from '@mui/material/SpeedDialAction'
 import FileCopyIcon from '@mui/icons-material/FileCopyOutlined'
 import ShareIcon from '@mui/icons-material/Share'
 import TwitterIcon from '@mui/icons-material/Twitter'
+import TelegramIcon from '@mui/icons-material/Telegram'
+import FacebookIcon from '@mui/icons-material/Facebook'
+import WhatsAppIcon from '@mui/icons-material/WhatsApp'
 import {Backdrop} from '@mui/material'
 
+const twitterUrl = 'https://twitter.com/intent/tweet'
+const telegramUrl = 'https://telegram.me/share/url'
+const facebookUrl = 'https://www.facebook.com/sharer/sharer.php'
+const whatsappUrl = 'whatsapp://send'
+
 const PREFIX = 'pataje'
 
 const classes = {
@@ -28,7 +36,10 @@ const TWITTER_HASHTAGS = process.env.NEXT_PUBLIC_TWITTER_HASHTAGS || 'OKi'
 const TWITTER_USERNAME = process.env.NEXT_PUBLIC_TWITTER_USERNAME || 'OrganisationKA'
 
 const actions = [
+  {icon: <WhatsAppIcon />, name: 'WhatsApp', code: 'whatsapp'},
+  {icon: <FacebookIcon />, name: 'Facebook', code: 'facebook'},
   {icon: <TwitterIcon />, name: 'Twitter', code: 'twitter'},
+  {icon: <TelegramIcon />, name: 'Telegram', code: 'telegram'},
   {icon: <FileCopyIcon />, name: 'Copier le lien', code: 'copy'}
 ]
 
@@ -40,8 +51,7 @@ export default function Pataje({teks, setError, setSuccess}) {
   const alias = awtis.map(({alias}) => alias)
   const renderAwtis = new Intl.ListFormat('fr').format(alias)
 
-  const text = teks.user ? `${renderAwtis} - ${tit} (Pawòl) - (texte soumis par ${teks.user.username})` : `${renderAwtis} - ${tit} (Pawòl)`
-  const twitterUrl = 'https://twitter.com/intent/tweet'
+  const text = teks.user ? `${renderAwtis} - ${tit} (Paroles | Traductions) - (texte soumis par ${teks.user.username})` : `${renderAwtis} - ${tit} (Paroles | Traductions)`
 
   const handleClose = () => {
     setOpen(false)
@@ -52,16 +62,35 @@ export default function Pataje({teks, setError, setSuccess}) {
   }
 
   const handleClick = code => {
-    if (typeof window !== 'undefined' && code === 'twitter') {
-      window.open(`${twitterUrl}?hashtags=${TWITTER_HASHTAGS}&text=${text}&via=${TWITTER_USERNAME}&url=${patajeUrl}`, 'Partage Twitter', 'width=600,height=300')
-    }
+    if (typeof window !== 'undefined') {
+      switch (code) {
+        case 'whatsapp':
+          window.open(`${whatsappUrl}?text=${encodeURI(text)} \n ${encodeURI(patajeUrl)}`, '_blank')
+          break
 
-    if (typeof window !== 'undefined' && code === 'copy') {
-      navigator.clipboard.writeText(patajeUrl)
-        .then(
-          () => setSuccess('Lien copié avec succès'),
-          () => setError('Error lors de la copie du lien')
-        )
+        case 'facebook':
+          window.open(`${facebookUrl}?u=${encodeURI(patajeUrl)}`, '_blank')
+          break
+
+        case 'telegram':
+          window.open(`${telegramUrl}?url=${encodeURI(patajeUrl)}&text=${encodeURI(text)}`, '_blank')
+          break
+
+        case 'twitter':
+          window.open(`${twitterUrl}?hashtags=${TWITTER_HASHTAGS}&text=${text}&via=${TWITTER_USERNAME}&url=${patajeUrl}`, 'Partage Twitter', 'width=600,height=300')
+          break
+
+        case 'copy':
+          navigator.clipboard.writeText(patajeUrl)
+            .then(
+              () => setSuccess('Lien copié avec succès'),
+              () => setError('Error lors de la copie du lien')
+            )
+          break
+
+        default:
+          break
+      }
     }
 
     setOpen(false)