feat: model selector w/ more info

This commit is contained in:
Timothy J. Baek 2024-03-25 14:04:46 -07:00
parent 32cb5f3ceb
commit 5d6cee0c58
2 changed files with 33 additions and 3 deletions

View file

@ -44,8 +44,7 @@
.filter((model) => model.name !== 'hr') .filter((model) => model.name !== 'hr')
.map((model) => ({ .map((model) => ({
value: model.id, value: model.id,
label: label: model.name,
model.name + `${model.size ? ` (${(model.size / 1024 ** 3).toFixed(1)}GB)` : ''}`,
info: model info: model
}))} }))}
bind:value={selectedModel} bind:value={selectedModel}

View file

@ -222,8 +222,14 @@
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<div class="line-clamp-1"> <div class="line-clamp-1">
{item.label} {item.label}
<span class=" text-xs font-medium text-gray-600 dark:text-gray-400"
>{item.info?.details?.parameter_size ?? ''}</span
>
</div> </div>
<!-- {JSON.stringify(item.info)} -->
{#if item.info.external} {#if item.info.external}
<Tooltip content={item.info?.source ?? 'External'}> <Tooltip content={item.info?.source ?? 'External'}>
<div class=" mr-2"> <div class=" mr-2">
@ -231,7 +237,7 @@
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 16 16" viewBox="0 0 16 16"
fill="currentColor" fill="currentColor"
class="w-4 h-4" class="size-3"
> >
<path <path
fill-rule="evenodd" fill-rule="evenodd"
@ -246,6 +252,31 @@
</svg> </svg>
</div> </div>
</Tooltip> </Tooltip>
{:else}
<Tooltip
content={`${
item.info?.details?.quantization_level
? item.info?.details?.quantization_level + ' '
: ''
}${item.info.size ? `(${(item.info.size / 1024 ** 3).toFixed(1)}GB)` : ''}`}
>
<div class=" mr-2">
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
class="w-4 h-4"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="m11.25 11.25.041-.02a.75.75 0 0 1 1.063.852l-.708 2.836a.75.75 0 0 0 1.063.853l.041-.021M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-9-3.75h.008v.008H12V8.25Z"
/>
</svg>
</div>
</Tooltip>
{/if} {/if}
</div> </div>