This commit is contained in:
Timothy Jaeryang Baek 2025-07-03 18:13:23 +04:00
parent 8661c4416a
commit d2485bbf09
7 changed files with 68 additions and 33 deletions

View file

@ -49,6 +49,8 @@
let showConfirm = false; let showConfirm = false;
let query = ''; let query = '';
let selectedType = 'all';
let showManifestModal = false; let showManifestModal = false;
let showValvesModal = false; let showValvesModal = false;
let selectedFunction = null; let selectedFunction = null;
@ -59,9 +61,10 @@
$: filteredItems = $functions $: filteredItems = $functions
.filter( .filter(
(f) => (f) =>
query === '' || (selectedType !== 'all' ? f.type === selectedType : true) &&
f.name.toLowerCase().includes(query.toLowerCase()) || (query === '' ||
f.id.toLowerCase().includes(query.toLowerCase()) f.name.toLowerCase().includes(query.toLowerCase()) ||
f.id.toLowerCase().includes(query.toLowerCase()))
) )
.sort((a, b) => a.type.localeCompare(b.type) || a.name.localeCompare(b.name)); .sort((a, b) => a.type.localeCompare(b.type) || a.name.localeCompare(b.name));
@ -219,8 +222,8 @@
}} }}
/> />
<div class="flex flex-col gap-1 mt-1.5 mb-2"> <div class="flex flex-col mt-1.5 mb-0.5">
<div class="flex justify-between items-center"> <div class="flex justify-between items-center mb-1">
<div class="flex md:self-center text-xl items-center font-medium px-0.5"> <div class="flex md:self-center text-xl items-center font-medium px-0.5">
{$i18n.t('Functions')} {$i18n.t('Functions')}
<div class="flex self-center w-[1px] h-6 mx-2.5 bg-gray-50 dark:bg-gray-850" /> <div class="flex self-center w-[1px] h-6 mx-2.5 bg-gray-50 dark:bg-gray-850" />
@ -270,12 +273,54 @@
</AddFunctionMenu> </AddFunctionMenu>
</div> </div>
</div> </div>
<div class=" flex w-full">
<div
class="flex gap-1 scrollbar-none overflow-x-auto w-fit text-center text-sm font-medium rounded-full bg-transparent"
>
<button
class="min-w-fit p-1.5 {selectedType === 'all'
? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
on:click={() => {
selectedType = 'all';
}}>{$i18n.t('All')}</button
>
<button
class="min-w-fit p-1.5 {selectedType === 'filter'
? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
on:click={() => {
selectedType = 'filter';
}}>{$i18n.t('Filter')}</button
>
<button
class="min-w-fit p-1.5 {selectedType === 'pipe'
? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
on:click={() => {
selectedType = 'pipe';
}}>{$i18n.t('Pipe')}</button
>
<button
class="min-w-fit p-1.5 {selectedType === 'action'
? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
on:click={() => {
selectedType = 'action';
}}>{$i18n.t('Action')}</button
>
</div>
</div>
</div> </div>
<div class="mb-5"> <div class="mb-5">
{#each filteredItems as func (func.id)} {#each filteredItems as func (func.id)}
<div <div
class=" flex space-x-4 cursor-pointer w-full px-3 py-2 dark:hover:bg-white/5 hover:bg-black/5 rounded-xl" class=" flex space-x-4 cursor-pointer w-full px-2 py-2 dark:hover:bg-white/5 hover:bg-black/5 rounded-xl"
> >
<a <a
class=" flex flex-1 space-x-3.5 cursor-pointer w-full" class=" flex flex-1 space-x-3.5 cursor-pointer w-full"

View file

@ -67,7 +67,7 @@
class="flex gap-1 scrollbar-none overflow-x-auto w-fit text-center text-sm font-medium rounded-full bg-transparent dark:text-gray-200" class="flex gap-1 scrollbar-none overflow-x-auto w-fit text-center text-sm font-medium rounded-full bg-transparent dark:text-gray-200"
> >
<button <button
class="min-w-fit rounded-full p-1.5 {selected === 'ollama' class="min-w-fit p-1.5 {selected === 'ollama'
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
on:click={() => { on:click={() => {
@ -76,7 +76,7 @@
> >
<!-- <button <!-- <button
class="min-w-fit rounded-full p-1.5 {selected === 'llamacpp' class="min-w-fit p-1.5 {selected === 'llamacpp'
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
on:click={() => { on:click={() => {

View file

@ -150,7 +150,7 @@
class="flex -mt-2 mb-1.5 gap-1 scrollbar-none overflow-x-auto w-fit text-center text-sm font-medium rounded-full bg-transparent dark:text-gray-200" class="flex -mt-2 mb-1.5 gap-1 scrollbar-none overflow-x-auto w-fit text-center text-sm font-medium rounded-full bg-transparent dark:text-gray-200"
> >
<button <button
class="min-w-fit rounded-full p-1.5 {tab === '' class="min-w-fit p-1.5 {tab === ''
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
type="button" type="button"
@ -160,7 +160,7 @@
> >
<button <button
class="min-w-fit rounded-full p-1.5 {tab === 'import' class="min-w-fit p-1.5 {tab === 'import'
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
type="button" type="button"

View file

@ -52,28 +52,28 @@
class="flex gap-1 scrollbar-none overflow-x-auto w-fit text-center text-sm font-medium rounded-full bg-transparent pt-1" class="flex gap-1 scrollbar-none overflow-x-auto w-fit text-center text-sm font-medium rounded-full bg-transparent pt-1"
> >
<a <a
class="min-w-fit rounded-full p-1.5 {$page.url.pathname.includes('/admin/users') class="min-w-fit p-1.5 {$page.url.pathname.includes('/admin/users')
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
href="/admin">{$i18n.t('Users')}</a href="/admin">{$i18n.t('Users')}</a
> >
<a <a
class="min-w-fit rounded-full p-1.5 {$page.url.pathname.includes('/admin/evaluations') class="min-w-fit p-1.5 {$page.url.pathname.includes('/admin/evaluations')
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
href="/admin/evaluations">{$i18n.t('Evaluations')}</a href="/admin/evaluations">{$i18n.t('Evaluations')}</a
> >
<a <a
class="min-w-fit rounded-full p-1.5 {$page.url.pathname.includes('/admin/functions') class="min-w-fit p-1.5 {$page.url.pathname.includes('/admin/functions')
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
href="/admin/functions">{$i18n.t('Functions')}</a href="/admin/functions">{$i18n.t('Functions')}</a
> >
<a <a
class="min-w-fit rounded-full p-1.5 {$page.url.pathname.includes('/admin/settings') class="min-w-fit p-1.5 {$page.url.pathname.includes('/admin/settings')
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
href="/admin/settings">{$i18n.t('Settings')}</a href="/admin/settings">{$i18n.t('Settings')}</a

View file

@ -42,14 +42,14 @@
class="flex gap-1 scrollbar-none overflow-x-auto w-fit text-center text-sm font-medium rounded-full bg-transparent pt-1" class="flex gap-1 scrollbar-none overflow-x-auto w-fit text-center text-sm font-medium rounded-full bg-transparent pt-1"
> >
<a <a
class="min-w-fit rounded-full p-1.5 {$page.url.pathname.includes('/home/notes') class="min-w-fit p-1.5 {$page.url.pathname.includes('/home/notes')
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
href="/playground/notes">{$i18n.t('Notes')}</a href="/playground/notes">{$i18n.t('Notes')}</a
> >
<a <a
class="min-w-fit rounded-full p-1.5 {$page.url.pathname.includes('/playground/calendar') class="min-w-fit p-1.5 {$page.url.pathname.includes('/playground/calendar')
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
href="/playground/completions">{$i18n.t('Calendar')}</a href="/playground/completions">{$i18n.t('Calendar')}</a

View file

@ -42,25 +42,21 @@
class="flex gap-1 scrollbar-none overflow-x-auto w-fit text-center text-sm font-medium rounded-full bg-transparent pt-1" class="flex gap-1 scrollbar-none overflow-x-auto w-fit text-center text-sm font-medium rounded-full bg-transparent pt-1"
> >
<a <a
class="min-w-fit rounded-full p-1.5 {['/playground', '/playground/'].includes( class="min-w-fit p-1.5 {['/playground', '/playground/'].includes($page.url.pathname)
$page.url.pathname
)
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
href="/playground">{$i18n.t('Chat')}</a href="/playground">{$i18n.t('Chat')}</a
> >
<!-- <a <!-- <a
class="min-w-fit rounded-full p-1.5 {$page.url.pathname.includes('/playground/notes') class="min-w-fit p-1.5 {$page.url.pathname.includes('/playground/notes')
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
href="/playground/notes">{$i18n.t('Notes')}</a href="/playground/notes">{$i18n.t('Notes')}</a
> --> > -->
<a <a
class="min-w-fit rounded-full p-1.5 {$page.url.pathname.includes( class="min-w-fit p-1.5 {$page.url.pathname.includes('/playground/completions')
'/playground/completions'
)
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
href="/playground/completions">{$i18n.t('Completions')}</a href="/playground/completions">{$i18n.t('Completions')}</a

View file

@ -78,9 +78,7 @@
> >
{#if $user?.role === 'admin' || $user?.permissions?.workspace?.models} {#if $user?.role === 'admin' || $user?.permissions?.workspace?.models}
<a <a
class="min-w-fit rounded-full p-1.5 {$page.url.pathname.includes( class="min-w-fit p-1.5 {$page.url.pathname.includes('/workspace/models')
'/workspace/models'
)
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
href="/workspace/models">{$i18n.t('Models')}</a href="/workspace/models">{$i18n.t('Models')}</a
@ -89,9 +87,7 @@
{#if $user?.role === 'admin' || $user?.permissions?.workspace?.knowledge} {#if $user?.role === 'admin' || $user?.permissions?.workspace?.knowledge}
<a <a
class="min-w-fit rounded-full p-1.5 {$page.url.pathname.includes( class="min-w-fit p-1.5 {$page.url.pathname.includes('/workspace/knowledge')
'/workspace/knowledge'
)
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
href="/workspace/knowledge" href="/workspace/knowledge"
@ -102,9 +98,7 @@
{#if $user?.role === 'admin' || $user?.permissions?.workspace?.prompts} {#if $user?.role === 'admin' || $user?.permissions?.workspace?.prompts}
<a <a
class="min-w-fit rounded-full p-1.5 {$page.url.pathname.includes( class="min-w-fit p-1.5 {$page.url.pathname.includes('/workspace/prompts')
'/workspace/prompts'
)
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
href="/workspace/prompts">{$i18n.t('Prompts')}</a href="/workspace/prompts">{$i18n.t('Prompts')}</a
@ -113,7 +107,7 @@
{#if $user?.role === 'admin' || $user?.permissions?.workspace?.tools} {#if $user?.role === 'admin' || $user?.permissions?.workspace?.tools}
<a <a
class="min-w-fit rounded-full p-1.5 {$page.url.pathname.includes('/workspace/tools') class="min-w-fit p-1.5 {$page.url.pathname.includes('/workspace/tools')
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
href="/workspace/tools" href="/workspace/tools"