feat(mention): allow selection of context from branches for remote files and directories

lib/prompt-editor/src/mentions/mentionMenu/MentionMenu.branch.test.ts

@@ -0,0 +1,173 @@
+import {
+    ContextItemSource,
+    type MentionQuery,
+    REMOTE_DIRECTORY_PROVIDER_URI,
+} from '@sourcegraph/cody-shared'
+import type { MentionMenuData } from '@sourcegraph/cody-shared'
+import { describe, expect, test } from 'vitest'
+import { URI } from 'vscode-uri'
+import { getBranchHelpText } from './MentionMenu'
+
+describe('MentionMenu branch selection', () => {
+    test('should show default branch text when no branch is specified', () => {
+        const items: MentionMenuData['items'] = [
+            {
+                type: 'openctx',
+                provider: 'openctx',
+                title: 'src/components',
+                uri: URI.parse('https://example.com/repo/-/tree/src/components'),
+                providerUri: REMOTE_DIRECTORY_PROVIDER_URI,
+                source: ContextItemSource.User,
+                mention: {
+                    uri: 'https://example.com/repo/-/tree/src/components',
+                    data: {
+                        repoName: 'test-repo',
+                        directoryPath: 'src/components',
+                    },
+                },
+            },
+        ]
+
+        const mentionQuery: MentionQuery = {
+            text: 'test-repo:src',
+            provider: REMOTE_DIRECTORY_PROVIDER_URI,
+        }
+
+        const result = getBranchHelpText(items!, mentionQuery)
+        expect(result).toBe('* Sourced from the remote default branch')
+    })
+
+    test('should show branch name when branch is specified in query', () => {
+        const items: MentionMenuData['items'] = [
+            {
+                type: 'openctx',
+                provider: 'openctx',
+                title: 'src/components',
+                uri: URI.parse('https://example.com/repo/-/tree/src/components'),
+                providerUri: REMOTE_DIRECTORY_PROVIDER_URI,
+                source: ContextItemSource.User,
+                mention: {
+                    uri: 'https://example.com/repo/-/tree/src/components',
+                    data: {
+                        repoName: 'test-repo',
+                        directoryPath: 'src/components',
+                    },
+                },
+            },
+        ]
+
+        const mentionQuery = {
+            text: 'test-repo@feature-branch:src',
+            provider: REMOTE_DIRECTORY_PROVIDER_URI,
+        }
+
+        const result = getBranchHelpText(items!, mentionQuery)
+        expect(result).toBe("* Sourced from the 'feature-branch' branch")
+    })
+
+    test('should show branch name from mention data when available', () => {
+        const items: MentionMenuData['items'] = [
+            {
+                type: 'openctx',
+                provider: 'openctx',
+                title: 'src/components',
+                uri: URI.parse('https://example.com/repo/-/tree/src/components'),
+                providerUri: REMOTE_DIRECTORY_PROVIDER_URI,
+                source: ContextItemSource.User,
+                mention: {
+                    uri: 'https://example.com/repo/-/tree/src/components',
+                    data: {
+                        repoName: 'test-repo',
+                        directoryPath: 'src/components',
+                        branch: 'main',
+                    },
+                },
+            },
+        ]
+
+        const mentionQuery = { text: 'test-repo:src', provider: REMOTE_DIRECTORY_PROVIDER_URI }
+
+        const result = getBranchHelpText(items!, mentionQuery)
+        expect(result).toBe("* Sourced from the 'main' branch")
+    })
+
+    test('should prefer mention data branch over query branch', () => {
+        const items: MentionMenuData['items'] = [
+            {
+                type: 'openctx',
+                provider: 'openctx',
+                title: 'src/components',
+                uri: URI.parse('https://example.com/repo/-/tree/src/components'),
+                providerUri: REMOTE_DIRECTORY_PROVIDER_URI,
+                source: ContextItemSource.User,
+                mention: {
+                    uri: 'https://example.com/repo/-/tree/src/components',
+                    data: {
+                        repoName: 'test-repo',
+                        directoryPath: 'src/components',
+                        branch: 'actual-branch',
+                    },
+                },
+            },
+        ]
+
+        const mentionQuery = {
+            text: 'test-repo@query-branch:src',
+            provider: REMOTE_DIRECTORY_PROVIDER_URI,
+        }
+
+        const result = getBranchHelpText(items!, mentionQuery)
+        expect(result).toBe("* Sourced from the 'actual-branch' branch")
+    })
+
+    test('should handle empty items array', () => {
+        const items: MentionMenuData['items'] = []
+        const mentionQuery = { text: 'test-repo@main:src', provider: REMOTE_DIRECTORY_PROVIDER_URI }
+
+        const result = getBranchHelpText(items!, mentionQuery)
+        expect(result).toBe("* Sourced from the 'main' branch")
+    })
+
+    test('should handle non-openctx items', () => {
+        const items: MentionMenuData['items'] = [
+            {
+                type: 'file',
+                provider: 'file',
+                title: 'test.ts',
+                uri: URI.parse('file:///test.ts'),
+                source: ContextItemSource.User,
+            },
+        ]
+
+        const mentionQuery = { text: 'test-repo@feature:src', provider: REMOTE_DIRECTORY_PROVIDER_URI }
+
+        const result = getBranchHelpText(items!, mentionQuery)
+        expect(result).toBe("* Sourced from the 'feature' branch")
+    })
+
+    test('should show branch selection help when showing branch options', () => {
+        const items: MentionMenuData['items'] = [
+            {
+                type: 'openctx',
+                provider: 'openctx',
+                title: '@main',
+                uri: URI.parse('https://example.com/repo@main'),
+                providerUri: REMOTE_DIRECTORY_PROVIDER_URI,
+                source: ContextItemSource.User,
+                mention: {
+                    uri: 'https://example.com/repo@main',
+                    data: {
+                        repoName: 'test-repo',
+                        branch: 'main',
+                        // No directoryPath - this indicates we're in branch selection mode
+                    },
+                },
+            },
+        ]
+
+        const mentionQuery = { text: 'test-repo:', provider: REMOTE_DIRECTORY_PROVIDER_URI }
+
+        const result = getBranchHelpText(items!, mentionQuery)
+        expect(result).toBe('* Select or search for a specific branch')
+    })
+})

