diff --git a/src/components/LineLoader.jsx b/src/components/LineLoader.jsx
new file mode 100644
index 0000000..99c23d6
--- /dev/null
+++ b/src/components/LineLoader.jsx
@@ -0,0 +1,51 @@
+import styled, { keyframes } from 'styled-components'
+
+const BarWidthAnimation = keyframes`
+ 0% {
+ width: 40%;
+ }
+ 100% {
+ width: 25%;
+ }
+`
+
+const BarPositionAnimation = keyframes`
+ 0% {
+ left: -50%;
+ }
+ 100% {
+ left: 100%;
+ }
+`
+
+const LoaderContainer = styled.div`
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 100;
+ background-color: rgba(255,255,255,.1);
+ overflow: hidden;
+
+ ::before, ::after {
+ content: '';
+ position: absolute;
+ top: 0;
+ left: 0;
+ height: 2px;
+ width: 100%;
+ background-color: var(--primary-color);
+ }
+
+ ::after {
+ background-color: var(--secondary-color);
+ animation: ${BarWidthAnimation} 8s, ${BarPositionAnimation} 3s;
+ }
+`
+
+const LineLoader = props => {
+ return
+}
+
+export default LineLoader
\ No newline at end of file
diff --git a/src/components/fileBrowser.jsx b/src/components/fileBrowser.jsx
index 6ca403b..7c81c81 100644
--- a/src/components/fileBrowser.jsx
+++ b/src/components/fileBrowser.jsx
@@ -38,12 +38,14 @@ import CaretDown from '../assets/icons/caretDown.svg'
import bytesToString from '../utils/bytestring.js'
import { Button } from '../styled.js'
import assert from 'assert'
+import LineLoader from './LineLoader.jsx'
const FBContainer = styled.div`
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
+ position: relative;
`
// bunch of styled components
@@ -331,7 +333,6 @@ class FileBrowser extends Component {
currentPath.shift()
if (index !== currentPath.length - 1) {
- console.log("changing path", index, currentPath.length)
currentPath.length = index + 1
this.props.updateFiles(currentPath.join("/"))
@@ -386,8 +387,6 @@ class FileBrowser extends Component {
* always show folders on top
*/
renderFiles = (isNew) => {
- // console.log(this.state.files)
-
let files = [{}]
if (isNew) files = this.props.files
else files = this.state.files
@@ -434,6 +433,9 @@ class FileBrowser extends Component {
{
this.renderMenu()
}
+ {
+ this.props.loading?:""
+ }