Function useThreadIndex

examples/ts-react-chat/src/routes/threads.tsx:167–227

* Owns the thread catalog in localStorage. This is the layer the persistence * adapter doesn't provide: the list of conversations, their titles, and recency.

()

 * adapter doesn't provide: the list of conversations, their titles, and recency.
 */
function useThreadIndex() {
  const [threads, setThreads] = useState<Array<ThreadMeta>>([])
  // SSR-safety: the server has no localStorage, so we render an empty list and
  // load the real catalog on the client after mount. `loaded` gates bootstrap
  // logic so we don't auto-create a spurious thread before the real one loads.
  const [loaded, setLoaded] = useState(false)
  // Mirror of the catalog read synchronously by mutators. State closures are
  // stale between two calls in the same event handler (e.g. set-title then
  // bump-recency), which would make the second call clobber the first; the ref
  // is always current, so sequential mutations compose correctly.
  const threadsRef = useRef<Array<ThreadMeta>>([])

  useEffect(() => {
    const initial = readIndex().sort(byRecency)
    threadsRef.current = initial
    setThreads(initial)
    setLoaded(true)
  }, [])

  const commit = (next: Array<ThreadMeta>) => {
    const sorted = [...next].sort(byRecency)
    threadsRef.current = sorted
    setThreads(sorted)
    writeIndex(sorted)
  }

  const createThread = (): ThreadMeta => {
    const thread: ThreadMeta = {
      id: crypto.randomUUID(),
      title: NEW_CHAT_TITLE,
      updatedAt: Date.now(),
    }
    commit([thread, ...threadsRef.current])
    return thread
  }

  const deleteThread = (id: string) => {
    threadPersistence.removeItem(id)
    commit(threadsRef.current.filter((t) => t.id !== id))
  }

  /** Bump recency, and set the title the first time a thread gets one. */
  const touchThread = (id: string, title?: string) => {
    commit(
      threadsRef.current.map((t) =>
        t.id === id
          ? {
              ...t,
              updatedAt: Date.now(),
              title:
                title && t.title === NEW_CHAT_TITLE
                  ? truncateTitle(title)
                  : t.title,
            }
          : t,
      ),
    )
  }