46 lines
1.5 KiB
JavaScript
46 lines
1.5 KiB
JavaScript
import * as React from "react";
|
|
import useSWR from "swr";
|
|
|
|
import { Table, TableBody, TableCell, TableRow } from "../Table";
|
|
import { ContainerLoadingIndicator } from "../LoadingIndicator";
|
|
import useFormattedFilesData from "../FileList/useFormattedFilesData";
|
|
|
|
import { ViewAllLink } from "./ViewAllLink";
|
|
|
|
export default function ActivityTable({ type }) {
|
|
const { data, error } = useSWR(`user/${type}?pageSize=3`);
|
|
const items = useFormattedFilesData(data?.items || []);
|
|
|
|
if (!items.length) {
|
|
return (
|
|
<div className="flex w-full h-full justify-center items-center text-palette-400">
|
|
{/* TODO: proper error message */}
|
|
{!data && !error && <ContainerLoadingIndicator />}
|
|
{!data && error && <p>An error occurred while loading this data.</p>}
|
|
{data && !error && <p>No files found.</p>}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<Table style={{ tableLayout: "fixed" }}>
|
|
<TableBody>
|
|
{items.map(({ id, name, type, size, date, skylink }) => (
|
|
<TableRow key={id}>
|
|
<TableCell>{name}</TableCell>
|
|
<TableCell className="w-[80px]">{type}</TableCell>
|
|
<TableCell className="w-[80px]" align="right">
|
|
{size}
|
|
</TableCell>
|
|
<TableCell className="w-[180px]">{date}</TableCell>
|
|
<TableCell>{skylink}</TableCell>
|
|
</TableRow>
|
|
))}
|
|
</TableBody>
|
|
</Table>
|
|
<ViewAllLink to={`/files?tab=${type}`} />
|
|
</>
|
|
);
|
|
}
|