diff --git a/src/frontend/src/components/inputComponent/index.tsx b/src/frontend/src/components/inputComponent/index.tsx
index 7746f0e32..934618d09 100644
--- a/src/frontend/src/components/inputComponent/index.tsx
+++ b/src/frontend/src/components/inputComponent/index.tsx
@@ -99,12 +99,16 @@ export default function InputComponent({
                 type="text"
                 onBlur={onInputLostFocus}
                 value={
-                  selectedOption !== "" || !onChange ? selectedOption : value
+                  (selectedOption !== "" || !onChange) && setSelectedOption
+                    ? selectedOption
+                    : value
                 }
                 autoFocus={autoFocus}
                 disabled={disabled}
                 onClick={() => {
-                  (selectedOption !== "" || !onChange) && setShowOptions(true);
+                  (selectedOption !== "" || !onChange) &&
+                    setSelectedOption &&
+                    setShowOptions(true);
                 }}
                 required={required}
                 className={classNames(
@@ -206,10 +210,12 @@ export default function InputComponent({
           <div
             className={cn(
               "pointer-events-auto absolute inset-y-0 h-full w-full cursor-pointer",
-              selectedOption !== "" || !onChange ? "" : "hidden"
+              (selectedOption !== "" || !onChange) && setSelectedOption
+                ? ""
+                : "hidden"
             )}
             onClick={
-              selectedOption !== "" || !onChange
+              (selectedOption !== "" || !onChange) && setSelectedOption
                 ? (e) => {
                     setShowOptions((old) => !old);
                     e.preventDefault();
@@ -221,30 +227,32 @@ export default function InputComponent({
         </>
       )}
 
-      <span
-        className={cn(
-          password && selectedOption === "" ? "right-8" : "right-0",
-          "absolute inset-y-0 flex items-center pr-2.5"
-        )}
-      >
-        <button
-          onClick={() => {
-            setShowOptions(!showOptions);
-          }}
+      {setSelectedOption && (
+        <span
           className={cn(
-            selectedOption !== ""
-              ? "text-medium-indigo"
-              : "text-muted-foreground",
-            "hover:text-accent-foreground"
+            password && selectedOption === "" ? "right-8" : "right-0",
+            "absolute inset-y-0 flex items-center pr-2.5"
           )}
         >
-          <ForwardedIconComponent
-            name={optionsIcon}
-            className={"h-4 w-4"}
-            aria-hidden="true"
-          />
-        </button>
-      </span>
+          <button
+            onClick={() => {
+              setShowOptions(!showOptions);
+            }}
+            className={cn(
+              selectedOption !== ""
+                ? "text-medium-indigo"
+                : "text-muted-foreground",
+              "hover:text-accent-foreground"
+            )}
+          >
+            <ForwardedIconComponent
+              name={optionsIcon}
+              className={"h-4 w-4"}
+              aria-hidden="true"
+            />
+          </button>
+        </span>
+      )}
 
       {password && selectedOption === "" && (
         <button