@igstack/app-catalog-frontend-core 6.10.3 → 6.11.0

package/dist/esm/modules/communityTools/ui/ToolFormDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolFormDialog.js","sources":["../../../../../src/modules/communityTools/ui/ToolFormDialog.tsx"],"sourcesContent":["import type { ToolPreview } from '@igstack/app-catalog-backend-core'\nimport type {\n  CommunityTag,\n  CommunityTool,\n  PersonRef,\n} from '@igstack/app-catalog-shared-core'\nimport { TAG_VALUE_MAX, hostOf } from '@igstack/app-catalog-shared-core'\nimport { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'\nimport { Link } from '@tanstack/react-router'\nimport {\n  AlertCircle,\n  AlertTriangle,\n  Archive,\n  Camera,\n  CheckCircle2,\n  ImageOff,\n  Loader2,\n  X,\n} from 'lucide-react'\nimport { useEffect, useId, useRef, useState } from 'react'\nimport { useTRPC } from '~/api/infra/trpc'\nimport { cn } from '~/lib/utils'\nimport { useAppCatalogContext } from '~/modules/appCatalog/context/AppCatalogContext'\nimport { MarkdownText } from '~/modules/appCatalog/ui/components/MarkdownText'\nimport { useAuth } from '~/modules/auth'\nimport { useDismissable } from '~/modules/dismiss/DismissStack'\nimport { Dialog, DialogContent, DialogTitle } from '~/ui/dialog'\nimport { formatCardDate } from './CardScreenshot'\nimport { screenshotUrl } from './FeedRow'\nimport { FIELD_BAD, FIELD_BOX, OwnerPicker, personName } from './OwnerPicker'\nimport { TagPicker } from './TagPicker'\n\n/** How long the address must sit still before the site is read. */\nconst PREVIEW_DELAY_MS = 400\n\nconst NAME_MAX = 80\nconst SUMMARY_MAX = 160\nconst DESCRIPTION_MAX = 5000\n\nexport const GHOST_BUTTON =\n  'inline-flex h-[34px] items-center gap-[7px] rounded-[10px] border border-border bg-card px-[11px] text-[13px] font-bold whitespace-nowrap hover:border-primary/40 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring disabled:opacity-50'\n\nexport const PRIMARY_BUTTON =\n  'inline-flex h-[34px] items-center gap-2 rounded-[10px] bg-primary px-4 text-[13.5px] font-extrabold whitespace-nowrap text-primary-foreground shadow-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring disabled:cursor-not-allowed disabled:opacity-50'\n\nconst LABEL = 'text-[13px] font-bold'\nconst HINT = 'text-[12.5px] text-muted-foreground'\n\ntype Field = 'name' | 'owners' | 'tags'\n\nexport interface ToolFormDialogProps {\n  mode: 'add' | 'edit'\n  /** The tool being edited. */\n  initial?: CommunityTool\n  /** What the visitor searched for: a first guess at the name. */\n  prefillName?: string\n  /** Published, saved or archived. */\n  onDone: (slug: string) => void\n  onClose: () => void\n  /** The address is already listed, and they chose to look at that card. */\n  onOpenCard?: (slug: string) => void\n}\n\n/** A field's error, next to it; the form points at the first one on submit. */\nfunction FieldError({ id, children }: { id: string; children: string }) {\n  return (\n    <p\n      id={id}\n      role=\"alert\"\n      className=\"flex items-center gap-1.5 text-[12.5px] font-bold text-destructive\"\n    >\n      <AlertCircle aria-hidden=\"true\" className=\"size-3.5 shrink-0\" />\n      {children}\n    </p>\n  )\n}\n\n/**\n * Add a tool, or edit one: the same form. The address comes first; once it\n * sits still the backend reads the page, the title fills the name and a\n * screenshot preview shows. A host already listed is caught before anything\n * else is asked. Publish makes the tool live at once and puts it in the\n * review list.\n */\nexport function ToolFormDialog({\n  mode,\n  initial,\n  prefillName,\n  onDone,\n  onClose,\n  onOpenCard,\n}: ToolFormDialogProps) {\n  const trpc = useTRPC()\n  const queryClient = useQueryClient()\n  const { user } = useAuth()\n  const { persons, resources } = useAppCatalogContext()\n  const list = useQuery(trpc.communityTools.list.queryOptions())\n  const formId = useId()\n  const ids = {\n    url: `${formId}-url`,\n    name: `${formId}-name`,\n    summary: `${formId}-summary`,\n    owners: `${formId}-owners`,\n    tags: `${formId}-tags`,\n    description: `${formId}-description`,\n  }\n  const errorId = (field: string) => `${field}-error`\n\n  const [url, setUrl] = useState(initial?.url ?? '')\n  const [name, setName] = useState(initial?.name ?? prefillName ?? '')\n  // The page title fills the name only until the visitor writes their own.\n  const [nameTouched, setNameTouched] = useState(mode === 'edit')\n  // The same, for the debounced read below, without restarting its timer.\n  const nameTouchedRef = useRef(nameTouched)\n  const [summary, setSummary] = useState(initial?.summary ?? '')\n  const [descriptionMd, setDescriptionMd] = useState(\n    initial?.descriptionMd ?? '',\n  )\n  const [owners, setOwners] = useState<PersonRef[]>(() => {\n    if (initial) return initial.owners\n    // The person adding it is the first owner, when the directory knows them.\n    const email = user?.email?.toLowerCase()\n    const me = email\n      ? persons.find(\n          (p) =>\n            p.email?.toLowerCase() === email || p.slug.toLowerCase() === email,\n        )\n      : undefined\n    return me ? [{ slug: me.slug, name: personName(me) }] : []\n  })\n  const [tags, setTags] = useState<CommunityTag[]>(initial?.tags ?? [])\n  const [tab, setTab] = useState<'write' | 'preview'>('write')\n  const [errors, setErrors] = useState<Partial<Record<Field, string>>>({})\n  const [archiving, setArchiving] = useState(false)\n\n  // The address as it was when the visitor stopped typing, and what reading it gave.\n  const [checked, setChecked] = useState(initial?.url ?? '')\n  const [preview, setPreview] = useState<{\n    url: string\n    data: ToolPreview | null\n  } | null>(null)\n  const [addAnywayFor, setAddAnywayFor] = useState<string | null>(null)\n\n  const previewMutation = useMutation(\n    trpc.communityTools.preview.mutationOptions(),\n  )\n  const { mutateAsync: readSite } = previewMutation\n  useEffect(() => {\n    const address = url.trim()\n    // Set once the address changes again: a slower answer for this one must\n    // not overwrite the newer address's preview or name.\n    let stale = false\n    const timer = setTimeout(() => {\n      setChecked(address)\n      if (!needsPreviewFor(address, mode, initial?.url)) return\n      readSite({ url: address }).then(\n        (data) => {\n          if (stale) return\n          setPreview({ url: address, data })\n          if (data.title && !nameTouchedRef.current) setName(data.title)\n        },\n        () => {\n          if (!stale) setPreview({ url: address, data: null })\n        },\n      )\n    }, PREVIEW_DELAY_MS)\n    return () => {\n      stale = true\n      clearTimeout(timer)\n    }\n  }, [url, mode, initial?.url, readSite])\n\n  const address = url.trim()\n  const validAddress = hostOf(address) !== null\n  const showBadAddress = checked !== '' && checked === address && !validAddress\n  const reading =\n    needsPreviewFor(address, mode, initial?.url) &&\n    (checked !== address || preview?.url !== address)\n  const current = preview?.url === address ? preview.data : null\n  const duplicate =\n    current?.duplicate && current.duplicate.slug !== initial?.slug\n      ? current.duplicate\n      : null\n  // An official catalog app on the same host outranks a community duplicate.\n  const officialApp = current?.officialApp ?? null\n  const blockedByDuplicate =\n    (officialApp !== null || duplicate !== null) && addAnywayFor !== address\n  const showDetails =\n    mode === 'edit' ||\n    (validAddress && !reading && !blockedByDuplicate) ||\n    (!validAddress && name.trim() !== '' && !showBadAddress)\n\n  const invalidate = () =>\n    queryClient.invalidateQueries({\n      queryKey: trpc.communityTools.pathKey(),\n    })\n  const add = useMutation(\n    trpc.communityTools.add.mutationOptions({ onSuccess: invalidate }),\n  )\n  const edit = useMutation(\n    trpc.communityTools.edit.mutationOptions({ onSuccess: invalidate }),\n  )\n  const archive = useMutation(\n    trpc.communityTools.archive.mutationOptions({ onSuccess: invalidate }),\n  )\n  const save = mode === 'add' ? add : edit\n  const busy = save.isPending || archive.isPending\n\n  const urlRef = useRef<HTMLInputElement>(null)\n\n  const submit = (e: React.FormEvent) => {\n    e.preventDefault()\n    // Publish stays disabled until the address is one; Enter in a field\n    // cannot submit past a disabled button either.\n    if (busy || !validAddress) return\n    const found: Partial<Record<Field, string>> = {}\n    if (!name.trim()) found.name = 'Give it the name colleagues call it.'\n    if (owners.length === 0) {\n      found.owners = 'Add at least one person to ask about it.'\n    }\n    setErrors(found)\n    const first = (['name', 'owners'] as const).find((f) => found[f])\n    if (first) {\n      document.getElementById(ids[first])?.focus()\n      return\n    }\n    const input = {\n      url: address,\n      name: name.trim(),\n      summary: summary.trim(),\n      descriptionMd,\n      ownerSlugs: owners.flatMap((o) => (o.slug ? [o.slug] : [])),\n      ownerNames: owners.flatMap((o) => (o.slug ? [] : [o.name])),\n      tags,\n    }\n    if (mode === 'add') {\n      add.mutate(input, { onSuccess: (tool) => onDone(tool.slug) })\n    } else if (initial) {\n      edit.mutate(\n        { ...input, slug: initial.slug },\n        { onSuccess: (tool) => onDone(tool.slug) },\n      )\n    }\n  }\n\n  const contentRef = useRef<HTMLDivElement>(null)\n  // On the dismiss stack, so Escape closes this form and not the card under\n  // it; while it saves, Escape does nothing at all.\n  useDismissable(contentRef, () => {\n    if (!busy) onClose()\n  })\n\n  const officialApps = resources.filter((r) => !r.parentSlug)\n  const knownTopics = [\n    ...new Set(\n      (list.data ?? []).flatMap((t) =>\n        t.tags.filter((g) => g.kind === 'topic').map((g) => g.value),\n      ),\n    ),\n  ].sort()\n\n  const title = mode === 'add' ? 'Add a tool' : 'Edit tool'\n  const serverError = save.error ?? archive.error\n\n  return (\n    <Dialog\n      open\n      onOpenChange={(open) => {\n        if (!open && !busy) onClose()\n      }}\n    >\n      <DialogContent\n        ref={contentRef}\n        data-testid={mode === 'add' ? 'add-tool-dialog' : 'edit-tool-dialog'}\n        aria-describedby={undefined}\n        showCloseButton={false}\n        // Top-anchored: the form grows downward as the site is read, so\n        // nothing above the caret moves.\n        className=\"top-[6vh] max-h-[88vh] translate-y-0 gap-0 overflow-y-auto p-0 sm:max-w-[680px]\"\n        onOpenAutoFocus={(e) => {\n          e.preventDefault()\n          urlRef.current?.focus()\n        }}\n        // Typing is lost on a stray click; only Cancel, Close or Esc leave.\n        onInteractOutside={(e) => e.preventDefault()}\n        onEscapeKeyDown={(e) => {\n          // An open suggestion list takes Escape for itself.\n          const target = e.target as Element | null\n          if (target?.closest('[aria-expanded=\"true\"]')) e.preventDefault()\n        }}\n      >\n        <form onSubmit={submit} noValidate aria-busy={busy || undefined}>\n          <div className=\"flex items-center justify-between px-5 pt-4\">\n            <DialogTitle className=\"font-serif text-[19px] leading-tight font-semibold\">\n              {title}\n            </DialogTitle>\n            <button\n              type=\"button\"\n              aria-label=\"Close\"\n              disabled={busy}\n              onClick={onClose}\n              className=\"rounded-full p-1.5 text-muted-foreground transition-colors hover:bg-accent hover:text-foreground disabled:opacity-50\"\n            >\n              <X aria-hidden=\"true\" className=\"size-4\" />\n            </button>\n          </div>\n\n          <div className=\"flex flex-col gap-3.5 px-5 pt-4 pb-1.5\">\n            <div className=\"flex flex-col gap-1.5\">\n              <label htmlFor={ids.url} className={LABEL}>\n                Site address\n              </label>\n              <div className={cn(FIELD_BOX, showBadAddress && FIELD_BAD)}>\n                <input\n                  ref={urlRef}\n                  id={ids.url}\n                  type=\"url\"\n                  inputMode=\"url\"\n                  autoComplete=\"off\"\n                  placeholder=\"Paste the link to the tool\"\n                  value={url}\n                  disabled={busy}\n                  aria-invalid={showBadAddress || undefined}\n                  aria-describedby={\n                    showBadAddress ? errorId(ids.url) : `${ids.url}-hint`\n                  }\n                  onChange={(e) => setUrl(e.target.value)}\n                  className=\"h-10 min-w-0 flex-1 bg-transparent font-mono text-[13px] outline-none placeholder:font-sans placeholder:text-muted-foreground\"\n                />\n                {validAddress && reading && (\n                  <span\n                    data-testid=\"reading-site\"\n                    className=\"inline-flex shrink-0 items-center gap-1.5 text-[12.5px] font-semibold text-muted-foreground\"\n                  >\n                    <Loader2\n                      aria-hidden=\"true\"\n                      className=\"size-3.5 animate-spin\"\n                    />\n                    Reading the site…\n                  </span>\n                )}\n                {validAddress &&\n                  !reading &&\n                  (current?.title || current?.screenshotDataUrl) && (\n                    <span className=\"inline-flex shrink-0 items-center gap-1.5 text-[12.5px] font-semibold text-green-700 dark:text-green-400\">\n                      <CheckCircle2 aria-hidden=\"true\" className=\"size-3.5\" />\n                      Found\n                    </span>\n                  )}\n              </div>\n              {showBadAddress ? (\n                <FieldError id={errorId(ids.url)}>\n                  That is not a web address. Paste the full link, starting with\n                  https://\n                </FieldError>\n              ) : (\n                !validAddress &&\n                !showDetails &&\n                !blockedByDuplicate && (\n                  <p id={`${ids.url}-hint`} className={HINT}>\n                    Paste it first. The name and screenshot fill in from the\n                    site.\n                  </p>\n                )\n              )}\n            </div>\n\n            {validAddress && reading && <ReadingSkeleton />}\n\n            {blockedByDuplicate && officialApp && (\n              <div\n                data-testid=\"official-app-warning\"\n                role=\"alert\"\n                className=\"flex gap-2.5 rounded-[10px] bg-amber-50 px-3.5 py-3 text-[13.5px] text-amber-900 dark:bg-amber-950 dark:text-amber-200\"\n              >\n                <AlertTriangle\n                  aria-hidden=\"true\"\n                  className=\"mt-px size-[18px] shrink-0\"\n                />\n                <div>\n                  <b>This is already in the catalog as {officialApp.name}.</b>\n                  <div className=\"mt-2.5 flex items-center gap-3.5\">\n                    <Link\n                      to=\"/app/$slug\"\n                      params={{ slug: officialApp.slug }}\n                      className={GHOST_BUTTON}\n                    >\n                      Open {officialApp.name}\n                    </Link>\n                    <button\n                      type=\"button\"\n                      className=\"font-bold underline underline-offset-2\"\n                      onClick={() => setAddAnywayFor(address)}\n                    >\n                      Add anyway\n                    </button>\n                  </div>\n                </div>\n              </div>\n            )}\n\n            {blockedByDuplicate && !officialApp && duplicate && (\n              <div\n                data-testid=\"duplicate-warning\"\n                role=\"alert\"\n                className=\"flex gap-2.5 rounded-[10px] bg-amber-50 px-3.5 py-3 text-[13.5px] text-amber-900 dark:bg-amber-950 dark:text-amber-200\"\n              >\n                <AlertTriangle\n                  aria-hidden=\"true\"\n                  className=\"mt-px size-[18px] shrink-0\"\n                />\n                <div>\n                  <b>This site is already here.</b> “{duplicate.name}” uses the\n                  same address.\n                  <div className=\"mt-2.5 flex items-center gap-3.5\">\n                    <button\n                      type=\"button\"\n                      className={GHOST_BUTTON}\n                      onClick={() => onOpenCard?.(duplicate.slug)}\n                    >\n                      Open that card\n                    </button>\n                    <button\n                      type=\"button\"\n                      className=\"font-bold underline underline-offset-2\"\n                      onClick={() => setAddAnywayFor(address)}\n                    >\n                      Add anyway\n                    </button>\n                  </div>\n                </div>\n              </div>\n            )}\n\n            {showDetails && (\n              <>\n                <div className=\"grid grid-cols-[minmax(0,1fr)_190px] items-start gap-4\">\n                  <div className=\"flex min-w-0 flex-col gap-3.5\">\n                    <div className=\"flex flex-col gap-1.5\">\n                      <label htmlFor={ids.name} className={LABEL}>\n                        Name\n                      </label>\n                      <div\n                        className={cn(\n                          FIELD_BOX,\n                          !nameTouched &&\n                            current?.title &&\n                            name === current.title &&\n                            'bg-amber-50/70 dark:bg-amber-950/40',\n                          errors.name && FIELD_BAD,\n                        )}\n                      >\n                        <input\n                          id={ids.name}\n                          type=\"text\"\n                          maxLength={NAME_MAX}\n                          value={name}\n                          disabled={busy}\n                          aria-invalid={!!errors.name || undefined}\n                          aria-describedby={\n                            errors.name ? errorId(ids.name) : `${ids.name}-hint`\n                          }\n                          onChange={(e) => {\n                            setName(e.target.value)\n                            setNameTouched(true)\n                            nameTouchedRef.current = true\n                            setErrors((prev) => ({ ...prev, name: undefined }))\n                          }}\n                          className=\"h-10 min-w-0 flex-1 bg-transparent outline-none\"\n                        />\n                      </div>\n                      {errors.name ? (\n                        <FieldError id={errorId(ids.name)}>\n                          {errors.name}\n                        </FieldError>\n                      ) : (\n                        current?.title &&\n                        !nameTouched && (\n                          <p id={`${ids.name}-hint`} className={HINT}>\n                            From the page title. Change it if colleagues call it\n                            something else.\n                          </p>\n                        )\n                      )}\n                    </div>\n\n                    <div className=\"flex flex-col gap-1.5\">\n                      <label htmlFor={ids.owners} className={LABEL}>\n                        Owners\n                      </label>\n                      <OwnerPicker\n                        id={ids.owners}\n                        persons={persons}\n                        value={owners}\n                        disabled={busy}\n                        invalid={!!errors.owners}\n                        describedBy={\n                          errors.owners\n                            ? errorId(ids.owners)\n                            : `${ids.owners}-hint`\n                        }\n                        onChange={(next) => {\n                          setOwners(next)\n                          setErrors((prev) => ({ ...prev, owners: undefined }))\n                        }}\n                      />\n                      {errors.owners ? (\n                        <FieldError id={errorId(ids.owners)}>\n                          {errors.owners}\n                        </FieldError>\n                      ) : (\n                        <p id={`${ids.owners}-hint`} className={HINT}>\n                          Who to ask about it. You are added by default.\n                        </p>\n                      )}\n                    </div>\n                  </div>\n                  <ShotPreview\n                    preview={current}\n                    initial={address === initial?.url ? initial : undefined}\n                    validAddress={validAddress}\n                  />\n                </div>\n\n                <div className=\"flex flex-col gap-1.5\">\n                  <label htmlFor={ids.summary} className={LABEL}>\n                    Summary{' '}\n                    <span className=\"font-normal text-muted-foreground\">\n                      (optional)\n                    </span>\n                  </label>\n                  <div className={FIELD_BOX}>\n                    <input\n                      id={ids.summary}\n                      type=\"text\"\n                      maxLength={SUMMARY_MAX}\n                      value={summary}\n                      disabled={busy}\n                      aria-describedby={`${ids.summary}-hint`}\n                      onChange={(e) => setSummary(e.target.value)}\n                      className=\"h-10 min-w-0 flex-1 bg-transparent outline-none\"\n                    />\n                  </div>\n                  <p id={`${ids.summary}-hint`} className={HINT}>\n                    One line under the name, in the list and on the card.\n                  </p>\n                </div>\n\n                <div className=\"flex flex-col gap-1.5\">\n                  <label htmlFor={ids.tags} className={LABEL}>\n                    Tags{' '}\n                    <span className=\"font-normal text-muted-foreground\">\n                      (optional)\n                    </span>\n                  </label>\n                  <TagPicker\n                    id={ids.tags}\n                    apps={officialApps}\n                    knownTopics={knownTopics}\n                    value={tags}\n                    disabled={busy}\n                    describedBy={\n                      errors.tags ? errorId(ids.tags) : `${ids.tags}-hint`\n                    }\n                    onChange={(next) => {\n                      setTags(next)\n                      setErrors((prev) => ({ ...prev, tags: undefined }))\n                    }}\n                    onTooLong={() =>\n                      setErrors((prev) => ({\n                        ...prev,\n                        tags: `A topic is at most ${TAG_VALUE_MAX} characters.`,\n                      }))\n                    }\n                  />\n                  {errors.tags ? (\n                    <FieldError id={errorId(ids.tags)}>\n                      {errors.tags}\n                    </FieldError>\n                  ) : (\n                    <p id={`${ids.tags}-hint`} className={HINT}>\n                      The app it is for, or a topic word. Press Enter to add a\n                      new topic.\n                    </p>\n                  )}\n                </div>\n\n                <div className=\"flex flex-col gap-1.5\">\n                  <label htmlFor={ids.description} className={LABEL}>\n                    How to use\n                  </label>\n                  <div className=\"overflow-hidden rounded-[10px] border border-border bg-card\">\n                    <div\n                      role=\"tablist\"\n                      aria-label=\"Write or preview\"\n                      className=\"flex items-center gap-0.5 border-b border-border bg-muted p-1\"\n                    >\n                      {(['write', 'preview'] as const).map((t) => (\n                        <button\n                          key={t}\n                          type=\"button\"\n                          role=\"tab\"\n                          aria-selected={tab === t}\n                          onClick={() => setTab(t)}\n                          className={cn(\n                            'rounded-[7px] px-3 py-1 text-[12.5px] font-bold text-muted-foreground',\n                            tab === t && 'bg-card text-foreground shadow-sm',\n                          )}\n                        >\n                          {t === 'write' ? 'Write' : 'Preview'}\n                        </button>\n                      ))}\n                      <span className=\"ml-auto pr-2 text-[11.5px] text-muted-foreground\">\n                        Markdown\n                      </span>\n                    </div>\n                    {/* Kept mounted while previewing, so the label and its draft stay. */}\n                    <textarea\n                      id={ids.description}\n                      rows={6}\n                      maxLength={DESCRIPTION_MAX}\n                      value={descriptionMd}\n                      disabled={busy}\n                      hidden={tab !== 'write'}\n                      aria-describedby={`${ids.description}-hint`}\n                      onChange={(e) => setDescriptionMd(e.target.value)}\n                      className=\"block w-full resize-y bg-transparent px-3 py-2.5 font-mono text-[12.5px] leading-relaxed outline-none\"\n                    />\n                    {tab === 'preview' && (\n                      <div\n                        data-testid=\"description-preview\"\n                        role=\"tabpanel\"\n                        className=\"prose prose-sm dark:prose-invert min-h-24 max-w-none px-3.5 py-2.5\"\n                      >\n                        {descriptionMd.trim() ? (\n                          <MarkdownText>{descriptionMd}</MarkdownText>\n                        ) : (\n                          <p className=\"text-muted-foreground\">\n                            Nothing written yet.\n                          </p>\n                        )}\n                      </div>\n                    )}\n                  </div>\n                  <p id={`${ids.description}-hint`} className={HINT}>\n                    Short steps work best. This is the text people read on the\n                    card.\n                  </p>\n                </div>\n              </>\n            )}\n          </div>\n\n          {serverError && (\n            <p\n              role=\"alert\"\n              className=\"mx-5 mt-2 rounded-[10px] bg-destructive/10 px-3 py-2 text-[13px] font-semibold text-destructive\"\n            >\n              {archive.error ? 'Could not archive it: ' : 'Could not save it: '}\n              {serverError.message}\n            </p>\n          )}\n\n          {archiving && initial ? (\n            <div className=\"mt-2 border-t border-border px-5 pt-3 pb-4\">\n              <ArchiveConfirm\n                busy={archive.isPending}\n                onCancel={() => setArchiving(false)}\n                onArchive={(reason) =>\n                  archive.mutate(\n                    { slug: initial.slug, reason },\n                    { onSuccess: () => onDone(initial.slug) },\n                  )\n                }\n              />\n            </div>\n          ) : (\n            <div className=\"mt-2 flex items-center justify-end gap-2.5 border-t border-border px-5 pt-3 pb-4\">\n              {/* Already archived: nothing to archive, as on the card. */}\n              {mode === 'edit' && initial?.lifecycle.state !== 'archived' && (\n                <button\n                  type=\"button\"\n                  disabled={busy}\n                  onClick={() => setArchiving(true)}\n                  className=\"inline-flex items-center gap-1.5 text-[13px] font-bold text-destructive hover:underline disabled:opacity-50\"\n                >\n                  <Archive aria-hidden=\"true\" className=\"size-3.5\" />\n                  Archive this tool\n                </button>\n              )}\n              <span\n                className={cn(\n                  'text-[12.5px] text-muted-foreground',\n                  mode === 'add' ? 'mr-auto' : 'ml-auto',\n                )}\n              >\n                {mode === 'add'\n                  ? 'Goes live now and joins the review list.'\n                  : 'Changes show on the card right away.'}\n              </span>\n              <button\n                type=\"button\"\n                disabled={busy}\n                onClick={onClose}\n                className={GHOST_BUTTON}\n              >\n                Cancel\n              </button>\n              <button\n                type=\"submit\"\n                disabled={!validAddress || reading || busy}\n                aria-busy={save.isPending || undefined}\n                className={PRIMARY_BUTTON}\n              >\n                {save.isPending && (\n                  <Loader2 aria-hidden=\"true\" className=\"size-4 animate-spin\" />\n                )}\n                {mode === 'add'\n                  ? save.isPending\n                    ? 'Publishing…'\n                    : 'Publish'\n                  : save.isPending\n                    ? 'Saving…'\n                    : 'Save changes'}\n              </button>\n            </div>\n          )}\n        </form>\n      </DialogContent>\n    </Dialog>\n  )\n}\n\nfunction needsPreviewFor(\n  address: string,\n  mode: 'add' | 'edit',\n  initialUrl: string | undefined,\n): boolean {\n  return hostOf(address) !== null && (mode === 'add' || address !== initialUrl)\n}\n\n/** While the site is read: where the name, owners and picture will be. */\nfunction ReadingSkeleton() {\n  return (\n    <div\n      aria-hidden=\"true\"\n      className=\"grid grid-cols-[minmax(0,1fr)_190px] items-start gap-4\"\n    >\n      <div className=\"flex flex-col gap-3.5\">\n        {['55%', '40%'].map((w, i) => (\n          <div key={w} className=\"flex flex-col gap-1.5\">\n            <span className={LABEL}>{i === 0 ? 'Name' : 'Owners'}</span>\n            <span className={cn(FIELD_BOX, 'pointer-events-none')}>\n              <i\n                className=\"block h-3 animate-pulse rounded-md bg-muted\"\n                style={{ width: w }}\n              />\n            </span>\n          </div>\n        ))}\n      </div>\n      <div className=\"mt-[22px] flex aspect-[16/11] flex-col items-center justify-center gap-1.5 rounded-[10px] border border-border bg-muted text-xs font-semibold text-muted-foreground\">\n        <Camera aria-hidden=\"true\" className=\"size-5 animate-pulse\" />\n        Taking a screenshot…\n      </div>\n    </div>\n  )\n}\n\n/** The picture the card will lead with, or why there will be none. */\nfunction ShotPreview({\n  preview,\n  initial,\n  validAddress,\n}: {\n  preview: ToolPreview | null\n  /** The tool being edited, while its address is unchanged. */\n  initial?: CommunityTool\n  validAddress: boolean\n}) {\n  const box =\n    'relative mt-[22px] flex aspect-[16/11] flex-col items-center justify-center gap-1.5 overflow-hidden rounded-[10px] border border-border bg-muted px-3 text-center text-xs font-semibold text-muted-foreground'\n  const caption =\n    'absolute bottom-1.5 left-1.5 inline-flex items-center gap-1 rounded-md bg-white/90 px-[7px] py-0.5 text-[11px] font-bold text-muted-foreground dark:bg-black/70'\n\n  if (preview?.screenshotDataUrl) {\n    return (\n      <div data-testid=\"shot-preview\" className={box}>\n        <img\n          src={preview.screenshotDataUrl}\n          alt=\"Screenshot preview of the site\"\n          className=\"absolute inset-0 size-full object-cover object-left-top\"\n        />\n        <span className={caption}>\n          <Camera aria-hidden=\"true\" className=\"size-3\" />\n          Captured just now\n        </span>\n      </div>\n    )\n  }\n  if (initial?.screenshotId) {\n    return (\n      <div data-testid=\"shot-preview\" className={box}>\n        <img\n          src={screenshotUrl(initial.screenshotId, 640)}\n          alt={`Screenshot of ${initial.name}`}\n          className=\"absolute inset-0 size-full object-cover object-left-top\"\n        />\n        {initial.capturedAt && (\n          <span className={caption}>\n            <Camera aria-hidden=\"true\" className=\"size-3\" />\n            Captured {formatCardDate(initial.capturedAt)}\n          </span>\n        )}\n      </div>\n    )\n  }\n  return (\n    <div data-testid=\"shot-preview\" data-state=\"none\" className={box}>\n      <ImageOff aria-hidden=\"true\" className=\"size-5\" />\n      {preview && !preview.captureAllowed\n        ? \"This site's address is outside the hosts we take screenshots of, so it will be listed without a picture.\"\n        : validAddress\n          ? 'No preview. The site may need a login, or it did not load.'\n          : 'The screenshot shows here once the address is in.'}\n    </div>\n  )\n}\n\n/**\n * Archiving asks why, in one step: the reason is what colleagues read on the\n * card, and what the review list records.\n */\nexport function ArchiveConfirm({\n  busy,\n  onArchive,\n  onCancel,\n}: {\n  busy: boolean\n  onArchive: (reason: string) => void\n  onCancel: () => void\n}) {\n  const id = useId()\n  const inputRef = useRef<HTMLInputElement>(null)\n  const [reason, setReason] = useState('')\n  const [missing, setMissing] = useState(false)\n\n  useEffect(() => {\n    inputRef.current?.focus()\n  }, [])\n\n  const confirm = () => {\n    if (!reason.trim()) {\n      setMissing(true)\n      inputRef.current?.focus()\n      return\n    }\n    onArchive(reason.trim())\n  }\n\n  return (\n    <div data-testid=\"archive-confirm\" className=\"flex flex-col gap-1.5\">\n      <label htmlFor={id} className={LABEL}>\n        Why archive it?\n      </label>\n      <div className=\"flex items-center gap-2.5\">\n        <div className={cn(FIELD_BOX, 'flex-1', missing && FIELD_BAD)}>\n          <input\n            ref={inputRef}\n            id={id}\n            type=\"text\"\n            maxLength={500}\n            value={reason}\n            disabled={busy}\n            aria-invalid={missing || undefined}\n            aria-describedby={missing ? `${id}-error` : `${id}-hint`}\n            onChange={(e) => {\n              setReason(e.target.value)\n              setMissing(false)\n            }}\n            onKeyDown={(e) => {\n              if (e.key === 'Enter') {\n                e.preventDefault()\n                confirm()\n              }\n            }}\n            className=\"h-10 min-w-0 flex-1 bg-transparent outline-none\"\n          />\n        </div>\n        <button\n          type=\"button\"\n          disabled={busy}\n          onClick={onCancel}\n          className={GHOST_BUTTON}\n        >\n          Keep it\n        </button>\n        <button\n          type=\"button\"\n          disabled={busy}\n          aria-busy={busy || undefined}\n          onClick={confirm}\n          className={cn(PRIMARY_BUTTON, 'bg-destructive text-white')}\n        >\n          {busy && (\n            <Loader2 aria-hidden=\"true\" className=\"size-4 animate-spin\" />\n          )}\n          {busy ? 'Archiving…' : 'Archive'}\n        </button>\n      </div>\n      {missing ? (\n        <FieldError id={`${id}-error`}>\n          Say why, so colleagues know what happened to it.\n        </FieldError>\n      ) : (\n        <p id={`${id}-hint`} className={HINT}>\n          Colleagues read this on the card. It stays reachable by its link.\n        </p>\n      )}\n    </div>\n  )\n}\n"],"names":["_a","address"],"mappings":"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"}

package/dist/esm/modules/communityTools/ui/ToolSearch.d.ts

@@ -0,0 +1,15 @@
+/**
+ * The community search box. It has focus when the page opens and `/` brings it
+ * back from anywhere. Esc clears it; a second Esc, on an empty box, leaves it.
+ * The arrow keys and Enter belong to the results, so they go to `onKey`.
+ */
+export declare function ToolSearch({ value, onChange, resultCount, onKey, resultsId, activeDescendant, }: {
+    value: string;
+    onChange: (value: string) => void;
+    resultCount: number;
+    onKey: (e: React.KeyboardEvent<HTMLInputElement>) => void;
+    /** The results grid, while there are results to move through. */
+    resultsId?: string;
+    /** The selected result's id: the option ↑↓ move and Enter opens. */
+    activeDescendant?: string;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/esm/modules/communityTools/ui/ToolSearch.js

@@ -0,0 +1,92 @@
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import { Search, X } from "lucide-react";
+import { useRef, useEffect } from "react";
+const KBD = "shrink-0 rounded-[5px] border border-b-2 border-border bg-card px-1.5 py-px text-[11px] font-semibold text-muted-foreground";
+function isTypingTarget(target) {
+  return target instanceof HTMLElement && (target.isContentEditable || target.tagName === "INPUT" || target.tagName === "TEXTAREA" || target.tagName === "SELECT");
+}
+function ToolSearch({
+  value,
+  onChange,
+  resultCount,
+  onKey,
+  resultsId,
+  activeDescendant
+}) {
+  const inputRef = useRef(null);
+  const searching = value.trim() !== "";
+  useEffect(() => {
+    const onSlash = (e) => {
+      var _a;
+      if (e.key !== "/" || isTypingTarget(e.target)) return;
+      e.preventDefault();
+      (_a = inputRef.current) == null ? void 0 : _a.focus();
+    };
+    document.addEventListener("keydown", onSlash);
+    return () => document.removeEventListener("keydown", onSlash);
+  }, []);
+  const clear = () => {
+    var _a;
+    onChange("");
+    (_a = inputRef.current) == null ? void 0 : _a.focus();
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-testid": "tool-search",
+      className: "flex h-[50px] min-w-0 flex-1 items-center gap-[11px] rounded-full border border-border bg-card px-4 text-muted-foreground transition-[border-color,box-shadow] focus-within:border-ring focus-within:ring-4 focus-within:ring-ring/20",
+      children: [
+        /* @__PURE__ */ jsx(Search, { "aria-hidden": "true", className: "size-[19px] shrink-0" }),
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            ref: inputRef,
+            type: "text",
+            value,
+            autoFocus: true,
+            autoComplete: "off",
+            spellCheck: false,
+            "aria-label": "Search community tools",
+            role: "combobox",
+            "aria-haspopup": "grid",
+            "aria-autocomplete": "list",
+            "aria-expanded": resultsId !== void 0,
+            "aria-controls": resultsId,
+            "aria-activedescendant": activeDescendant,
+            placeholder: "Type anything you remember: a word, the author, part of the address",
+            onChange: (e) => onChange(e.target.value),
+            onKeyDown: (e) => {
+              if (e.key === "Escape") {
+                e.preventDefault();
+                e.stopPropagation();
+                if (value) onChange("");
+                else e.currentTarget.blur();
+                return;
+              }
+              onKey(e);
+            },
+            className: "min-w-0 flex-1 truncate border-0 bg-transparent text-[15.5px] text-foreground outline-none placeholder:text-muted-foreground"
+          }
+        ),
+        searching ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx("span", { className: "shrink-0 text-[13px] font-semibold", children: resultCount === 1 ? "1 tool" : `${resultCount} tools` }),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              "aria-label": "Clear search",
+              onClick: clear,
+              className: "shrink-0 rounded-full p-1 hover:bg-accent hover:text-foreground",
+              children: /* @__PURE__ */ jsx(X, { "aria-hidden": "true", className: "size-4" })
+            }
+          ),
+          /* @__PURE__ */ jsx("kbd", { className: KBD, children: "Esc" })
+        ] }) : /* @__PURE__ */ jsx("kbd", { className: KBD, children: "/" })
+      ]
+    }
+  );
+}
+export {
+  ToolSearch
+};
+//# sourceMappingURL=ToolSearch.js.map

