experiment flag & textare height

ee/tabby-ui/app/(dashboard)/experiments/components/feature-list.tsx

@@ -1,11 +1,15 @@
 'use client'
 
-import { useEnableCodeBrowserQuickActionBar } from '@/lib/experiment-flags'
+import {
+  useEnableCodeBrowserQuickActionBar,
+  useEnableSearch
+} from '@/lib/experiment-flags'
 import { Switch } from '@/components/ui/switch'
 
 export default function FeatureList() {
   const [quickActionBar, toggleQuickActionBar] =
     useEnableCodeBrowserQuickActionBar()
+  const [search, toggleSearch] = useEnableSearch()
   return (
     <>
       {!quickActionBar.loading && (
@@ -24,6 +28,17 @@ export default function FeatureList() {
           />
         </div>
       )}
+      {!search.loading && (
+        <div className="flex items-center space-x-4 rounded-md border p-4">
+          <div className="flex-1 space-y-1">
+            <p className="text-sm font-medium leading-none">{search.title}</p>
+            <p className="text-sm text-muted-foreground">
+              {search.description}
+            </p>
+          </div>
+          <Switch checked={search.value} onCheckedChange={toggleSearch} />
+        </div>
+      )}
     </>
   )
 }

ee/tabby-ui/app/search/components/search-gate.tsx

@@ -0,0 +1,14 @@
+'use client'
+
+import { useEnableSearch } from '@/lib/experiment-flags'
+
+import { Search } from './search'
+
+export default function SearchGate() {
+  const [searchFlag] = useEnableSearch()
+  if (!searchFlag.value) {
+    return <></>
+  }
+
+  return <Search />
+}

ee/tabby-ui/app/search/components/search.tsx

@@ -79,18 +79,8 @@ const tabbyFetcher = ((url: string, init?: RequestInit) => {
   })
 }) as typeof fetch
 
-export default function Search() {
+export function Search() {
   const [conversation, setConversation] = useState<ConversationMessage[]>([])
-  // const [conversation, setConversation] = useState<ConversationMessage[]>([{
-  //   id: nanoid(), // FIXME
-  //   role: 'user',
-  //   content: 'add function'
-  // }, {
-  //   id: nanoid(), // FIXME
-  //   role: 'assistant',
-  //   content: "",
-  //   isLoading: true
-  // }])
   const contentContainerRef = useRef<HTMLDivElement>(null)
   const [container, setContainer] = useState<HTMLDivElement | null>(null)
   const [title, setTitle] = useState('')
@@ -120,7 +110,7 @@ export default function Search() {
       item => item.id === currentLoadindId
     )
     if (!currentAnswer) return
-    currentAnswer.content = answer.answer_delta
+    currentAnswer.content = answer.answer_delta || ""
     currentAnswer.relevant_documents = answer.relevant_documents
     currentAnswer.relevant_questions = answer.relevant_questions
     currentAnswer.isLoading = isLoading
@@ -313,12 +303,12 @@ function SearchArea({
 }: {
   onSubmitSearch: (question: string) => void
 }) {
-  // FIXME: the textarea has unexpected flash when it's mounted, maybe it can be fixed after adding loader
   const [isShow, setIsShow] = useState(false)
   const [isFocus, setIsFocus] = useState(false)
   const [value, setValue] = useState('')
 
   useEffect(() => {
+    // Ensure the textarea height remains consistent during rendering
     setIsShow(true)
   }, [])
 
@@ -348,9 +338,14 @@ function SearchArea({
       )}
     >
       <TextareaAutosize
-        className="flex-1 resize-none rounded-lg !border-none bg-transparent px-4 py-3 !shadow-none !outline-none !ring-0 !ring-offset-0"
+        className={cn(
+          'flex-1 resize-none rounded-lg !border-none bg-transparent px-4 py-3 !shadow-none !outline-none !ring-0 !ring-offset-0',
+          {
+            '!h-[48px]': !isShow
+          }
+        )}
         placeholder="Ask anything"
-        maxRows={15}
+        maxRows={5}
         onKeyDown={onSearchKeyDown}
         onKeyUp={onSearchKeyUp}
         onFocus={() => setIsFocus(true)}

ee/tabby-ui/app/search/page.tsx

@@ -1,11 +1,11 @@
 import { Metadata } from 'next'
 
-import Search from './components/search'
+import SearchGate from './components/search-gate'
 
 export const metadata: Metadata = {
   title: 'Search'
 }
 
 export default function SearchPage() {
-  return <Search />
+  return <SearchGate />
 }

ee/tabby-ui/lib/experiment-flags.ts

@@ -101,8 +101,16 @@ const enableCodeBrowserQuickActionBarFactory = new ExperimentFlagFactory(
   'Enable Quick Action Bar to display a convenient toolbar when you select code, offering options to explain the code, add unit tests, and more.',
   true
 )
-
 export const EXP_enable_code_browser_quick_action_bar =
   enableCodeBrowserQuickActionBarFactory.defineGlobalVar()
 export const useEnableCodeBrowserQuickActionBar =
   enableCodeBrowserQuickActionBarFactory.defineHook()
+
+const enableSearchFactory = new ExperimentFlagFactory(
+  'enable_search',
+  'Search',
+  'Enable the search on the home page to search for anything you want to know using the local chat model.',
+  false
+)
+export const EXP_enable_search = enableSearchFactory.defineGlobalVar()
+export const useEnableSearch = enableSearchFactory.defineHook()