feat(sharing): user picker in share dialog

Replace the free-text username input with a Select populated from a new
/sharing/users endpoint. Users already on the target's share list are
filtered out, and the trigger surfaces loading / empty states. Matches
the existing permission model since sharing only ever required knowing
a username.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

frontend/src/components/sharing/ShareDialog.tsx

@@ -1,7 +1,12 @@
-import { useEffect, useState } from 'react'
+import { useEffect, useMemo, useState } from 'react'
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
 import { Users, Trash2 } from 'lucide-react'
-import { sharing, type ShareInfo } from '../../services/api'
+import {
+  sharing,
+  type ShareInfo,
+  type ShareableUser,
+} from '../../services/api'
+import { formatApiError } from '../../lib/apiError'
 import {
   SHARED_HEAPS_KEY,
   SHARED_FOLDERS_KEY,
@@ -13,7 +18,6 @@ import {
   DialogTitle,
 } from '@/components/ui/dialog'
 import { Button } from '@/components/ui/button'
-import { Input } from '@/components/ui/input'
 import {
   Select,
   SelectContent,
@@ -54,6 +58,24 @@ export function ShareDialog({
     enabled: isOpen,
   })
 
+  // All users that can be shared with (the caller is filtered out
+  // server-side). Only fetched while the dialog is open. Cached for 60s
+  // because the user directory changes slowly.
+  const { data: allUsers = [], isLoading: isLoadingUsers } = useQuery<
+    ShareableUser[]
+  >({
+    queryKey: ['sharing', 'users'],
+    queryFn: sharing.listUsers,
+    enabled: isOpen,
+    staleTime: 60_000,
+  })
+
+  // Users who don't already have a share on this target.
+  const availableUsers = useMemo(() => {
+    const taken = new Set(shares.map((s) => s.shared_with_username))
+    return allUsers.filter((u) => !taken.has(u.username))
+  }, [allUsers, shares])
+
   const addMutation = useMutation({
     mutationFn: () =>
       type === 'heap'
@@ -68,8 +90,8 @@ export function ShareDialog({
         queryKey: type === 'heap' ? SHARED_HEAPS_KEY : SHARED_FOLDERS_KEY,
       })
     },
-    onError: (err: any) => {
-      setError(err?.response?.data?.detail || 'Failed to share')
+    onError: (err) => {
+      setError(formatApiError(err, 'Failed to share'))
     },
   })
 
@@ -149,17 +171,33 @@ export function ShareDialog({
           className="space-y-3"
         >
           <div className="flex gap-2">
-            <Input
-              type="text"
+            <Select
               value={username}
-              onChange={(e) => {
-                setUsername(e.target.value)
+              onValueChange={(v) => {
+                setUsername(v)
                 setError(null)
               }}
-              placeholder="Username"
-              className="flex-1"
-              autoFocus
-            />
+              disabled={isLoadingUsers || availableUsers.length === 0}
+            >
+              <SelectTrigger className="flex-1">
+                <SelectValue
+                  placeholder={
+                    isLoadingUsers
+                      ? 'Loading users…'
+                      : availableUsers.length === 0
+                        ? 'No users to share with'
+                        : 'Select a user'
+                  }
+                />
+              </SelectTrigger>
+              <SelectContent>
+                {availableUsers.map((u) => (
+                  <SelectItem key={u.id} value={u.username}>
+                    {u.username}
+                  </SelectItem>
+                ))}
+              </SelectContent>
+            </Select>
             <Select
               value={permission}
               onValueChange={(v) => setPermission(v as 'read' | 'write')}