fix(frontend): pass selected item to doInsert on Enter key and fix list keys
- handleSelectRef.current() was called without argument → suggestion was undefined → suggestion.type threw. Now passes the selected item. - key prop moved to outer map wrapper div so React can diff the list correctly. Inner SuggestionItem/CategoryHeader no longer need keys.
This commit is contained in:
parent
989a4117db
commit
4ace651c6f
@ -401,7 +401,7 @@ export function MentionPopover({
|
||||
if (!item) return;
|
||||
e.preventDefault();
|
||||
if (item.type === 'category') onCategoryEnterRef.current(item.category!);
|
||||
else handleSelectRef.current();
|
||||
else handleSelectRef.current(item);
|
||||
} else if (e.key === 'Escape') {
|
||||
e.preventDefault();
|
||||
closePopoverRef.current();
|
||||
@ -473,13 +473,17 @@ export function MentionPopover({
|
||||
<ScrollArea className="max-h-80">
|
||||
<div className="py-1">
|
||||
{suggestions.map((s, i) => s.type === 'category' ? (
|
||||
<CategoryHeader key={s.label + i} suggestion={s} isSelected={i === selectedIndex} />
|
||||
<div key={s.label}>
|
||||
<CategoryHeader suggestion={s} isSelected={i === selectedIndex} />
|
||||
</div>
|
||||
) : (
|
||||
<div ref={el => { itemsRef.current[i] = el; }}>
|
||||
<SuggestionItem key={s.mentionId || s.label + i} suggestion={s} isSelected={i === selectedIndex}
|
||||
<div key={s.mentionId || s.label} ref={el => { itemsRef.current[i] = el; }}>
|
||||
<SuggestionItem
|
||||
suggestion={s} isSelected={i === selectedIndex}
|
||||
onSelect={() => doInsert(s)}
|
||||
onMouseEnter={() => { setSelectedIndex(i); selectedIndexRef.current = i; }}
|
||||
searchTerm={mentionState.item} />
|
||||
searchTerm={mentionState.item}
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user