Hermes
78 lines
2.5 KiB
TypeScript
78 lines
2.5 KiB
TypeScript
"use client";
|
|
|
|
import Link from "next/link";
|
|
import { Puzzle, Timer, Sparkles, Settings } from "lucide-react";
|
|
import { useQueryClient } from "@tanstack/react-query";
|
|
import { StatusCard } from "@/components/StatusCard";
|
|
import { StatsCard } from "@/components/StatsCard";
|
|
import { SessionCard } from "@/components/SessionCard";
|
|
import { MemorySnapshotCard } from "@/components/MemorySnapshotCard";
|
|
import { useSessions } from "@/lib/hooks";
|
|
import { usePullToRefresh } from "@/lib/usePullToRefresh";
|
|
|
|
const QUICK_LINKS = [
|
|
{ href: "/skills", label: "Skills", icon: Puzzle, color: "#a78bfa" },
|
|
{ href: "/cron", label: "Cron", icon: Timer, color: "#f59e0b" },
|
|
{ href: "/soul", label: "Soul", icon: Sparkles, color: "#ec4899" },
|
|
{ href: "/config", label: "Config", icon: Settings, color: "#6b7280" },
|
|
] as const;
|
|
|
|
export default function PulsePage() {
|
|
const qc = useQueryClient();
|
|
const { data: sessionsData, isLoading } = useSessions(8);
|
|
|
|
usePullToRefresh(() => {
|
|
qc.invalidateQueries();
|
|
});
|
|
|
|
return (
|
|
<div className="space-y-4">
|
|
<h1 className="text-xl font-bold" style={{ color: "#f59e0b" }}>
|
|
Pulse
|
|
</h1>
|
|
|
|
<StatusCard />
|
|
<StatsCard />
|
|
<MemorySnapshotCard />
|
|
|
|
<div className="grid grid-cols-4 gap-2">
|
|
{QUICK_LINKS.map(({ href, label, icon: Icon, color }) => (
|
|
<Link key={href} href={href}>
|
|
<div className="glass glass-hover p-3 flex flex-col items-center gap-1.5 transition-all">
|
|
<Icon size={18} style={{ color }} />
|
|
<span className="text-[11px] font-medium" style={{ color }}>{label}</span>
|
|
</div>
|
|
</Link>
|
|
))}
|
|
</div>
|
|
|
|
<div>
|
|
<h2 className="text-sm font-medium text-zinc-400 mb-2">
|
|
Recent Sessions
|
|
</h2>
|
|
{isLoading ? (
|
|
<div className="space-y-3">
|
|
{[...Array(3)].map((_, i) => (
|
|
<div key={i} className="glass p-4 animate-pulse">
|
|
<div className="h-4 bg-white/[0.06] rounded w-3/4 mb-2" />
|
|
<div className="h-3 bg-white/[0.06] rounded w-1/2" />
|
|
</div>
|
|
))}
|
|
</div>
|
|
) : (
|
|
<div className="space-y-2">
|
|
{sessionsData?.items?.map((s) => (
|
|
<SessionCard key={s.id} session={s} />
|
|
))}
|
|
{sessionsData?.items?.length === 0 && (
|
|
<div className="glass p-6 text-center text-sm text-zinc-500">
|
|
No sessions yet
|
|
</div>
|
|
)}
|
|
</div>
|
|
)}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|