diff --git a/README.md b/README.md index c9862b02..bdd7c766 100644 --- a/README.md +++ b/README.md @@ -19,8 +19,8 @@ Yes. The source of the smart contact is available here. 5. Is Ballot.gg free? Yes. There are no charges for creating polls in Ballot. -6. Who is the team behind Owl Link? -We are developers from Team [BlockSurvey ↗](https://blocksurvey.io/?ref=owl-link). +6. Who is the team behind Ballot.gg? +We are developers from Team [BlockSurvey ↗](https://blocksurvey.io/?ref=ballot). ## Getting Started diff --git a/components/common/HeaderComponent.js b/components/common/HeaderComponent.js index 8a502323..fbc47e3e 100644 --- a/components/common/HeaderComponent.js +++ b/components/common/HeaderComponent.js @@ -1,8 +1,18 @@ -import { formStacksExplorerUrl } from "../../services/utils"; +import { + formStacksExplorerUrl, + openFacebookUrl, + openLinkedinUrl, + openRedditUrl, + openTelegramUrl, + openTwitterUrl, + openWhatsappUrl +} from "../../services/utils"; import Tooltip from "react-bootstrap/Tooltip"; import { useState } from "react"; import OverlayTrigger from "react-bootstrap/OverlayTrigger"; import QRCodePopup from "../poll/QRCodePopup"; +import { Dropdown } from "react-bootstrap"; +import styles from "../../styles/Dashboard.module.css"; export default function HeaderComponent(props) { // Variables @@ -87,6 +97,87 @@ export default function HeaderComponent(props) { + + {/* Share icon */} + + + Share}> +
+ + + +
+
+
+ + + { + openTwitterUrl( + publicUrl, + pollObject?.title + ); + }} + > + Twitter + + { + openFacebookUrl( + publicUrl, + pollObject?.title + ); + }} + > + Facebook + + { + openLinkedinUrl( + publicUrl, + pollObject?.title + ); + }} + > + LinkedIn + + { + openWhatsappUrl( + publicUrl, + pollObject?.title + ); + }} + > + WhatsApp + + { + openTelegramUrl( + publicUrl, + pollObject?.title + ); + }} + > + Telegram + + { + openRedditUrl( + publicUrl, + pollObject?.title + ); + }} + > + Reddit + + +
{/* Description */} diff --git a/pages/index.js b/pages/index.js index cccbbad5..45f0479d 100644 --- a/pages/index.js +++ b/pages/index.js @@ -46,6 +46,14 @@ export default function Home() { content={metaImage} /> + + {/* Twitter Meta Tags */} @@ -63,7 +71,6 @@ export default function Home() { content={metaImage} /> - diff --git a/pages/p/[[...id]].js b/pages/p/[[...id]].js index 3def609a..c08e726c 100644 --- a/pages/p/[[...id]].js +++ b/pages/p/[[...id]].js @@ -305,6 +305,8 @@ export default function Poll(props) { + + {/* Twitter Meta Tags */} diff --git a/services/utils.js b/services/utils.js index da2f4f82..d05d9269 100644 --- a/services/utils.js +++ b/services/utils.js @@ -68,4 +68,72 @@ export async function getDomainNamesFromBlockchain() { } return displayUsername; -}; \ No newline at end of file +}; + +// Social media share +/** + * Get Twitter post content + */ +export function openTwitterUrl(url, title) { + if (title && url) { + let link = "https://twitter.com/intent/tweet?text=" + title + "&url=" + url; + window.open(link, "_blank"); + } +} + +/** + * Get Facebook post content + */ +export function openFacebookUrl(url, title) { + if (url) { + let link = "https://www.facebook.com/sharer.php?u=" + url; + window.open(link, "_blank"); + } +} + +/** + * Get Linkedin post content + */ +export function openLinkedinUrl(url, title) { + if (url) { + let link = "https://www.linkedin.com/sharing/share-offsite/?url=" + url; + + // Adding extra text + if (title) { + link = link + "&summary=" + title; + } + + window.open(link, "_blank"); + } +} + +/** + * Get Whatsapp post content + */ +export function openWhatsappUrl(url, title) { + if (url) { + let link = "https://web.whatsapp.com/send?text=" + url; + window.open(link, "_blank"); + } +} + +/** + * Get Telegram post content + */ +export function openTelegramUrl(url, title) { + if (url) { + let link = "https://telegram.me/share/url?url=" + url; + window.open(link, "_blank"); + } +} + +/** + * Get Facebook post content + */ +export function openRedditUrl(url, title) { + if (url) { + let link = "https://www.reddit.com/submit?url=" + url; + window.open(link, "_blank"); + } +} + // Social media share \ No newline at end of file diff --git a/styles/Dashboard.module.css b/styles/Dashboard.module.css index cfcdf622..4bee2bc3 100644 --- a/styles/Dashboard.module.css +++ b/styles/Dashboard.module.css @@ -78,4 +78,14 @@ .dashboard_transactions_modal_body_box { max-height: 360px; overflow: auto; +} + +.share_dropdown { + padding: 0px; + background: none; + border: 0px; +} + +.share_dropdown::after { + display: none; } \ No newline at end of file