show reasoning in frontend and some other stuff

public/app/modelCapabilities.js

@@ -0,0 +1,6 @@
+// Conservative allowlist for models supporting the boolean think API.
+// Unknown models remain usable for normal chat.
+export function supportsReasoning(model) {
+    const id = String(typeof model === "string" ? model : model?.model || model?.name || "").toLowerCase().split("/").at(-1);
+    return /^(qwen3|deepseek-r1|deepseek-v3\.1)(:|$)/.test(id);
+}

public/app/reasoning.js

@@ -0,0 +1,57 @@
+import {supportsReasoning} from "./modelCapabilities.js";
+
+export function createReasoningToggle(button) {
+    let reasoningEnabled = false;
+    let supported = false;
+    let busy = false;
+    const render = () => {
+        button.disabled = !supported || busy;
+        button.setAttribute("aria-pressed", String(reasoningEnabled));
+        button.title = !supported ? "This model does not support reasoning"
+            : reasoningEnabled ? "Reasoning enabled" : "Enable reasoning";
+        button.setAttribute("aria-label", button.title);
+    };
+    button.addEventListener("click", () => {
+        if (!supported || busy) return;
+        reasoningEnabled = !reasoningEnabled;
+        render();
+    });
+    render();
+    return {
+        get enabled() { return reasoningEnabled; },
+        reset() { reasoningEnabled = false; render(); },
+        setModel(model) { supported = supportsReasoning(model); if (!supported) reasoningEnabled = false; render(); },
+        setBusy(value) { busy = value; render(); }
+    };
+}
+
+export function updateReasoning(messageElement, thinking, streaming = false) {
+    let details = messageElement.querySelector(".msg-reasoning");
+    if (!thinking) {
+        details?.remove();
+        return;
+    }
+    if (!details) {
+        details = document.createElement("details");
+        details.className = "msg-reasoning";
+        details.open = streaming;
+        const summary = document.createElement("summary");
+        const content = document.createElement("div");
+        content.className = "msg-reasoning-content";
+        details.append(summary, content);
+        messageElement.insertBefore(details, messageElement.querySelector(".msg-content"));
+    }
+    details.querySelector("summary").textContent = streaming ? "Reasoning · Thinking…" : "Reasoning";
+    const content = details.querySelector(".msg-reasoning-content");
+    const follow = content.scrollHeight - content.scrollTop - content.clientHeight < 40;
+    content.textContent = thinking;
+    if (streaming && follow) content.scrollTop = content.scrollHeight;
+}
+
+export function finishReasoning(messageElement) {
+    const details = messageElement.querySelector(".msg-reasoning");
+    if (!details || details.dataset.complete) return;
+    details.dataset.complete = "true";
+    details.open = false;
+    details.querySelector("summary").textContent = "Reasoning · Completed";
+}