iris-chatbot 2.0.0 → 4.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "iris-chatbot",
-  "version": "2.0.0",
+  "version": "4.0.0",
   "private": false,
   "description": "One-command installer for the Iris project template.",
   "bin": {

package/template/next-env.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="next" />
 /// <reference types="next/image-types/global" />
-import "./.next/types/routes.d.ts";
+import "./.next/dev/types/routes.d.ts";
 
 // NOTE: This file should not be edited
 // see https://nextjs.org/docs/app/api-reference/config/typescript for more information.

package/template/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "iris",
-  "version": "2.0.0",
+  "version": "4.0.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "iris",
-      "version": "2.0.0",
+      "version": "4.0.0",
       "dependencies": {
         "@anthropic-ai/sdk": "^0.72.1",
         "clsx": "^2.1.1",

package/template/package.json

@@ -1,6 +1,6 @@
 {
   "name": "iris",
-  "version": "2.0.0",
+  "version": "4.0.0",
   "private": true,
   "description": "One-command installer for the Iris project template.",
   "engines": {

package/template/src/app/globals.css

@@ -784,8 +784,8 @@ a {
   height: 38px;
   width: 38px;
   border-radius: 12px;
-  border: 1px solid var(--border);
-  background: var(--panel-2);
+  border: 1px solid transparent;
+  background: transparent;
   color: var(--text-secondary);
   display: flex;
   align-items: center;
@@ -794,7 +794,7 @@ a {
 }
 
 .sidebar-icon-button:hover {
-  border-color: var(--border-strong);
+  border-color: var(--border);
   color: var(--text-primary);
   transform: translateY(-1px);
 }

package/template/src/app/page.tsx

@@ -132,6 +132,11 @@ export default function Home() {
     [threads, activeThreadId]
   );
 
+  const sidebarThreads = useMemo(
+    () => threads?.filter((t) => t.headMessageId != null) ?? [],
+    [threads]
+  );
+
   const conversationMessages = useConversationMessages(
     activeThread?.conversationId || null
   );
@@ -333,11 +338,23 @@ export default function Home() {
       }
     >
       <Sidebar
-        threads={threads || []}
+        threads={sidebarThreads}
         activeThreadId={activeThreadId}
         collapsed={sidebarCollapsed}
-        onSelect={(id) => setActiveThreadId(id)}
+        onSelect={async (id) => {
+          if (id !== activeThreadId) {
+            const prev = threads?.find((t) => t.id === activeThreadId);
+            if (prev?.headMessageId == null) {
+              await deleteThread(prev.id);
+            }
+          }
+          setActiveThreadId(id);
+        }}
         onNewChat={async () => {
+          const prev = threads?.find((t) => t.id === activeThreadId);
+          if (prev?.headMessageId == null) {
+            await deleteThread(prev.id);
+          }
           const thread = await createNewThread();
           setViewMode("chat");
           setActiveThreadId(thread.id);
@@ -432,7 +449,7 @@ export default function Home() {
       ) : null}
       {searchOpen ? (
         <SearchModal
-          threads={threads || []}
+          threads={sidebarThreads}
           onClose={() => setSearchOpen(false)}
           onSelect={(id) => {
             setActiveThreadId(id);

package/template/src/components/ChatView.tsx

@@ -1,6 +1,5 @@
 "use client";
 
-import { ArrowDown } from "lucide-react";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import type {
   ChatCitationSource,
@@ -27,6 +26,7 @@ import {
 } from "../lib/memory";
 import { useUIStore } from "../lib/store";
 import { toChatConnectionPayload } from "../lib/connections";
+import { ArrowDown } from "lucide-react";
 import MessageCard from "./MessageCard";
 import Composer from "./Composer";
 
@@ -1506,9 +1506,9 @@ export default function ChatView({
       {threadMessages.length > 0 ? (
 	        <>
 	          {showJumpToBottom ? (
-            <div className="pointer-events-none absolute bottom-24 right-8 z-30">
+            <div className="pointer-events-none absolute bottom-28 left-1/2 z-30 -translate-x-1/2 opacity-80 transition-opacity duration-200">
               <button
-	                className="pointer-events-auto inline-flex h-11 w-11 items-center justify-center rounded-full border border-[var(--border-strong)] bg-[var(--panel)] text-[var(--text-primary)] shadow-[var(--shadow)] transition hover:translate-y-[1px] hover:border-[var(--accent)]"
+	                className="pointer-events-auto inline-flex h-9 w-9 items-center justify-center rounded-full border border-[var(--border-strong)] bg-[var(--panel)] text-[var(--text-primary)] shadow-[var(--shadow)] transition hover:translate-y-[1px] hover:border-[var(--accent)] hover:opacity-100"
 	                onClick={() => {
                     shouldStickToBottomRef.current = true;
                     setShowJumpToBottom(false);
@@ -1518,7 +1518,7 @@ export default function ChatView({
 	                aria-label="Jump to latest message"
                 title="Jump to latest"
               >
-                <ArrowDown className="h-5 w-5" />
+                <ArrowDown className="h-4 w-4" />
               </button>
             </div>
           ) : null}

package/template/src/components/Sidebar.tsx

@@ -90,23 +90,33 @@ export default function Sidebar({
 	              {groups.map(({ root }) => (
 	                <div key={root.id} className="space-y-1">
 	                  <div
-	                    className={`group flex h-11 items-center justify-between rounded-lg px-3 text-sm transition ${
+	                    role="button"
+	                    tabIndex={0}
+	                    onClick={() => onSelect(root.id)}
+	                    onKeyDown={(e) => {
+	                      if (e.key === "Enter" || e.key === " ") {
+	                        e.preventDefault();
+	                        onSelect(root.id);
+	                      }
+	                    }}
+	                    className={`group flex h-11 cursor-pointer items-center justify-between rounded-lg px-3 text-sm transition ${
 	                      activeThreadId === root.id
 	                        ? "bg-[var(--panel-2)] text-[var(--text-primary)]"
 	                        : "text-[var(--text-secondary)] hover:bg-[var(--panel)]"
 	                    }`}
 	                  >
-	                    <button
-	                      onClick={() => onSelect(root.id)}
-	                      className="flex min-w-0 flex-1 items-center gap-2 text-left"
-	                    >
+	                    <div className="flex min-w-0 flex-1 items-center gap-2">
 	                      <Folder className="h-4 w-4 shrink-0 text-[var(--text-muted)]" />
 	                      <div className="sidebar-text min-w-0 truncate">
 	                        {root.title || "Main chat"}
 	                      </div>
-	                    </button>
+	                    </div>
                     <button
-                      onClick={() => onDeleteThread(root)}
+                      type="button"
+                      onClick={(e) => {
+                        e.stopPropagation();
+                        onDeleteThread(root);
+                      }}
                       className="ml-2 rounded-full border border-transparent p-1 text-[var(--text-muted)] opacity-0 transition hover:border-[var(--border)] hover:text-[var(--danger)] group-hover:opacity-100"
                     >
                       <Trash2 className="h-3 w-3" />