package/dist/esm/modules/communityTools/ui/ToolSearch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolSearch.js","sources":["../../../../../src/modules/communityTools/ui/ToolSearch.tsx"],"sourcesContent":["import { Search, X } from 'lucide-react'\nimport { useEffect, useRef } from 'react'\n\nconst KBD =\n  'shrink-0 rounded-[5px] border border-b-2 border-border bg-card px-1.5 py-px text-[11px] font-semibold text-muted-foreground'\n\nfunction isTypingTarget(target: EventTarget | null): boolean {\n  return (\n    target instanceof HTMLElement &&\n    (target.isContentEditable ||\n      target.tagName === 'INPUT' ||\n      target.tagName === 'TEXTAREA' ||\n      target.tagName === 'SELECT')\n  )\n}\n\n/**\n * The community search box. It has focus when the page opens and `/` brings it\n * back from anywhere. Esc clears it; a second Esc, on an empty box, leaves it.\n * The arrow keys and Enter belong to the results, so they go to `onKey`.\n */\nexport function ToolSearch({\n  value,\n  onChange,\n  resultCount,\n  onKey,\n  resultsId,\n  activeDescendant,\n}: {\n  value: string\n  onChange: (value: string) => void\n  resultCount: number\n  onKey: (e: React.KeyboardEvent<HTMLInputElement>) => void\n  /** The results grid, while there are results to move through. */\n  resultsId?: string\n  /** The selected result's id: the option ↑↓ move and Enter opens. */\n  activeDescendant?: string\n}) {\n  const inputRef = useRef<HTMLInputElement>(null)\n  const searching = value.trim() !== ''\n\n  useEffect(() => {\n    const onSlash = (e: KeyboardEvent) => {\n      if (e.key !== '/' || isTypingTarget(e.target)) return\n      e.preventDefault()\n      inputRef.current?.focus()\n    }\n    document.addEventListener('keydown', onSlash)\n    return () => document.removeEventListener('keydown', onSlash)\n  }, [])\n\n  const clear = () => {\n    onChange('')\n    inputRef.current?.focus()\n  }\n\n  return (\n    <div\n      data-testid=\"tool-search\"\n      className=\"flex h-[50px] min-w-0 flex-1 items-center gap-[11px] rounded-full border border-border bg-card px-4 text-muted-foreground transition-[border-color,box-shadow] focus-within:border-ring focus-within:ring-4 focus-within:ring-ring/20\"\n    >\n      <Search aria-hidden=\"true\" className=\"size-[19px] shrink-0\" />\n      <input\n        ref={inputRef}\n        type=\"text\"\n        value={value}\n        autoFocus\n        autoComplete=\"off\"\n        spellCheck={false}\n        aria-label=\"Search community tools\"\n        role=\"combobox\"\n        aria-haspopup=\"grid\"\n        aria-autocomplete=\"list\"\n        aria-expanded={resultsId !== undefined}\n        aria-controls={resultsId}\n        aria-activedescendant={activeDescendant}\n        placeholder=\"Type anything you remember: a word, the author, part of the address\"\n        onChange={(e) => onChange(e.target.value)}\n        onKeyDown={(e) => {\n          if (e.key === 'Escape') {\n            e.preventDefault()\n            e.stopPropagation()\n            if (value) onChange('')\n            else e.currentTarget.blur()\n            return\n          }\n          onKey(e)\n        }}\n        className=\"min-w-0 flex-1 truncate border-0 bg-transparent text-[15.5px] text-foreground outline-none placeholder:text-muted-foreground\"\n      />\n      {searching ? (\n        <>\n          <span className=\"shrink-0 text-[13px] font-semibold\">\n            {resultCount === 1 ? '1 tool' : `${resultCount} tools`}\n          </span>\n          <button\n            type=\"button\"\n            aria-label=\"Clear search\"\n            onClick={clear}\n            className=\"shrink-0 rounded-full p-1 hover:bg-accent hover:text-foreground\"\n          >\n            <X aria-hidden=\"true\" className=\"size-4\" />\n          </button>\n          <kbd className={KBD}>Esc</kbd>\n        </>\n      ) : (\n        <kbd className={KBD}>/</kbd>\n      )}\n    </div>\n  )\n}\n"],"names":[],"mappings":";;;AAGA,MAAM,MACJ;AAEF,SAAS,eAAe,QAAqC;AAC3D,SACE,kBAAkB,gBACjB,OAAO,qBACN,OAAO,YAAY,WACnB,OAAO,YAAY,cACnB,OAAO,YAAY;AAEzB;AAOO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GASG;AACD,QAAM,WAAW,OAAyB,IAAI;AAC9C,QAAM,YAAY,MAAM,KAAA,MAAW;AAEnC,YAAU,MAAM;AACd,UAAM,UAAU,CAAC,MAAqB;;AACpC,UAAI,EAAE,QAAQ,OAAO,eAAe,EAAE,MAAM,EAAG;AAC/C,QAAE,eAAA;AACF,qBAAS,YAAT,mBAAkB;AAAA,IACpB;AACA,aAAS,iBAAiB,WAAW,OAAO;AAC5C,WAAO,MAAM,SAAS,oBAAoB,WAAW,OAAO;AAAA,EAC9D,GAAG,CAAA,CAAE;AAEL,QAAM,QAAQ,MAAM;;AAClB,aAAS,EAAE;AACX,mBAAS,YAAT,mBAAkB;AAAA,EACpB;AAEA,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,eAAY;AAAA,MACZ,WAAU;AAAA,MAEV,UAAA;AAAA,QAAA,oBAAC,QAAA,EAAO,eAAY,QAAO,WAAU,wBAAuB;AAAA,QAC5D;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAK;AAAA,YACL,MAAK;AAAA,YACL;AAAA,YACA,WAAS;AAAA,YACT,cAAa;AAAA,YACb,YAAY;AAAA,YACZ,cAAW;AAAA,YACX,MAAK;AAAA,YACL,iBAAc;AAAA,YACd,qBAAkB;AAAA,YAClB,iBAAe,cAAc;AAAA,YAC7B,iBAAe;AAAA,YACf,yBAAuB;AAAA,YACvB,aAAY;AAAA,YACZ,UAAU,CAAC,MAAM,SAAS,EAAE,OAAO,KAAK;AAAA,YACxC,WAAW,CAAC,MAAM;AAChB,kBAAI,EAAE,QAAQ,UAAU;AACtB,kBAAE,eAAA;AACF,kBAAE,gBAAA;AACF,oBAAI,gBAAgB,EAAE;AAAA,oBACjB,GAAE,cAAc,KAAA;AACrB;AAAA,cACF;AACA,oBAAM,CAAC;AAAA,YACT;AAAA,YACA,WAAU;AAAA,UAAA;AAAA,QAAA;AAAA,QAEX,YACC,qBAAA,UAAA,EACE,UAAA;AAAA,UAAA,oBAAC,QAAA,EAAK,WAAU,sCACb,UAAA,gBAAgB,IAAI,WAAW,GAAG,WAAW,SAAA,CAChD;AAAA,UACA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,cAAW;AAAA,cACX,SAAS;AAAA,cACT,WAAU;AAAA,cAEV,UAAA,oBAAC,GAAA,EAAE,eAAY,QAAO,WAAU,SAAA,CAAS;AAAA,YAAA;AAAA,UAAA;AAAA,UAE3C,oBAAC,OAAA,EAAI,WAAW,KAAK,UAAA,MAAA,CAAG;AAAA,QAAA,EAAA,CAC1B,IAEA,oBAAC,OAAA,EAAI,WAAW,KAAK,UAAA,IAAA,CAAC;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAI9B;"}

