portal-dashboard/app/components/file-card.tsx

38 lines
1.1 KiB
TypeScript
Raw Permalink Normal View History

import { FolderIcon, MoreIcon, RecentIcon } from "./icons";
2024-03-12 03:40:23 +00:00
export enum FileTypes {
Folder = "FOLDER",
Document = "DOCUMENT",
Image = "IMAGE",
}
interface FileCardProps {
type: FileTypes;
fileName: string;
createdAt: string;
size: string;
}
export const FileCardList = ({ children }: React.PropsWithChildren<{}>) => {
return <div className="flex flex-row gap-x-8">{children}</div>;
};
export const FileCard = ({ type, fileName, createdAt, size }: FileCardProps) => {
return (
<div className="border-1 rounded-lg p-4 w-[calc((100%/4))]">
<div className="flex justify-end">
<MoreIcon className="text-ring/50" />
</div>
<FolderIcon className="text-ring" />
<span className="block font-semibold my-4">{fileName}</span>
<div className="flex justify-between items-center">
<span className="text-primary-2 font-semibold text-sm">{size}</span>
<div className="flex items-center space-x-2 text-primary-2">
<RecentIcon />
<span className="font-semibold text-sm">{createdAt}</span>
</div>
</div>
</div>
);
};