From 9be9ff990cdcccd18e08ee9161e143547929ba71 Mon Sep 17 00:00:00 2001
From: Gana016 <jayam.ganapathi12@gmail.com>
Date: Sat, 1 May 2021 17:23:04 +0530
Subject: [PATCH] link update
---
digital-course-file/src/user/Folder.js | 268 +++++++++---------
digital-course-file/src/user/FolderNav.js | 59 ++--
.../src/user/ForgotPassword.js | 47 +--
digital-course-file/src/user/Sharelink.js | 6 +-
4 files changed, 197 insertions(+), 183 deletions(-)
diff --git a/digital-course-file/src/user/Folder.js b/digital-course-file/src/user/Folder.js
index ee6f132..ee5cf11 100644
--- a/digital-course-file/src/user/Folder.js
+++ b/digital-course-file/src/user/Folder.js
@@ -1,155 +1,161 @@
-import { React,useState,Fragment } from "react";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { faFolder } from "@fortawesome/free-solid-svg-icons"
-import { Button,Modal,Form } from "react-bootstrap";
-import { Link } from "react-router-dom";
-import { useHistory } from "react-router-dom";
+import { React, useState, Fragment } from 'react'
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
+import { faFolder } from '@fortawesome/free-solid-svg-icons'
+import { Button, Modal, Form } from 'react-bootstrap'
+import { Link } from 'react-router-dom'
+import { useHistory } from 'react-router-dom'
import { database } from '../fire.js'
import firebase from 'firebase'
-import { useContextMenu, Menu, Item, Separator } from "react-contexify";
-import "react-contexify/dist/ReactContexify.css";
+import { useContextMenu, Menu, Item, Separator } from 'react-contexify'
+import 'react-contexify/dist/ReactContexify.css'
+import { BrowserRouter } from 'react-router-dom'
-export default function Folder ({folder}) {
- const MENU_ID = "#aadsd299dfsdwqwdasc29";
- const history = useHistory();
+export default function Folder({ folder }) {
+ const MENU_ID = '#aadsd299dfsdwqwdasc29'
+ const history = useHistory()
- const [showit, setShowit] = useState(false);
- const [showit1, setShowit1] = useState(false);
- const [fname,setFname] = useState(folder.name);
- const [fid,setFid] = useState(folder.id);
- const [uploaddetail,setuploadDetail] = useState("");
- const [name, setName] = useState(folder.name);
+ const [showit, setShowit] = useState(false)
+ const [showit1, setShowit1] = useState(false)
+ const [fname, setFname] = useState(folder.name)
+ const [fid, setFid] = useState(folder.id)
+ const [uploaddetail, setuploadDetail] = useState('')
+ const [name, setName] = useState(folder.name)
- const { show } = useContextMenu({
- id: MENU_ID,
- });
+ const { show } = useContextMenu({
+ id: MENU_ID,
+ })
- function closeModal(){
- setShowit(false);
- setShowit1(false);
- }
- function displayMenu(e) {
- show(e, { props: { id: Number(e.currentTarget.id) , folderId : folder.id , folderName : folder.name, showit : showit , details : folder.createdAt} });
- }
-
- function handleItemClick({ event, props, data, triggerEvent}) {
- switch (event.currentTarget.id) {
- case "open":
- history.push(`/folder/${props.folderId}`);
- break;
+ function closeModal() {
+ setShowit(false)
+ setShowit1(false)
+ }
+ function displayMenu(e) {
+ show(e, {
+ props: {
+ id: Number(e.currentTarget.id),
+ folderId: folder.id,
+ folderName: folder.name,
+ showit: showit,
+ details: folder.createdAt,
+ },
+ })
+ }
- case "rename":
- setFid(props.folderId);
- setShowit1(true);
- setName(props.folderName);
- break;
+ function handleItemClick({ event, props, data, triggerEvent }) {
+ switch (event.currentTarget.id) {
+ case 'open':
+ history.push(`/folder/${props.folderId}`)
+ break
- case "details":
- setShowit(true);
- setFname(props.folderName);
- setuploadDetail(Date((props.details).toMillis()));
- break;
-
- }
- }
+ case 'rename':
+ setFid(props.folderId)
+ setShowit1(true)
+ setName(props.folderName)
+ break
+ case 'details':
+ setShowit(true)
+ setFname(props.folderName)
+ setuploadDetail(Date(props.details.toMillis()))
+ break
+ }
+ }
- function handleSubmit(e){
+ function handleSubmit(e) {
+ //Renaming the current folder in database
+ e.preventDefault()
+ const docRef = database.folders.doc(fid)
+ docRef.update({ name: name })
+ closeModal()
- //Renaming the current folder in database
- e.preventDefault();
- const docRef = database.folders.doc(fid);
- docRef.update({"name": name});
- closeModal();
-
- //Changing name of path in all child folders
- var folderdel = database.folders
- .where("userId","==", firebase.auth().currentUser.uid)
- .where("parents", "array-contains", fid);
- folderdel.get().then(function(querySnapshot) {
- querySnapshot.forEach(function(doc) {
- const child_folder_id = doc.id;
- const child_folder_path = doc.data().path;
- for (var key in child_folder_path) {
- if(child_folder_path[key].id == fid){
- child_folder_path[key].name = name;
- }
- }
- const docRef1 = database.folders.doc(child_folder_id);
- docRef1.update({"path": child_folder_path});
- });
- });
- }
+ //Changing name of path in all child folders
+ var folderdel = database.folders
+ .where('userId', '==', firebase.auth().currentUser.uid)
+ .where('parents', 'array-contains', fid)
+ folderdel.get().then(function (querySnapshot) {
+ querySnapshot.forEach(function (doc) {
+ const child_folder_id = doc.id
+ const child_folder_path = doc.data().path
+ for (var key in child_folder_path) {
+ if (child_folder_path[key].id == fid) {
+ child_folder_path[key].name = name
+ }
+ }
+ const docRef1 = database.folders.doc(child_folder_id)
+ docRef1.update({ path: child_folder_path })
+ })
+ })
+ }
- return (
- <Fragment>
- <div>
- <Button
+ return (
+ <Fragment>
+ <div>
+ <BrowserRouter>
+ <Button
onContextMenu={displayMenu}
id={folder.id}
- to={`/folder/${folder.id}`}
- variant="outline-secondary"
- className="text-truncate w-100"
- as={Link}>
- <FontAwesomeIcon icon={faFolder} className="mr-2"/>
+ to={`/folder/${folder.id}`}
+ variant='outline-secondary'
+ className='text-truncate w-100'
+ as={Link}
+ >
+ <FontAwesomeIcon icon={faFolder} className='mr-2' />
{folder.name}
- </Button>
-
+ </Button>
+ </BrowserRouter>
+
{/* CONTEXT MENU FOR THE COMPONENT */}
<Menu id={MENU_ID}>
- <Item id="open" onClick={handleItemClick} >
- Open
- </Item>
- <Item id="rename" onClick={handleItemClick}>
- Rename
- </Item>
- <Item id="details" onClick={handleItemClick}>
- Details
- </Item>
+ <Item id='open' onClick={handleItemClick}>
+ Open
+ </Item>
+ <Item id='rename' onClick={handleItemClick}>
+ Rename
+ </Item>
+ <Item id='details' onClick={handleItemClick}>
+ Details
+ </Item>
</Menu>
-
{/* FOR SHOWING DETAILS OF THE FOLDER */}
<Modal show={showit} onHide={closeModal}>
- <Modal.Body>
+ <Modal.Body>
<h3>Folder details</h3>
- <p>Folder : {fname}</p>
- <p>Created On : {(""+uploaddetail).substring(0,34)+"(IST)"}</p>
+ <p>Folder : {fname}</p>
+ <p>Created On : {('' + uploaddetail).substring(0, 34) + '(IST)'}</p>
+ </Modal.Body>
+ <Modal.Footer>
+ <Button variant='danger' onClick={closeModal}>
+ Close
+ </Button>
+ </Modal.Footer>
+ </Modal>
+
+ {/* FOR RENAMING THE FOLDER */}
+ <Modal show={showit1} onHide={closeModal}>
+ <Form onSubmit={handleSubmit}>
+ <Modal.Body>
+ <Form.Group>
+ <Form.Label>RENAME FOLDER</Form.Label>
+ <Form.Control
+ type='text'
+ required
+ value={name}
+ onChange={(e) => setName(e.target.value)}
+ />
+ </Form.Group>
</Modal.Body>
<Modal.Footer>
- <Button variant="danger" onClick={closeModal}>
- Close
- </Button>
- </Modal.Footer>
- </Modal>
-
- {/* FOR RENAMING THE FOLDER */}
- <Modal show={showit1} onHide={closeModal} >
- <Form onSubmit={handleSubmit}>
- <Modal.Body>
- <Form.Group>
- <Form.Label>RENAME FOLDER</Form.Label>
- <Form.Control
- type="text"
- required
- value={name}
- onChange={e => setName(e.target.value)}
- />
- </Form.Group>
- </Modal.Body>
- <Modal.Footer>
- <Button variant="success" type="submit">
- Rename
- </Button>
- <Button variant="danger" onClick={closeModal}>
- Cancel
- </Button>
- </Modal.Footer>
- </Form>
- </Modal>
-
- </div>
- </Fragment>
- );
-
-}
\ No newline at end of file
+ <Button variant='success' type='submit'>
+ Rename
+ </Button>
+ <Button variant='danger' onClick={closeModal}>
+ Cancel
+ </Button>
+ </Modal.Footer>
+ </Form>
+ </Modal>
+ </div>
+ </Fragment>
+ )
+}
diff --git a/digital-course-file/src/user/FolderNav.js b/digital-course-file/src/user/FolderNav.js
index eab3425..fdd0298 100644
--- a/digital-course-file/src/user/FolderNav.js
+++ b/digital-course-file/src/user/FolderNav.js
@@ -1,7 +1,8 @@
-import { react,Fragment } from 'react'
+import { react, Fragment } from 'react'
import { Breadcrumb } from 'react-bootstrap'
import { Link } from 'react-router-dom'
import { ROOT_FOLDER } from '../hooks/useFolder'
+import { BrowserRouter, Switch, Route } from 'react-router-dom'
export default function FolderNav({ currentFolder }) {
let path = currentFolder === ROOT_FOLDER ? [] : [ROOT_FOLDER]
@@ -12,33 +13,35 @@ export default function FolderNav({ currentFolder }) {
return (
<Fragment>
- <Breadcrumb
- className='flex-grow-1'
- listProps={{ className: 'bg-white pl-0 m-0' }}
- >
- {path.map((folder, index) => (
- <Breadcrumb.Item
- key={folder.id}
- linkAs={Link}
- linkProps={{
- to: folder.id ? `/folder/${folder.id}` : '/',
- }}
- className='text-truncate d-inline-block'
- style={{ maxWidth: '175px' }}
+ <BrowserRouter>
+ <Breadcrumb
+ className='flex-grow-1'
+ listProps={{ className: 'bg-white pl-0 m-0' }}
>
- {folder.name}
- </Breadcrumb.Item>
- ))}
- {currentFolder && (
- <Breadcrumb.Item
- className='text-truncate d-inline-block'
- style={{ maxWidth: '200px' }}
- active
- >
- {currentFolder.name}
- </Breadcrumb.Item>
- )}
- </Breadcrumb>
+ {path.map((folder, index) => (
+ <Breadcrumb.Item
+ key={folder.id}
+ linkAs={Link}
+ linkProps={{
+ to: folder.id ? `/folder/${folder.id}` : '/',
+ }}
+ className='text-truncate d-inline-block'
+ style={{ maxWidth: '175px' }}
+ >
+ {folder.name}
+ </Breadcrumb.Item>
+ ))}
+ {currentFolder && (
+ <Breadcrumb.Item
+ className='text-truncate d-inline-block'
+ style={{ maxWidth: '200px' }}
+ active
+ >
+ {currentFolder.name}
+ </Breadcrumb.Item>
+ )}
+ </Breadcrumb>
+ </BrowserRouter>
</Fragment>
)
-}
\ No newline at end of file
+}
diff --git a/digital-course-file/src/user/ForgotPassword.js b/digital-course-file/src/user/ForgotPassword.js
index fa04881..209bdbc 100644
--- a/digital-course-file/src/user/ForgotPassword.js
+++ b/digital-course-file/src/user/ForgotPassword.js
@@ -1,7 +1,8 @@
-import {React,useState,useEffect,Fragment } from 'react'
+import { React, useState, useEffect, Fragment } from 'react'
import { Link } from 'react-router-dom'
import fire from '../fire'
import firebase from 'firebase'
+import { BrowserRouter } from 'react-router-dom'
export default function ForgotPassword() {
const [email, setEmail] = useState('')
@@ -23,28 +24,30 @@ export default function ForgotPassword() {
}
return (
<Fragment>
- <section className='login'>
- <div className='loginContainer'>
- <p className='errorMsg'>{emailError}</p>
- <label>UserName</label>
- <input
- type='text'
- autoFocus
- required
- value={email}
- onChange={(e) => setEmail(e.target.value)}
- ></input>
- <div className='btnContainer'>
- <button onClick={handleforgot}>Reset Password</button>
- <p>
- Have an account ?{' '}
- <Link to='/signin'>
- <span>Sign in</span>
- </Link>
- </p>
+ <section className='login'>
+ <div className='loginContainer'>
+ <p className='errorMsg'>{emailError}</p>
+ <label>UserName</label>
+ <input
+ type='text'
+ autoFocus
+ required
+ value={email}
+ onChange={(e) => setEmail(e.target.value)}
+ ></input>
+ <div className='btnContainer'>
+ <button onClick={handleforgot}>Reset Password</button>
+ <p>
+ Have an account ?{' '}
+ <BrowserRouter>
+ <Link to='/signin'>
+ <span>Sign in</span>
+ </Link>
+ </BrowserRouter>
+ </p>
+ </div>
</div>
- </div>
- </section>
+ </section>
</Fragment>
)
}
diff --git a/digital-course-file/src/user/Sharelink.js b/digital-course-file/src/user/Sharelink.js
index e6b06a9..32f1a0d 100644
--- a/digital-course-file/src/user/Sharelink.js
+++ b/digital-course-file/src/user/Sharelink.js
@@ -4,6 +4,8 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faLink, faPaste } from '@fortawesome/free-solid-svg-icons'
import { CopyToClipboard } from 'react-copy-to-clipboard'
import ReactTooltip from 'react-tooltip';
+import firebase from 'firebase'
+
export default function Sharelink({ currentFolder }) {
const divStyle = {
@@ -37,10 +39,10 @@ export default function Sharelink({ currentFolder }) {
<Form.Group>
<Form.Label>Sharable link for this folder :</Form.Label>
<Form.Label>
- {'https://dcfstudentsview.netlify.app/folders/' + String(currentFolder.id)}
+ {'https://dcfstudentsview.netlify.app/folders/' +String(firebase.auth().currentUser.uid)+'/'+ String(currentFolder.id) }
<p></p>
<CopyToClipboard
- text={'https://dcfstudentsview.netlify.app/folders/' + String(currentFolder.id)}
+ text={'https://dcfstudentsview.netlify.app/folders/' +String(firebase.auth().currentUser.uid)+'/'+ String(currentFolder.id)}
onCopy={() => setClipBoard(true)}
>
<FontAwesomeIcon icon={faPaste} />
--
GitLab