Files
hermes-os/app/page.tsx
T
Hermes f721d87423 Add Skills browser, Cron jobs, SOUL.md editor
- Skills: categorized list with search, detail view with markdown
- Cron: job list grouped by status, manual trigger button
- Soul: full SOUL.md editor with save/revert
- Pulse: quick link cards to Skills, Cron, Soul
- All routes proxied server-side (no CORS)
2026-04-09 20:59:33 -05:00

69 lines
2.2 KiB
TypeScript

"use client";
import Link from "next/link";
import { Puzzle, Timer, Sparkles } from "lucide-react";
import { StatusCard } from "@/components/StatusCard";
import { SessionCard } from "@/components/SessionCard";
import { MemorySnapshotCard } from "@/components/MemorySnapshotCard";
import { useSessions } from "@/lib/hooks";
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" },
] as const;
export default function PulsePage() {
const { data: sessionsData, isLoading } = useSessions(8);
return (
<div className="space-y-4">
<h1 className="text-xl font-bold" style={{ color: "#f59e0b" }}>
Pulse
</h1>
<StatusCard />
<MemorySnapshotCard />
{/* Quick links */}
<div className="grid grid-cols-3 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>
);
}