Skip to content
Snippets Groups Projects
Select Git revision
  • fc60ddbc06333e3cdc100f52015b55848a3c3a88
  • master default protected
  • createAssg
  • beta1
4 results

Hero.js

Blame
  • Hero.js 1.78 KiB
    import React, { useEffect, useState } from 'react'
    import AddFolder from './AddFolder'
    import { Container, Button, Navbar, Nav } from 'react-bootstrap'
    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'
    import Loader from 'react-loader-spinner'
    
    const Hero = ({ handleLogout }) => {
      const { folderId } = useParams()
      const { folder, childFolders } = useFolder(folderId)
    
      if (!folder) {
        return (
          <>
            <div className='centered'>
              <Loader
                type='Puff'
                color='#00BFFF'
                height={100}
                width={100}
                timeout={3000} //3 secs
              />
            </div>
          </>
        )
      }
    
      return (
        <>
          <Container fluid>
            <div className='d-flex align-items-center'>
              <FolderNav currentFolder={folder} />
              <AddFolder currentFolder={folder} />
              
              {childFolders.length == 0 && folder.parentId == null && folder.id!=null &&  (
                <Deffolders currentFolder={folder} />
              )}
              {folder.id!=null &&  ( <Sharelink currentFolder={folder} /> )}
            </div>
    
            {childFolders.length > 0 && (
              <div className='d-flex flex-wrap'>
                {childFolders.map((childFolder) => (
                  <div
                    key={childFolder.id}
                    style={{ maxWidth: '250px' }}
                    className='p-2'
                  >
                    <Folder folder={childFolder}></Folder>
                  </div>
                ))}
              </div>
            )}
          </Container>
        </>
      )
    }
    export default Hero