Merge branch 'pr/831'

Fix name of provider in embeddings models error message

.gitignore

@@ -37,3 +37,5 @@ Thumbs.db
 # Db
 db.sqlite
 /searxng
+
+certificates

README.md

@@ -16,7 +16,7 @@
 
 <hr/>
 
-[![Discord](https://dcbadge.vercel.app/api/server/26aArMy8tT?style=flat&compact=true)](https://discord.gg/26aArMy8tT)
+[![Discord](https://dcbadge.limes.pink/api/server/26aArMy8tT?style=flat)](https://discord.gg/26aArMy8tT)
 
 ![preview](.assets/perplexica-screenshot.png?)
 
@@ -90,6 +90,9 @@ There are mainly 2 ways of installing Perplexica - With Docker, Without Docker.
    - `OLLAMA`: Your Ollama API URL. You should enter it as `http://host.docker.internal:PORT_NUMBER`. If you installed Ollama on port 11434, use `http://host.docker.internal:11434`. For other ports, adjust accordingly. **You need to fill this if you wish to use Ollama's models instead of OpenAI's**.
    - `GROQ`: Your Groq API key. **You only need to fill this if you wish to use Groq's hosted models**.
    - `ANTHROPIC`: Your Anthropic API key. **You only need to fill this if you wish to use Anthropic models**.
+   - `Gemini`: Your Gemini API key. **You only need to fill this if you wish to use Google's models**.
+   - `DEEPSEEK`: Your Deepseek API key. **Only needed if you want Deepseek models.**
+   - `AIMLAPI`: Your AI/ML API key. **Only needed if you want to use AI/ML API models and embeddings.**
 
      **Note**: You can change these after starting Perplexica from the settings dialog.
 
@@ -111,7 +114,7 @@ There are mainly 2 ways of installing Perplexica - With Docker, Without Docker.
 2. Clone the repository and rename the `sample.config.toml` file to `config.toml` in the root directory. Ensure you complete all required fields in this file.
 3. After populating the configuration run `npm i`.
 4. Install the dependencies and then execute `npm run build`.
-5. Finally, start the app by running `npm rum start`
+5. Finally, start the app by running `npm run start`
 
 **Note**: Using Docker is recommended as it simplifies the setup process, especially for managing environment variables and dependencies.
 
@@ -132,7 +135,7 @@ If you're encountering an Ollama connection error, it is likely due to the backe
 
 3. **Linux Users - Expose Ollama to Network:**
 
-   - Inside `/etc/systemd/system/ollama.service`, you need to add `Environment="OLLAMA_HOST=0.0.0.0"`. Then restart Ollama by `systemctl restart ollama`. For more information see [Ollama docs](https://github.com/ollama/ollama/blob/main/docs/faq.md#setting-environment-variables-on-linux)
+   - Inside `/etc/systemd/system/ollama.service`, you need to add `Environment="OLLAMA_HOST=0.0.0.0:11434"`. (Change the port number if you are using a different one.) Then reload the systemd manager configuration with `systemctl daemon-reload`, and restart Ollama by `systemctl restart ollama`. For more information see [Ollama docs](https://github.com/ollama/ollama/blob/main/docs/faq.md#setting-environment-variables-on-linux)
 
    - Ensure that the port (default is 11434) is not blocked by your firewall.
 

docs/installation/UPDATING.md

@@ -41,6 +41,6 @@ To update Perplexica to the latest version, follow these steps:
 3. Check for changes in the configuration files. If the `sample.config.toml` file contains new fields, delete your existing `config.toml` file, rename `sample.config.toml` to `config.toml`, and update the configuration accordingly.
 4. After populating the configuration run `npm i`.
 5. Install the dependencies and then execute `npm run build`.
-6. Finally, start the app by running `npm rum start`
+6. Finally, start the app by running `npm run start`
 
 ---

package.json

@@ -1,6 +1,6 @@
 {
   "name": "perplexica-frontend",
-  "version": "1.11.0-rc1",
+  "version": "1.11.0-rc2",
   "license": "MIT",
   "author": "ItzCrazyKns",
   "scripts": {
@@ -15,11 +15,12 @@
     "@headlessui/react": "^2.2.0",
     "@iarna/toml": "^2.2.5",
     "@icons-pack/react-simple-icons": "^12.3.0",
-    "@langchain/anthropic": "^0.3.15",
-    "@langchain/community": "^0.3.36",
-    "@langchain/core": "^0.3.42",
-    "@langchain/google-genai": "^0.1.12",
-    "@langchain/openai": "^0.0.25",
+    "@langchain/anthropic": "^0.3.24",
+    "@langchain/community": "^0.3.49",
+    "@langchain/core": "^0.3.66",
+    "@langchain/google-genai": "^0.2.15",
+    "@langchain/ollama": "^0.2.3",
+    "@langchain/openai": "^0.6.2",
     "@langchain/textsplitters": "^0.1.0",
     "@tailwindcss/typography": "^0.5.12",
     "@xenova/transformers": "^2.17.2",
@@ -31,7 +32,7 @@
     "drizzle-orm": "^0.40.1",
     "html-to-text": "^9.0.5",
     "jspdf": "^3.0.1",
-    "langchain": "^0.1.30",
+    "langchain": "^0.3.30",
     "lucide-react": "^0.363.0",
     "mammoth": "^1.9.1",
     "markdown-to-jsx": "^7.7.2",

sample.config.toml

@@ -25,6 +25,9 @@ API_URL = "" # Ollama API URL - http://host.docker.internal:11434
 [MODELS.DEEPSEEK]
 API_KEY = ""
 
+[MODELS.AIMLAPI]
+API_KEY = "" # Required to use AI/ML API chat and embedding models
+
 [MODELS.LM_STUDIO]
 API_URL = "" # LM Studio API URL - http://host.docker.internal:1234
 

src/app/api/chat/route.ts

@@ -223,7 +223,7 @@ export const POST = async (req: Request) => {
 
     if (body.chatModel?.provider === 'custom_openai') {
       llm = new ChatOpenAI({
-        openAIApiKey: getCustomOpenaiApiKey(),
+        apiKey: getCustomOpenaiApiKey(),
         modelName: getCustomOpenaiModelName(),
         temperature: 0.7,
         configuration: {

src/app/api/config/route.ts

@@ -8,6 +8,7 @@ import {
   getOllamaApiEndpoint,
   getOpenaiApiKey,
   getDeepseekApiKey,
+  getAimlApiKey,
   getLMStudioApiEndpoint,
   updateConfig,
 } from '@/lib/config';
@@ -57,6 +58,7 @@ export const GET = async (req: Request) => {
     config['groqApiKey'] = getGroqApiKey();
     config['geminiApiKey'] = getGeminiApiKey();
     config['deepseekApiKey'] = getDeepseekApiKey();
+    config['aimlApiKey'] = getAimlApiKey();
     config['customOpenaiApiUrl'] = getCustomOpenaiApiUrl();
     config['customOpenaiApiKey'] = getCustomOpenaiApiKey();
     config['customOpenaiModelName'] = getCustomOpenaiModelName();
@@ -95,6 +97,9 @@ export const POST = async (req: Request) => {
         DEEPSEEK: {
           API_KEY: config.deepseekApiKey,
         },
+        AIMLAPI: {
+          API_KEY: config.aimlApiKey,
+        },
         LM_STUDIO: {
           API_URL: config.lmStudioApiUrl,
         },

src/app/api/discover/route.ts

@@ -36,6 +36,7 @@ export const GET = async (req: Request) => {
                   {
                     engines: ['bing news'],
                     pageno: 1,
+                    language: 'en',
                   },
                 )
               ).results;
@@ -49,7 +50,11 @@ export const GET = async (req: Request) => {
       data = (
         await searchSearxng(
           `site:${articleWebsites[Math.floor(Math.random() * articleWebsites.length)]} ${topics[Math.floor(Math.random() * topics.length)]}`,
-          { engines: ['bing news'], pageno: 1 },
+          {
+            engines: ['bing news'],
+            pageno: 1,
+            language: 'en',
+          },
         )
       ).results;
     }

src/app/api/images/route.ts

@@ -49,7 +49,7 @@ export const POST = async (req: Request) => {
 
     if (body.chatModel?.provider === 'custom_openai') {
       llm = new ChatOpenAI({
-        openAIApiKey: getCustomOpenaiApiKey(),
+        apiKey: getCustomOpenaiApiKey(),
         modelName: getCustomOpenaiModelName(),
         temperature: 0.7,
         configuration: {

src/app/api/search/route.ts

@@ -81,8 +81,7 @@ export const POST = async (req: Request) => {
     if (body.chatModel?.provider === 'custom_openai') {
       llm = new ChatOpenAI({
         modelName: body.chatModel?.name || getCustomOpenaiModelName(),
-        openAIApiKey:
-          body.chatModel?.customOpenAIKey || getCustomOpenaiApiKey(),
+        apiKey: body.chatModel?.customOpenAIKey || getCustomOpenaiApiKey(),
         temperature: 0.7,
         configuration: {
           baseURL:

src/app/api/suggestions/route.ts

@@ -48,7 +48,7 @@ export const POST = async (req: Request) => {
 
     if (body.chatModel?.provider === 'custom_openai') {
       llm = new ChatOpenAI({
-        openAIApiKey: getCustomOpenaiApiKey(),
+        apiKey: getCustomOpenaiApiKey(),
         modelName: getCustomOpenaiModelName(),
         temperature: 0.7,
         configuration: {

src/app/api/videos/route.ts

@@ -49,7 +49,7 @@ export const POST = async (req: Request) => {
 
     if (body.chatModel?.provider === 'custom_openai') {
       llm = new ChatOpenAI({
-        openAIApiKey: getCustomOpenaiApiKey(),
+        apiKey: getCustomOpenaiApiKey(),
         modelName: getCustomOpenaiModelName(),
         temperature: 0.7,
         configuration: {

src/app/api/weather/route.ts

@@ -1,6 +1,10 @@
 export const POST = async (req: Request) => {
   try {
-    const body: { lat: number; lng: number } = await req.json();
+    const body: {
+      lat: number;
+      lng: number;
+      measureUnit: 'Imperial' | 'Metric';
+    } = await req.json();
 
     if (!body.lat || !body.lng) {
       return Response.json(
@@ -12,7 +16,9 @@ export const POST = async (req: Request) => {
     }
 
     const res = await fetch(
-      `https://api.open-meteo.com/v1/forecast?latitude=${body.lat}&longitude=${body.lng}&current=weather_code,temperature_2m,is_day,relative_humidity_2m,wind_speed_10m&timezone=auto`,
+      `https://api.open-meteo.com/v1/forecast?latitude=${body.lat}&longitude=${body.lng}&current=weather_code,temperature_2m,is_day,relative_humidity_2m,wind_speed_10m&timezone=auto${
+        body.measureUnit === 'Metric' ? '' : '&temperature_unit=fahrenheit'
+      }${body.measureUnit === 'Metric' ? '' : '&wind_speed_unit=mph'}`,
     );
 
     const data = await res.json();
@@ -33,12 +39,16 @@ export const POST = async (req: Request) => {
       humidity: number;
       windSpeed: number;
       icon: string;
+      temperatureUnit: 'C' | 'F';
+      windSpeedUnit: 'm/s' | 'mph';
     } = {
       temperature: data.current.temperature_2m,
       condition: '',
       humidity: data.current.relative_humidity_2m,
       windSpeed: data.current.wind_speed_10m,
       icon: '',
+      temperatureUnit: body.measureUnit === 'Metric' ? 'C' : 'F',
+      windSpeedUnit: body.measureUnit === 'Metric' ? 'm/s' : 'mph',
     };
 
     const code = data.current.weather_code;

src/app/globals.css

@@ -11,3 +11,11 @@
     display: none;
   }
 }
+
+@media screen and (-webkit-min-device-pixel-ratio: 0) {
+  select,
+  textarea,
+  input {
+    font-size: 16px !important;
+  }
+}

src/app/manifest.ts

@@ -0,0 +1,54 @@
+import type { MetadataRoute } from 'next';
+
+export default function manifest(): MetadataRoute.Manifest {
+  return {
+    name: 'Perplexica - Chat with the internet',
+    short_name: 'Perplexica',
+    description:
+      'Perplexica is an AI powered chatbot that is connected to the internet.',
+    start_url: '/',
+    display: 'standalone',
+    background_color: '#0a0a0a',
+    theme_color: '#0a0a0a',
+    screenshots: [
+      {
+        src: '/screenshots/p1.png',
+        form_factor: 'wide',
+        sizes: '2560x1600',
+      },
+      {
+        src: '/screenshots/p2.png',
+        form_factor: 'wide',
+        sizes: '2560x1600',
+      },
+      {
+        src: '/screenshots/p1_small.png',
+        form_factor: 'narrow',
+        sizes: '828x1792',
+      },
+      {
+        src: '/screenshots/p2_small.png',
+        form_factor: 'narrow',
+        sizes: '828x1792',
+      },
+    ],
+    icons: [
+      {
+        src: '/icon-50.png',
+        sizes: '50x50',
+        type: 'image/png' as const,
+      },
+      {
+        src: '/icon-100.png',
+        sizes: '100x100',
+        type: 'image/png',
+      },
+      {
+        src: '/icon.png',
+        sizes: '440x440',
+        type: 'image/png',
+        purpose: 'any',
+      },
+    ],
+  };
+}

src/app/settings/page.tsx

@@ -23,6 +23,7 @@ interface SettingsType {
   ollamaApiUrl: string;
   lmStudioApiUrl: string;
   deepseekApiKey: string;
+  aimlApiKey: string;
   customOpenaiApiKey: string;
   customOpenaiApiUrl: string;
   customOpenaiModelName: string;
@@ -147,6 +148,9 @@ const Page = () => {
   const [automaticImageSearch, setAutomaticImageSearch] = useState(false);
   const [automaticVideoSearch, setAutomaticVideoSearch] = useState(false);
   const [systemInstructions, setSystemInstructions] = useState<string>('');
+  const [measureUnit, setMeasureUnit] = useState<'Imperial' | 'Metric'>(
+    'Metric',
+  );
   const [savingStates, setSavingStates] = useState<Record<string, boolean>>({});
 
   useEffect(() => {
@@ -209,6 +213,10 @@ const Page = () => {
 
       setSystemInstructions(localStorage.getItem('systemInstructions')!);
 
+      setMeasureUnit(
+        localStorage.getItem('measureUnit')! as 'Imperial' | 'Metric',
+      );
+
       setIsLoading(false);
     };
 
@@ -367,6 +375,8 @@ const Page = () => {
         localStorage.setItem('embeddingModel', value);
       } else if (key === 'systemInstructions') {
         localStorage.setItem('systemInstructions', value);
+      } else if (key === 'measureUnit') {
+        localStorage.setItem('measureUnit', value.toString());
       }
     } catch (err) {
       console.error('Failed to save:', err);
@@ -415,13 +425,35 @@ const Page = () => {
       ) : (
         config && (
           <div className="flex flex-col space-y-6 pb-28 lg:pb-8">
-            <SettingsSection title="Appearance">
+            <SettingsSection title="Preferences">
               <div className="flex flex-col space-y-1">
                 <p className="text-black/70 dark:text-white/70 text-sm">
                   Theme
                 </p>
                 <ThemeSwitcher />
               </div>
+              <div className="flex flex-col space-y-1">
+                <p className="text-black/70 dark:text-white/70 text-sm">
+                  Measurement Units
+                </p>
+                <Select
+                  value={measureUnit ?? undefined}
+                  onChange={(e) => {
+                    setMeasureUnit(e.target.value as 'Imperial' | 'Metric');
+                    saveConfig('measureUnit', e.target.value);
+                  }}
+                  options={[
+                    {
+                      label: 'Metric',
+                      value: 'Metric',
+                    },
+                    {
+                      label: 'Imperial',
+                      value: 'Imperial',
+                    },
+                  ]}
+                />
+              </div>
             </SettingsSection>
 
             <SettingsSection title="Automatic Search">
@@ -515,7 +547,7 @@ const Page = () => {
             <SettingsSection title="System Instructions">
               <div className="flex flex-col space-y-4">
                 <Textarea
-                  value={systemInstructions}
+                  value={systemInstructions ?? undefined}
                   isSaving={savingStates['systemInstructions']}
                   onChange={(e) => {
                     setSystemInstructions(e.target.value);
@@ -862,6 +894,25 @@ const Page = () => {
                   />
                 </div>
 
+                <div className="flex flex-col space-y-1">
+                  <p className="text-black/70 dark:text-white/70 text-sm">
+                    AI/ML API Key
+                  </p>
+                  <Input
+                    type="text"
+                    placeholder="AI/ML API Key"
+                    value={config.aimlApiKey}
+                    isSaving={savingStates['aimlApiKey']}
+                    onChange={(e) => {
+                      setConfig((prev) => ({
+                        ...prev!,
+                        aimlApiKey: e.target.value,
+                      }));
+                    }}
+                    onSave={(value) => saveConfig('aimlApiKey', value)}
+                  />
+                </div>
+
                 <div className="flex flex-col space-y-1">
                   <p className="text-black/70 dark:text-white/70 text-sm">
                     LM Studio API URL

src/components/ChatWindow.tsx

@@ -82,14 +82,29 @@ const checkConfig = async (
     ) {
       if (!chatModel || !chatModelProvider) {
         const chatModelProviders = providers.chatModelProviders;
+        const chatModelProvidersKeys = Object.keys(chatModelProviders);
 
-        chatModelProvider =
-          chatModelProvider || Object.keys(chatModelProviders)[0];
+        if (!chatModelProviders || chatModelProvidersKeys.length === 0) {
+          return toast.error('No chat models available');
+        } else {
+          chatModelProvider =
+            chatModelProvidersKeys.find(
+              (provider) =>
+                Object.keys(chatModelProviders[provider]).length > 0,
+            ) || chatModelProvidersKeys[0];
+        }
+
+        if (
+          chatModelProvider === 'custom_openai' &&
+          Object.keys(chatModelProviders[chatModelProvider]).length === 0
+        ) {
+          toast.error(
+            "Looks like you haven't configured any chat model providers. Please configure them from the settings page or the config file.",
+          );
+          return setHasError(true);
+        }
 
         chatModel = Object.keys(chatModelProviders[chatModelProvider])[0];
-
-        if (!chatModelProviders || Object.keys(chatModelProviders).length === 0)
-          return toast.error('No chat models available');
       }
 
       if (!embeddingModel || !embeddingModelProvider) {
@@ -117,7 +132,8 @@ const checkConfig = async (
 
       if (
         Object.keys(chatModelProviders).length > 0 &&
-        !chatModelProviders[chatModelProvider]
+        (!chatModelProviders[chatModelProvider] ||
+          Object.keys(chatModelProviders[chatModelProvider]).length === 0)
       ) {
         const chatModelProvidersKeys = Object.keys(chatModelProviders);
         chatModelProvider =
@@ -132,6 +148,16 @@ const checkConfig = async (
         chatModelProvider &&
         !chatModelProviders[chatModelProvider][chatModel]
       ) {
+        if (
+          chatModelProvider === 'custom_openai' &&
+          Object.keys(chatModelProviders[chatModelProvider]).length === 0
+        ) {
+          toast.error(
+            "Looks like you haven't configured any chat model providers. Please configure them from the settings page or the config file.",
+          );
+          return setHasError(true);
+        }
+
         chatModel = Object.keys(
           chatModelProviders[
             Object.keys(chatModelProviders[chatModelProvider]).length > 0
@@ -139,6 +165,7 @@ const checkConfig = async (
               : Object.keys(chatModelProviders)[0]
           ],
         )[0];
+
         localStorage.setItem('chatModel', chatModel);
       }
 
@@ -327,7 +354,11 @@ const ChatWindow = ({ id }: { id?: string }) => {
     }
   }, [isMessagesLoaded, isConfigReady]);
 
-  const sendMessage = async (message: string, messageId?: string) => {
+  const sendMessage = async (
+    message: string,
+    messageId?: string,
+    rewrite = false,
+  ) => {
     if (loading) return;
     if (!isConfigReady) {
       toast.error('Cannot send message before the configuration is ready');
@@ -455,6 +486,8 @@ const ChatWindow = ({ id }: { id?: string }) => {
       }
     };
 
+    const messageIndex = messages.findIndex((m) => m.messageId === messageId);
+
     const res = await fetch('/api/chat', {
       method: 'POST',
       headers: {
@@ -471,7 +504,9 @@ const ChatWindow = ({ id }: { id?: string }) => {
         files: fileIds,
         focusMode: focusMode,
         optimizationMode: optimizationMode,
-        history: chatHistory,
+        history: rewrite
+          ? chatHistory.slice(0, messageIndex === -1 ? undefined : messageIndex)
+          : chatHistory,
         chatModel: {
           name: chatModelProvider.name,
           provider: chatModelProvider.provider,
@@ -525,7 +560,7 @@ const ChatWindow = ({ id }: { id?: string }) => {
       return [...prev.slice(0, messages.length > 2 ? index - 1 : 0)];
     });
 
-    sendMessage(message.content, message.messageId);
+    sendMessage(message.content, message.messageId, true);
   };
 
   useEffect(() => {

src/components/EmptyChat.tsx

@@ -1,6 +1,5 @@
 import { Settings } from 'lucide-react';
 import EmptyChatMessageInput from './EmptyChatMessageInput';
-import { useEffect, useState } from 'react';
 import { File } from './ChatWindow';
 import Link from 'next/link';
 import WeatherWidget from './WeatherWidget';
@@ -34,26 +33,28 @@ const EmptyChat = ({
           <Settings className="cursor-pointer lg:hidden" />
         </Link>
       </div>
-      <div className="flex flex-col items-center justify-center min-h-screen max-w-screen-sm mx-auto p-2 space-y-8">
-        <h2 className="text-black/70 dark:text-white/70 text-3xl font-medium -mt-8">
-          Research begins here.
-        </h2>
-        <EmptyChatMessageInput
-          sendMessage={sendMessage}
-          focusMode={focusMode}
-          setFocusMode={setFocusMode}
-          optimizationMode={optimizationMode}
-          setOptimizationMode={setOptimizationMode}
-          fileIds={fileIds}
-          setFileIds={setFileIds}
-          files={files}
-          setFiles={setFiles}
-        />
+      <div className="flex flex-col items-center justify-center min-h-screen max-w-screen-sm mx-auto p-2 space-y-4">
+        <div className="flex flex-col items-center justify-center w-full space-y-8">
+          <h2 className="text-black/70 dark:text-white/70 text-3xl font-medium -mt-8">
+            Research begins here.
+          </h2>
+          <EmptyChatMessageInput
+            sendMessage={sendMessage}
+            focusMode={focusMode}
+            setFocusMode={setFocusMode}
+            optimizationMode={optimizationMode}
+            setOptimizationMode={setOptimizationMode}
+            fileIds={fileIds}
+            setFileIds={setFileIds}
+            files={files}
+            setFiles={setFiles}
+          />
+        </div>
         <div className="flex flex-col w-full gap-4 mt-2 sm:flex-row sm:justify-center">
-          <div className="flex-1 max-w-xs">
+          <div className="flex-1 w-full">
             <WeatherWidget />
           </div>
-          <div className="flex-1 max-w-xs">
+          <div className="flex-1 w-full">
             <NewsArticleWidget />
           </div>
         </div>

src/components/MessageBox.tsx

@@ -21,8 +21,16 @@ import SearchVideos from './SearchVideos';
 import { useSpeech } from 'react-text-to-speech';
 import ThinkBox from './ThinkBox';
 
-const ThinkTagProcessor = ({ children }: { children: React.ReactNode }) => {
-  return <ThinkBox content={children as string} />;
+const ThinkTagProcessor = ({
+  children,
+  thinkingEnded,
+}: {
+  children: React.ReactNode;
+  thinkingEnded: boolean;
+}) => {
+  return (
+    <ThinkBox content={children as string} thinkingEnded={thinkingEnded} />
+  );
 };
 
 const MessageBox = ({
@@ -46,6 +54,7 @@ const MessageBox = ({
 }) => {
   const [parsedMessage, setParsedMessage] = useState(message.content);
   const [speechMessage, setSpeechMessage] = useState(message.content);
+  const [thinkingEnded, setThinkingEnded] = useState(false);
 
   useEffect(() => {
     const citationRegex = /\[([^\]]+)\]/g;
@@ -61,6 +70,10 @@ const MessageBox = ({
       }
     }
 
+    if (message.role === 'assistant' && message.content.includes('</think>')) {
+      setThinkingEnded(true);
+    }
+
     if (
       message.role === 'assistant' &&
       message?.sources &&
@@ -88,7 +101,7 @@ const MessageBox = ({
                 if (url) {
                   return `<a href="${url}" target="_blank" className="bg-light-secondary dark:bg-dark-secondary px-1 rounded ml-1 no-underline text-xs text-black/70 dark:text-white/70 relative">${numStr}</a>`;
                 } else {
-                  return `[${numStr}]`;
+                  return ``;
                 }
               })
               .join('');
@@ -99,6 +112,14 @@ const MessageBox = ({
       );
       setSpeechMessage(message.content.replace(regex, ''));
       return;
+    } else if (
+      message.role === 'assistant' &&
+      message?.sources &&
+      message.sources.length === 0
+    ) {
+      setParsedMessage(processedMessage.replace(regex, ''));
+      setSpeechMessage(message.content.replace(regex, ''));
+      return;
     }
 
     setSpeechMessage(message.content.replace(regex, ''));
@@ -111,6 +132,9 @@ const MessageBox = ({
     overrides: {
       think: {
         component: ThinkTagProcessor,
+        props: {
+          thinkingEnded: thinkingEnded,
+        },
       },
     },
   };

src/components/ThinkBox.tsx

@@ -1,15 +1,23 @@
 'use client';
 
-import { useState } from 'react';
-import { cn } from '@/lib/utils';
+import { useEffect, useState } from 'react';
 import { ChevronDown, ChevronUp, BrainCircuit } from 'lucide-react';
 
 interface ThinkBoxProps {
   content: string;
+  thinkingEnded: boolean;
 }
 
-const ThinkBox = ({ content }: ThinkBoxProps) => {
-  const [isExpanded, setIsExpanded] = useState(false);
+const ThinkBox = ({ content, thinkingEnded }: ThinkBoxProps) => {
+  const [isExpanded, setIsExpanded] = useState(true);
+
+  useEffect(() => {
+    if (thinkingEnded) {
+      setIsExpanded(false);
+    } else {
+      setIsExpanded(true);
+    }
+  }, [thinkingEnded]);
 
   return (
     <div className="my-4 bg-light-secondary/50 dark:bg-dark-secondary/50 rounded-xl border border-light-200 dark:border-dark-200 overflow-hidden">

src/components/WeatherWidget.tsx

@@ -9,7 +9,10 @@ const WeatherWidget = () => {
     humidity: 0,
     windSpeed: 0,
     icon: '',
+    temperatureUnit: 'C',
+    windSpeedUnit: 'm/s',
   });
+
   const [loading, setLoading] = useState(true);
 
   useEffect(() => {
@@ -31,30 +34,40 @@ const WeatherWidget = () => {
         city: string;
       }) => void,
     ) => {
-      /* 
-          // Geolocation doesn't give city so we'll country using ipapi for now
-            if (navigator.geolocation) {
-            const result = await navigator.permissions.query({
-              name: 'geolocation',
-            })
-    
-            if (result.state === 'granted') {
-              navigator.geolocation.getCurrentPosition(position => {
-                callback({
-                  latitude: position.coords.latitude,
-                  longitude: position.coords.longitude,
-                })
-              })
-            } else if (result.state === 'prompt') {
-              callback(await getApproxLocation())
-              navigator.geolocation.getCurrentPosition(position => {})
-            } else if (result.state === 'denied') {
-              callback(await getApproxLocation())
-            }
-          } else {
-            callback(await getApproxLocation())
-          } */
-      callback(await getApproxLocation());
+      if (navigator.geolocation) {
+        const result = await navigator.permissions.query({
+          name: 'geolocation',
+        });
+
+        if (result.state === 'granted') {
+          navigator.geolocation.getCurrentPosition(async (position) => {
+            const res = await fetch(
+              `https://api-bdc.io/data/reverse-geocode-client?latitude=${position.coords.latitude}&longitude=${position.coords.longitude}&localityLanguage=en`,
+              {
+                method: 'GET',
+                headers: {
+                  'Content-Type': 'application/json',
+                },
+              },
+            );
+
+            const data = await res.json();
+
+            callback({
+              latitude: position.coords.latitude,
+              longitude: position.coords.longitude,
+              city: data.locality,
+            });
+          });
+        } else if (result.state === 'prompt') {
+          callback(await getApproxLocation());
+          navigator.geolocation.getCurrentPosition((position) => {});
+        } else if (result.state === 'denied') {
+          callback(await getApproxLocation());
+        }
+      } else {
+        callback(await getApproxLocation());
+      }
     };
 
     getLocation(async (location) => {
@@ -63,6 +76,7 @@ const WeatherWidget = () => {
         body: JSON.stringify({
           lat: location.latitude,
           lng: location.longitude,
+          measureUnit: localStorage.getItem('measureUnit') ?? 'Metric',
         }),
       });
 
@@ -81,6 +95,8 @@ const WeatherWidget = () => {
         humidity: data.humidity,
         windSpeed: data.windSpeed,
         icon: data.icon,
+        temperatureUnit: data.temperatureUnit,
+        windSpeedUnit: data.windSpeedUnit,
       });
       setLoading(false);
     });
@@ -115,7 +131,7 @@ const WeatherWidget = () => {
               className="h-10 w-auto"
             />
             <span className="text-base font-semibold text-black dark:text-white">
-              {data.temperature}°C
+              {data.temperature}°{data.temperatureUnit}
             </span>
           </div>
           <div className="flex flex-col justify-between flex-1 h-full py-1">
@@ -125,7 +141,7 @@ const WeatherWidget = () => {
               </span>
               <span className="flex items-center text-xs text-black/60 dark:text-white/60">
                 <Wind className="w-3 h-3 mr-1" />
-                {data.windSpeed} km/h
+                {data.windSpeed} {data.windSpeedUnit}
               </span>
             </div>
             <span className="text-xs text-black/60 dark:text-white/60 mt-1">

src/lib/chains/imageSearchAgent.ts

@@ -3,32 +3,18 @@ import {
   RunnableMap,
   RunnableLambda,
 } from '@langchain/core/runnables';
-import { PromptTemplate } from '@langchain/core/prompts';
+import { ChatPromptTemplate } from '@langchain/core/prompts';
 import formatChatHistoryAsString from '../utils/formatHistory';
 import { BaseMessage } from '@langchain/core/messages';
 import { StringOutputParser } from '@langchain/core/output_parsers';
 import { searchSearxng } from '../searxng';
 import type { BaseChatModel } from '@langchain/core/language_models/chat_models';
+import LineOutputParser from '../outputParsers/lineOutputParser';
 
 const imageSearchChainPrompt = `
 You will be given a conversation below and a follow up question. You need to rephrase the follow-up question so it is a standalone question that can be used by the LLM to search the web for images.
 You need to make sure the rephrased question agrees with the conversation and is relevant to the conversation.
-
-Example:
-1. Follow up question: What is a cat?
-Rephrased: A cat
-
-2. Follow up question: What is a car? How does it works?
-Rephrased: Car working
-
-3. Follow up question: How does an AC work?
-Rephrased: AC working
-
-Conversation:
-{chat_history}
-
-Follow up question: {query}
-Rephrased question:
+Output only the rephrased query wrapped in an XML <query> element. Do not include any explanation or additional text.
 `;
 
 type ImageSearchChainInput = {
@@ -54,12 +40,39 @@ const createImageSearchChain = (llm: BaseChatModel) => {
         return input.query;
       },
     }),
-    PromptTemplate.fromTemplate(imageSearchChainPrompt),
+    ChatPromptTemplate.fromMessages([
+      ['system', imageSearchChainPrompt],
+      [
+        'user',
+        '<conversation>\n</conversation>\n<follow_up>\nWhat is a cat?\n</follow_up>',
+      ],
+      ['assistant', '<query>A cat</query>'],
+
+      [
+        'user',
+        '<conversation>\n</conversation>\n<follow_up>\nWhat is a car? How does it work?\n</follow_up>',
+      ],
+      ['assistant', '<query>Car working</query>'],
+      [
+        'user',
+        '<conversation>\n</conversation>\n<follow_up>\nHow does an AC work?\n</follow_up>',
+      ],
+      ['assistant', '<query>AC working</query>'],
+      [
+        'user',
+        '<conversation>{chat_history}</conversation>\n<follow_up>\n{query}\n</follow_up>',
+      ],
+    ]),
     llm,
     strParser,
     RunnableLambda.from(async (input: string) => {
-      input = input.replace(/<think>.*?<\/think>/g, '');
+      const queryParser = new LineOutputParser({
+        key: 'query',
+      });
 
+      return await queryParser.parse(input);
+    }),
+    RunnableLambda.from(async (input: string) => {
       const res = await searchSearxng(input, {
         engines: ['bing images', 'google images'],
       });

src/lib/chains/videoSearchAgent.ts

@@ -3,33 +3,19 @@ import {
   RunnableMap,
   RunnableLambda,
 } from '@langchain/core/runnables';
-import { PromptTemplate } from '@langchain/core/prompts';
+import { ChatPromptTemplate } from '@langchain/core/prompts';
 import formatChatHistoryAsString from '../utils/formatHistory';
 import { BaseMessage } from '@langchain/core/messages';
 import { StringOutputParser } from '@langchain/core/output_parsers';
 import { searchSearxng } from '../searxng';
 import type { BaseChatModel } from '@langchain/core/language_models/chat_models';
+import LineOutputParser from '../outputParsers/lineOutputParser';
 
-const VideoSearchChainPrompt = `
-  You will be given a conversation below and a follow up question. You need to rephrase the follow-up question so it is a standalone question that can be used by the LLM to search Youtube for videos.
-  You need to make sure the rephrased question agrees with the conversation and is relevant to the conversation.
-  
-  Example:
-  1. Follow up question: How does a car work?
-  Rephrased: How does a car work?
-  
-  2. Follow up question: What is the theory of relativity?
-  Rephrased: What is theory of relativity
-  
-  3. Follow up question: How does an AC work?
-  Rephrased: How does an AC work
-  
-  Conversation:
-  {chat_history}
-  
-  Follow up question: {query}
-  Rephrased question:
-  `;
+const videoSearchChainPrompt = `
+You will be given a conversation below and a follow up question. You need to rephrase the follow-up question so it is a standalone question that can be used by the LLM to search Youtube for videos.
+You need to make sure the rephrased question agrees with the conversation and is relevant to the conversation.
+Output only the rephrased query wrapped in an XML <query> element. Do not include any explanation or additional text.
+`;
 
 type VideoSearchChainInput = {
   chat_history: BaseMessage[];
@@ -55,12 +41,37 @@ const createVideoSearchChain = (llm: BaseChatModel) => {
         return input.query;
       },
     }),
-    PromptTemplate.fromTemplate(VideoSearchChainPrompt),
+    ChatPromptTemplate.fromMessages([
+      ['system', videoSearchChainPrompt],
+      [
+        'user',
+        '<conversation>\n</conversation>\n<follow_up>\nHow does a car work?\n</follow_up>',
+      ],
+      ['assistant', '<query>How does a car work?</query>'],
+      [
+        'user',
+        '<conversation>\n</conversation>\n<follow_up>\nWhat is the theory of relativity?\n</follow_up>',
+      ],
+      ['assistant', '<query>Theory of relativity</query>'],
+      [
+        'user',
+        '<conversation>\n</conversation>\n<follow_up>\nHow does an AC work?\n</follow_up>',
+      ],
+      ['assistant', '<query>AC working</query>'],
+      [
+        'user',
+        '<conversation>{chat_history}</conversation>\n<follow_up>\n{query}\n</follow_up>',
+      ],
+    ]),
     llm,
     strParser,
     RunnableLambda.from(async (input: string) => {
-      input = input.replace(/<think>.*?<\/think>/g, '');
-
+      const queryParser = new LineOutputParser({
+        key: 'query',
+      });
+      return await queryParser.parse(input);
+    }),
+    RunnableLambda.from(async (input: string) => {
       const res = await searchSearxng(input, {
         engines: ['youtube'],
       });
@@ -92,8 +103,8 @@ const handleVideoSearch = (
   input: VideoSearchChainInput,
   llm: BaseChatModel,
 ) => {
-  const VideoSearchChain = createVideoSearchChain(llm);
-  return VideoSearchChain.invoke(input);
+  const videoSearchChain = createVideoSearchChain(llm);
+  return videoSearchChain.invoke(input);
 };
 
 export default handleVideoSearch;

src/lib/config.ts

@@ -35,6 +35,9 @@ interface Config {
     DEEPSEEK: {
       API_KEY: string;
     };
+    AIMLAPI: {
+      API_KEY: string;
+    };
     LM_STUDIO: {
       API_URL: string;
     };
@@ -85,6 +88,8 @@ export const getOllamaApiEndpoint = () => loadConfig().MODELS.OLLAMA.API_URL;
 
 export const getDeepseekApiKey = () => loadConfig().MODELS.DEEPSEEK.API_KEY;
 
+export const getAimlApiKey = () => loadConfig().MODELS.AIMLAPI.API_KEY;
+
 export const getCustomOpenaiApiKey = () =>
   loadConfig().MODELS.CUSTOM_OPENAI.API_KEY;
 

src/lib/providers/aimlapi.ts

@@ -0,0 +1,94 @@
+import { ChatOpenAI, OpenAIEmbeddings } from '@langchain/openai';
+import { getAimlApiKey } from '../config';
+import { ChatModel, EmbeddingModel } from '.';
+import { BaseChatModel } from '@langchain/core/language_models/chat_models';
+import { Embeddings } from '@langchain/core/embeddings';
+import axios from 'axios';
+
+export const PROVIDER_INFO = {
+  key: 'aimlapi',
+  displayName: 'AI/ML API',
+};
+
+interface AimlApiModel {
+  id: string;
+  name?: string;
+  type?: string;
+}
+
+const API_URL = 'https://api.aimlapi.com';
+
+export const loadAimlApiChatModels = async () => {
+  const apiKey = getAimlApiKey();
+
+  if (!apiKey) return {};
+
+  try {
+    const response = await axios.get(`${API_URL}/models`, {
+      headers: {
+        'Content-Type': 'application/json',
+        Authorization: `Bearer ${apiKey}`,
+      },
+    });
+
+    const chatModels: Record<string, ChatModel> = {};
+
+    response.data.data.forEach((model: AimlApiModel) => {
+      if (model.type === 'chat-completion') {
+        chatModels[model.id] = {
+          displayName: model.name || model.id,
+          model: new ChatOpenAI({
+            apiKey: apiKey,
+            modelName: model.id,
+            temperature: 0.7,
+            configuration: {
+              baseURL: API_URL,
+            },
+          }) as unknown as BaseChatModel,
+        };
+      }
+    });
+
+    return chatModels;
+  } catch (err) {
+    console.error(`Error loading AI/ML API models: ${err}`);
+    return {};
+  }
+};
+
+export const loadAimlApiEmbeddingModels = async () => {
+  const apiKey = getAimlApiKey();
+
+  if (!apiKey) return {};
+
+  try {
+    const response = await axios.get(`${API_URL}/models`, {
+      headers: {
+        'Content-Type': 'application/json',
+        Authorization: `Bearer ${apiKey}`,
+      },
+    });
+
+    const embeddingModels: Record<string, EmbeddingModel> = {};
+
+    response.data.data.forEach((model: AimlApiModel) => {
+      if (model.type === 'embedding') {
+        embeddingModels[model.id] = {
+          displayName: model.name || model.id,
+          model: new OpenAIEmbeddings({
+            apiKey: apiKey,
+            modelName: model.id,
+            configuration: {
+              baseURL: API_URL,
+            },
+          }) as unknown as Embeddings,
+        };
+      }
+    });
+
+    return embeddingModels;
+  } catch (err) {
+    console.error(`Error loading AI/ML API embeddings models: ${err}`);
+    return {};
+  }
+};

src/lib/providers/deepseek.ts

@@ -31,7 +31,7 @@ export const loadDeepseekChatModels = async () => {
       chatModels[model.key] = {
         displayName: model.displayName,
         model: new ChatOpenAI({
-          openAIApiKey: deepseekApiKey,
+          apiKey: deepseekApiKey,
           modelName: model.key,
           temperature: 0.7,
           configuration: {

src/lib/providers/gemini.ts

@@ -14,8 +14,12 @@ import { Embeddings } from '@langchain/core/embeddings';
 
 const geminiChatModels: Record<string, string>[] = [
   {
-    displayName: 'Gemini 2.5 Pro Experimental',
-    key: 'gemini-2.5-pro-exp-03-25',
+    displayName: 'Gemini 2.5 Flash',
+    key: 'gemini-2.5-flash',
+  },
+  {
+    displayName: 'Gemini 2.5 Pro',
+    key: 'gemini-2.5-pro',
   },
   {
     displayName: 'Gemini 2.0 Flash',
@@ -67,7 +71,7 @@ export const loadGeminiChatModels = async () => {
         displayName: model.displayName,
         model: new ChatGoogleGenerativeAI({
           apiKey: geminiApiKey,
-          modelName: model.key,
+          model: model.key,
           temperature: 0.7,
         }) as unknown as BaseChatModel,
       };
@@ -100,7 +104,7 @@ export const loadGeminiEmbeddingModels = async () => {
 
     return embeddingModels;
   } catch (err) {
-    console.error(`Error loading OpenAI embeddings models: ${err}`);
+    console.error(`Error loading Gemini embeddings models: ${err}`);
     return {};
   }
 };

src/lib/providers/groq.ts

@@ -29,12 +29,15 @@ export const loadGroqChatModels = async () => {
       chatModels[model.id] = {
         displayName: model.id,
         model: new ChatOpenAI({
-          openAIApiKey: groqApiKey,
+          apiKey: groqApiKey,
           modelName: model.id,
           temperature: 0.7,
           configuration: {
             baseURL: 'https://api.groq.com/openai/v1',
           },
+          metadata: {
+            'model-type': 'groq',
+          },
         }) as unknown as BaseChatModel,
       };
     });

src/lib/providers/index.ts

@@ -35,6 +35,11 @@ import {
   loadDeepseekChatModels,
   PROVIDER_INFO as DeepseekInfo,
 } from './deepseek';
+import {
+  loadAimlApiChatModels,
+  loadAimlApiEmbeddingModels,
+  PROVIDER_INFO as AimlApiInfo,
+} from './aimlapi';
 import {
   loadLMStudioChatModels,
   loadLMStudioEmbeddingsModels,
@@ -49,6 +54,7 @@ export const PROVIDER_METADATA = {
   gemini: GeminiInfo,
   transformers: TransformersInfo,
   deepseek: DeepseekInfo,
+  aimlapi: AimlApiInfo,
   lmstudio: LMStudioInfo,
   custom_openai: {
     key: 'custom_openai',
@@ -76,6 +82,7 @@ export const chatModelProviders: Record<
   anthropic: loadAnthropicChatModels,
   gemini: loadGeminiChatModels,
   deepseek: loadDeepseekChatModels,
+  aimlapi: loadAimlApiChatModels,
   lmstudio: loadLMStudioChatModels,
 };
 
@@ -87,6 +94,7 @@ export const embeddingModelProviders: Record<
   ollama: loadOllamaEmbeddingModels,
   gemini: loadGeminiEmbeddingModels,
   transformers: loadTransformersEmbeddingsModels,
+  aimlapi: loadAimlApiEmbeddingModels,
   lmstudio: loadLMStudioEmbeddingsModels,
 };
 
@@ -110,7 +118,7 @@ export const getAvailableChatModelProviders = async () => {
           [customOpenAiModelName]: {
             displayName: customOpenAiModelName,
             model: new ChatOpenAI({
-              openAIApiKey: customOpenAiApiKey,
+              apiKey: customOpenAiApiKey,
               modelName: customOpenAiModelName,
               temperature: 0.7,
               configuration: {

src/lib/providers/lmstudio.ts

@@ -47,7 +47,7 @@ export const loadLMStudioChatModels = async () => {
       chatModels[model.id] = {
         displayName: model.name || model.id,
         model: new ChatOpenAI({
-          openAIApiKey: 'lm-studio',
+          apiKey: 'lm-studio',
           configuration: {
             baseURL: ensureV1Endpoint(endpoint),
           },
@@ -83,7 +83,7 @@ export const loadLMStudioEmbeddingsModels = async () => {
       embeddingsModels[model.id] = {
         displayName: model.name || model.id,
         model: new OpenAIEmbeddings({
-          openAIApiKey: 'lm-studio',
+          apiKey: 'lm-studio',
           configuration: {
             baseURL: ensureV1Endpoint(endpoint),
           },

src/lib/providers/ollama.ts

@@ -6,8 +6,8 @@ export const PROVIDER_INFO = {
   key: 'ollama',
   displayName: 'Ollama',
 };
-import { ChatOllama } from '@langchain/community/chat_models/ollama';
-import { OllamaEmbeddings } from '@langchain/community/embeddings/ollama';
+import { ChatOllama } from '@langchain/ollama';
+import { OllamaEmbeddings } from '@langchain/ollama';
 
 export const loadOllamaChatModels = async () => {
   const ollamaApiEndpoint = getOllamaApiEndpoint();

src/lib/providers/openai.ts

@@ -67,7 +67,7 @@ export const loadOpenAIChatModels = async () => {
       chatModels[model.key] = {
         displayName: model.displayName,
         model: new ChatOpenAI({
-          openAIApiKey: openaiApiKey,
+          apiKey: openaiApiKey,
           modelName: model.key,
           temperature: 0.7,
         }) as unknown as BaseChatModel,
@@ -93,7 +93,7 @@ export const loadOpenAIEmbeddingModels = async () => {
       embeddingModels[model.key] = {
         displayName: model.displayName,
         model: new OpenAIEmbeddings({
-          openAIApiKey: openaiApiKey,
+          apiKey: openaiApiKey,
           modelName: model.key,
         }) as unknown as Embeddings,
       };

src/lib/utils/formatHistory.ts

@@ -1,8 +1,11 @@
-import { BaseMessage } from '@langchain/core/messages';
+import { BaseMessage, isAIMessage } from '@langchain/core/messages';
 
 const formatChatHistoryAsString = (history: BaseMessage[]) => {
   return history
-    .map((message) => `${message._getType()}: ${message.content}`)
+    .map(
+      (message) =>
+        `${isAIMessage(message) ? 'AI' : 'User'}: ${message.content}`,
+    )
     .join('\n');
 };