Shareablelink #39

digital-course-file/src/user/Deffolders.js

@@ -83,7 +83,7 @@ export default function Deffolders( {currentFolder} ){
     }
   return (
     <>
-      <Button style={{maxWidth : "80px"}} onClick={openModel} variant="primary" size="sm">
+      <Button style={{maxWidth : "80px"}} className="mr-2" onClick={openModel} variant="primary" size="sm">
         <FontAwesomeIcon icon={faBolt} />
       </Button>
     </>

digital-course-file/src/user/Hero.js

@@ -5,6 +5,7 @@ import { ROOT_FOLDER, useFolder } from '.././hooks/useFolder'
 import Folder from './Folder'
 import FolderNav from './FolderNav'
 import Deffolders from './Deffolders'
+import Sharelink from './Sharelink'
 import { useParams } from 'react-router-dom'
 import copyright from './copyright'
 import { Link } from 'react-router-dom'
@@ -41,6 +42,7 @@ const Hero = ({ handleLogout }) => {
           {childFolders.length == 0 && folder.parentId == null && folder.id!=null &&  (
             <Deffolders currentFolder={folder} />
           )}
+          {folder.id!=null &&  ( <Sharelink currentFolder={folder} /> )}
         </div>
 
         {childFolders.length > 0 && (

digital-course-file/src/user/Sharelink.js

+import { React , useState } from "react";
+import { Button,Modal,Form} from 'react-bootstrap';
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { faLink } from "@fortawesome/free-solid-svg-icons";
+
+export default function Sharelink( {currentFolder} ){
+    const [open, setOpen] = useState(false);
+    function openModal(){
+        setOpen(true);
+    }
+    function closeModal(){
+        setOpen(false);
+    }
+    
+    return(
+        <>
+        <Button style={{maxWidth : "80px" }} onClick={openModal} className="mr-2" variant="primary" size="sm" >
+            <FontAwesomeIcon icon={faLink} />
+        </Button>
+        <Modal show={open} onHide={closeModal} >
+              <Modal.Body>
+                {/* text area that will display link */}
+                <p>Sharable link for this folder : </p>
+                <textarea rows="2" cols="55" utofocus readOnly value={"www.dcfstudentview.com/"+String(currentFolder.id)}> 
+                </textarea>
+              </Modal.Body>
+              <Modal.Footer>
+                <Button variant="danger" onClick={closeModal}>
+                  Close
+                </Button>
+              </Modal.Footer>
+          </Modal>
+        </>
+    );
+}
\ No newline at end of file