import { ThreadRuntime, ThreadState } from "@/generated/typeDocs";
import { ThreadViewportState } from "@/components/docs/parameters-table.context";
useAui (Thread Actions)#
Access thread actions via useAui:
import { useAui } from "@assistant-ui/react";
const aui = useAui();
aui.thread().cancelRun();
aui.thread().append({ role: "user", content: [{ type: "text", text: "Hello" }] });
<ParametersTable {...ThreadRuntime} />
useAuiState (Thread State)#
Access the thread state reactively:
import { useAuiState } from "@assistant-ui/react";
const isRunning = useAuiState((s) => s.thread.isRunning);
const isLoading = useAuiState((s) => s.thread.isLoading);
const messages = useAuiState((s) => s.thread.messages);
<ParametersTable {...ThreadState} />
useThreadViewport#
Manage thread viewport state (e.g., scrolling):
import { useThreadViewport } from "@assistant-ui/react";
const threadViewport = useThreadViewport();
const isAtBottom = useThreadViewport((m) => m.isAtBottom);
<ParametersTable {...ThreadViewportState} />