kennel 0.2.13 → 0.2.15

package/kernel/apps/web/src/project-search-dialog.tsx

@@ -1,257 +0,0 @@
-import { useCallback, useDeferredValue, useEffect, useState } from "react"
-import { useNavigate } from "@tanstack/react-router"
-import { api } from "~/api-client"
-import {
-  ArrowUpRight,
-  CornerDownLeft,
-  FolderGit2,
-  LoaderCircle,
-} from "lucide-react"
-
-import {
-  CommandDialog,
-  CommandEmpty,
-  CommandGroup,
-  CommandInput,
-  CommandItem,
-  CommandList,
-} from "@raggle-ai/ui/components/command"
-
-import type { LocalProjectSearchItem } from "./project-search"
-import { folderSectionHref } from "./viewer-route"
-
-function isEditableTarget(target: EventTarget | null) {
-  if (!(target instanceof HTMLElement)) return false
-  if (target.isContentEditable) return true
-  return ["INPUT", "SELECT", "TEXTAREA"].includes(target.tagName)
-}
-
-export function ProjectSearchDialog({
-  onOpenChange,
-  open: openProp,
-}: {
-  onOpenChange?: (open: boolean) => void
-  open?: boolean
-}) {
-  const [internalOpen, setInternalOpen] = useState(false)
-  const open = openProp ?? internalOpen
-  const setOpen = onOpenChange ?? setInternalOpen
-  const [query, setQuery] = useState("")
-  const [items, setItems] = useState<LocalProjectSearchItem[]>([])
-  const [loading, setLoading] = useState(false)
-  const [error, setError] = useState("")
-  const deferredQuery = useDeferredValue(query)
-  const navigate = useNavigate()
-  const updateOpen = useCallback(
-    (value: boolean | ((open: boolean) => boolean)) => {
-      const next = typeof value === "function" ? value(open) : value
-      setOpen(next)
-    },
-    [open, setOpen],
-  )
-
-  useEffect(() => {
-    const onKeyDown = (event: KeyboardEvent) => {
-      if (!(event.metaKey || event.ctrlKey)) return
-      if (event.key.toLocaleLowerCase() !== "k") return
-      if (isEditableTarget(event.target)) return
-      event.preventDefault()
-      updateOpen((current) => !current)
-    }
-    window.addEventListener("keydown", onKeyDown)
-    return () => window.removeEventListener("keydown", onKeyDown)
-  }, [updateOpen])
-
-  useEffect(() => {
-    if (!open) return
-
-    const controller = new AbortController()
-    const loadingTimer = window.setTimeout(() => setLoading(true), 0)
-    void api
-      .projectSearch(deferredQuery, { signal: controller.signal })
-      .then((result) => {
-        setItems(result.items)
-        setError("")
-      })
-      .catch((reason: unknown) => {
-        if (controller.signal.aborted) return
-        setItems([])
-        setError(
-          reason instanceof Error
-            ? reason.message
-            : "Could not search local projects.",
-        )
-      })
-      .finally(() => {
-        if (!controller.signal.aborted) setLoading(false)
-      })
-    return () => {
-      window.clearTimeout(loadingTimer)
-      controller.abort()
-    }
-  }, [deferredQuery, open])
-
-  useEffect(() => {
-    if (open) return
-    const resetTimer = window.setTimeout(() => {
-      setQuery("")
-      setError("")
-    }, 0)
-    return () => window.clearTimeout(resetTimer)
-  }, [open])
-
-  return (
-    <CommandDialog
-      className="border-[rgb(255_255_255/0.72)]
-        bg-[linear-gradient(180deg,rgb(255_255_255/0.88),rgb(249_248_246/0.82))]
-        shadow-[0_20px_60px_rgb(31_41_55/0.12),0_6px_20px_rgb(31_41_55/0.08),inset_0_1px_0_rgb(255_255_255/0.7)]
-        backdrop-blur-[28px] backdrop-saturate-[140%] sm:max-w-3xl
-        [&_[data-slot=command-group]_[cmdk-group-heading]]:pt-[0.9rem]
-        [&_[data-slot=command-group]_[cmdk-group-heading]]:pb-[0.6rem]
-        [&_[data-slot=command-group]_[cmdk-group-heading]]:text-[0.8rem]
-        [&_[data-slot=command-group]_[cmdk-group-heading]]:font-bold
-        [&_[data-slot=command-group]_[cmdk-group-heading]]:tracking-normal
-        [&_[data-slot=command-group]_[cmdk-group-heading]]:text-[rgb(100_116_139/0.96)]
-        [&_[data-slot=command-group]_[cmdk-group-heading]]:normal-case
-        [&_[data-slot=command-input-wrapper]]:h-20
-        [&_[data-slot=command-input-wrapper]]:gap-3.5
-        [&_[data-slot=command-input-wrapper]]:border-b-[rgb(148_163_184/0.18)]
-        [&_[data-slot=command-input-wrapper]]:px-6
-        [&_[data-slot=command-input-wrapper]_svg]:text-[rgb(100_116_139/0.72)]
-        [&_[data-slot=command]]:bg-transparent"
-      description="Search local projects and open one in the viewer."
-      open={open}
-      showCloseButton={false}
-      title="Find project"
-      onOpenChange={updateOpen}
-    >
-      <CommandInput
-        className="text-[1.05rem]"
-        placeholder="Search local projects..."
-        value={query}
-        onValueChange={setQuery}
-      />
-      <CommandList className="max-h-[26rem] px-[0.9rem] pt-[0.35rem] pb-4">
-        <CommandEmpty>
-          {loading ? (
-            <span className="inline-flex items-center gap-2">
-              <LoaderCircle className="size-4 animate-spin" />
-              Searching local projects…
-            </span>
-          ) : error ? (
-            error
-          ) : (
-            "No local projects found."
-          )}
-        </CommandEmpty>
-        <CommandGroup heading="Local Projects">
-          {items.map((item) => (
-            <CommandItem
-              key={item.id}
-              className="min-h-[4.5rem] items-center gap-[0.9rem] rounded-2xl
-                border border-transparent px-4 py-[0.95rem]
-                transition-[background-color,border-color,box-shadow,transform]
-                duration-[140ms]
-                data-[selected=true]:border-[rgb(255_255_255/0.78)]
-                data-[selected=true]:bg-transparent
-                data-[selected=true]:bg-[linear-gradient(180deg,rgb(233_234_236/0.9),rgb(228_229_231/0.82))]
-                data-[selected=true]:text-current
-                data-[selected=true]:shadow-[inset_0_1px_0_rgb(255_255_255/0.7),0_8px_18px_rgb(148_163_184/0.14)]
-                max-[760px]:grid
-                max-[760px]:grid-cols-[2.5rem_minmax(0,1fr)_auto]
-                max-[760px]:grid-rows-[auto_auto] max-[760px]:gap-y-1"
-              value={[
-                item.title,
-                item.repositoryLabel,
-                item.relativePath,
-                item.latestSessionTitle,
-                item.worktree,
-              ]
-                .filter(Boolean)
-                .join(" ")}
-              onSelect={() =>
-                void navigate({
-                  to: folderSectionHref(item.worktree, "sessions"),
-                })
-              }
-            >
-              <div
-                className="inline-flex size-10 flex-none items-center
-                  justify-center rounded-xl border
-                  border-[rgb(255_255_255/0.72)]
-                  bg-[linear-gradient(180deg,rgb(255_248_241/0.96),rgb(244_238_232/0.94))]
-                  text-zinc-700
-                  shadow-[inset_0_1px_0_rgb(255_255_255/0.7),0_2px_6px_rgb(148_163_184/0.12)]
-                  max-[760px]:row-[1/span_2]"
-                aria-hidden="true"
-              >
-                {item.icon ? (
-                  <img
-                    alt=""
-                    className="size-6 rounded-md object-cover"
-                    src={item.icon}
-                  />
-                ) : (
-                  <FolderGit2 className="size-4" />
-                )}
-              </div>
-              <div
-                className="flex min-w-0 flex-1 items-center gap-[0.8rem]
-                  max-[760px]:col-start-2 max-[760px]:gap-[0.55rem]"
-              >
-                <span className="truncate text-[0.95rem] font-semibold">
-                  {item.title}
-                </span>
-                {item.subtitle ? (
-                  <span className="truncate text-[0.9rem] text-slate-500">
-                    {item.subtitle}
-                  </span>
-                ) : null}
-              </div>
-              {item.repositoryLabel ? (
-                <span
-                  className="max-w-72 truncate text-[0.9rem] text-slate-500
-                    max-[760px]:hidden"
-                >
-                  {item.repositoryLabel}
-                </span>
-              ) : null}
-              <div
-                className="hidden min-w-0 text-[0.78rem] text-slate-500
-                  max-[760px]:col-start-2 max-[760px]:block"
-              >
-                {item.relativePath ? (
-                  <span className="truncate">{item.relativePath}</span>
-                ) : item.repositoryLabel ? (
-                  <span className="truncate">{item.repositoryLabel}</span>
-                ) : null}
-              </div>
-              <div
-                className="ml-auto inline-flex flex-none items-center
-                  gap-[0.55rem] text-slate-500 max-[760px]:col-start-3
-                  max-[760px]:row-[1/span_2] max-[760px]:self-center"
-                aria-hidden="true"
-              >
-                <span
-                  className="hidden items-center gap-[0.35rem] text-[0.8rem]
-                    font-medium sm:inline-flex"
-                >
-                  <ArrowUpRight className="size-3.5" />
-                  Open
-                </span>
-                <span
-                  className="inline-flex size-7 items-center justify-center
-                    rounded-[0.55rem] border border-[rgb(148_163_184/0.18)]
-                    bg-[rgb(255_255_255/0.58)]
-                    shadow-[inset_0_1px_0_rgb(255_255_255/0.72)]"
-                >
-                  <CornerDownLeft className="size-3" />
-                </span>
-              </div>
-            </CommandItem>
-          ))}
-        </CommandGroup>
-      </CommandList>
-    </CommandDialog>
-  )
-}