package/dist/esm/modules/communityTools/useCommunityTools.d.ts

@@ -0,0 +1,157 @@
+import { CommunityTool } from '@igstack/app-catalog-shared-core';
+/**
+ * Everything the community page reads, and the pin writes. Pins
+ * belong to the signed-in user, so they are not asked for until there is one.
+ */
+export declare function useCommunityTools(): {
+    list: import('@tanstack/react-query').UseQueryResult<{
+        createdAt: string;
+        slug: string;
+        name: string;
+        tags: {
+            value: string;
+            kind: "app" | "topic";
+        }[];
+        url: string;
+        host: string;
+        summary: string;
+        descriptionMd: string;
+        capturedAt: string | null;
+        siteUpdatedAt: string | null;
+        owners: {
+            slug: string | null;
+            name: string;
+        }[];
+        likes: number;
+        views30d: number;
+        viewsAll: number;
+        lifecycle: import('@igstack/app-catalog-shared-core').Lifecycle;
+        capturePending: boolean;
+        canEdit: boolean;
+        addedBy: {
+            userId: string;
+            name: string;
+        };
+        likedByMe: boolean;
+        likedBy: string[];
+        reviewed: boolean;
+        screenshotId: string | null;
+        faviconId: string | null;
+    }[], import('@trpc/client').TRPCClientErrorLike<{
+        transformer: false;
+        errorShape: import('@trpc/server').TRPCDefaultErrorShape;
+    }>>;
+    pins: import('@tanstack/react-query').UseQueryResult<{
+        createdAt: string;
+        slug: string;
+        name: string;
+        tags: {
+            value: string;
+            kind: "app" | "topic";
+        }[];
+        url: string;
+        host: string;
+        summary: string;
+        descriptionMd: string;
+        capturedAt: string | null;
+        siteUpdatedAt: string | null;
+        owners: {
+            slug: string | null;
+            name: string;
+        }[];
+        likes: number;
+        views30d: number;
+        viewsAll: number;
+        lifecycle: import('@igstack/app-catalog-shared-core').Lifecycle;
+        capturePending: boolean;
+        canEdit: boolean;
+        addedBy: {
+            userId: string;
+            name: string;
+        };
+        likedByMe: boolean;
+        likedBy: string[];
+        reviewed: boolean;
+        screenshotId: string | null;
+        faviconId: string | null;
+    }[], import('@trpc/client').TRPCClientErrorLike<{
+        transformer: false;
+        errorShape: import('@trpc/server').TRPCDefaultErrorShape;
+    }>>;
+    appNames: {
+        [k: string]: string;
+    };
+    isAuthenticated: boolean;
+    isAuthLoading: boolean;
+    pin: import('@tanstack/react-query').UseMutationResult<never, import('@trpc/client').TRPCClientErrorLike<{
+        input: {
+            slug: string;
+        };
+        output: never;
+        transformer: false;
+        errorShape: import('@trpc/server').TRPCDefaultErrorShape;
+        featureFlags: {
+            keyPrefix: false;
+        };
+    }>, {
+        slug: string;
+    }, {
+        previous: CommunityTool[] | undefined;
+    }>;
+    unpin: import('@tanstack/react-query').UseMutationResult<never, import('@trpc/client').TRPCClientErrorLike<{
+        input: {
+            slug: string;
+        };
+        output: never;
+        transformer: false;
+        errorShape: import('@trpc/server').TRPCDefaultErrorShape;
+        featureFlags: {
+            keyPrefix: false;
+        };
+    }>, {
+        slug: string;
+    }, {
+        previous: CommunityTool[] | undefined;
+    }>;
+    pinBusySlug: string | undefined;
+    reorder: import('@tanstack/react-query').UseMutationResult<never, import('@trpc/client').TRPCClientErrorLike<{
+        input: {
+            slugs: string[];
+        };
+        output: never;
+        transformer: false;
+        errorShape: import('@trpc/server').TRPCDefaultErrorShape;
+        featureFlags: {
+            keyPrefix: false;
+        };
+    }>, {
+        slugs: string[];
+    }, void>;
+    like: import('@tanstack/react-query').UseMutationResult<never, import('@trpc/client').TRPCClientErrorLike<{
+        input: {
+            slug: string;
+        };
+        output: never;
+        transformer: false;
+        errorShape: import('@trpc/server').TRPCDefaultErrorShape;
+        featureFlags: {
+            keyPrefix: false;
+        };
+    }>, {
+        slug: string;
+    }, void>;
+    unlike: import('@tanstack/react-query').UseMutationResult<never, import('@trpc/client').TRPCClientErrorLike<{
+        input: {
+            slug: string;
+        };
+        output: never;
+        transformer: false;
+        errorShape: import('@trpc/server').TRPCDefaultErrorShape;
+        featureFlags: {
+            keyPrefix: false;
+        };
+    }>, {
+        slug: string;
+    }, void>;
+    withMyLike: (tool: CommunityTool) => CommunityTool;
+};

