From c79afa52cc58014cf1fa332ec18b21b626ded98b Mon Sep 17 00:00:00 2001
From: Saoud Rizwan <7799382+saoudrizwan@users.noreply.github.com>
Date: Fri, 4 Oct 2024 03:38:03 -0400
Subject: [PATCH] Fixes

---
 .../src/components/settings/ApiOptions.tsx    | 21 ++++++++++++++++---
 .../settings/OpenRouterModelPicker.tsx        |  8 ++++++-
 2 files changed, 25 insertions(+), 4 deletions(-)

diff --git a/webview-ui/src/components/settings/ApiOptions.tsx b/webview-ui/src/components/settings/ApiOptions.tsx
index f5aae3d..9674403 100644
--- a/webview-ui/src/components/settings/ApiOptions.tsx
+++ b/webview-ui/src/components/settings/ApiOptions.tsx
@@ -44,6 +44,7 @@ const ApiOptions = ({ showModelOptions, apiErrorMessage, modelIdErrorMessage }:
 	const [ollamaModels, setOllamaModels] = useState<string[]>([])
 	const [anthropicBaseUrlSelected, setAnthropicBaseUrlSelected] = useState(!!apiConfiguration?.anthropicBaseUrl)
 	const [azureApiVersionSelected, setAzureApiVersionSelected] = useState(!!apiConfiguration?.azureApiVersion)
+	const [isDescriptionExpanded, setIsDescriptionExpanded] = useState(false)
 
 	const handleInputChange = (field: keyof ApiConfiguration) => (event: any) => {
 		setApiConfiguration({ ...apiConfiguration, [field]: event.target.value })
@@ -542,7 +543,12 @@ const ApiOptions = ({ showModelOptions, apiErrorMessage, modelIdErrorMessage }:
 							{selectedProvider === "openai-native" && createDropdown(openAiNativeModels)}
 						</div>
 
-						<ModelInfoView selectedModelId={selectedModelId} modelInfo={selectedModelInfo} />
+						<ModelInfoView
+							selectedModelId={selectedModelId}
+							modelInfo={selectedModelInfo}
+							isDescriptionExpanded={isDescriptionExpanded}
+							setIsDescriptionExpanded={setIsDescriptionExpanded}
+						/>
 					</>
 				)}
 
@@ -573,8 +579,17 @@ export const formatPrice = (price: number) => {
 	}).format(price)
 }
 
-export const ModelInfoView = ({ selectedModelId, modelInfo }: { selectedModelId: string; modelInfo: ModelInfo }) => {
-	const [isDescriptionExpanded, setIsDescriptionExpanded] = useState(false)
+export const ModelInfoView = ({
+	selectedModelId,
+	modelInfo,
+	isDescriptionExpanded,
+	setIsDescriptionExpanded,
+}: {
+	selectedModelId: string
+	modelInfo: ModelInfo
+	isDescriptionExpanded: boolean
+	setIsDescriptionExpanded: (isExpanded: boolean) => void
+}) => {
 	const isGemini = Object.keys(geminiModels).includes(selectedModelId)
 
 	const infoItems = [
diff --git a/webview-ui/src/components/settings/OpenRouterModelPicker.tsx b/webview-ui/src/components/settings/OpenRouterModelPicker.tsx
index 8e6c0c4..fa77d57 100644
--- a/webview-ui/src/components/settings/OpenRouterModelPicker.tsx
+++ b/webview-ui/src/components/settings/OpenRouterModelPicker.tsx
@@ -17,6 +17,7 @@ const OpenRouterModelPicker: React.FC = () => {
 	const [selectedIndex, setSelectedIndex] = useState(-1)
 	const dropdownRef = useRef<HTMLDivElement>(null)
 	const itemRefs = useRef<(HTMLDivElement | null)[]>([])
+	const [isDescriptionExpanded, setIsDescriptionExpanded] = useState(false)
 
 	const handleModelChange = (newModelId: string) => {
 		setApiConfiguration({
@@ -187,7 +188,12 @@ const OpenRouterModelPicker: React.FC = () => {
 			</DropdownWrapper>
 
 			{hasInfo ? (
-				<ModelInfoView selectedModelId={selectedModelId} modelInfo={selectedModelInfo} />
+				<ModelInfoView
+					selectedModelId={selectedModelId}
+					modelInfo={selectedModelInfo}
+					isDescriptionExpanded={isDescriptionExpanded}
+					setIsDescriptionExpanded={setIsDescriptionExpanded}
+				/>
 			) : (
 				<p
 					style={{