Fix: Submit AI Agent question on enter (#38)

* Fix: Submit AI Agent question on enter

* Focus on option select

Author: dennypradipta

app/components/ai-agent.tsx

@@ -25,6 +25,7 @@ export default function AIAgent() {
   const [isChatOpen, setIsChatOpen] = useState<boolean>(true);
 
   // Refs to store DOM elements
+  const inputRef = useRef<HTMLInputElement | null>(null);
   const chatDivRef = useRef<HTMLElement | null>(null);
   const chatWindowRef = useRef<HTMLElement | null>(null);
   const chatFABRef = useRef<HTMLElement | null>(null);
@@ -252,10 +253,17 @@ export default function AIAgent() {
                 className="absolute left-0 z-10 ml-4 h-6 w-6 text-[#3276F5]"
               />
               <input
+                ref={inputRef}
                 type="text"
                 className="z-0 h-[52px] w-full max-w-7xl rounded-lg bg-white p-2 pr-12 pl-12 text-gray-800 placeholder:text-gray-400"
                 value={text}
                 onChange={({ target }) => setText(target.value)}
+                onKeyDown={(e) => {
+                  if (e.key === "Enter" && !e.shiftKey) {
+                    e.preventDefault();
+                    handleSubmit(text);
+                  }
+                }}
                 aria-describedby="Ask me about services, success stories, or your challenges"
                 placeholder="Ask me about services, success stories, or your challenges"
               />
@@ -285,7 +293,10 @@ export default function AIAgent() {
               <Button
                 key={id}
                 className="rounded-md border border-white bg-transparent hover:cursor-pointer"
-                onClick={() => setText(text)}>
+                onClick={() => {
+                  setText(text);
+                  inputRef.current?.focus();
+                }}>
                 {text}
               </Button>
             ))}