package/dist/esm/modules/communityTools/useCommunityTools.js

@@ -0,0 +1,122 @@
+import { useQueryClient, useQuery, useMutation } from "@tanstack/react-query";
+import { useMemo, useState, useCallback } from "react";
+import { useTRPC } from "../../api/infra/trpc.js";
+import { useAppCatalogContext } from "../appCatalog/context/AppCatalogContext.js";
+import { useAuth } from "../auth/AuthContext.js";
+import "react/jsx-runtime";
+import "../../ui/button.js";
+import { withLike } from "./likedBy.js";
+function useCommunityTools() {
+  const trpc = useTRPC();
+  const queryClient = useQueryClient();
+  const { isAuthenticated, isLoading: isAuthLoading } = useAuth();
+  const { resources } = useAppCatalogContext();
+  const list = useQuery(trpc.communityTools.list.queryOptions());
+  const pins = useQuery(
+    trpc.communityTools.pins.queryOptions(void 0, {
+      enabled: isAuthenticated
+    })
+  );
+  const appNames = useMemo(
+    () => Object.fromEntries(resources.map((r) => [r.slug, r.displayName])),
+    [resources]
+  );
+  const pinsKey = trpc.communityTools.pins.queryKey();
+  const refreshPins = () => queryClient.invalidateQueries({ queryKey: pinsKey });
+  const optimisticPins = (change) => ({
+    onMutate: async ({ slug }) => {
+      await queryClient.cancelQueries({ queryKey: pinsKey });
+      const previous = queryClient.getQueryData(pinsKey);
+      queryClient.setQueryData(
+        pinsKey,
+        (old) => old ? change(old, slug) : old
+      );
+      return { previous };
+    },
+    onError: (_error, _input, context) => {
+      queryClient.setQueryData(pinsKey, context == null ? void 0 : context.previous);
+    },
+    // Not awaited: the pin is saved once the server answers; the refetch
+    // behind it only confirms what the star already shows.
+    onSettled: () => {
+      void refreshPins();
+    }
+  });
+  const pin = useMutation(
+    trpc.communityTools.pin.mutationOptions(
+      optimisticPins((old, slug) => {
+        var _a;
+        const tool = (_a = list.data) == null ? void 0 : _a.find((t) => t.slug === slug);
+        return tool && !old.some((t) => t.slug === slug) ? [...old, tool] : old;
+      })
+    )
+  );
+  const unpin = useMutation(
+    trpc.communityTools.unpin.mutationOptions(
+      optimisticPins((old, slug) => old.filter((t) => t.slug !== slug))
+    )
+  );
+  const pinBusySlug = pin.isPending ? pin.variables.slug : unpin.isPending ? unpin.variables.slug : void 0;
+  const reorder = useMutation(
+    trpc.communityTools.reorderPins.mutationOptions({
+      onMutate: ({ slugs }) => {
+        queryClient.setQueryData(
+          pinsKey,
+          (old) => old ? slugs.flatMap((s) => old.find((t) => t.slug === s) ?? []) : old
+        );
+      },
+      onSettled: refreshPins
+    })
+  );
+  const [myLikes, setMyLikes] = useState(
+    () => /* @__PURE__ */ new Map()
+  );
+  const setMyLike = (slug, liked) => setMyLikes((prev) => {
+    const next = new Map(prev);
+    if (liked === void 0) next.delete(slug);
+    else next.set(slug, liked);
+    return next;
+  });
+  const likeOptions = (liked) => ({
+    onMutate: ({ slug }) => setMyLike(slug, liked),
+    onError: (_error, { slug }) => setMyLike(slug, void 0),
+    onSettled: () => {
+      void queryClient.invalidateQueries({
+        queryKey: trpc.communityTools.list.queryKey(),
+        refetchType: "none"
+      });
+      void refreshPins();
+    }
+  });
+  const like = useMutation(
+    trpc.communityTools.like.mutationOptions(likeOptions(true))
+  );
+  const unlike = useMutation(
+    trpc.communityTools.unlike.mutationOptions(likeOptions(false))
+  );
+  const withMyLike = useCallback(
+    (tool) => {
+      const mine = myLikes.get(tool.slug);
+      return mine === void 0 ? tool : withLike(tool, mine);
+    },
+    [myLikes]
+  );
+  return {
+    list,
+    pins,
+    appNames,
+    isAuthenticated,
+    isAuthLoading,
+    pin,
+    unpin,
+    pinBusySlug,
+    reorder,
+    like,
+    unlike,
+    withMyLike
+  };
+}
+export {
+  useCommunityTools
+};
+//# sourceMappingURL=useCommunityTools.js.map