lib/prompt-editor/src/mentions/mentionMenu/MentionMenu.tsx

@@ -165,20 +165,24 @@ export const MentionMenu: FunctionComponent<
                     // Rather keep the provider in place and update the query with repo name so that the provider can
                     // start showing the files instead.
 
+                    const branch = item.mention?.data?.branch
+                    const repoName = item?.mention?.data.repoName
+                    const repoWithBranch = branch ? `${repoName}@${branch}` : repoName
+
                     updateMentionMenuParams({
                         parentItem:
                             item.providerUri === REMOTE_DIRECTORY_PROVIDER_URI
                                 ? {
                                       id: REMOTE_DIRECTORY_PROVIDER_URI,
                                       title: 'Remote Directories',
-                                      queryLabel: 'Enter directory path to search',
-                                      emptyLabel: `No matching directories found in ${item?.mention?.data.repoName} repository`,
+                                      queryLabel: `Enter directory path to search in ${repoWithBranch}`,
+                                      emptyLabel: `No matching directories found in ${repoWithBranch} repository`,
                                   }
                                 : {
                                       id: REMOTE_FILE_PROVIDER_URI,
                                       title: 'Remote Files',
-                                      queryLabel: 'Enter file path to search',
-                                      emptyLabel: `No matching files found in ${item?.mention?.data.repoName} repository`,
+                                      queryLabel: `Enter file path to search in ${repoWithBranch}`,
+                                      emptyLabel: `No matching files found in ${repoWithBranch} repository`,
                                   },
                     })
 
@@ -192,7 +196,11 @@ export const MentionMenu: FunctionComponent<
                         const cursorPosition = selection.anchorOffset
                         const mentionStart = cursorPosition - mentionQuery.text.length
                         const mentionEndIndex = cursorPosition
-                        const textToInsert = `${item.mention?.data?.repoName}:`
+                        // If a branch is selected, include it in the query
+                        const branch = item.mention?.data?.branch
+                        const textToInsert = branch
+                            ? `${item.mention?.data?.repoName}@${branch}:`
+                            : `${item.mention?.data?.repoName}:`
 
                         return [
                             currentText.slice(0, mentionStart) +
@@ -265,7 +273,7 @@ export const MentionMenu: FunctionComponent<
                 ref={ref}
                 data-testid="mention-menu"
             >
-                <CommandList className="!tw-max-h-[unset]">
+                <CommandList className="!tw-max-h-[unset] tw-min-h-[90px]">
                     {providers.length > 0 && (
                         <CommandGroup className={COMMAND_GROUP_CLASS_NAME}>{providers}</CommandGroup>
                     )}
@@ -302,10 +310,11 @@ export const MentionMenu: FunctionComponent<
                             className={clsx(
                                 COMMAND_ROW_CLASS_NAME,
                                 COMMAND_ROW_TEXT_CLASS_NAME,
-                                'tw-bg-accent'
+                                'tw-bg-accent',
+                                '!tw-h-auto'
                             )}
                         >
-                            * Sourced from the remote default branch
+                            {getBranchHelpText(data.items, mentionQuery)}
                         </CommandLoading>
                     )}
 
