rqbit/crates/librqbit/webui/src/components/Footer.tsx
2024-08-21 13:40:43 +01:00

20 lines
790 B
TypeScript

import { formatBytes } from "../helper/formatBytes";
import { formatSecondsToTime } from "../helper/formatSecondsToTime";
import { useStatsStore } from "../stores/statsStore";
export const Footer: React.FC<{}> = () => {
let stats = useStatsStore((stats) => stats.stats);
return (
<div className="sticky bottom-0 bg-white/10 dark:text-gray-200 backdrop-blur text-nowrap text-xs font-medium text-gray-500 flex p-1 gap-x-3 justify-center">
<div>
{stats.download_speed.human_readable} (total{" "}
{formatBytes(stats.fetched_bytes)})
</div>
<div>
{stats.upload_speed.human_readable} (total{" "}
{formatBytes(stats.uploaded_bytes)})
</div>
<div>up {formatSecondsToTime(stats.uptime_seconds)}</div>
</div>
);
};