Chat: Disable adding large-file via @-mention

vscode/CHANGELOG.md

@@ -8,6 +8,8 @@ This is a log of all notable changes to Cody for VS Code. [Unreleased] changes a
 
 ### Fixed
 
+Chat: Large file cannot be added via @-mention. [pull/3531](https://github.com/sourcegraph/cody/pull/3531)
+
 ### Changed
 
 ## [1.10.0]

vscode/webviews/promptEditor/nodes/ContextItemMentionNode.ts

@@ -176,7 +176,8 @@ export function contextItemMentionNodeDisplayText(contextItem: SerializedContext
     // range needs to go to the start (0th character) of line 5. Also, `RangeData` is 0-indexed but
     // display ranges are 1-indexed.
     const rangeText = contextItem.range ? `:${displayLineRange(contextItem.range)}` : ''
-    if (contextItem.type === 'file') {
+    // Large file cannot be added to the context file list.
+    if (contextItem.type === 'file' && !contextItem.isTooLarge) {
         return `@${displayPath(URI.parse(contextItem.uri))}${rangeText}`
     }
     if (contextItem.type === 'symbol') {

vscode/webviews/promptEditor/plugins/atMentions/OptionsList.module.css

@@ -70,6 +70,10 @@
     color: var(--vscode-list-hoverForeground);
     background-color: var(--vscode-list-hoverBackground);
 }
+.option-item.disabled {
+    opacity: 0.5;
+    cursor: default;
+}
 
 body[data-vscode-theme-kind='vscode-high-contrast-light'] .option-item.selected,
 body[data-vscode-theme-kind='vscode-high-contrast'] .option-item.selected {

vscode/webviews/promptEditor/plugins/atMentions/OptionsList.tsx

@@ -22,9 +22,26 @@ export const OptionsList: FunctionComponent<
     useEffect(() => {
         // Scroll to top when options change because the prior `selectedIndex` is invalidated.
         ref?.current?.scrollTo(0, 0)
-        setHighlightedIndex(0)
+        const validIndex = options.findIndex(o => o?.item?.type === 'file' && !o?.item?.isTooLarge)
+        setHighlightedIndex(validIndex < 0 ? 0 : validIndex)
     }, [options])
 
+    // biome-ignore lint/correctness/useExhaustiveDependencies: Intent is to run whenever `selectedIndex` changes.
+    useEffect(() => {
+        if (selectedIndex === null) {
+            return
+        }
+        // If the selectedIndex isTooLarge, set it to the next valid option.
+        const current = options[selectedIndex]
+        const currentOptionIsInvalid = current?.item?.type === 'file' && current?.item?.isTooLarge
+        if (currentOptionIsInvalid) {
+            const validIndex = options.findIndex(
+                (o, i) => i > selectedIndex && o?.item?.type === 'file' && !o?.item?.isTooLarge
+            )
+            setHighlightedIndex(validIndex)
+        }
+    }, [selectedIndex])
+
     const mentionQuery = parseMentionQuery(query)
 
     return (
@@ -95,7 +112,12 @@ const Item: FunctionComponent<{
         <li
             key={option.key}
             tabIndex={-1}
-            className={classNames(className, styles.optionItem, isSelected && styles.selected)}
+            className={classNames(
+                className,
+                styles.optionItem,
+                isSelected && !warning && styles.selected,
+                warning && styles.disabled
+            )}
             ref={option.setRefElement}
             // biome-ignore lint/a11y/noNoninteractiveElementToInteractiveRole: This element is interactive, in a dropdown list.
             role="option"