feat(search): Implement OpenSearch support

feat(search): Add searchUrl to message
feat(parsers): Enhance parsers to deal with some thinking models better.

src/components/ChatWindow.tsx

@@ -28,6 +28,7 @@ export type Message = {
   sources?: Document[];
   modelStats?: ModelStats;
   searchQuery?: string;
+  searchUrl?: string;
 };
 
 export interface File {
@@ -417,7 +418,6 @@ const ChatWindow = ({ id }: { id?: string }) => {
 
       if (data.type === 'sources') {
         sources = data.data;
-        const searchQuery = data.searchQuery;
         if (!added) {
           setMessages((prevMessages) => [
             ...prevMessages,
@@ -427,7 +427,8 @@ const ChatWindow = ({ id }: { id?: string }) => {
               chatId: chatId!,
               role: 'assistant',
               sources: sources,
-              searchQuery: searchQuery,
+              searchQuery: data.searchQuery,
+              searchUrl: data.searchUrl,
               createdAt: new Date(),
             },
           ]);
@@ -486,6 +487,7 @@ const ChatWindow = ({ id }: { id?: string }) => {
                 modelStats: data.modelStats || null,
                 // Make sure the searchQuery is preserved (if available in the message data)
                 searchQuery: message.searchQuery || data.searchQuery,
+                searchUrl: message.searchUrl || data.searchUrl,
               };
             }
             return message;

src/components/MessageBox.tsx

@@ -280,8 +280,23 @@ const MessageBox = ({
                 </div>
                 {message.searchQuery && (
                   <div className="mb-2 text-sm bg-light-secondary dark:bg-dark-secondary rounded-lg p-3">
-                    <span className="font-medium text-black/70 dark:text-white/70">Search query:</span>{' '}
-                    <span className="text-black dark:text-white">{message.searchQuery}</span>
+                    <span className="font-medium text-black/70 dark:text-white/70">
+                      Search query:
+                    </span>{' '}
+                    {message.searchUrl ? (
+                      <a
+                        href={message.searchUrl}
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        className="dark:text-white text-black hover:underline"
+                      >
+                        {message.searchQuery}
+                      </a>
+                    ) : (
+                      <span className="text-black dark:text-white">
+                        {message.searchQuery}
+                      </span>
+                    )}
                   </div>
                 )}
                 <MessageSources sources={message.sources} />

src/components/MessageInput.tsx

@@ -86,7 +86,7 @@ const MessageInput = ({
     setMessage('');
   };
 
- return (
+  return (
     <form
       onSubmit={(e) => {
         e.preventDefault();
@@ -107,7 +107,7 @@ const MessageInput = ({
           onChange={(e) => setMessage(e.target.value)}
           minRows={2}
           className="bg-transparent placeholder:text-black/50 dark:placeholder:text-white/50 text-sm text-black dark:text-white resize-none focus:outline-none w-full max-h-24 lg:max-h-36 xl:max-h-48"
-          placeholder={firstMessage ? "Ask anything..." :"Ask a follow-up"}
+          placeholder={firstMessage ? 'Ask anything...' : 'Ask a follow-up'}
         />
         <div className="flex flex-row items-center justify-between mt-4">
           <div className="flex flex-row items-center space-x-2 lg:space-x-4">
@@ -134,7 +134,11 @@ const MessageInput = ({
               className="bg-[#24A0ED] text-white disabled:text-black/50 dark:disabled:text-white/50 disabled:bg-[#e0e0dc] dark:disabled:bg-[#ececec21] hover:bg-opacity-85 transition duration-100 rounded-full p-2"
               type="submit"
             >
-              {firstMessage ? <ArrowRight className="bg-background" size={17} /> : <ArrowUp className="bg-background" size={17} />}
+              {firstMessage ? (
+                <ArrowRight className="bg-background" size={17} />
+              ) : (
+                <ArrowUp className="bg-background" size={17} />
+              )}
             </button>
           </div>
         </div>