import { faFile, faFolder } from "@fortawesome/free-solid-svg-icons" import { FontAwesomeIcon } from "@fortawesome/react-fontawesome" import { Link as MuiLink } from "@mui/material" import Head from 'next/head' import Link from 'next/link' import { useEffect, useState } from 'react' import { useCookies } from 'react-cookie' import styled from 'styled-components' import api from '../../api' const Table = styled.table` border: 1px solid; width: 80vw; border-collapse: collapse; thead { background-color: #01754b; color: white; } tr, td { border: 1px solid #000; padding: 8px; } a { text-decoration: none; } a:hover { cursor: pointer; } ` const Icon = styled(FontAwesomeIcon)` padding-right: 5px; padding-left: 5px; ` export default function Files() { const [cookies] = useCookies(["token"]) const [path, setPath] = useState("") const [files, setFiles] = useState([{ name: "", size: "", modified: "" }]) const [folders, setFolders] = useState([{ name: "", size: "", modified: "" }]) const refresh = (path: string) => { api.list(path, cookies.token) .then(data => { setPath(path) setFolders(data.dirs) setFiles(data.files) }) .catch(err => console.error(err)) } useEffect(() => { const params = new URLSearchParams(window.location.search) const path = params.get("dir") || "" api.list(path, cookies.token) .then(data => { setPath(path) setFolders(data.dirs) setFiles(data.files) }) .catch(err => console.error(err)) }, [cookies]) return ( <>
Name | Size | Modified |