From 5d477cebb2728663d15981d209b0ce0a31358ebb Mon Sep 17 00:00:00 2001
From: leangseu-edx <83240113+leangseu-edx@users.noreply.github.com>
Date: Wed, 18 Jan 2023 10:29:09 -0500
Subject: [PATCH] fix: update social sharing icon and title (#1046)

* fix: update social sharing icon and title

* chore: remove twitter icon
---
 src/courseware/course/share/ShareButton.jsx | 19 ++++++++++++++-----
 src/courseware/course/share/messages.js     |  5 +++++
 2 files changed, 19 insertions(+), 5 deletions(-)

diff --git a/src/courseware/course/share/ShareButton.jsx b/src/courseware/course/share/ShareButton.jsx
index 251dd35d..d981e1b9 100644
--- a/src/courseware/course/share/ShareButton.jsx
+++ b/src/courseware/course/share/ShareButton.jsx
@@ -1,13 +1,21 @@
 import { PropTypes } from 'prop-types';
-import { Icon } from '@edx/paragon';
-import { Share } from '@edx/paragon/icons';
 import { useIntl } from '@edx/frontend-platform/i18n';
-import { TwitterShareButton } from 'react-share';
-
+import { TwitterShareButton, TwitterIcon } from 'react-share';
 import { stringifyUrl } from 'query-string';
 
+import { Icon } from '@edx/paragon';
 import messages from './messages';
 
+const ShareTwitterIcon = () => (
+  <TwitterIcon
+    round
+    iconFillColor="#0A3055"
+    bgStyle={{
+      fill: '#fff',
+    }}
+  />
+);
+
 function ShareButton({ url }) {
   const { formatMessage } = useIntl();
 
@@ -23,10 +31,11 @@ function ShareButton({ url }) {
   return (
     <TwitterShareButton
       url={twitterUrl}
+      title={formatMessage(messages.shareQuote)}
       resetButtonStyle={false}
       className="px-1 ml-n1 btn-sm text-primary-500 btn btn-link"
     >
-      <Icon src={Share} />
+      <Icon src={ShareTwitterIcon} />
       {formatMessage(messages.shareButton)}
     </TwitterShareButton>
   );
diff --git a/src/courseware/course/share/messages.js b/src/courseware/course/share/messages.js
index 2ef59128..9c9b0855 100644
--- a/src/courseware/course/share/messages.js
+++ b/src/courseware/course/share/messages.js
@@ -16,6 +16,11 @@ const messages = defineMessages({
     defaultMessage: 'Copy the link below to share this content.',
     description: 'share message modal body',
   },
+  shareQuote: {
+    id: 'learn.sequence.share.quote',
+    defaultMessage: 'Here\'s a fun clip from a class I\'m taking on @edXonline.\n',
+    description: 'share message quote',
+  },
 });
 
 export default messages;