diff --git a/digital-course-file/src/hooks/useFolder.js b/digital-course-file/src/hooks/useFolder.js
index cf2eba24297aa328a3a70992f614ff6d73905790..11a7175ed333e4b9180ab090abb0b5cce8f2906e 100644
--- a/digital-course-file/src/hooks/useFolder.js
+++ b/digital-course-file/src/hooks/useFolder.js
@@ -5,7 +5,7 @@ import Loader from "react-loader-spinner";
 
 export const ROOT_FOLDER = {name: 'Courses', id : null , path : [] , parents : []};
 
-export function useFolder( folderId = null, folder= null) {
+export function useFolder( folderId = null, folder= null,rand) {
 
     // const {currentUser} = firebase.auth.currentUser;
     
@@ -109,7 +109,7 @@ export function useFolder( folderId = null, folder= null) {
                     payload : { childFolders : snapshot.docs.map(database.formatDoc) }
                 })
             })
-    },[folderId])
+    },[folderId,rand])
     useEffect(() => {
         if(firebase.auth().currentUser)
         {
@@ -126,7 +126,7 @@ export function useFolder( folderId = null, folder= null) {
         )
         }
         
-      }, [folderId])
+      }, [folderId,rand])
 
     return state;
 }
diff --git a/digital-course-file/src/user/Hero.js b/digital-course-file/src/user/Hero.js
index 6d433617ab62c686f773f34a367f09b684fcd6a9..a639fe7d84432e64fa23a18bf769b2d3c1560155 100644
--- a/digital-course-file/src/user/Hero.js
+++ b/digital-course-file/src/user/Hero.js
@@ -1,7 +1,7 @@
 import React, { useState, Component } from 'react'
 import AddFolder from './AddFolder'
 import AddFile from './AddFile'
-import { Container, Button, Navbar, Nav } from 'react-bootstrap'
+import { Container, Navbar, Nav } from 'react-bootstrap'
 import { useFolder } from '.././hooks/useFolder'
 import Folder from './Folder'
 import FolderNav from './FolderNav'
@@ -14,11 +14,18 @@ import 'firebase/storage'
 import Loader from 'react-loader-spinner'
 import Dropzone from './Dropzone'
 import ParticlesBg from 'particles-bg'
+import { v4 as uuidV4 } from 'uuid'
 
 const Hero = ({ handleLogout }) => {
   const { folderId } = useParams()
   const { state = {} } = useLocation()
-  const { folder, childFolders, childFiles } = useFolder(folderId, state.folder)
+
+  const rand = uuidV4()
+  const { folder, childFolders, childFiles } = useFolder(
+    folderId,
+    state.folder,
+    rand
+  )
 
   if (!folder) {
     return (
@@ -40,7 +47,7 @@ const Hero = ({ handleLogout }) => {
     return (
       <>
         <Container fluid>
-          <ParticlesBg type="cobweb" bg={true} />
+          <ParticlesBg type='cobweb' bg={true} />
           <div className='d-flex align-items-center'>
             <FolderNav currentFolder={folder} />
             <AddFolder currentFolder={folder} />