bazilion 0.0.0 → 0.1.0

package/apps/web/src/routes/skills/index.tsx

@@ -1,297 +0,0 @@
-import type { SkillInfo } from '@bazilion/api-types'
-import { createFileRoute, useRouter } from '@tanstack/react-router'
-import { createServerFn } from '@tanstack/react-start'
-import { type ChangeEvent, type DragEvent, useRef, useState } from 'react'
-import { daemonClient } from '../../lib/daemon-client'
-
-const fetchSkills = createServerFn({ method: 'GET' }).handler(() =>
-  daemonClient().get<SkillInfo[]>('/api/skills'),
-)
-
-export const Route = createFileRoute('/skills/')({
-  loader: () => fetchSkills(),
-  component: SkillsPage,
-})
-
-type Tab = 'openclaw' | 'path' | 'zip'
-
-function SkillsPage() {
-  const skills = Route.useLoaderData()
-  const router = useRouter()
-
-  async function remove(name: string) {
-    if (!confirm(`remove skill "${name}"? this deletes the directory on disk.`)) return
-    const res = await fetch(`/api/skills/${encodeURIComponent(name)}`, { method: 'DELETE' })
-    if (!res.ok && res.status !== 204) {
-      alert(res.statusText)
-      return
-    }
-    await router.invalidate()
-  }
-
-  return (
-    <div>
-      <h1>skills</h1>
-      <ImportCard onImported={() => router.invalidate()} />
-
-      <table>
-        <thead>
-          <tr>
-            <th>name</th>
-            <th>description</th>
-            <th>source</th>
-            <th />
-          </tr>
-        </thead>
-        <tbody>
-          {skills.length === 0 && (
-            <tr>
-              <td colSpan={4} className="muted">
-                no skills installed yet
-              </td>
-            </tr>
-          )}
-          {skills.map((s) => (
-            <tr key={s.name}>
-              <td>
-                <code>{s.name}</code>
-              </td>
-              <td>
-                {s.parseError ? (
-                  <span className="text-[#9B3D3D]">parse error: {s.parseError}</span>
-                ) : (
-                  s.description
-                )}
-              </td>
-              <td className="text-[0.78em] text-mocha-light">
-                <span className="font-mono">{s.source ?? '(unknown)'}</span>
-                {s.importedAt && (
-                  <div className="font-mono">
-                    {new Date(s.importedAt).toLocaleDateString()}
-                  </div>
-                )}
-              </td>
-              <td>
-                <button type="button" className="ghost-btn" onClick={() => remove(s.name)}>
-                  remove
-                </button>
-              </td>
-            </tr>
-          ))}
-        </tbody>
-      </table>
-    </div>
-  )
-}
-
-function ImportCard({ onImported }: { onImported: () => void }) {
-  const [tab, setTab] = useState<Tab>('openclaw')
-  const [path, setPath] = useState('')
-  const [force, setForce] = useState(false)
-  const [zipFile, setZipFile] = useState<File | null>(null)
-  const [dragOver, setDragOver] = useState(false)
-  const [err, setErr] = useState<string | null>(null)
-  const [submitting, setSubmitting] = useState(false)
-  const fileInput = useRef<HTMLInputElement>(null)
-
-  async function submit(e: React.FormEvent<HTMLFormElement>) {
-    e.preventDefault()
-    setErr(null)
-    setSubmitting(true)
-    try {
-      let res: Response
-      if (tab === 'zip') {
-        if (!zipFile) {
-          setErr('choose a .zip file first')
-          setSubmitting(false)
-          return
-        }
-        const fd = new FormData()
-        fd.set('file', zipFile)
-        if (force) fd.set('force', 'true')
-        res = await fetch('/api/skills/import', { method: 'POST', body: fd })
-      } else {
-        let source: string
-        if (tab === 'openclaw') {
-          source = 'openclaw'
-        } else {
-          source = path.trim()
-          if (!source) {
-            setErr('fill in the server path')
-            setSubmitting(false)
-            return
-          }
-        }
-        res = await fetch('/api/skills/import', {
-          method: 'POST',
-          headers: { 'content-type': 'application/json' },
-          body: JSON.stringify({ source, force }),
-        })
-      }
-      if (!res.ok) {
-        const e2 = (await res.json().catch(() => null)) as { error?: string } | null
-        throw new Error(e2?.error ?? `${res.status} ${res.statusText}`)
-      }
-      setPath('')
-      setZipFile(null)
-      onImported()
-    } catch (e2) {
-      setErr((e2 as Error).message)
-    } finally {
-      setSubmitting(false)
-    }
-  }
-
-  function onFileChange(e: ChangeEvent<HTMLInputElement>) {
-    const f = e.target.files?.[0] ?? null
-    setZipFile(f)
-  }
-  function onDrop(e: DragEvent<HTMLLabelElement>) {
-    e.preventDefault()
-    setDragOver(false)
-    const files = e.dataTransfer?.files
-    if (!files || files.length === 0) return
-    const f = files[0]
-    if (!f) return
-    if (!/\.zip$/i.test(f.name)) {
-      setErr('only .zip archives are supported')
-      return
-    }
-    setZipFile(f)
-    if (fileInput.current) {
-      // Sync the underlying input so the label reflects state if anyone reads it.
-      const dt = new DataTransfer()
-      dt.items.add(f)
-      fileInput.current.files = dt.files
-    }
-  }
-
-  return (
-    <section className="card">
-      <h3 className="mb-1">import skills</h3>
-      <p className="muted mb-3 text-[0.88em]">
-        pick a source. Each skill's <code>SKILL.md</code> body is injected into the system
-        prompt of any agent it's attached to.
-      </p>
-
-      <div
-        role="tablist"
-        className="mb-4 inline-flex gap-0 rounded-md border border-frost bg-ivory p-1"
-      >
-        {[
-          { id: 'openclaw' as const, label: 'OpenClaw' },
-          { id: 'path' as const, label: 'server directory' },
-          { id: 'zip' as const, label: 'upload zip' },
-        ].map((it) => (
-          <button
-            key={it.id}
-            type="button"
-            role="tab"
-            aria-selected={tab === it.id}
-            onClick={() => {
-              setTab(it.id)
-              setErr(null)
-            }}
-            className={`unstyled cursor-pointer rounded-sm border-none bg-transparent px-3 py-1.5 text-[0.88em] font-medium transition-colors ${
-              tab === it.id
-                ? 'bg-snow text-sapphire-deep shadow-baziu-sm'
-                : 'text-mocha hover:text-sapphire'
-            }`}
-          >
-            {it.label}
-          </button>
-        ))}
-      </div>
-
-      {err && <div className="err">{err}</div>}
-
-      <form onSubmit={submit}>
-        {tab === 'openclaw' && (
-          <p className="text-[0.92em] text-mocha">
-            One-click import of every skill found in <code>~/.openclaw/skills</code> on the
-            server.
-          </p>
-        )}
-        {tab === 'path' && (
-          <>
-            <p className="text-[0.92em] text-mocha">
-              Import from an absolute path on the server — either a single skill folder
-              (contains <code>SKILL.md</code>) or a parent folder holding many skill subfolders.
-            </p>
-            <label>
-              server path
-              <input
-                value={path}
-                onChange={(e) => setPath(e.target.value)}
-                placeholder="/home/you/my-skills"
-                required
-              />
-            </label>
-          </>
-        )}
-        {tab === 'zip' && (
-          <>
-            <p className="text-[0.92em] text-mocha">
-              Upload a <code>.zip</code> archive whose top level contains one folder per skill —
-              the folder name becomes the skill name.
-            </p>
-            <label
-              onDragOver={(e) => {
-                e.preventDefault()
-                setDragOver(true)
-              }}
-              onDragLeave={() => setDragOver(false)}
-              onDrop={onDrop}
-              className={`block cursor-pointer rounded-md border-2 border-dashed p-6 text-center transition-colors ${
-                dragOver
-                  ? 'border-sapphire bg-sapphire-glow text-sapphire-deep'
-                  : zipFile
-                    ? 'border-solid border-sapphire-light bg-snow text-chocolate'
-                    : 'border-frost bg-ivory text-mocha-light hover:border-sapphire hover:bg-sapphire-glow hover:text-sapphire-deep'
-              }`}
-            >
-              <input
-                ref={fileInput}
-                type="file"
-                accept=".zip,application/zip"
-                onChange={onFileChange}
-                className="absolute h-px w-px overflow-hidden opacity-0"
-              />
-              {zipFile ? (
-                <span className="block break-all font-mono text-[0.85em] text-sapphire-deep">
-                  {zipFile.name}
-                </span>
-              ) : (
-                <>
-                  <span className="block text-[0.95em] font-medium text-mocha">
-                    click to choose a .zip file
-                  </span>
-                  <span className="text-[0.82em]">or drag &amp; drop here</span>
-                </>
-              )}
-            </label>
-          </>
-        )}
-        <div className="mt-3 flex flex-wrap items-center gap-3">
-          <button type="submit" disabled={submitting}>
-            {submitting
-              ? 'importing…'
-              : tab === 'zip'
-                ? 'upload & import'
-                : tab === 'openclaw'
-                  ? 'import from OpenClaw'
-                  : 'import'}
-          </button>
-          <label className="m-0 inline-flex cursor-pointer items-center text-[0.88em] text-mocha">
-            <input
-              type="checkbox"
-              checked={force}
-              onChange={(e) => setForce(e.target.checked)}
-            />
-            overwrite existing
-          </label>
-        </div>
-      </form>
-    </section>
-  )
-}

