feat: external model info

src/lib/apis/litellm/index.ts

@@ -33,7 +33,7 @@ export const getLiteLLMModels = async (token: string = '') => {
 					id: model.id,
 					name: model.name ?? model.id,
 					external: true,
-					source: 'litellm'
+					source: 'LiteLLM'
 				}))
 				.sort((a, b) => {
 					return a.name.localeCompare(b.name);

src/lib/components/chat/ModelSelector/Selector.svelte

@@ -12,7 +12,7 @@
 
 	import { user, MODEL_DOWNLOAD_POOL, models } from '$lib/stores';
 	import { toast } from 'svelte-sonner';
-	import { getModels, splitStream } from '$lib/utils';
+	import { capitalizeFirstLetter, getModels, splitStream } from '$lib/utils';
 	import Tooltip from '$lib/components/common/Tooltip.svelte';
 
 	const i18n = getContext('i18n');
@@ -225,6 +225,7 @@
 							</div>
 
 							{#if item.info.external}
+								<Tooltip content={item.info?.source ?? 'External'}>
 									<div class=" mr-2">
 										<svg
 											xmlns="http://www.w3.org/2000/svg"
@@ -244,6 +245,7 @@
 											/>
 										</svg>
 									</div>
+								</Tooltip>
 							{/if}
 						</div>
 

src/lib/utils/index.ts

@@ -31,6 +31,10 @@ export const getModels = async (token: string) => {
 // Helper functions
 //////////////////////////
 
+export const capitalizeFirstLetter = (string) => {
+	return string.charAt(0).toUpperCase() + string.slice(1);
+};
+
 export const splitStream = (splitOn) => {
 	let buffer = '';
 	return new TransformStream({