From 3ea20ab8dbd6dc0b4c603acdd62ce9d1c783b0f4 Mon Sep 17 00:00:00 2001
From: Saoud Rizwan <7799382+saoudrizwan@users.noreply.github.com>
Date: Wed, 18 Sep 2024 12:32:18 -0400
Subject: [PATCH] Minor fixes

---
 webview-ui/src/components/ContextMenu.tsx | 15 +++++++--------
 1 file changed, 7 insertions(+), 8 deletions(-)

diff --git a/webview-ui/src/components/ContextMenu.tsx b/webview-ui/src/components/ContextMenu.tsx
index f5f33c3..658bc16 100644
--- a/webview-ui/src/components/ContextMenu.tsx
+++ b/webview-ui/src/components/ContextMenu.tsx
@@ -1,5 +1,5 @@
-import React, { useEffect, useRef, useState } from "react"
-import { getContextMenuOptions, ContextMenuOptionType, ContextMenuQueryItem } from "../utils/mention-context"
+import React, { useEffect, useMemo, useRef } from "react"
+import { ContextMenuOptionType, ContextMenuQueryItem, getContextMenuOptions } from "../utils/mention-context"
 import { formatFilePathForTruncation } from "./CodeAccordian"
 
 interface ContextMenuProps {
@@ -21,14 +21,12 @@ const ContextMenu: React.FC<ContextMenuProps> = ({
 	selectedType,
 	queryItems,
 }) => {
-	const [filteredOptions, setFilteredOptions] = useState<ContextMenuQueryItem[]>(
-		getContextMenuOptions(searchQuery, selectedType, queryItems)
-	)
 	const menuRef = useRef<HTMLDivElement>(null)
 
-	useEffect(() => {
-		setFilteredOptions(getContextMenuOptions(searchQuery, selectedType, queryItems))
-	}, [searchQuery, selectedType, queryItems])
+	const filteredOptions = useMemo(
+		() => getContextMenuOptions(searchQuery, selectedType, queryItems),
+		[searchQuery, selectedType, queryItems]
+	)
 
 	useEffect(() => {
 		if (menuRef.current) {
@@ -120,6 +118,7 @@ const ContextMenu: React.FC<ContextMenuProps> = ({
 					maxHeight: "200px",
 					overflowY: "auto",
 				}}>
+				{/* Can't use virtuoso since it requires fixed height and menu height is dynamic based on # of items */}
 				{filteredOptions.map((option, index) => (
 					<div
 						key={`${option.type}-${option.value || index}`}