feat: closes #21
This commit is contained in:
parent
7fec1f0543
commit
ffef784f50
|
@ -589,3 +589,22 @@ export const ExclamationCircleIcon = ({
|
|||
</svg>
|
||||
);
|
||||
};
|
||||
|
||||
export const DownloadIcon = ({ className }: { className?: string }) => {
|
||||
return (
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
strokeWidth={1.5}
|
||||
stroke="currentColor"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
className={className}>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
d="M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5M16.5 12 12 16.5m0 0L7.5 12m4.5 4.5V3"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
};
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import { TrashIcon } from "@radix-ui/react-icons";
|
||||
import type { ColumnDef } from "@tanstack/react-table";
|
||||
import { FileIcon, MoreIcon } from "~/components/icons";
|
||||
import { DownloadIcon, FileIcon, MoreIcon } from "~/components/icons";
|
||||
import { Checkbox } from "~/components/ui/checkbox";
|
||||
import {
|
||||
DropdownMenu,
|
||||
|
@ -14,6 +14,7 @@ import { cn } from "~/utils";
|
|||
import type { FileItem } from "~/data/file-provider";
|
||||
import { usePinning } from "~/hooks/usePinning";
|
||||
import filesize from "~/components/lib/filesize";
|
||||
import { Button } from "~/components/ui/button";
|
||||
|
||||
|
||||
// This type is used to define the shape of our data.
|
||||
|
@ -50,19 +51,15 @@ export const columns: ColumnDef<FileItem>[] = [
|
|||
enableHiding: false,
|
||||
},
|
||||
{
|
||||
accessorKey: "name",
|
||||
header: "Name",
|
||||
accessorKey: "cid",
|
||||
header: "CID",
|
||||
cell: ({ row }) => (
|
||||
<div className="flex items-center gap-x-2">
|
||||
<FileIcon />
|
||||
{row.getValue("name")}
|
||||
{row.getValue("name") ?? row.getValue("cid")}
|
||||
</div>
|
||||
),
|
||||
},
|
||||
{
|
||||
accessorKey: "cid",
|
||||
header: "CID",
|
||||
},
|
||||
{
|
||||
accessorKey: "size",
|
||||
header: "Size",
|
||||
|
@ -82,12 +79,20 @@ export const columns: ColumnDef<FileItem>[] = [
|
|||
size: 20,
|
||||
cell: ({ row }) => {
|
||||
const { unpin } = usePinning();
|
||||
const downloadFile = () => {
|
||||
// TODO: @pcfreak30 download file
|
||||
const cid = row.getValue("cid");
|
||||
console.log(cid);
|
||||
};
|
||||
return (
|
||||
<div className="flex w-5 items-center justify-between">
|
||||
<div className="flex space-x-2 w-10 items-center justify-between">
|
||||
<Button size={"icon"} variant="ghost" onClick={downloadFile}>
|
||||
<DownloadIcon className="w-5"/>
|
||||
</Button>
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger
|
||||
className={cn(
|
||||
"hidden group-hover:block data-[state=open]:block",
|
||||
"opacity-0 group-hover:opacity-100 data-[state=open]:opacity-100",
|
||||
row.getIsSelected() && "block",
|
||||
)}>
|
||||
<MoreIcon />
|
||||
|
|
Loading…
Reference in New Issue