diff options
| author | Manuel Palenzuela Merino <manuel.palenzuela@datadoghq.com> | 2024-07-10 12:04:51 +0200 |
|---|---|---|
| committer | Manuel Palenzuela Merino <manuel.palenzuela@datadoghq.com> | 2024-07-10 12:04:51 +0200 |
| commit | 2eccd5eb475b3b9f6080ce8d70189b5da2b531fb (patch) | |
| tree | 49f23b9557b553a00a2576637a9f8a14fd4f9e9b | |
| parent | Pages: Recent: Add pagination (diff) | |
| download | fs-tracer-frontend-2eccd5eb475b3b9f6080ce8d70189b5da2b531fb.tar.gz fs-tracer-frontend-2eccd5eb475b3b9f6080ce8d70189b5da2b531fb.tar.bz2 fs-tracer-frontend-2eccd5eb475b3b9f6080ce8d70189b5da2b531fb.zip | |
Pages: Recent: Style
| -rw-r--r-- | TODO | 2 | ||||
| -rw-r--r-- | src/pages/Recent.tsx | 30 |
2 files changed, 19 insertions, 13 deletions
diff --git a/TODO b/TODO index 26f68ca..fc224b7 100644 --- a/TODO +++ b/TODO @@ -1,2 +1,2 @@ -Deploy somewhere +we should probably use UUIDs for files instead of IDs we can save the time it takes to execute syscalls diff --git a/src/pages/Recent.tsx b/src/pages/Recent.tsx index 19c681f..76d9e2a 100644 --- a/src/pages/Recent.tsx +++ b/src/pages/Recent.tsx @@ -23,7 +23,6 @@ export default function Recent(props: any) { const { data, error } = await props.supabase .from('file') .select().range(paginationOffset, paginationOffset + numOfFilesToShow - 1) - //.limit(10).offset(paginationOffset) if (error) { console.error(error) return @@ -44,17 +43,24 @@ export default function Recent(props: any) { <> <div className="flex h-screen"> <SideBar currentPage="Recent" /> - <main className="flex-1 overflow-y-auto"> - <button onClick={() => setPaginationOffset(paginationOffset + numOfFilesToShow)}> - clickmeforpaginate - </button> - <div> - {files.map((file: any) => ( - <div key={file.id}> - <p className="underline">file: {file.absolute_path}</p> - </div> - )) - } + <main className="flex-1 overflow-y-auto my-4"> + <div className="flex flex-col items-center"> + <div className="flex flex-col gap-2"> + {files.map((file: any) => ( + <div key={file.id} role="button" onClick={() => console.log("clocked file")}> + <p className="underline">file: {file.absolute_path}</p> + </div> + )) + } + </div> + </div> + <div className="flex flex-row gap-2 mt-4"> + <button className="ml-7 bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded" onClick={() => setPaginationOffset(paginationOffset + -numOfFilesToShow)}> + prev + </button> + <button className="mr-7 ml-auto bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded" onClick={() => setPaginationOffset(paginationOffset + numOfFilesToShow)}> + next + </button> </div> </main> </div> |