feat(app): lint & beautify

src/components/Settings/Sections/Models/DeleteProviderDialog.tsx

@@ -2,118 +2,117 @@ import { Dialog, DialogPanel } from '@headlessui/react';
 import { Loader2, Trash2 } from 'lucide-react';
 import { useState } from 'react';
 import { AnimatePresence, motion } from 'framer-motion';
-import {
-    ConfigModelProvider,
-} from '@/lib/config/types';
+import { ConfigModelProvider } from '@/lib/config/types';
 import { toast } from 'sonner';
 
 const DeleteProvider = ({
-    modelProvider,
-    setProviders,
+  modelProvider,
+  setProviders,
 }: {
-    modelProvider: ConfigModelProvider;
-    setProviders: React.Dispatch<React.SetStateAction<ConfigModelProvider[]>>;
+  modelProvider: ConfigModelProvider;
+  setProviders: React.Dispatch<React.SetStateAction<ConfigModelProvider[]>>;
 }) => {
-    const [open, setOpen] = useState(false);
-    const [loading, setLoading] = useState(false);
+  const [open, setOpen] = useState(false);
+  const [loading, setLoading] = useState(false);
 
-    const handleDelete = async (e: React.FormEvent) => {
-        e.preventDefault();
-        setLoading(true);
-        try {
-            const res = await fetch(`/api/providers/${modelProvider.id}`, {
-                method: 'DELETE',
-                headers: {
-                    'Content-Type': 'application/json',
-                },
-            });
+  const handleDelete = async (e: React.FormEvent) => {
+    e.preventDefault();
+    setLoading(true);
+    try {
+      const res = await fetch(`/api/providers/${modelProvider.id}`, {
+        method: 'DELETE',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+      });
 
-            if (!res.ok) {
-                throw new Error('Failed to delete provider');
-            }
+      if (!res.ok) {
+        throw new Error('Failed to delete provider');
+      }
 
-            setProviders((prev) => {
-                return prev.filter((p) => p.id !== modelProvider.id);
-            });
+      setProviders((prev) => {
+        return prev.filter((p) => p.id !== modelProvider.id);
+      });
 
-            toast.success('Provider deleted successfully.');
-        } catch (error) {
-            console.error('Error deleting provider:', error);
-            toast.error('Failed to delete provider.');
-        } finally {
-            setLoading(false);
-        }
-    };
+      toast.success('Provider deleted successfully.');
+    } catch (error) {
+      console.error('Error deleting provider:', error);
+      toast.error('Failed to delete provider.');
+    } finally {
+      setLoading(false);
+    }
+  };
 
-    return (
-        <>
-            <button
-                onClick={(e) => {
-                    e.stopPropagation();
-                    setOpen(true);
-                }}
-                className="group p-1.5 rounded-md hover:bg-light-200 hover:dark:bg-dark-200 transition-colors group"
-                title="Delete provider"
+  return (
+    <>
+      <button
+        onClick={(e) => {
+          e.stopPropagation();
+          setOpen(true);
+        }}
+        className="group p-1.5 rounded-md hover:bg-light-200 hover:dark:bg-dark-200 transition-colors group"
+        title="Delete provider"
+      >
+        <Trash2
+          size={14}
+          className="text-black/60 dark:text-white/60 group-hover:text-red-500 group-hover:dark:text-red-400"
+        />
+      </button>
+      <AnimatePresence>
+        {open && (
+          <Dialog
+            static
+            open={open}
+            onClose={() => setOpen(false)}
+            className="relative z-[60]"
+          >
+            <motion.div
+              initial={{ opacity: 0 }}
+              animate={{ opacity: 1 }}
+              exit={{ opacity: 0 }}
+              transition={{ duration: 0.1 }}
+              className="fixed inset-0 flex w-screen items-center justify-center p-4 bg-black/30 backdrop-blur-sm"
             >
-                <Trash2
-                    size={14}
-                    className="text-black/60 dark:text-white/60 group-hover:text-red-500 group-hover:dark:text-red-400"
-                />
-            </button>
-            <AnimatePresence>
-                {open && (
-                    <Dialog
-                        static
-                        open={open}
-                        onClose={() => setOpen(false)}
-                        className="relative z-[60]"
-                    >
-                        <motion.div
-                            initial={{ opacity: 0 }}
-                            animate={{ opacity: 1 }}
-                            exit={{ opacity: 0 }}
-                            transition={{ duration: 0.1 }}
-                            className="fixed inset-0 flex w-screen items-center justify-center p-4 bg-black/30 backdrop-blur-sm"
-                        >
-                            <DialogPanel className="w-full mx-4 lg:w-[600px] max-h-[85vh] flex flex-col border bg-light-primary dark:bg-dark-primary border-light-secondary dark:border-dark-secondary rounded-lg">
-                                    <div className="px-6 pt-6 pb-4">
-                                        <h3 className="text-black/90 dark:text-white/90 font-medium">
-                                            Delete provider
-                                        </h3>
-                                    </div>
-                                    <div className="border-t border-light-200 dark:border-dark-200" />
-                                    <div className="flex-1 overflow-y-auto px-6 py-4">
-                                        <p className='text-SM text-black/60 dark:text-white/60'>
-                                            Are you sure you want to delete the provider &quot;{modelProvider.name}&quot;? This action cannot be undone.
-                                        </p>
-                                    </div>
-                                    <div className="px-6 py-6 flex justify-end space-x-2">
-                                        <button
-                                            disabled={loading}
-                                            onClick={() => setOpen(false)}
-                                            className="px-4 py-2 rounded-lg text-sm border border-light-200 dark:border-dark-200 text-black dark:text-white bg-light-secondary/50 dark:bg-dark-secondary/50 hover:bg-light-secondary hover:dark:bg-dark-secondary hover:border-light-300 hover:dark:border-dark-300 flex flex-row items-center space-x-1 active:scale-95 transition duration-200"
-                                        >
-                                           Cancel
-                                        </button>
-                                        <button
-                                            disabled={loading}
-                                            onClick={handleDelete}
-                                            className="px-4 py-2 rounded-lg text-sm bg-red-500 text-white font-medium disabled:opacity-85 hover:opacity-85 active:scale-95 transition duration-200"
-                                        >
-                                            {loading ? (
-                                                <Loader2 className="animate-spin" size={16} />
-                                            ) : (
-                                                'Delete'
-                                            )}
-                                        </button>
-                                    </div>
-                            </DialogPanel>
-                        </motion.div>
-                    </Dialog>
-                )}
-            </AnimatePresence>
-        </>
-    );
+              <DialogPanel className="w-full mx-4 lg:w-[600px] max-h-[85vh] flex flex-col border bg-light-primary dark:bg-dark-primary border-light-secondary dark:border-dark-secondary rounded-lg">
+                <div className="px-6 pt-6 pb-4">
+                  <h3 className="text-black/90 dark:text-white/90 font-medium">
+                    Delete provider
+                  </h3>
+                </div>
+                <div className="border-t border-light-200 dark:border-dark-200" />
+                <div className="flex-1 overflow-y-auto px-6 py-4">
+                  <p className="text-SM text-black/60 dark:text-white/60">
+                    Are you sure you want to delete the provider &quot;
+                    {modelProvider.name}&quot;? This action cannot be undone.
+                  </p>
+                </div>
+                <div className="px-6 py-6 flex justify-end space-x-2">
+                  <button
+                    disabled={loading}
+                    onClick={() => setOpen(false)}
+                    className="px-4 py-2 rounded-lg text-sm border border-light-200 dark:border-dark-200 text-black dark:text-white bg-light-secondary/50 dark:bg-dark-secondary/50 hover:bg-light-secondary hover:dark:bg-dark-secondary hover:border-light-300 hover:dark:border-dark-300 flex flex-row items-center space-x-1 active:scale-95 transition duration-200"
+                  >
+                    Cancel
+                  </button>
+                  <button
+                    disabled={loading}
+                    onClick={handleDelete}
+                    className="px-4 py-2 rounded-lg text-sm bg-red-500 text-white font-medium disabled:opacity-85 hover:opacity-85 active:scale-95 transition duration-200"
+                  >
+                    {loading ? (
+                      <Loader2 className="animate-spin" size={16} />
+                    ) : (
+                      'Delete'
+                    )}
+                  </button>
+                </div>
+              </DialogPanel>
+            </motion.div>
+          </Dialog>
+        )}
+      </AnimatePresence>
+    </>
+  );
 };
 
 export default DeleteProvider;

