2 files changed, 31 insertions, 15 deletions
diff --git a/extension/react-app/src/components/ComboBox.tsx b/extension/react-app/src/components/ComboBox.tsx
index fdd1e9b7..7d266c6e 100644
--- a/extension/react-app/src/components/ComboBox.tsx
+++ b/extension/react-app/src/components/ComboBox.tsx
@@ -20,6 +20,8 @@ import { ContextItem } from "../../../schema/FullState";
 import { postVscMessage } from "../vscode";
 import { GUIClientContext } from "../App";
 import { MeiliSearch } from "meilisearch";
+import { setBottomMessageCloseTimeout } from "../redux/slices/uiStateSlice";
+import { useDispatch } from "react-redux";
 
 const SEARCH_INDEX_NAME = "continue_context_items";
 
@@ -124,6 +126,7 @@ interface ComboBoxProps {
 const ComboBox = React.forwardRef((props: ComboBoxProps, ref) => {
   const searchClient = new MeiliSearch({ host: "http://127.0.0.1:7700" });
   const client = useContext(GUIClientContext);
+  const dispatch = useDispatch();
 
   const [history, setHistory] = React.useState<string[]>([]);
   // The position of the current command you are typing now, so the one that will be appended to history once you press enter
@@ -179,8 +182,8 @@ const ComboBox = React.forwardRef((props: ComboBoxProps, ref) => {
               })
             );
           })
-          .catch((err) => {
-            console.error(err);
+          .catch(() => {
+            // Swallow errors, because this simply is not supported on Windows at the moment
           });
         return;
       }
@@ -202,6 +205,12 @@ const ComboBox = React.forwardRef((props: ComboBoxProps, ref) => {
     }
   }, [downshiftProps.inputValue]);
 
+  const divRef = React.useRef<HTMLDivElement>(null);
+  const ulRef = React.useRef<HTMLUListElement>(null);
+  const showAbove = () => {
+    return (divRef.current?.getBoundingClientRect().top || 0) > UlMaxHeight;
+  };
+
   useImperativeHandle(ref, () => downshiftProps, [downshiftProps]);
 
   const [metaKeyPressed, setMetaKeyPressed] = useState(false);
@@ -241,12 +250,6 @@ const ComboBox = React.forwardRef((props: ComboBoxProps, ref) => {
     };
   }, [inputRef.current]);
 
-  const divRef = React.useRef<HTMLDivElement>(null);
-  const ulRef = React.useRef<HTMLUListElement>(null);
-  const showAbove = () => {
-    return (divRef.current?.getBoundingClientRect().top || 0) > UlMaxHeight;
-  };
-
   return (
     <>
       <div className="px-2 flex gap-2 items-center flex-wrap mt-2">
@@ -304,6 +307,7 @@ const ComboBox = React.forwardRef((props: ComboBoxProps, ref) => {
             },
             onFocus: (e) => {
               setFocused(true);
+              dispatch(setBottomMessageCloseTimeout(undefined));
             },
             onBlur: (e) => {
               setFocused(false);
@@ -358,6 +362,9 @@ const ComboBox = React.forwardRef((props: ComboBoxProps, ref) => {
                 setCurrentlyInContextQuery(false);
               }
             },
+            onClick: () => {
+              dispatch(setBottomMessageCloseTimeout(undefined));
+            },
             ref: inputRef,
           })}
         />
diff --git a/extension/react-app/src/components/PillButton.tsx b/extension/react-app/src/components/PillButton.tsx
index af4263af..660ede09 100644
--- a/extension/react-app/src/components/PillButton.tsx
+++ b/extension/react-app/src/components/PillButton.tsx
@@ -1,8 +1,9 @@
-import { useContext, useEffect, useState } from "react";
+import { useContext, useEffect, useRef, useState } from "react";
 import styled from "styled-components";
 import {
   StyledTooltip,
   defaultBorderRadius,
+  lightGray,
   secondaryDark,
   vscBackground,
   vscForeground,
@@ -96,12 +97,19 @@ const PillButton = (props: PillButtonProps) => {
           <>
             <b>{props.item.description.name}</b>:{" "}
             {props.item.description.description}
-            <StyledMarkdownPreview
-              source={`\`\`\`\n${props.item.content}\n\`\`\``}
-              wrapperElement={{
-                "data-color-mode": "dark",
-              }}
-            />
+            <pre>
+              <code
+                style={{
+                  fontSize: "10px",
+                  backgroundColor: vscBackground,
+                  color: vscForeground,
+                  whiteSpace: "pre-wrap",
+                  wordWrap: "break-word",
+                }}
+              >
+                {props.item.content}
+              </code>
+            </pre>
           </>
         )
       );
@@ -178,6 +186,7 @@ const PillButton = (props: PillButtonProps) => {
                 backgroundColor={"#cc000055"}
                 onClick={() => {
                   client?.deleteContextWithIds([props.item.description.id]);
+                  dispatch(setBottomMessageCloseTimeout(undefined));
                 }}
               >
                 <Trash style={{ margin: "auto" }} width="1.6em"></Trash>