package/kernel/apps/web/src/project-search.ts

@@ -1,18 +0,0 @@
-import { folderSectionHref } from "./viewer-route"
-
-export type {
-  LocalProjectSearchItem,
-  LocalProjectSearchResponse,
-} from "~/api-client"
-
-export function projectSearchUrl(origin: string, query: string) {
-  const url = new URL("/api/project-search", origin)
-  if (query.trim()) url.searchParams.set("q", query)
-  return `${url.pathname}${url.search}`
-}
-
-export { projectSearchResponse } from "~/api-client"
-
-export function projectFolderHref(worktree: string) {
-  return folderSectionHref(worktree, "notes")
-}

package/kernel/apps/web/src/query-client.ts

@@ -1,4 +0,0 @@
-import { QueryClient } from "@tanstack/react-query"
-
-// One cache for folder, collection and document page entry points.
-export const queryClient = new QueryClient()

package/kernel/apps/web/src/rehype-source-lines.ts

@@ -1,22 +0,0 @@
-type SourceNode = {
-  children?: SourceNode[]
-  position?: { end: { line: number }; start: { line: number } }
-  properties?: Record<string, unknown>
-  type: string
-}
-
-// Stamps remark positional info onto elements as data-line-start/data-line-end
-// attributes so text selections in the rendered document can be traced back to
-// source file lines. lineOffset compensates for stripped frontmatter.
-export function rehypeSourceLines(lineOffset = 0) {
-  const attach = (node: SourceNode) => {
-    if (node.type === "element" && node.position && node.properties) {
-      node.properties["data-line-start"] = node.position.start.line + lineOffset
-      node.properties["data-line-end"] = node.position.end.line + lineOffset
-    }
-    node.children?.forEach(attach)
-  }
-  return (tree: SourceNode) => {
-    attach(tree)
-  }
-}