@@ -341,6 +350,55 @@ function commandRowValue(
     return contextItemID(row)
 }
 
+export function getBranchHelpText(
+    items: NonNullable<MentionMenuData['items']>,
+    mentionQuery: MentionQuery
+): string {
+    const firstItem = items[0]
+
+    // Type guard for openctx items
+    const isOpenCtxItem = (
+        item: ContextItem
+    ): item is ContextItem & {
+        type: 'openctx'
+        mention?: { data?: { branch?: string; repoName?: string; directoryPath?: string } }
+    } => item.type === 'openctx'
+
+    if (firstItem && isOpenCtxItem(firstItem)) {
+        const openCtxItem = firstItem
+        const repoName = openCtxItem.mention?.data?.repoName
+        const branch = openCtxItem.mention?.data?.branch
+        const directoryPath = openCtxItem.mention?.data?.directoryPath
+
+        // If we're showing branch options (no directoryPath), show branch selection help
+        if (repoName && !directoryPath) {
+            // Check if this is a branch mention (title starts with @)
+            if (firstItem.title?.startsWith('@')) {
+                return '* Select or search for a specific branch'
+            }
+        }
+
+        // If we're browsing directories and have branch info, show current branch
+        if (branch) {
+            return `* Sourced from the '${branch}' branch`
+        }
+    }
+
+    // Check if user has specified a branch in the query
+    const atIndex = mentionQuery.text.indexOf('@')
+    if (atIndex !== -1 && atIndex < mentionQuery.text.length - 1) {
+        const afterAt = mentionQuery.text.slice(atIndex + 1)
+        const colonIndex = afterAt.indexOf(':')
+        const branchName = colonIndex !== -1 ? afterAt.slice(0, colonIndex) : afterAt
+
+        if (branchName.trim()) {
+            return `* Sourced from the '${branchName}' branch`
+        }
+    }
+
+    return '* Sourced from the remote default branch'
+}
+
 function getEmptyLabel(
     parentItem: ContextMentionProviderMetadata | null,
     mentionQuery: MentionQuery
@@ -359,6 +417,19 @@ function getEmptyLabel(
     return parentItem.emptyLabel ?? 'No results'
 }
 
+function getRemoteDirectoryHeading(queryText: string): string {
+    if (!queryText.includes(':')) {
+        return 'Directory - Select a repository*'
+    }
+
+    // If path includes @, we're in directory selection/filtering mode
+    if (queryText.includes('@')) {
+        return 'Directory - Select or search for a directory*'
+    }
+
+    return 'Directory - Select or search for a branch*'
+}
+
 function getItemsHeading(
     parentItem: ContextMentionProviderMetadata | null,
     mentionQuery: MentionQuery
@@ -383,19 +454,7 @@ function getItemsHeading(
     if (parentItem.id === REMOTE_DIRECTORY_PROVIDER_URI) {
         return (
             <div className="tw-flex tw-flex-gap-2 tw-items-center tw-justify-between">
-                <div>
-                    {mentionQuery.text.includes(':')
-                        ? 'Directory - Select or search for a directory*'
-                        : 'Directory - Select a repository*'}
-                </div>
-                <div
-                    className={clsx(
-                        'tw-text-xs tw-rounded tw-px-2 tw-text-foreground',
-                        styles.experimental
-                    )}
-                >
-                    Experimental
-                </div>
+                <div>{getRemoteDirectoryHeading(mentionQuery.text)}</div>
             </div>
         )
     }

lib/prompt-editor/src/mentions/mentionMenu/MentionMenuItem.module.css

@@ -6,7 +6,6 @@
     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
-    direction: rtl;
     text-align: left;
 }
 
@@ -29,6 +28,4 @@
     flex: 1;
 }
 
-.title:hover {
-    direction: rtl;
-}
+

lib/shared/src/index.ts

@@ -343,7 +343,10 @@ export {
     promise,
     type ReadonlyDeep,
 } from './utils'
-export type { CurrentUserCodySubscription } from './sourcegraph-api/graphql/client'
+export type {
+    CurrentUserCodySubscription,
+    DirectoryContentsResponse,
+} from './sourcegraph-api/graphql/client'
 export * from './auth/types'
 export * from './auth/tokens'
 export * from './auth/referral'