Trim page props and page the conversation's messages

Bot and workspace lists in page props leave out instructions, memory and
workspace context, and carry the last message as a short preview. The
header avatar's edit form loads the bot's instructions when it opens.
The conversation renders its latest 30 messages and loads older ones as
the thread scrolls to its top.

Also: the composer shows a placeholder until its editor loads, and
`bun start` no longer builds first.

Co-Authored-By: Claude Opus 5.5 <[email protected]>

src/pages/admin/bots/[bot_id]/(hooks)/use-bot-instructions.ts

@@ -0,0 +1,50 @@
+import { useEffect, useState } from "react";
+import fetchBotInstructions from "../(functions)/fetch-bot-instructions";
+
+type Params = {
+    bot_id: number;
+    /**
+     * Loads each time this turns true (the edit form opens), so the form
+     * starts from what was last saved.
+     */
+    enabled: boolean;
+};
+
+/**
+ * The bot's core instructions for its edit form, loaded when it opens:
+ * page props leave them out of every bot row.
+ */
+export default function useBotInstructions({ bot_id, enabled }: Params) {
+    const [system_prompt, setSystemPrompt] = useState<string>();
+    const [error, setError] = useState<string>();
+
+    useEffect(() => {
+        /** Cleared on close, so the next open never shows an old copy. */
+        setSystemPrompt(undefined);
+        setError(undefined);
+
+        if (!enabled || !bot_id) return;
+
+        let cancelled = false;
+
+        fetchBotInstructions({ bot_id })
+            .then((res) => {
+                if (cancelled) return;
+
+                if (res.success && res.singleRes) {
+                    setSystemPrompt(res.singleRes.system_prompt);
+                } else {
+                    setError(res.msg || "Couldn't load the instructions.");
+                }
+            })
+            .catch(() => {
+                if (!cancelled) setError("Couldn't load the instructions.");
+            });
+
+        return () => {
+            cancelled = true;
+        };
+    }, [enabled, bot_id]);
+
+    return { system_prompt, error };
+}

src/pages/admin/bots/[bot_id]/(hooks)/use-older-messages.ts

@@ -0,0 +1,67 @@
+import { useEffect, useRef, useState } from "react";
+import postSessionApi from "@/src/functions/frontend/post-session-api";
+import type { BotMessageWithAttachments, OlderBotMessagesData } from "@/src/types";
+
+type Params = {
+    session_id?: number | null;
+    /**
+     * The page rendered with only the session's latest messages.
+     */
+    has_more: boolean;
+    /**
+     * The thread's oldest message: the next page ends before it.
+     */
+    first_message_id?: number | null;
+    /**
+     * Takes a loaded page, oldest first, to put above the thread.
+     */
+    onLoaded: (params: { messages: BotMessageWithAttachments[] }) => void;
+};
+
+/**
+ * Loads the session's older messages a page at a time, when the thread
+ * is scrolled to its top. A session the thread moves onto starts with
+ * its first message, so it has none older.
+ */
+export default function useOlderMessages({
+    session_id,
+    has_more: initial_has_more,
+    first_message_id,
+    onLoaded,
+}: Params) {
+    const [has_more, setHasMore] = useState(initial_has_more);
+    const [loading, setLoading] = useState(false);
+    const [error, setError] = useState<string>();
+    const first_session = useRef(session_id);
+
+    useEffect(() => {
+        if (session_id == first_session.current) return;
+
+        setHasMore(false);
+        setError(undefined);
+    }, [session_id]);
+
+    const loadOlder = async () => {
+        if (loading || !has_more || !session_id || !first_message_id) return;
+
+        setLoading(true);
+        setError(undefined);
+
+        const res = await postSessionApi<OlderBotMessagesData>({
+            path: "older-messages",
+            body: { session_id, before_id: first_message_id },
+        }).catch(() => null);
+
+        setLoading(false);
+
+        if (!res?.success || !res.singleRes) {
+            setError(res?.msg || "Couldn't load earlier messages.");
+            return;
+        }
+
+        onLoaded({ messages: res.singleRes.messages });
+        setHasMore(res.singleRes.has_more);
+    };
+
+    return { has_more, loading, error, loadOlder };
+}