package/apps/web/src/routes/welcome.tsx

@@ -1,61 +0,0 @@
-import { createFileRoute, redirect } from '@tanstack/react-router'
-import { fetchAuthState } from '../lib/auth'
-
-export const Route = createFileRoute('/welcome')({
-  beforeLoad: async () => {
-    // The root middleware already redirected here when setup wasn't done.
-    // If the user lands directly (or completed setup in another tab), bounce
-    // to the homepage — no point lingering on the welcome screen.
-    const auth = await fetchAuthState()
-    if (auth.setupComplete) {
-      throw redirect({ to: '/' })
-    }
-  },
-  component: WelcomePage,
-})
-
-function WelcomePage() {
-  return (
-    <div className="mx-auto max-w-2xl">
-      <div className="card">
-        <h1>Welcome to bazilion</h1>
-        <p className="muted my-3">
-          Before you can spawn agents, pick a provider and give it at least one model. Once you
-          do, a <code>default</code> profile (and a <code>default</code> group directory) are
-          created automatically and the rest of the app unlocks.
-        </p>
-        <ol className="my-5 space-y-4">
-          <Step n={1}>
-            <strong>Configure credentials.</strong> Head to the{' '}
-            <a href="/config">providers tab</a> and set the API key or local URL for the service
-            you want to use (Anthropic, OpenAI, Ollama, LMStudio, …).
-          </Step>
-          <Step n={2}>
-            <strong>Enable the provider + add a model.</strong> Flip the provider's toggle on
-            and list at least one concrete model name (e.g. <code>claude-opus-4-6</code> or{' '}
-            <code>llama3.2</code>).
-          </Step>
-          <Step n={3}>
-            <strong>Start chatting.</strong> You'll be redirected to the home page
-            automatically, where a <code>default</code> profile is waiting for a first spawn.
-          </Step>
-        </ol>
-        <a
-          href="/config"
-          className="inline-flex items-center gap-2 rounded-md bg-sapphire px-4 py-2 text-[0.92em] font-semibold text-snow no-underline transition-colors hover:bg-sapphire-deep"
-        >
-          Go to config →
-        </a>
-      </div>
-    </div>
-  )
-}
-
-function Step({ n, children }: { n: number; children: React.ReactNode }) {
-  return (
-    <li className="grid grid-cols-[2rem_1fr] gap-3 border-t border-frost pt-3 first:border-t-0 first:pt-0">
-      <span className="text-center font-display text-xl text-sapphire">{n}</span>
-      <div className="text-[0.92em] leading-relaxed text-mocha">{children}</div>
-    </li>
-  )
-}