share to fb/twitter added

src/Components/ShareModal.js

@@ -16,7 +16,7 @@ GNU Affero General Public License for more details.
 You should have received a copy of the GNU Affero General Public License
 along with Plataforma Integrada MEC.  If not, see <http://www.gnu.org/licenses/>.*/
 
-import React, {useContext, useRef} from 'react';
+import React, {useRef} from 'react';
 import { Button } from '@material-ui/core';
 import Modal from '@material-ui/core/Modal';
 import Backdrop from '@material-ui/core/Backdrop';
@@ -33,14 +33,12 @@ import LinkIcon from '../img/link_icon.svg'
 import CloseModalButton from './CloseModalButton.js'
 
 export default function ReportModal (props) {
-        const pRef = useRef(props.link);
+    const refContainer = useRef(props.link);
 
-      function copyToClipboard(e) {
-          console.log(pRef.current)
-        pRef.current.select();
-        document.execCommand('copy');
-        e.target.focus();
-      };
+    function copyToClipboard(e) {
+        let copyText = document.getElementById('p-text')
+        console.log(copyText)
+    };
 
     return (
         <StyledModal
@@ -72,22 +70,36 @@ export default function ReportModal (props) {
                         </ResourceInfo>
                         <ShareInfo>
                         <Grid container style={{paddingRight : "15px", paddingLeft : "15px"}}>
+
+                            {/*Share to facebook*/}
                             <Grid item xs={4}>
-                                <ShareButton>
-                                    <img src={Facebook} alt="facebook-logo"/>
-                                    <p>FACEBOOK</p>
-                                </ShareButton>
+                                <a
+                                    href={"https://www.facebook.com/sharer/sharer.php?u=" + props.link}
+                                    target="_blank">
+                                    <ShareButton>
+                                        <img src={Facebook} alt="facebook-logo"/>
+                                        <p>FACEBOOK</p>
+                                    </ShareButton>
+                                </a>
                             </Grid>
+
+                            {/*Share to Twitter*/}
                             <Grid item xs={4}>
-                                <ShareButton>
-                                    <img src={Twitter} alt="twitter-logo"/>
-                                    <p>TWITTER</p>
-                                </ShareButton>
+                                <a
+                                    href={"https://www.twitter.com/intent/tweet?url=" + props.link}
+                                    target="_blank">
+                                    <ShareButton>
+                                        <img src={Twitter} alt="twitter-logo"/>
+                                        <p>TWITTER</p>
+                                    </ShareButton>
+                                </a>
                             </Grid>
+
+                            {/*Get shareable link*/}
                             <Grid item xs={4}>
                                 <ShareButton onClick={copyToClipboard}>
                                     <img src={LinkIcon} alt="link-icon"/>
-                                    <p ref={pRef} value={props.link}>COPIAR LINK</p>
+                                    <p id="p-text" value={props.link}>COPIAR LINK</p>
                                 </ShareButton>
                             </Grid>
                         </Grid>