package/kernel/apps/web/src/routes/document.tsx

@@ -1 +0,0 @@
-export { MarkdownPage as DocumentPage } from "../markdown-page"

package/kernel/apps/web/src/routes/entities.tsx

@@ -1,277 +0,0 @@
-import type { FolderEntity } from "~/api-client"
-import type { FormEvent } from "react"
-import { useState } from "react"
-import { useQuery } from "@tanstack/react-query"
-import { Link, useLocation, useNavigate } from "@tanstack/react-router"
-import { api } from "~/api-client"
-
-function entitySearch(search: URLSearchParams) {
-  return {
-    entity: search.get("entity") ?? undefined,
-    q: search.get("q") ?? undefined,
-    root: search.get("root") ?? undefined,
-  }
-}
-
-export function EntitySearchPage() {
-  const location = useLocation()
-  const navigate = useNavigate()
-  const search = new URLSearchParams(location.search)
-  const query = useQuery({
-    queryFn: ({ signal }) => api.entities(entitySearch(search), { signal }),
-    queryKey: ["entities", search.toString()],
-  })
-  const [draftQuery, setDraftQuery] = useState(search.get("q") ?? "")
-  const [draftRoot, setDraftRoot] = useState(search.get("root") ?? "")
-  const workspace = query.data
-  const needsRoot = workspace?.rootPath === ""
-
-  function submit(event: FormEvent<HTMLFormElement>) {
-    event.preventDefault()
-    const next = new URLSearchParams()
-    if (draftQuery) next.set("q", draftQuery)
-    if (draftRoot) next.set("root", draftRoot)
-    void navigate({ to: `/entities?${next}` })
-  }
-
-  return (
-    <main className="min-h-screen bg-[#f4efe5] text-stone-900">
-      <div
-        className="mx-auto grid w-full max-w-[1500px] gap-6 px-4 py-6 sm:px-6
-          lg:grid-cols-[360px_minmax(0,1fr)] lg:px-10"
-      >
-        <aside className="space-y-5 lg:sticky lg:top-6 lg:self-start">
-          <div className="flex items-center justify-between">
-            <Link
-              className="font-serif text-2xl tracking-tight"
-              to="/"
-              search={{ path: undefined }}
-            >
-              Kennel
-            </Link>
-            <span
-              className="rounded-full bg-emerald-800 px-3 py-1 text-[10px]
-                font-bold tracking-[0.18em] text-white uppercase"
-            >
-              Entities
-            </span>
-          </div>
-
-          <form
-            className="space-y-3 rounded-3xl border border-stone-300 bg-white/80
-              p-4"
-            onSubmit={submit}
-          >
-            <label
-              className="block text-xs font-bold tracking-[0.14em]
-                text-stone-600 uppercase"
-            >
-              Search entities
-              <input
-                autoFocus
-                className="mt-2 w-full rounded-xl border border-stone-300
-                  bg-white px-3 py-2.5 text-base font-normal tracking-normal
-                  outline-none focus:border-emerald-700 focus:ring-2
-                  focus:ring-emerald-700/15"
-                onChange={(event) => setDraftQuery(event.target.value)}
-                placeholder="Title, alias, type, or content"
-                type="search"
-                value={draftQuery}
-              />
-            </label>
-            <label
-              className="block text-xs font-bold tracking-[0.14em]
-                text-stone-600 uppercase"
-            >
-              Workspace root
-              <input
-                className="mt-2 w-full rounded-xl border border-stone-300
-                  bg-stone-50 px-3 py-2 text-xs font-normal tracking-normal
-                  outline-none focus:border-emerald-700"
-                onChange={(event) => setDraftRoot(event.target.value)}
-                value={draftRoot}
-              />
-            </label>
-            <button
-              className="w-full rounded-xl bg-stone-900 px-4 py-2.5 text-sm
-                font-semibold text-white hover:bg-stone-700"
-              type="submit"
-            >
-              Search folder records
-            </button>
-          </form>
-
-          <div aria-live="polite" className="space-y-2">
-            <p className="px-1 text-xs font-semibold text-stone-600">
-              {needsRoot
-                ? "Choose a workspace root"
-                : workspace
-                  ? `${workspace.entities.length} ${workspace.entities.length === 1 ? "entity" : "entities"}`
-                  : "Loading entities..."}
-            </p>
-            {workspace?.entities.map((entity) => (
-              <a
-                className={`block rounded-2xl border p-3 transition ${
-                  workspace.selected?.relativePath === entity.relativePath
-                    ? "border-emerald-700 bg-emerald-50"
-                    : "border-stone-300 bg-white/70 hover:border-stone-500"
-                }`}
-                key={entity.folderPath}
-                href={`/entities?${new URLSearchParams({
-                  ...(search.get("q") ? { q: search.get("q")! } : {}),
-                  ...(workspace.rootPath ? { root: workspace.rootPath } : {}),
-                  entity: entity.relativePath,
-                })}`}
-              >
-                <span className="block text-sm font-bold text-stone-950">
-                  {entity.title}
-                </span>
-                <span className="mt-1 block text-xs text-stone-600">
-                  {entity.type} · {entity.relativePath}
-                </span>
-              </a>
-            ))}
-            {query.error ? (
-              <p
-                className="rounded-2xl border border-red-300 bg-red-50 p-4
-                  text-sm text-red-800"
-              >
-                {String(query.error)}
-              </p>
-            ) : null}
-            {needsRoot ? (
-              <p
-                className="rounded-2xl border border-dashed border-stone-400 p-4
-                  text-sm text-stone-600"
-              >
-                Enter a workspace root to search folder records.
-              </p>
-            ) : workspace && !workspace.entities.length ? (
-              <p
-                className="rounded-2xl border border-dashed border-stone-400 p-4
-                  text-sm text-stone-600"
-              >
-                No folder entities match this search. An entity needs an
-                index.md record.
-              </p>
-            ) : null}
-          </div>
-        </aside>
-
-        <section
-          className="min-w-0 rounded-[32px] border border-stone-300 bg-white/80
-            p-6 shadow-[0_24px_80px_-60px_rgba(41,37,36,0.5)] sm:p-8"
-        >
-          {workspace?.selected ? (
-            <EntityDetail entity={workspace.selected} />
-          ) : (
-            <div
-              className="grid min-h-80 place-items-center text-center
-                text-stone-600"
-            >
-              Select a folder entity to inspect it.
-            </div>
-          )}
-        </section>
-      </div>
-    </main>
-  )
-}
-
-function EntityDetail({ entity }: { entity: FolderEntity }) {
-  return (
-    <div className="space-y-8">
-      <header className="space-y-4 border-b border-stone-200 pb-7">
-        <div className="flex flex-wrap gap-2 text-xs font-semibold">
-          <span className="rounded-full bg-emerald-800 px-3 py-1 text-white">
-            {entity.type}
-          </span>
-          {entity.status ? (
-            <span className="rounded-full bg-stone-200 px-3 py-1 text-stone-700">
-              {entity.status}
-            </span>
-          ) : null}
-          <span
-            className="rounded-full border border-stone-300 px-3 py-1
-              text-stone-600"
-          >
-            {entity.documents.length} documents
-          </span>
-        </div>
-        <div>
-          <h1
-            className="font-serif text-4xl tracking-tight text-stone-950
-              sm:text-5xl"
-          >
-            {entity.title}
-          </h1>
-          <p className="mt-3 max-w-3xl text-base leading-7 text-stone-700">
-            {entity.description || "No description recorded."}
-          </p>
-        </div>
-        {entity.aliases.length ? (
-          <p className="text-sm text-stone-600">
-            Also known as {entity.aliases.join(", ")}
-          </p>
-        ) : null}
-      </header>
-
-      <div className="grid gap-8 xl:grid-cols-[minmax(0,1fr)_300px]">
-        <div>
-          <h2
-            className="text-xs font-bold tracking-[0.16em] text-stone-500
-              uppercase"
-          >
-            Searchable documents
-          </h2>
-          <ol
-            className="mt-3 divide-y divide-stone-200 border-y border-stone-200"
-          >
-            {entity.documents.map((document) => (
-              <li
-                className="grid gap-1 py-3
-                  sm:grid-cols-[minmax(0,1fr)_minmax(180px,0.7fr)]"
-                key={document.path}
-              >
-                <span className="font-medium text-stone-900">
-                  {document.title}
-                </span>
-                <span
-                  className="truncate font-mono text-xs text-stone-500
-                    sm:text-right"
-                >
-                  {document.path}
-                </span>
-              </li>
-            ))}
-          </ol>
-        </div>
-        <dl className="space-y-4 rounded-2xl bg-stone-100 p-4 text-sm">
-          <Metadata label="Slug" value={entity.slug} />
-          <Metadata label="Folder" value={entity.folderPath} />
-          <Metadata
-            label="Schema"
-            value={entity.schemaPath ?? "No schema found"}
-          />
-        </dl>
-      </div>
-    </div>
-  )
-}
-
-function Metadata({ label, value }: { label: string; value: string }) {
-  return (
-    <div>
-      <dt
-        className="text-xs font-bold tracking-[0.14em] text-stone-500 uppercase"
-      >
-        {label}
-      </dt>
-      <dd
-        className="mt-1 font-mono text-xs leading-5 break-words text-stone-700"
-      >
-        {value}
-      </dd>
-    </div>
-  )
-}

