minor UI changes

Author: rashadphz

src/backend/search/providers/bing.py

@@ -43,7 +43,7 @@ async def get_link_results(
         ]
 
     async def get_image_results(
-        self, client: httpx.AsyncClient, query: str, num_results: int = 5
+        self, client: httpx.AsyncClient, query: str, num_results: int = 4
     ) -> list[str]:
         response = await client.get(
             f"{self.host}/images/search",

src/backend/search/providers/searxng.py

@@ -38,7 +38,7 @@ async def get_link_results(
         ]
 
     async def get_image_results(
-        self, client: httpx.AsyncClient, query: str, num_results: int = 5
+        self, client: httpx.AsyncClient, query: str, num_results: int = 4
     ) -> list[str]:
         response = await client.get(
             f"{self.host}/search",

src/backend/search/providers/serper.py

@@ -43,7 +43,7 @@ async def get_link_results(
         ]
 
     async def get_image_results(
-        self, client: httpx.AsyncClient, query: str, num_results: int = 5
+        self, client: httpx.AsyncClient, query: str, num_results: int = 4
     ) -> list[str]:
         response = await client.get(
             f"{self.host}/images",

src/frontend/src/components/assistant-message.tsx

@@ -56,36 +56,38 @@ export const AssistantMessageContent = ({
 
   return (
     <div className="flex flex-col">
-      <Section title="Sources" animate={isStreaming}>
-        {!sources || sources.length === 0 ? (
-          <SearchResultsSkeleton />
-        ) : (
-          <SearchResults results={sources} />
-        )}
-      </Section>
       <Section title="Answer" animate={isStreaming} streaming={isStreaming}>
         {content ? (
           <MessageComponent message={message} isStreaming={isStreaming} />
         ) : (
           <MessageComponentSkeleton />
         )}
-        {images && images.length > 0 && (
-          <div className="my-4 grid grid-cols-1 gap-2 lg:grid-cols-2">
-            {images.map((image) => (
-              <a
-                key={image}
-                href={image}
-                target="_blank"
-                rel="noopener noreferrer"
-                className="aspect-video w-full h-full overflow-hidden hover:scale-[1.03] duration-150 rounded-lg transition-all shadow-md"
-              >
-                <img
-                  src={image}
-                  className="w-full object-cover object-top h-full max-h-[80vh]"
-                />
-              </a>
-            ))}
-          </div>
+      </Section>
+      <Section title="Sources" animate={isStreaming}>
+        {!sources || sources.length === 0 ? (
+          <SearchResultsSkeleton />
+        ) : (
+          <>
+            <SearchResults results={sources} />
+            {images && images.length > 0 && (
+              <div className="my-4 grid grid-cols-1 gap-2 lg:grid-cols-2">
+                {images.map((image) => (
+                  <a
+                    key={image}
+                    href={image}
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    className="aspect-video w-full h-full overflow-hidden hover:scale-[1.03] duration-150 rounded-lg transition-all shadow-md"
+                  >
+                    <img
+                      src={image}
+                      className="w-full object-cover object-top h-full max-h-[80vh]"
+                    />
+                  </a>
+                ))}
+              </div>
+            )}
+          </>
         )}
       </Section>
       {relatedQuestions && relatedQuestions.length > 0 && (