src/components/Settings/Sections/Models/ModelProvider.tsx

@@ -9,199 +9,209 @@ import UpdateProvider from './UpdateProviderDialog';
 import DeleteProvider from './DeleteProviderDialog';
 
 const ModelProvider = ({
-    modelProvider,
-    setProviders,
-    fields,
+  modelProvider,
+  setProviders,
+  fields,
 }: {
-    modelProvider: ConfigModelProvider;
-    fields: UIConfigField[];
-    setProviders: React.Dispatch<React.SetStateAction<ConfigModelProvider[]>>;
+  modelProvider: ConfigModelProvider;
+  fields: UIConfigField[];
+  setProviders: React.Dispatch<React.SetStateAction<ConfigModelProvider[]>>;
 }) => {
-    const [open, setOpen] = useState(false);
+  const [open, setOpen] = useState(false);
 
-    const handleModelDelete = async (
-        type: 'chat' | 'embedding',
-        modelKey: string,
-    ) => {
-        try {
-            const res = await fetch(`/api/providers/${modelProvider.id}/models`, {
-                method: 'DELETE',
-                headers: {
-                    'Content-Type': 'application/json',
-                },
-                body: JSON.stringify({ key: modelKey, type: type }),
-            });
+  const handleModelDelete = async (
+    type: 'chat' | 'embedding',
+    modelKey: string,
+  ) => {
+    try {
+      const res = await fetch(`/api/providers/${modelProvider.id}/models`, {
+        method: 'DELETE',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({ key: modelKey, type: type }),
+      });
 
-            if (!res.ok) {
-                throw new Error('Failed to delete model: ' + (await res.text()));
+      if (!res.ok) {
+        throw new Error('Failed to delete model: ' + (await res.text()));
+      }
+
+      setProviders(
+        (prev) =>
+          prev.map((provider) => {
+            if (provider.id === modelProvider.id) {
+              return {
+                ...provider,
+                ...(type === 'chat'
+                  ? {
+                      chatModels: provider.chatModels.filter(
+                        (m) => m.key !== modelKey,
+                      ),
+                    }
+                  : {
+                      embeddingModels: provider.embeddingModels.filter(
+                        (m) => m.key !== modelKey,
+                      ),
+                    }),
+              };
             }
+            return provider;
+          }) as ConfigModelProvider[],
+      );
 
-            setProviders(
-                (prev) =>
-                    prev.map((provider) => {
-                        if (provider.id === modelProvider.id) {
-                            return {
-                                ...provider,
-                                ...(type === 'chat'
-                                    ? {
-                                        chatModels: provider.chatModels.filter(
-                                            (m) => m.key !== modelKey,
-                                        ),
-                                    }
-                                    : {
-                                        embeddingModels: provider.embeddingModels.filter(
-                                            (m) => m.key !== modelKey,
-                                        ),
-                                    }),
-                            };
-                        }
-                        return provider;
-                    }) as ConfigModelProvider[],
-            );
+      toast.success('Model deleted successfully.');
+    } catch (err) {
+      console.error('Failed to delete model', err);
+      toast.error('Failed to delete model.');
+    }
+  };
 
-            toast.success('Model deleted successfully.');
-        } catch (err) {
-            console.error('Failed to delete model', err);
-            toast.error('Failed to delete model.');
-        }
-    };
-
-    return (
-        <div
-            key={modelProvider.id}
-            className="border border-light-200 dark:border-dark-200 rounded-lg overflow-hidden"
-        >
-            <div
-                className={cn(
-                    'group px-5 py-4 flex flex-row justify-between w-full cursor-pointer hover:bg-light-secondary hover:dark:bg-dark-secondary transition duration-200 items-center',
-                    !open && 'rounded-lg',
-                )}
-                onClick={() => setOpen(!open)}
-            >
-                <p className="text-black dark:text-white font-medium">
-                    {modelProvider.name}
-                </p>
-                <div className="flex items-center gap-4">
-                    <div className="flex flex-row items-center">
-                        <UpdateProvider
-                            fields={fields}
-                            modelProvider={modelProvider}
-                            setProviders={setProviders}
-                        />
-                        <DeleteProvider
-                            modelProvider={modelProvider}
-                            setProviders={setProviders}
-                        />
-                    </div>
-                    <ChevronDown
-                        size={16}
-                        className={cn(
-                            open ? 'rotate-180' : '',
-                            'transition duration-200 text-black/70 dark:text-white/70 group-hover:text-sky-500',
-                        )}
-                    />
-                </div>
-            </div>
-            <AnimatePresence>
-                {open && (
-                    <motion.div
-                        initial={{ height: 0, opacity: 0 }}
-                        animate={{ height: 'auto', opacity: 1 }}
-                        exit={{ height: 0, opacity: 0 }}
-                        transition={{ duration: 0.1 }}
-                    >
-                        <div className="border-t border-light-200 dark:border-dark-200" />
-                        <div className="flex flex-col gap-y-4 px-5 py-4">
-                            {modelProvider.chatModels.length > 0 && (
-                                <div className="flex flex-col gap-y-2">
-                                    <div className="flex flex-row w-full justify-between items-center">
-                                        <p className="text-xs text-black/70 dark:text-white/70">
-                                            Chat models
-                                        </p>
-                                        <AddModel
-                                            providerId={modelProvider.id}
-                                            setProviders={setProviders}
-                                            type="chat"
-                                        />
-                                    </div>
-                                    <div className="flex flex-col gap-2">
-                                        {modelProvider.chatModels.some((m) => m.key === 'error') ? (
-                                            <div className="flex flex-row items-center gap-2 text-sm text-red-500 dark:text-red-400 rounded-lg bg-red-50 dark:bg-red-950/20 px-3 py-2 border border-red-200 dark:border-red-900/30">
-                                                <AlertCircle size={16} className="shrink-0" />
-                                                <span className="break-words">
-                                                    {modelProvider.chatModels.find((m) => m.key === 'error')?.name}
-                                                </span>
-                                            </div>
-                                        ) : (
-                                            <div className="flex flex-row flex-wrap gap-2">
-                                                {modelProvider.chatModels.map((model, index) => (
-                                                    <div
-                                                        key={`${modelProvider.id}-chat-${model.key}-${index}`}
-                                                        className="flex flex-row items-center space-x-1 text-sm text-black/70 dark:text-white/70 rounded-lg bg-light-secondary dark:bg-dark-secondary px-3 py-1.5"
-                                                    >
-                                                        <span>{model.name}</span>
-                                                        <button
-                                                            onClick={() => {
-                                                                handleModelDelete('chat', model.key);
-                                                            }}
-                                                        >
-                                                            <X size={12} />
-                                                        </button>
-                                                    </div>
-                                                ))}
-                                            </div>
-                                        )}
-                                    </div>
-                                </div>
-                            )}
-                            {modelProvider.embeddingModels.length > 0 && (
-                                <div className="flex flex-col gap-y-2">
-                                    <div className="flex flex-row w-full justify-between items-center">
-                                        <p className="text-xs text-black/70 dark:text-white/70">
-                                            Embedding models
-                                        </p>
-                                        <AddModel
-                                            providerId={modelProvider.id}
-                                            setProviders={setProviders}
-                                            type="embedding"
-                                        />
-                                    </div>
-                                    <div className="flex flex-col gap-2">
-                                        {modelProvider.embeddingModels.some((m) => m.key === 'error') ? (
-                                            <div className="flex flex-row items-center gap-2 text-sm text-red-500 dark:text-red-400 rounded-lg bg-red-50 dark:bg-red-950/20 px-3 py-2 border border-red-200 dark:border-red-900/30">
-                                                <AlertCircle size={16} className="shrink-0" />
-                                                <span className="break-words">
-                                                    {modelProvider.embeddingModels.find((m) => m.key === 'error')?.name}
-                                                </span>
-                                            </div>
-                                        ) : (
-                                            <div className="flex flex-row flex-wrap gap-2">
-                                                {modelProvider.embeddingModels.map((model, index) => (
-                                                    <div
-                                                        key={`${modelProvider.id}-embedding-${model.key}-${index}`}
-                                                        className="flex flex-row items-center space-x-1 text-sm text-black/70 dark:text-white/70 rounded-lg bg-light-secondary dark:bg-dark-secondary px-3 py-1.5"
-                                                    >
-                                                        <span>{model.name}</span>
-                                                        <button
-                                                            onClick={() => {
-                                                                handleModelDelete('embedding', model.key);
-                                                            }}
-                                                        >
-                                                            <X size={12} />
-                                                        </button>
-                                                    </div>
-                                                ))}
-                                            </div>
-                                        )}
-                                    </div>
-                                </div>
-                            )}
-                        </div>
-                    </motion.div>
-                )}
-            </AnimatePresence>
+  return (
+    <div
+      key={modelProvider.id}
+      className="border border-light-200 dark:border-dark-200 rounded-lg overflow-hidden"
+    >
+      <div
+        className={cn(
+          'group px-5 py-4 flex flex-row justify-between w-full cursor-pointer hover:bg-light-secondary hover:dark:bg-dark-secondary transition duration-200 items-center',
+          !open && 'rounded-lg',
+        )}
+        onClick={() => setOpen(!open)}
+      >
+        <p className="text-black dark:text-white font-medium">
+          {modelProvider.name}
+        </p>
+        <div className="flex items-center gap-4">
+          <div className="flex flex-row items-center">
+            <UpdateProvider
+              fields={fields}
+              modelProvider={modelProvider}
+              setProviders={setProviders}
+            />
+            <DeleteProvider
+              modelProvider={modelProvider}
+              setProviders={setProviders}
+            />
+          </div>
+          <ChevronDown
+            size={16}
+            className={cn(
+              open ? 'rotate-180' : '',
+              'transition duration-200 text-black/70 dark:text-white/70 group-hover:text-sky-500',
+            )}
+          />
         </div>
-    );
+      </div>
+      <AnimatePresence>
+        {open && (
+          <motion.div
+            initial={{ height: 0, opacity: 0 }}
+            animate={{ height: 'auto', opacity: 1 }}
+            exit={{ height: 0, opacity: 0 }}
+            transition={{ duration: 0.1 }}
+          >
+            <div className="border-t border-light-200 dark:border-dark-200" />
+            <div className="flex flex-col gap-y-4 px-5 py-4">
+              {modelProvider.chatModels.length > 0 && (
+                <div className="flex flex-col gap-y-2">
+                  <div className="flex flex-row w-full justify-between items-center">
+                    <p className="text-xs text-black/70 dark:text-white/70">
+                      Chat models
+                    </p>
+                    <AddModel
+                      providerId={modelProvider.id}
+                      setProviders={setProviders}
+                      type="chat"
+                    />
+                  </div>
+                  <div className="flex flex-col gap-2">
+                    {modelProvider.chatModels.some((m) => m.key === 'error') ? (
+                      <div className="flex flex-row items-center gap-2 text-sm text-red-500 dark:text-red-400 rounded-lg bg-red-50 dark:bg-red-950/20 px-3 py-2 border border-red-200 dark:border-red-900/30">
+                        <AlertCircle size={16} className="shrink-0" />
+                        <span className="break-words">
+                          {
+                            modelProvider.chatModels.find(
+                              (m) => m.key === 'error',
+                            )?.name
+                          }
+                        </span>
+                      </div>
+                    ) : (
+                      <div className="flex flex-row flex-wrap gap-2">
+                        {modelProvider.chatModels.map((model, index) => (
+                          <div
+                            key={`${modelProvider.id}-chat-${model.key}-${index}`}
+                            className="flex flex-row items-center space-x-1 text-sm text-black/70 dark:text-white/70 rounded-lg bg-light-secondary dark:bg-dark-secondary px-3 py-1.5"
+                          >
+                            <span>{model.name}</span>
+                            <button
+                              onClick={() => {
+                                handleModelDelete('chat', model.key);
+                              }}
+                            >
+                              <X size={12} />
+                            </button>
+                          </div>
+                        ))}
+                      </div>
+                    )}
+                  </div>
+                </div>
+              )}
+              {modelProvider.embeddingModels.length > 0 && (
+                <div className="flex flex-col gap-y-2">
+                  <div className="flex flex-row w-full justify-between items-center">
+                    <p className="text-xs text-black/70 dark:text-white/70">
+                      Embedding models
+                    </p>
+                    <AddModel
+                      providerId={modelProvider.id}
+                      setProviders={setProviders}
+                      type="embedding"
+                    />
+                  </div>
+                  <div className="flex flex-col gap-2">
+                    {modelProvider.embeddingModels.some(
+                      (m) => m.key === 'error',
+                    ) ? (
+                      <div className="flex flex-row items-center gap-2 text-sm text-red-500 dark:text-red-400 rounded-lg bg-red-50 dark:bg-red-950/20 px-3 py-2 border border-red-200 dark:border-red-900/30">
+                        <AlertCircle size={16} className="shrink-0" />
+                        <span className="break-words">
+                          {
+                            modelProvider.embeddingModels.find(
+                              (m) => m.key === 'error',
+                            )?.name
+                          }
+                        </span>
+                      </div>
+                    ) : (
+                      <div className="flex flex-row flex-wrap gap-2">
+                        {modelProvider.embeddingModels.map((model, index) => (
+                          <div
+                            key={`${modelProvider.id}-embedding-${model.key}-${index}`}
+                            className="flex flex-row items-center space-x-1 text-sm text-black/70 dark:text-white/70 rounded-lg bg-light-secondary dark:bg-dark-secondary px-3 py-1.5"
+                          >
+                            <span>{model.name}</span>
+                            <button
+                              onClick={() => {
+                                handleModelDelete('embedding', model.key);
+                              }}
+                            >
+                              <X size={12} />
+                            </button>
+                          </div>
+                        ))}
+                      </div>
+                    )}
+                  </div>
+                </div>
+              )}
+            </div>
+          </motion.div>
+        )}
+      </AnimatePresence>
+    </div>
+  );
 };
 
 export default ModelProvider;

src/lib/config/serverRegistry.ts

@@ -11,4 +11,5 @@ export const getConfiguredModelProviderById = (
   return getConfiguredModelProviders().find((p) => p.id === id) ?? undefined;
 };
 
-export const getSearxngURL = () => configManager.getConfig('search.searxngURL', '')
+export const getSearxngURL = () =>
+  configManager.getConfig('search.searxngURL', '');

src/lib/config/types.ts

@@ -17,7 +17,6 @@ type StringUIConfigField = BaseUIConfigField & {
 
 type SelectUIConfigFieldOptions = {
   name: string;
-  key: string;
   value: string;
 };
 
@@ -56,8 +55,8 @@ type Config = {
   };
   modelProviders: ConfigModelProvider[];
   search: {
-    [key: string]: any
-  }
+    [key: string]: any;
+  };
 };
 
 type EnvMap = {
@@ -76,7 +75,7 @@ type ModelProviderUISection = {
 type UIConfigSections = {
   general: UIConfigField[];
   modelProviders: ModelProviderUISection[];
-  search:  UIConfigField[];
+  search: UIConfigField[];
 };
 
 export type {
@@ -84,6 +83,8 @@ export type {
   Config,
   EnvMap,
   UIConfigSections,
+  SelectUIConfigField,
+  StringUIConfigField,
   ModelProviderUISection,
   ConfigModelProvider,
 };

src/lib/models/providers/index.ts

@@ -5,7 +5,7 @@ import OllamaProvider from './ollama';
 
 export const providers: Record<string, ProviderConstructor<any>> = {
   openai: OpenAIProvider,
-  ollama: OllamaProvider
+  ollama: OllamaProvider,
 };
 
 export const getModelProvidersUIConfigSection =

src/lib/models/providers/ollama.ts

@@ -7,129 +7,131 @@ import { UIConfigField } from '@/lib/config/types';
 import { getConfiguredModelProviderById } from '@/lib/config/serverRegistry';
 
 interface OllamaConfig {
-    baseURL: string;
+  baseURL: string;
 }
 
 const providerConfigFields: UIConfigField[] = [
-    {
-        type: 'string',
-        name: 'Base URL',
-        key: 'baseURL',
-        description: 'The base URL for the Ollama',
-        required: true,
-        placeholder: 'Ollama Base URL',
-        default: process.env.DOCKER ? 'http://host.docker.internal:11434' : 'http://localhost:11434',
-        env: 'OLLAMA_BASE_URL',
-        scope: 'server',
-    },
+  {
+    type: 'string',
+    name: 'Base URL',
+    key: 'baseURL',
+    description: 'The base URL for the Ollama',
+    required: true,
+    placeholder: 'Ollama Base URL',
+    default: process.env.DOCKER
+      ? 'http://host.docker.internal:11434'
+      : 'http://localhost:11434',
+    env: 'OLLAMA_BASE_URL',
+    scope: 'server',
+  },
 ];
 
 class OllamaProvider extends BaseModelProvider<OllamaConfig> {
-    constructor(id: string, name: string, config: OllamaConfig) {
-        super(id, name, config);
-    }
+  constructor(id: string, name: string, config: OllamaConfig) {
+    super(id, name, config);
+  }
 
-    async getDefaultModels(): Promise<ModelList> {
-        try {
-            const res = await fetch(`${this.config.baseURL}/api/tags`, {
-                method: "GET",
-                headers: {
-                    'Content-type': 'application/json'
-                }
-            })
+  async getDefaultModels(): Promise<ModelList> {
+    try {
+      const res = await fetch(`${this.config.baseURL}/api/tags`, {
+        method: 'GET',
+        headers: {
+          'Content-type': 'application/json',
+        },
+      });
 
-            const data = await res.json()
-
-            const models: Model[] = data.models.map((m: any) => {
-                return {
-                    name: m.name,
-                    key: m.model
-                }
-            })
-
-            return {
-                embedding: models,
-                chat: models,
-            };
-        } catch (err) {
-            if (err instanceof TypeError) {
-                throw new Error('Error connecting to Ollama API. Please ensure the base URL is correct and the Ollama server is running.');
-            }
-
-            throw err;
-        }
-    }
-
-    async getModelList(): Promise<ModelList> {
-        const defaultModels = await this.getDefaultModels();
-        const configProvider = getConfiguredModelProviderById(this.id)!;
+      const data = await res.json();
 
+      const models: Model[] = data.models.map((m: any) => {
         return {
-            embedding: [
-                ...defaultModels.embedding,
-                ...configProvider.embeddingModels,
-            ],
-            chat: [...defaultModels.chat, ...configProvider.chatModels],
+          name: m.name,
+          key: m.model,
         };
+      });
+
+      return {
+        embedding: models,
+        chat: models,
+      };
+    } catch (err) {
+      if (err instanceof TypeError) {
+        throw new Error(
+          'Error connecting to Ollama API. Please ensure the base URL is correct and the Ollama server is running.',
+        );
+      }
+
+      throw err;
+    }
+  }
+
+  async getModelList(): Promise<ModelList> {
+    const defaultModels = await this.getDefaultModels();
+    const configProvider = getConfiguredModelProviderById(this.id)!;
+
+    return {
+      embedding: [
+        ...defaultModels.embedding,
+        ...configProvider.embeddingModels,
+      ],
+      chat: [...defaultModels.chat, ...configProvider.chatModels],
+    };
+  }
+
+  async loadChatModel(key: string): Promise<BaseChatModel> {
+    const modelList = await this.getModelList();
+
+    const exists = modelList.chat.find((m) => m.key === key);
+
+    if (!exists) {
+      throw new Error(
+        'Error Loading Ollama Chat Model. Invalid Model Selected',
+      );
     }
 
-    async loadChatModel(key: string): Promise<BaseChatModel> {
-        const modelList = await this.getModelList();
+    return new ChatOllama({
+      temperature: 0.7,
+      model: key,
+      baseUrl: this.config.baseURL,
+    });
+  }
 
-        const exists = modelList.chat.find((m) => m.key === key);
+  async loadEmbeddingModel(key: string): Promise<Embeddings> {
+    const modelList = await this.getModelList();
+    const exists = modelList.embedding.find((m) => m.key === key);
 
-        if (!exists) {
-            throw new Error(
-                'Error Loading Ollama Chat Model. Invalid Model Selected',
-            );
-        }
-
-        return new ChatOllama({
-            temperature: 0.7,
-            model: key,
-            baseUrl: this.config.baseURL,
-        });
+    if (!exists) {
+      throw new Error(
+        'Error Loading Ollama Embedding Model. Invalid Model Selected.',
+      );
     }
 
-    async loadEmbeddingModel(key: string): Promise<Embeddings> {
-        const modelList = await this.getModelList();
-        const exists = modelList.embedding.find((m) => m.key === key);
+    return new OllamaEmbeddings({
+      model: key,
+      baseUrl: this.config.baseURL,
+    });
+  }
 
-        if (!exists) {
-            throw new Error(
-                'Error Loading Ollama Embedding Model. Invalid Model Selected.',
-            );
-        }
+  static parseAndValidate(raw: any): OllamaConfig {
+    if (!raw || typeof raw !== 'object')
+      throw new Error('Invalid config provided. Expected object');
+    if (!raw.baseURL)
+      throw new Error('Invalid config provided. Base URL must be provided');
 
-        return new OllamaEmbeddings({
-            model: key,
-            baseUrl: this.config.baseURL,
-        });
-    }
+    return {
+      baseURL: String(raw.baseURL),
+    };
+  }
 
-    static parseAndValidate(raw: any): OllamaConfig {
-        if (!raw || typeof raw !== 'object')
-            throw new Error('Invalid config provided. Expected object');
-        if (!raw.baseURL)
-            throw new Error(
-                'Invalid config provided. Base URL must be provided',
-            );
+  static getProviderConfigFields(): UIConfigField[] {
+    return providerConfigFields;
+  }
 
-        return {
-            baseURL: String(raw.baseURL),
-        };
-    }
-
-    static getProviderConfigFields(): UIConfigField[] {
-        return providerConfigFields;
-    }
-
-    static getProviderMetadata(): ProviderMetadata {
-        return {
-            key: 'ollama',
-            name: 'Ollama',
-        };
-    }
+  static getProviderMetadata(): ProviderMetadata {
+    return {
+      key: 'ollama',
+      name: 'Ollama',
+    };
+  }
 }
 
 export default OllamaProvider;

src/lib/models/registry.ts

@@ -67,7 +67,6 @@ class ModelRegistry {
           chatModels: m.chat,
           embeddingModels: m.embedding,
         });
-
       }),
     );