diff --git a/src/features/donations/components/ShareDonationLinks/ShareButton.js b/src/features/common/components/ShareLinks/ShareButton.js
similarity index 95%
rename from src/features/donations/components/ShareDonationLinks/ShareButton.js
rename to src/features/common/components/ShareLinks/ShareButton.js
index 27846d6..716e6fc 100644
--- a/src/features/donations/components/ShareDonationLinks/ShareButton.js
+++ b/src/features/common/components/ShareLinks/ShareButton.js
@@ -1,21 +1,21 @@
-import PropTypes from 'prop-types';
-
-import styles from './ShareButton.module.scss';
-
-const ShareButton = ({ children, type }) => (
-
- {children}
-
-);
-
-ShareButton.propTypes = {
- children: PropTypes.oneOfType([
- PropTypes.arrayOf(PropTypes.node),
- PropTypes.node,
- ]).isRequired,
- type: PropTypes.string.isRequired,
-};
-
-export default ShareButton;
+import PropTypes from 'prop-types';
+
+import styles from './ShareButton.module.scss';
+
+const ShareButton = ({ children, type }) => (
+
+ {children}
+
+);
+
+ShareButton.propTypes = {
+ children: PropTypes.oneOfType([
+ PropTypes.arrayOf(PropTypes.node),
+ PropTypes.node,
+ ]).isRequired,
+ type: PropTypes.string.isRequired,
+};
+
+export default ShareButton;
diff --git a/src/features/donations/components/ShareDonationLinks/ShareButton.module.scss b/src/features/common/components/ShareLinks/ShareButton.module.scss
similarity index 87%
rename from src/features/donations/components/ShareDonationLinks/ShareButton.module.scss
rename to src/features/common/components/ShareLinks/ShareButton.module.scss
index f9c2fb1..a059882 100644
--- a/src/features/donations/components/ShareDonationLinks/ShareButton.module.scss
+++ b/src/features/common/components/ShareLinks/ShareButton.module.scss
@@ -1,106 +1,117 @@
-@import '../../../../sass/variables';
-
-.share-button {
- border: 1px solid #fff;
- border-radius: 5px;
-}
-
-.share-button button {
- width: 3.5rem;
- height: 2.9rem;
- display: flex;
- justify-content: center;
- align-items: center;
-}
-
-.share-button__whatsapp {
- &:hover {
- svg path {
- fill: $whatsapp;
- }
- }
-
- &:active {
- border: 1px solid $whatsapp;
- }
-}
-
-.share-button__facebook {
- &:hover {
- svg path {
- fill: $facebook;
- }
- }
-
- &:active {
- border: 1px solid $facebook--active;
-
- svg path {
- fill: $facebook--active;
- }
- }
-}
-
-.share-button__telegram {
- &:hover {
- svg path {
- fill: $telegram;
- }
- }
-
- &:active {
- border: 1px solid $telegram--active;
-
- svg path {
- fill: $telegram--active;
- }
- }
-}
-
-.share-button__twitter {
- &:hover {
- svg path {
- fill: $twitter;
- }
- }
-
- &:active {
- border: 1px solid $twitter--active;
-
- svg path {
- fill: $twitter--active;
- }
- }
-}
-
-.share-button__email {
- &:hover {
- svg path {
- fill: $email;
- }
- }
-
- &:active {
- border: 1px solid $email--active;
-
- svg path {
- fill: $email--active;
- }
- }
-}
-
-.share-button__reddit {
- &:hover {
- svg path {
- fill: $reddit;
- }
- }
-
- &:active {
- border: 1px solid $reddit--active;
-
- svg path {
- fill: $reddit--active;
- }
- }
-}
+@import 'sass/variables';
+
+.share-button {
+ border: 1px solid #fff;
+ border-radius: 5px;
+}
+
+.share-button button {
+ width: 3.5rem;
+ height: 2.9rem;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+.share-button__whatsapp {
+ &:hover {
+ svg path {
+ fill: $whatsapp;
+ }
+ }
+
+ &:active {
+ border: 1px solid $whatsapp;
+ }
+}
+
+.share-button__facebook {
+ &:hover {
+ svg path {
+ fill: $facebook;
+ }
+ }
+
+ &:active {
+ border: 1px solid $facebook--active;
+
+ svg path {
+ fill: $facebook--active;
+ }
+ }
+}
+
+.share-button__telegram {
+ &:hover {
+ svg path {
+ fill: $telegram;
+ }
+ }
+
+ &:active {
+ border: 1px solid $telegram--active;
+
+ svg path {
+ fill: $telegram--active;
+ }
+ }
+}
+
+.share-button__twitter {
+ &:hover {
+ svg path {
+ fill: $twitter;
+ }
+ }
+
+ &:active {
+ border: 1px solid $twitter--active;
+
+ svg path {
+ fill: $twitter--active;
+ }
+ }
+}
+
+.share-button__email {
+ &:hover {
+ svg path {
+ fill: $email;
+ }
+ }
+
+ &:active {
+ border: 1px solid $email--active;
+
+ svg path {
+ fill: $email--active;
+ }
+ }
+}
+
+.share-button__reddit {
+ &:hover {
+ svg path {
+ fill: $reddit;
+ }
+ }
+
+ &:active {
+ border: 1px solid $reddit--active;
+
+ svg path {
+ fill: $reddit--active;
+ }
+ }
+}
+
+@media (max-width: $breakpoint-tablet) {
+ .share-button {
+ margin-top: 10px;
+ }
+
+ .share-button button {
+ width: 2.5rem;
+ height: 1.5rem;
+ }
+}
diff --git a/src/features/donations/components/ShareDonationLinks/ShareDonationLinks.js b/src/features/common/components/ShareLinks/ShareLinks.js
similarity index 73%
rename from src/features/donations/components/ShareDonationLinks/ShareDonationLinks.js
rename to src/features/common/components/ShareLinks/ShareLinks.js
index 9e0d1d2..e5f8fb4 100644
--- a/src/features/donations/components/ShareDonationLinks/ShareDonationLinks.js
+++ b/src/features/common/components/ShareLinks/ShareLinks.js
@@ -1,72 +1,87 @@
-import {
- FacebookShareButton,
- WhatsappShareButton,
- TelegramShareButton,
- TwitterShareButton,
- RedditShareButton,
- EmailShareButton,
-} from 'react-share';
-
-import { ReactComponent as WhatsappIcon } from 'assets/whatsapp_icon.svg';
-import { ReactComponent as FacebookIcon } from 'assets/facebook_icon.svg';
-import { ReactComponent as TelegramIcon } from 'assets/telegram_icon.svg';
-import { ReactComponent as TwitterIcon } from 'assets/twitter_icon.svg';
-import { ReactComponent as RedditIcon } from 'assets/reddit_icon.svg';
-import { ReactComponent as EmailIcon } from 'assets/email_icon.svg';
-import ShareButton from './ShareButton';
-
-const ShareDonationLinks = () => {
- const currentURL = window.location.href;
- const description =
- "Hola! hecha un vistazo a esta donación en 'Che, ¿hoy donamos?'";
-
- return (
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- );
-};
-
-export default ShareDonationLinks;
+import PropTypes from 'prop-types';
+import { useParams } from 'react-router-dom';
+import {
+ FacebookShareButton,
+ WhatsappShareButton,
+ TelegramShareButton,
+ TwitterShareButton,
+ RedditShareButton,
+ EmailShareButton,
+} from 'react-share';
+
+import { ReactComponent as WhatsappIcon } from 'assets/whatsapp_icon.svg';
+import { ReactComponent as FacebookIcon } from 'assets/facebook_icon.svg';
+import { ReactComponent as TelegramIcon } from 'assets/telegram_icon.svg';
+import { ReactComponent as TwitterIcon } from 'assets/twitter_icon.svg';
+import { ReactComponent as RedditIcon } from 'assets/reddit_icon.svg';
+import { ReactComponent as EmailIcon } from 'assets/email_icon.svg';
+import ShareButton from './ShareButton';
+
+const ShareLinks = ({ user, object }) => {
+ const currentURL = window.location.href;
+ const { id } = useParams();
+
+ const descriptionPetition = `${user} está necesitando '${object}' y quizás tu puedas ayudar! Ingresa a hoydonamos.uy o al siguiente link para obtener más información.`;
+ const descriptionDonation = `Están donando '${object}' y quizás tú lo estés necesitando. Ingresa a hoydonamos.uy o al siguiente link para obtener más información.`;
+
+ const description = id ? descriptionDonation : descriptionPetition;
+
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+};
+
+ShareLinks.propTypes = {
+ user: PropTypes.string,
+ object: PropTypes.string.isRequired,
+};
+
+ShareLinks.defaultProps = {
+ user: 'Un usuario',
+};
+
+export { ShareLinks };
diff --git a/src/features/common/components/ShareLinks/index.js b/src/features/common/components/ShareLinks/index.js
new file mode 100644
index 0000000..7f033ac
--- /dev/null
+++ b/src/features/common/components/ShareLinks/index.js
@@ -0,0 +1 @@
+export { ShareLinks } from './ShareLinks';
diff --git a/src/features/common/components/index.js b/src/features/common/components/index.js
index 442c128..5f3b4b8 100644
--- a/src/features/common/components/index.js
+++ b/src/features/common/components/index.js
@@ -16,3 +16,4 @@ export * from './PageLoading';
export * from './Subtitle';
export * from './Swiper';
export * from './CallToActionLink';
+export * from './ShareLinks';
diff --git a/src/features/donations/components/Donation/Donation.js b/src/features/donations/components/Donation/Donation.js
index 121cf48..d666319 100644
--- a/src/features/donations/components/Donation/Donation.js
+++ b/src/features/donations/components/Donation/Donation.js
@@ -1,7 +1,6 @@
import PropTypes from 'prop-types';
-import { Form, UnderlinedTitle } from 'features/common';
-import ShareDonationLinks from '../ShareDonationLinks';
+import { Form, UnderlinedTitle, ShareLinks } from 'features/common';
import styles from './Donation.module.scss';
@@ -15,7 +14,7 @@ const Donation = ({ data, onOpenModal }) => (
-
+
{data.name}
diff --git a/src/features/donations/components/ShareDonationLinks/index.js b/src/features/donations/components/ShareDonationLinks/index.js
deleted file mode 100644
index 69a128b..0000000
--- a/src/features/donations/components/ShareDonationLinks/index.js
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from './ShareDonationLinks';
diff --git a/src/features/petitions/components/PetitionModal/PetitionModal.js b/src/features/petitions/components/PetitionModal/PetitionModal.js
index cd6742e..4f197a6 100644
--- a/src/features/petitions/components/PetitionModal/PetitionModal.js
+++ b/src/features/petitions/components/PetitionModal/PetitionModal.js
@@ -2,7 +2,7 @@ import { useRef, useCallback } from 'react';
import PropTypes from 'prop-types';
import { useHistory } from 'react-router-dom';
-import { Modal, Loading, useClickAway } from 'features/common';
+import { Modal, Loading, useClickAway, ShareLinks } from 'features/common';
import { usePetition } from 'features/petitions/hooks';
import { ReactComponent as PhoneIcon } from 'assets/phone.svg';
import { ReactComponent as MailIcon } from 'assets/email.svg';
@@ -53,6 +53,7 @@ const PetitionModal = ({ petitionId, onClose }) => {
{data.data.user.email}
+
Cerrar