refactor(chat): remove unused mention components and styles

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

@@ -79,10 +79,9 @@ export default function ChatPage() {
     supportsReadWorkspaceGitRepoInfo,
     setSupportsReadWorkspaceGitRepoInfo
   ] = useState(false)
-  const [supportProvideFileAtInfo, setSupportProvideFileAtInfo] =
-    useState(false)
-  const [supportGetFileAtInfoContent, setSupportGetFileAtInfoContent] =
+  const [supportsListFileInWorkspace, setSupportProvideFileAtInfo] =
     useState(false)
+  const [supportsReadFileContent, setSupportsReadFileContent] = useState(false)
 
   const executeCommand = (command: ChatCommand) => {
     if (chatRef.current) {
@@ -248,6 +247,12 @@ export default function ChatPage() {
         server
           ?.hasCapability('readWorkspaceGitRepositories')
           .then(setSupportsReadWorkspaceGitRepoInfo)
+        server
+          ?.hasCapability('listFileInWorkspace')
+          .then(setSupportProvideFileAtInfo)
+        server
+          ?.hasCapability('readFileContent')
+          .then(setSupportsReadFileContent)
       }
 
       checkCapabilities().then(() => {
@@ -431,6 +436,16 @@ export default function ChatPage() {
             : undefined
         }
         getActiveEditorSelection={getActiveEditorSelection}
+        listFileInWorkspace={
+          isInEditor && supportsListFileInWorkspace
+            ? server?.listFileInWorkspace
+            : undefined
+        }
+        readFileContent={
+          isInEditor && supportsReadFileContent
+            ? server?.readFileContent
+            : undefined
+        }
       />
     </ErrorBoundary>
   )

ee/tabby-ui/components/chat/chat-panel.tsx

@@ -1,6 +1,5 @@
-import React, { RefObject, useMemo, useState } from 'react'
+import React, { RefObject, useEffect, useMemo, useState } from 'react'
 import slugify from '@sindresorhus/slugify'
-import { Editor } from '@tiptap/core'
 import { useWindowSize } from '@uidotdev/usehooks'
 import type { UseChatHelpers } from 'ai/react'
 import { AnimatePresence, motion } from 'framer-motion'
@@ -33,11 +32,12 @@ import {
   IconTrash
 } from '@/components/ui/icons'
 import { ButtonScrollToBottom } from '@/components/button-scroll-to-bottom'
-import { PromptForm, PromptFormRef } from '@/components/chat/prompt-form'
+import { PromptForm } from '@/components/chat/prompt-form'
 import { FooterText } from '@/components/footer'
 
 import { Tooltip, TooltipContent, TooltipTrigger } from '../ui/tooltip'
 import { ChatContext } from './chat'
+import { PromptFormRef } from './form-editor/types'
 import { RepoSelect } from './repo-select'
 
 export interface ChatPanelProps
@@ -329,7 +329,6 @@ function ChatPanelRenderer(
             ref={promptFormRef}
             onSubmit={onSubmit}
             isLoading={isLoading}
-            isInitializing={!initialized}
           />
           <FooterText className="hidden sm:block" />
         </div>

ee/tabby-ui/components/chat/chat.tsx

@@ -5,7 +5,10 @@ import type {
   EditorContext,
   EditorFileContext,
   FileLocation,
+  FileRange,
   GitRepository,
+  ListFileItem,
+  ListFilesInWorkspaceParams,
   LookupSymbolHint,
   SymbolInfo
 } from 'tabby-chat-panel'
@@ -48,10 +51,7 @@ import {
 import { ChatPanel, ChatPanelRef } from './chat-panel'
 import { ChatScrollAnchor } from './chat-scroll-anchor'
 import { EmptyScreen } from './empty-screen'
-import {
-  extractAtSourceFromString,
-  isFileAtInfo
-} from './prompt-form-editor/utils'
+import { FILEITEM_REGEX } from './form-editor/utils'
 import { QuestionAnswerList } from './question-answer'
 
 type ChatContextValue = {
@@ -84,8 +84,10 @@ type ChatContextValue = {
   setSelectedRepoId: React.Dispatch<React.SetStateAction<string | undefined>>
   repos: RepositorySourceListQuery['repositoryList'] | undefined
   fetchingRepos: boolean
-  provideFileAtInfo?: (opts?: AtInputOpts) => Promise<FileAtInfo[] | null>
-  getFileAtInfoContent?: (info: FileAtInfo) => Promise<string | null>
+  listFileInWorkspace?: (
+    params: ListFilesInWorkspaceParams
+  ) => Promise<ListFileItem[]>
+  readFileContent?: (info: FileRange) => Promise<string | null>
 }
 
 export const ChatContext = React.createContext<ChatContextValue>(
@@ -127,6 +129,10 @@ interface ChatProps extends React.ComponentProps<'div'> {
   supportsOnApplyInEditorV2: boolean
   readWorkspaceGitRepositories?: () => Promise<GitRepository[]>
   getActiveEditorSelection?: () => Promise<EditorFileContext | null>
+  listFileInWorkspace?: (
+    params: ListFilesInWorkspaceParams
+  ) => Promise<ListFileItem[]>
+  readFileContent?: (info: FileRange) => Promise<string | null>
 }
 
 function ChatRenderer(
@@ -150,7 +156,9 @@ function ChatRenderer(
     chatInputRef,
     supportsOnApplyInEditorV2,
     readWorkspaceGitRepositories,
-    getActiveEditorSelection
+    getActiveEditorSelection,
+    listFileInWorkspace,
+    readFileContent
   }: ChatProps,
   ref: React.ForwardedRef<ChatRef>
 ) {
@@ -500,10 +508,28 @@ function ChatRenderer(
   }
 
   const handleSubmit = async (value: string) => {
+    const fileItems: any[] = []
+    let newValue = value
+
+    let match
+    while ((match = FILEITEM_REGEX.exec(value)) !== null) {
+      try {
+        const parsedItem = JSON.parse(match[1])
+        fileItems.push(parsedItem)
+
+        const replacement = `@${
+          parsedItem.label.split('/').pop() || parsedItem.label || 'unknown'
+        }`
+        newValue = newValue.replace(match[0], replacement)
+      } catch (error) {
+        continue
+      }
+    }
     sendUserChat({
       message: value,
       relevantContext: relevantContext
     })
+
     setRelevantContext([])
   }
 
@@ -632,8 +658,8 @@ function ChatRenderer(
         repos,
         fetchingRepos,
         initialized,
-        provideFileAtInfo,
-        getFileAtInfoContent
+        listFileInWorkspace,
+        readFileContent
       }}
     >
       <div className="flex justify-center overflow-x-hidden">

ee/tabby-ui/components/chat/form-editor/types.ts

@@ -0,0 +1,72 @@
+/**
+ * PromptProps defines the props for the PromptForm component.
+ */
+export interface PromptProps {
+  /**
+   * A callback function that handles form submission.
+   * It returns a Promise, so you can handle async actions.
+   */
+  onSubmit: (value: string) => Promise<void>
+  /**
+   * Indicates if the form (or chat) is in a loading/submitting state.
+   */
+  isLoading: boolean
+}
+
+/**
+ * PromptFormRef defines the methods exposed by the PromptForm via forwardRef.
+ */
+export interface PromptFormRef {
+  /**
+   * Focus the editor inside PromptForm.
+   */
+  focus: () => void
+  /**
+   * Set the content of the editor programmatically.
+   */
+  setInput: (value: string) => void
+  /**
+   * Get the current editor text content.
+   */
+  input: string
+}
+
+/**
+ * Represents a file item inside the workspace.
+ * (You can add more properties if needed)
+ */
+export interface FileItem {
+  label: string
+  id?: string
+  // ... any other fields that you might have
+}
+
+/**
+ * Represents a file source item for mention suggestions.
+ */
+export interface SourceItem {
+  name: string
+  filepath: string
+  category: 'file'
+  fileItem: FileItem
+}
+
+/**
+ * The attributes stored in a mention node.
+ */
+export interface MentionNodeAttrs {
+  id: string
+  name: string
+  category: 'file'
+  fileItem: FileItem
+}
+
+/**
+ * Stores the current state of the mention feature while typing.
+ */
+export interface MentionState {
+  items: SourceItem[]
+  command: ((props: MentionNodeAttrs) => void) | null
+  query: string
+  selectedIndex: number
+}