pilothub 0.0.1 → 0.0.2

package/src/routes/index.tsx

@@ -1,252 +0,0 @@
-import { createFileRoute, Link } from '@tanstack/react-router'
-import { useAction, useQuery } from 'convex/react'
-import { useEffect, useMemo, useRef, useState } from 'react'
-import { api } from '../../convex/_generated/api'
-import { InstallSwitcher } from '../components/InstallSwitcher'
-import { SkillCard } from '../components/SkillCard'
-import { SoulCard } from '../components/SoulCard'
-import { getSkillBadges } from '../lib/badges'
-import type { PublicSkill, PublicSoul } from '../lib/publicUser'
-import { getSiteMode } from '../lib/site'
-
-export const Route = createFileRoute('/')({
-  component: Home,
-})
-
-function Home() {
-  const mode = getSiteMode()
-  return mode === 'souls' ? <OnlyCrabsHome /> : <SkillsHome />
-}
-
-function SkillsHome() {
-  const highlighted =
-    (useQuery(api.skills.list, {
-      batch: 'highlighted',
-      limit: 6,
-    }) as PublicSkill[]) ?? []
-  const latest = (useQuery(api.skills.list, { limit: 12 }) as PublicSkill[]) ?? []
-
-  return (
-    <main>
-      <section className="hero">
-        <div className="hero-inner">
-          <div className="hero-copy fade-up" data-delay="1">
-            <span className="hero-badge">Lobster-light. Agent-right.</span>
-            <h1 className="hero-title">PilotHub, the skill dock for sharp agents.</h1>
-            <p className="hero-subtitle">
-              Upload AgentSkills bundles, version them like npm, and make them searchable with
-              vectors. No gatekeeping, just signal.
-            </p>
-            <div style={{ display: 'flex', gap: 12, marginTop: 20 }}>
-              <Link to="/upload" search={{ updateSlug: undefined }} className="btn btn-primary">
-                Publish a skill
-              </Link>
-              <Link
-                to="/skills"
-                search={{
-                  q: undefined,
-                  sort: undefined,
-                  dir: undefined,
-                  highlighted: undefined,
-                  view: undefined,
-                  focus: undefined,
-                }}
-                className="btn"
-              >
-                Browse skills
-              </Link>
-            </div>
-          </div>
-          <div className="hero-card hero-search-card fade-up" data-delay="2">
-            <div className="hero-install" style={{ marginTop: 18 }}>
-              <div className="stat">Search skills. Versioned, rollback-ready.</div>
-              <InstallSwitcher exampleSlug="sonoscli" />
-            </div>
-          </div>
-        </div>
-      </section>
-
-      <section className="section">
-        <h2 className="section-title">Highlighted skills</h2>
-        <p className="section-subtitle">Curated signal — highlighted for quick trust.</p>
-        <div className="grid">
-          {highlighted.length === 0 ? (
-            <div className="card">No highlighted skills yet.</div>
-          ) : (
-            highlighted.map((skill) => (
-              <SkillCard
-                key={skill._id}
-                skill={skill}
-                badge={getSkillBadges(skill)}
-                summaryFallback="A fresh skill bundle."
-                meta={
-                  <div className="stat">
-                    ⭐ {skill.stats.stars} · ⤓ {skill.stats.downloads} · ⤒{' '}
-                    {skill.stats.installsAllTime ?? 0}
-                  </div>
-                }
-              />
-            ))
-          )}
-        </div>
-      </section>
-
-      <section className="section">
-        <h2 className="section-title">Latest drops</h2>
-        <p className="section-subtitle">Newest uploads across the registry.</p>
-        <div className="grid">
-          {latest.length === 0 ? (
-            <div className="card">No skills yet. Be the first.</div>
-          ) : (
-            latest.map((skill) => (
-              <SkillCard
-                key={skill._id}
-                skill={skill}
-                summaryFallback="Agent-ready skill pack."
-                meta={
-                  <div className="stat">
-                    {skill.stats.versions} versions · ⤓ {skill.stats.downloads} · ⤒{' '}
-                    {skill.stats.installsAllTime ?? 0}
-                  </div>
-                }
-              />
-            ))
-          )}
-        </div>
-        <div className="section-cta">
-          <Link
-            to="/skills"
-            search={{
-              q: undefined,
-              sort: undefined,
-              dir: undefined,
-              highlighted: undefined,
-              view: undefined,
-              focus: undefined,
-            }}
-            className="btn"
-          >
-            See all skills
-          </Link>
-        </div>
-      </section>
-    </main>
-  )
-}
-
-function OnlyCrabsHome() {
-  const navigate = Route.useNavigate()
-  const ensureSoulSeeds = useAction(api.seed.ensureSoulSeeds)
-  const latest = (useQuery(api.souls.list, { limit: 12 }) as PublicSoul[]) ?? []
-  const [query, setQuery] = useState('')
-  const seedEnsuredRef = useRef(false)
-  const trimmedQuery = useMemo(() => query.trim(), [query])
-
-  useEffect(() => {
-    if (seedEnsuredRef.current) return
-    seedEnsuredRef.current = true
-    void ensureSoulSeeds({})
-  }, [ensureSoulSeeds])
-
-  return (
-    <main>
-      <section className="hero">
-        <div className="hero-inner">
-          <div className="hero-copy fade-up" data-delay="1">
-            <span className="hero-badge">SOUL.md, shared.</span>
-            <h1 className="hero-title">SoulHub, where system lore lives.</h1>
-            <p className="hero-subtitle">
-              Share SOUL.md bundles, version them like docs, and keep personal system lore in one
-              public place.
-            </p>
-            <div style={{ display: 'flex', gap: 12, marginTop: 20 }}>
-              <Link to="/upload" search={{ updateSlug: undefined }} className="btn btn-primary">
-                Publish a soul
-              </Link>
-              <Link
-                to="/souls"
-                search={{
-                  q: undefined,
-                  sort: undefined,
-                  dir: undefined,
-                  view: undefined,
-                  focus: undefined,
-                }}
-                className="btn"
-              >
-                Browse souls
-              </Link>
-            </div>
-          </div>
-          <div className="hero-card hero-search-card fade-up" data-delay="2">
-            <form
-              className="search-bar"
-              onSubmit={(event) => {
-                event.preventDefault()
-                void navigate({
-                  to: '/souls',
-                  search: {
-                    q: trimmedQuery || undefined,
-                    sort: undefined,
-                    dir: undefined,
-                    view: undefined,
-                    focus: undefined,
-                  },
-                })
-              }}
-            >
-              <span className="mono">/</span>
-              <input
-                className="search-input"
-                placeholder="Search souls, prompts, or lore"
-                value={query}
-                onChange={(event) => setQuery(event.target.value)}
-              />
-            </form>
-            <div className="hero-install" style={{ marginTop: 18 }}>
-              <div className="stat">Search souls. Versioned, readable, easy to remix.</div>
-            </div>
-          </div>
-        </div>
-      </section>
-
-      <section className="section">
-        <h2 className="section-title">Latest souls</h2>
-        <p className="section-subtitle">Newest SOUL.md bundles across the hub.</p>
-        <div className="grid">
-          {latest.length === 0 ? (
-            <div className="card">No souls yet. Be the first.</div>
-          ) : (
-            latest.map((soul) => (
-              <SoulCard
-                key={soul._id}
-                soul={soul}
-                summaryFallback="A SOUL.md bundle."
-                meta={
-                  <div className="stat">
-                    ⭐ {soul.stats.stars} · ⤓ {soul.stats.downloads} · {soul.stats.versions} v
-                  </div>
-                }
-              />
-            ))
-          )}
-        </div>
-        <div className="section-cta">
-          <Link
-            to="/souls"
-            search={{
-              q: undefined,
-              sort: undefined,
-              dir: undefined,
-              view: undefined,
-              focus: undefined,
-            }}
-            className="btn"
-          >
-            See all souls
-          </Link>
-        </div>
-      </section>
-    </main>
-  )
-}