diff --git a/frontend-modern/src/components/AI/Chat/MentionAutocomplete.tsx b/frontend-modern/src/components/AI/Chat/MentionAutocomplete.tsx
index 96fd5fe6a..e20a75f72 100644
--- a/frontend-modern/src/components/AI/Chat/MentionAutocomplete.tsx
+++ b/frontend-modern/src/components/AI/Chat/MentionAutocomplete.tsx
@@ -4,7 +4,7 @@ import { getSimpleStatusIndicator } from '@/utils/status';
export interface MentionResource {
id: string;
- name: string;
+ displayName: string;
type: 'vm' | 'system-container' | 'app-container' | 'agent';
status?: string;
node?: string;
@@ -27,7 +27,9 @@ export function MentionAutocomplete(props: MentionAutocompleteProps) {
const q = props.query.toLowerCase();
if (!q) return props.resources.slice(0, 10); // Show first 10 if no query
- return props.resources.filter((r) => r.name.toLowerCase().includes(q)).slice(0, 10); // Limit to 10 results
+ return props.resources
+ .filter((r) => r.displayName.toLowerCase().includes(q))
+ .slice(0, 10); // Limit to 10 results
};
// Reset selection when query changes
@@ -153,7 +155,7 @@ export function MentionAutocomplete(props: MentionAutocompleteProps) {
{getTypeIcon(resource.type)}
-
{resource.name}
+
{resource.displayName}
({
MentionAutocomplete: (props: {
visible: boolean;
query: string;
- resources: Array<{ id: string; name: string }>;
- onSelect: (resource: { id: string; name: string }) => void;
+ resources: Array<{ id: string; displayName: string }>;
+ onSelect: (resource: { id: string; displayName: string }) => void;
}) => (
resource.name).join('|')}
+ data-resource-labels={props.resources.map((resource) => resource.displayName).join('|')}
>