File size: 2,167 Bytes
38c5e89 945c6bb 5786921 d378496 a447b30 30f44e6 38c5e89 65d87c5 30f44e6 a447b30 31d949e 65d87c5 30f44e6 65d87c5 a447b30 31d949e 38c5e89 945c6bb 38c5e89 945c6bb 5786921 30f44e6 65d87c5 4ed1d4f 65d87c5 30f44e6 65d87c5 4ed1d4f 65d87c5 5786921 945c6bb 38c5e89 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 |
import Head from "next/head";
import Container from "@mui/material/Container";
import { Stack } from "@mui/material";
import { DividerBox } from "@/components/base/boxes";
import { useCallback, useEffect, useState } from "react";
import { HF_FileEntry, HFRes } from "@/types";
import { basename } from "path";
export default function Home() {
const [repo, setRepo] = useState('https://huggingface.co/datasets/banned-historical-archives/cankaoxiaoxi/tree/main');
const [path, setPath] = useState('1990');
const [entries, setEntries] = useState<HF_FileEntry[]>([])
const [next, setNext] = useState('')
const update = useCallback(
(async () => {
const res = (await ((await fetch(`/api/get_file_list?repo=${encodeURIComponent(repo)}&path=${encodeURIComponent(path)}`)).json())) as HFRes;
setEntries(res.entries);
setNext(res.nextURL!);
}), [repo, path]
)
useEffect(() => {
update()
}, [])
return (
<>
<Head>
<title>nextjs-docker-starter</title>
<link rel="icon" href="/favicon.ico" />
<meta name="description" content="Next.js in Docker on 🤗 Spaces" />
</Head>
<Container component="main" sx={{ minHeight: "90vh" }}>
<Stack spacing={4} useFlexGap>
<input value={repo} onChange={e => setRepo(e.target.value)}/>
<input value={path} onChange={e => setPath(e.target.value)}/>
<button onClick={update}>update</button>
{entries.map(i => <div key={i.path} style={{display: 'flex'}}>
<div style={{flex: 1}} onClick={() => {
if (i.type =='directory') {
setPath(i.path);
setTimeout(update, 100);
}
}}>{basename(i.path)}</div>
<div style={{flex: 1}}>{i.size}</div>
<div style={{flex: 1}}>{i.type}</div>
</div>)}
{next ?
<button onClick={async () => {
const data = await (await fetch(next)).json() as HFRes;
setEntries([...entries, ...data.entries]);
setNext(data.nextURL!)
}}>more</button> : null}
</Stack>
</Container>
</>
);
}
|