package/kernel/apps/web/src/routes/search.tsx

@@ -1,60 +0,0 @@
-import "@raggle-ai/scout-ui/styles.css"
-
-import { useState } from "react"
-import { useQuery } from "@tanstack/react-query"
-import { useNavigate } from "@tanstack/react-router"
-import { api } from "~/api-client"
-
-import { ProjectSearchList } from "@raggle-ai/scout-ui"
-
-import { projectFolderHref } from "../project-search"
-
-export function ProjectSearchPage() {
-  const navigate = useNavigate()
-  const [query, setQuery] = useState("")
-  const result = useQuery({
-    queryKey: ["project-search", query],
-    queryFn: ({ signal }) => api.projectSearch(query, { signal }),
-    retry: false,
-  })
-
-  return (
-    <main className="search-page">
-      <div className="search-page-header">
-        <a className="font-serif text-2xl tracking-tight" href="/">
-          Kennel
-        </a>
-        <span
-          className="rounded-full bg-emerald-800 px-3 py-1 text-[10px] font-bold
-            tracking-[0.18em] text-white uppercase"
-        >
-          Search projects
-        </span>
-      </div>
-      <ProjectSearchList
-        ariaLabel="Search local projects"
-        emptyMessage={
-          result.isPending
-            ? "Searching local projects…"
-            : result.error
-              ? result.error.message
-              : "No local projects found."
-        }
-        placeholder="Search local projects..."
-        projects={(result.data?.items ?? []).map((item) => ({
-          id: item.id,
-          name: item.title,
-          worktree: item.worktree,
-          parentFolders: item.relativePath,
-          repositoryLabel: item.repositoryLabel,
-          iconUrl: item.icon,
-        }))}
-        query={query}
-        onQueryChange={setQuery}
-        onSelect={(project) =>
-          void navigate({ to: projectFolderHref(project.worktree) })
-        }
-      />
-    </main>
-  )
-}