Files
graff-mate-client/src/components/SessionFiles.tsx
T
2025-06-17 12:27:42 +05:00

58 lines
1.4 KiB
TypeScript

import { Session } from "../types/Session";
import ChevronRightIcon from "./icons/ChevronRightIcon";
import FilledHomeIcon from "./icons/FilledHomeIcon";
interface SessionFilesProps {
files: { filename: string; size: number }[];
session: Session;
}
function SessionFiles({ files, session }: SessionFilesProps) {
return (
<div>
{files.map((file) => (
<SessionFile
{...file}
key={file.filename}
link={`http://${session.server.ipAddress}:3001/files/${
session.app.fileName
}/${new Date(session.createdAt).getTime()}/${file.filename}`}
/>
))}
</div>
);
}
export default SessionFiles;
export function SessionFile({
link,
filename,
size,
}: {
link: string;
filename: string;
size: number;
}) {
return (
<a
href={link}
target="_blank"
className="flex gap-[0.833vw] items-center px-[0.833vw] py-[0.556vw]"
>
<div className="p-[0.972vw] bg-[#F6F6F6] rounded-[0.556vw]">
<div className="size-[1.389vw] text-[#7D7D7D]">
<FilledHomeIcon />
</div>
</div>
<div className="space-y-[0.278vw] flex-1">
<p className="button-m font-medium">{filename}</p>
<p className="text-[#BDBDBD] caption-s font-medium">{size}</p>
</div>
<span className="size-[1.389vw] text-[#7D7D7D]">
<ChevronRightIcon />
</span>
</a>
);
}