package/dist/esm/modules/communityTools/useCommunityTools.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCommunityTools.js","sources":["../../../../src/modules/communityTools/useCommunityTools.ts"],"sourcesContent":["import type { CommunityTool } from '@igstack/app-catalog-shared-core'\nimport { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'\nimport { useCallback, useMemo, useState } from 'react'\nimport { useTRPC } from '~/api/infra/trpc'\nimport { useAppCatalogContext } from '~/modules/appCatalog/context/AppCatalogContext'\nimport { useAuth } from '~/modules/auth'\nimport { withLike } from './likedBy'\n\n/**\n * Everything the community page reads, and the pin writes. Pins\n * belong to the signed-in user, so they are not asked for until there is one.\n */\nexport function useCommunityTools() {\n  const trpc = useTRPC()\n  const queryClient = useQueryClient()\n  const { isAuthenticated, isLoading: isAuthLoading } = useAuth()\n  const { resources } = useAppCatalogContext()\n\n  const list = useQuery(trpc.communityTools.list.queryOptions())\n  const pins = useQuery(\n    trpc.communityTools.pins.queryOptions(undefined, {\n      enabled: isAuthenticated,\n    }),\n  )\n\n  /** Display names of official apps by slug, for app tags. */\n  const appNames = useMemo(\n    () => Object.fromEntries(resources.map((r) => [r.slug, r.displayName])),\n    [resources],\n  )\n\n  const pinsKey = trpc.communityTools.pins.queryKey()\n  const refreshPins = () => queryClient.invalidateQueries({ queryKey: pinsKey })\n\n  // The star and the shelf change at once; a failed save puts them back.\n  const optimisticPins = (\n    change: (old: CommunityTool[], slug: string) => CommunityTool[],\n  ) => ({\n    onMutate: async ({ slug }: { slug: string }) => {\n      await queryClient.cancelQueries({ queryKey: pinsKey })\n      const previous = queryClient.getQueryData<CommunityTool[]>(pinsKey)\n      queryClient.setQueryData<CommunityTool[]>(pinsKey, (old) =>\n        old ? change(old, slug) : old,\n      )\n      return { previous }\n    },\n    onError: (\n      _error: unknown,\n      _input: { slug: string },\n      context: { previous?: CommunityTool[] } | undefined,\n    ) => {\n      queryClient.setQueryData(pinsKey, context?.previous)\n    },\n    // Not awaited: the pin is saved once the server answers; the refetch\n    // behind it only confirms what the star already shows.\n    onSettled: () => {\n      void refreshPins()\n    },\n  })\n  const pin = useMutation(\n    trpc.communityTools.pin.mutationOptions(\n      optimisticPins((old, slug) => {\n        const tool = list.data?.find((t) => t.slug === slug)\n        return tool && !old.some((t) => t.slug === slug) ? [...old, tool] : old\n      }),\n    ),\n  )\n  const unpin = useMutation(\n    trpc.communityTools.unpin.mutationOptions(\n      optimisticPins((old, slug) => old.filter((t) => t.slug !== slug)),\n    ),\n  )\n  /** The tool whose pin is being saved, if any. */\n  const pinBusySlug = pin.isPending\n    ? pin.variables.slug\n    : unpin.isPending\n      ? unpin.variables.slug\n      : undefined\n  const reorder = useMutation(\n    trpc.communityTools.reorderPins.mutationOptions({\n      onMutate: ({ slugs }) => {\n        // The tile moves at once; the server catches up behind it.\n        queryClient.setQueryData<CommunityTool[]>(pinsKey, (old) =>\n          old ? slugs.flatMap((s) => old.find((t) => t.slug === s) ?? []) : old,\n        )\n      },\n      onSettled: refreshPins,\n    }),\n  )\n\n  // My likes show at once, as an overlay on the tools as fetched. The feed\n  // ranks from the fetched tools, so a like changes its own count and never\n  // moves a row out from under the pointer. Settling marks the list stale\n  // without refetching it: it re-ranks on the next refocus or remount.\n  const [myLikes, setMyLikes] = useState<ReadonlyMap<string, boolean>>(\n    () => new Map(),\n  )\n  const setMyLike = (slug: string, liked: boolean | undefined) =>\n    setMyLikes((prev) => {\n      const next = new Map(prev)\n      if (liked === undefined) next.delete(slug)\n      else next.set(slug, liked)\n      return next\n    })\n  const likeOptions = (liked: boolean) => ({\n    onMutate: ({ slug }: { slug: string }) => setMyLike(slug, liked),\n    onError: (_error: unknown, { slug }: { slug: string }) =>\n      setMyLike(slug, undefined),\n    onSettled: () => {\n      void queryClient.invalidateQueries({\n        queryKey: trpc.communityTools.list.queryKey(),\n        refetchType: 'none',\n      })\n      void refreshPins()\n    },\n  })\n  const like = useMutation(\n    trpc.communityTools.like.mutationOptions(likeOptions(true)),\n  )\n  const unlike = useMutation(\n    trpc.communityTools.unlike.mutationOptions(likeOptions(false)),\n  )\n  /** The tool with my latest like or unlike, saved or still saving. */\n  const withMyLike = useCallback(\n    (tool: CommunityTool) => {\n      const mine = myLikes.get(tool.slug)\n      return mine === undefined ? tool : withLike(tool, mine)\n    },\n    [myLikes],\n  )\n\n  return {\n    list,\n    pins,\n    appNames,\n    isAuthenticated,\n    isAuthLoading,\n    pin,\n    unpin,\n    pinBusySlug,\n    reorder,\n    like,\n    unlike,\n    withMyLike,\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/modules/communityTools/useCommunityToolsConfig.d.ts

@@ -0,0 +1,10 @@
+import { AcRouterContext } from '~/types/types';
+/**
+ * The feature switch, read with the route context's clients, for the route
+ * above the layout's providers. Same query key as the header's, so it is one
+ * request. Here and not in the route file: a deployment compiles the core's
+ * route files from its own tree, where these packages are other copies.
+ */
+export declare function useCommunityToolsConfig({ queryClient, trpcClient, }: Pick<AcRouterContext, 'queryClient' | 'trpcClient'>): {
+    enabled: boolean;
+} | undefined;

package/dist/esm/modules/communityTools/useCommunityToolsConfig.js

@@ -0,0 +1,20 @@
+import { useQuery } from "@tanstack/react-query";
+import { createTRPCOptionsProxy } from "@trpc/tanstack-react-query";
+import { useMemo } from "react";
+function useCommunityToolsConfig({
+  queryClient,
+  trpcClient
+}) {
+  const options = useMemo(
+    () => createTRPCOptionsProxy({
+      client: trpcClient,
+      queryClient
+    }).communityTools.config.queryOptions(),
+    [queryClient, trpcClient]
+  );
+  return useQuery(options, queryClient).data;
+}
+export {
+  useCommunityToolsConfig
+};
+//# sourceMappingURL=useCommunityToolsConfig.js.map

package/dist/esm/modules/communityTools/useCommunityToolsConfig.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCommunityToolsConfig.js","sources":["../../../../src/modules/communityTools/useCommunityToolsConfig.ts"],"sourcesContent":["import type { TRPCRouter } from '@igstack/app-catalog-backend-core'\nimport { useQuery } from '@tanstack/react-query'\nimport { createTRPCOptionsProxy } from '@trpc/tanstack-react-query'\nimport { useMemo } from 'react'\nimport type { AcRouterContext } from '~/types/types'\n\n/**\n * The feature switch, read with the route context's clients, for the route\n * above the layout's providers. Same query key as the header's, so it is one\n * request. Here and not in the route file: a deployment compiles the core's\n * route files from its own tree, where these packages are other copies.\n */\nexport function useCommunityToolsConfig({\n  queryClient,\n  trpcClient,\n}: Pick<AcRouterContext, 'queryClient' | 'trpcClient'>) {\n  const options = useMemo(\n    () =>\n      createTRPCOptionsProxy<TRPCRouter>({\n        client: trpcClient,\n        queryClient,\n      }).communityTools.config.queryOptions(),\n    [queryClient, trpcClient],\n  )\n  return useQuery(options, queryClient).data\n}\n"],"names":[],"mappings":";;;AAYO,SAAS,wBAAwB;AAAA,EACtC;AAAA,EACA;AACF,GAAwD;AACtD,QAAM,UAAU;AAAA,IACd,MACE,uBAAmC;AAAA,MACjC,QAAQ;AAAA,MACR;AAAA,IAAA,CACD,EAAE,eAAe,OAAO,aAAA;AAAA,IAC3B,CAAC,aAAa,UAAU;AAAA,EAAA;AAE1B,SAAO,SAAS,SAAS,WAAW,EAAE;AACxC;"}

package/dist/esm/modules/communityTools/useTimeUp.d.ts

@@ -0,0 +1,5 @@
+/**
+ * True once `ms` have passed since `key` was first shown, false until then. A
+ * new key starts the wait again. The card's cap on waiting for a screenshot.
+ */
+export declare function useTimeUp(key: string, ms: number): boolean;

package/dist/esm/modules/communityTools/useTimeUp.js

@@ -0,0 +1,13 @@
+import { useState, useEffect } from "react";
+function useTimeUp(key, ms) {
+  const [upFor, setUpFor] = useState(null);
+  useEffect(() => {
+    const timer = setTimeout(() => setUpFor(key), ms);
+    return () => clearTimeout(timer);
+  }, [key, ms]);
+  return upFor === key;
+}
+export {
+  useTimeUp
+};
+//# sourceMappingURL=useTimeUp.js.map

package/dist/esm/modules/communityTools/useTimeUp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTimeUp.js","sources":["../../../../src/modules/communityTools/useTimeUp.ts"],"sourcesContent":["import { useEffect, useState } from 'react'\n\n/**\n * True once `ms` have passed since `key` was first shown, false until then. A\n * new key starts the wait again. The card's cap on waiting for a screenshot.\n */\nexport function useTimeUp(key: string, ms: number): boolean {\n  const [upFor, setUpFor] = useState<string | null>(null)\n  useEffect(() => {\n    const timer = setTimeout(() => setUpFor(key), ms)\n    return () => clearTimeout(timer)\n  }, [key, ms])\n  return upFor === key\n}\n"],"names":[],"mappings":";AAMO,SAAS,UAAU,KAAa,IAAqB;AAC1D,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAwB,IAAI;AACtD,YAAU,MAAM;AACd,UAAM,QAAQ,WAAW,MAAM,SAAS,GAAG,GAAG,EAAE;AAChD,WAAO,MAAM,aAAa,KAAK;AAAA,EACjC,GAAG,CAAC,KAAK,EAAE,CAAC;AACZ,SAAO,UAAU;AACnB;"}

package/dist/esm/node_modules/.pnpm/zod@4.3.5/node_modules/zod/v4/classic/schemas.js

@@ -1,10 +1,10 @@
 import { $constructor, $ZodEncodeError } from "../core/core.js";
 import { normalizeParams, defineLazy, extend, safeExtend, merge, pick, omit, partial, required, mergeDefs, clone, shallowClone, issue } from "../core/util.js";
-import { $ZodObjectJIT, $ZodOptional, $ZodNonOptional, $ZodString, $ZodType, $ZodEnum, $ZodExactOptional, $ZodNullable, $ZodUnion, $ZodIntersection, $ZodPipe, $ZodTransform, $ZodDefault, $ZodPrefault, $ZodCatch, $ZodReadonly, $ZodStringFormat, $ZodEmail, $ZodGUID, $ZodUUID, $ZodURL, $ZodEmoji, $ZodNanoID, $ZodCUID, $ZodCUID2, $ZodULID, $ZodXID, $ZodKSUID, $ZodIPv4, $ZodIPv6, $ZodCIDRv4, $ZodCIDRv6, $ZodBase64, $ZodBase64URL, $ZodE164, $ZodJWT, $ZodUnknown, $ZodNever, $ZodArray, $ZodCustom } from "../core/schemas.js";
+import { $ZodObjectJIT, $ZodEnum, $ZodOptional, $ZodNonOptional, $ZodString, $ZodType, $ZodExactOptional, $ZodNullable, $ZodUnion, $ZodIntersection, $ZodPipe, $ZodTransform, $ZodDefault, $ZodPrefault, $ZodCatch, $ZodReadonly, $ZodStringFormat, $ZodEmail, $ZodGUID, $ZodUUID, $ZodURL, $ZodEmoji, $ZodNanoID, $ZodCUID, $ZodCUID2, $ZodULID, $ZodXID, $ZodKSUID, $ZodIPv4, $ZodIPv6, $ZodCIDRv4, $ZodCIDRv6, $ZodBase64, $ZodBase64URL, $ZodE164, $ZodJWT, $ZodUnknown, $ZodNever, $ZodArray, $ZodCustom } from "../core/schemas.js";
 import { globalRegistry } from "../core/registries.js";
 import { _string, _email, _url, _jwt, _emoji, _guid, _uuid, _uuidv4, _uuidv6, _uuidv7, _nanoid, _cuid, _cuid2, _ulid, _base64, _base64url, _xid, _ksuid, _ipv4, _ipv6, _cidrv4, _cidrv6, _e164, _overwrite, _unknown, _never, _regex, _includes, _startsWith, _endsWith, _minLength, _maxLength, _length, _lowercase, _uppercase, _trim, _normalize, _toLowerCase, _toUpperCase, _slugify, _refine, _superRefine, _array } from "../core/api.js";
 import { createStandardJSONSchemaMethod, createToJSONSchemaMethod } from "../core/to-json-schema.js";
-import { objectProcessor, optionalProcessor, nonoptionalProcessor, enumProcessor, stringProcessor, nullableProcessor, unionProcessor, intersectionProcessor, pipeProcessor, transformProcessor, defaultProcessor, prefaultProcessor, catchProcessor, readonlyProcessor, unknownProcessor, neverProcessor, arrayProcessor, customProcessor } from "../core/json-schema-processors.js";
+import { objectProcessor, enumProcessor, optionalProcessor, nonoptionalProcessor, stringProcessor, nullableProcessor, unionProcessor, intersectionProcessor, pipeProcessor, transformProcessor, defaultProcessor, prefaultProcessor, catchProcessor, readonlyProcessor, unknownProcessor, neverProcessor, arrayProcessor, customProcessor } from "../core/json-schema-processors.js";
 import { datetime, date, time, duration } from "./iso.js";
 import { parse, safeParse, parseAsync, safeParseAsync, encode, decode, encodeAsync, decodeAsync, safeEncode, safeDecode, safeEncodeAsync, safeDecodeAsync } from "./parse.js";
 const ZodType = /* @__PURE__ */ $constructor("ZodType", (inst, def) => {