diff --git a/src/lib/components/admin/Evaluations/Leaderboard.svelte b/src/lib/components/admin/Evaluations/Leaderboard.svelte index e5d8a2166..d8407a574 100644 --- a/src/lib/components/admin/Evaluations/Leaderboard.svelte +++ b/src/lib/components/admin/Evaluations/Leaderboard.svelte @@ -11,6 +11,9 @@ import Tooltip from '$lib/components/common/Tooltip.svelte'; import MagnifyingGlass from '$lib/components/icons/MagnifyingGlass.svelte'; + import ChevronUp from '$lib/components/icons/ChevronUp.svelte'; + import ChevronDown from '$lib/components/icons/ChevronDown.svelte'; + const i18n = getContext('i18n'); const EMBEDDING_MODEL = 'TaylorAI/bge-micro-v2'; @@ -28,6 +31,9 @@ let loadingLeaderboard = true; let debounceTimer; + let orderBy: string = 'rating'; // default sort column + let direction: 'asc' | 'desc' = 'desc'; // default sort order + type Feedback = { id: string; data: { @@ -51,6 +57,15 @@ lost: number; }; + function setSortKey(key) { + if (orderBy === key) { + direction = direction === 'asc' ? 'desc' : 'asc'; + } else { + orderBy = key; + direction = key === 'name' ? 'asc' : 'desc'; + } + } + ////////////////////// // // Rank models by Elo rating @@ -324,25 +339,140 @@ class="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-850 dark:text-gray-400 -translate-y-0.5" > - - {$i18n.t('RK')} + setSortKey('rating')} + > +
+ {$i18n.t('RK')} + {#if orderBy === 'rating'} + + {#if direction === 'asc'} + + {:else} + + {/if} + + {:else} + + {/if} +
- - {$i18n.t('Model')} + setSortKey('name')} + > +
+ {$i18n.t('Model')} + {#if orderBy === 'name'} + + {#if direction === 'asc'} + + {:else} + + {/if} + + {:else} + + {/if} +
- - {$i18n.t('Rating')} + setSortKey('rating')} + > +
+ {$i18n.t('Rating')} + {#if orderBy === 'rating'} + + {#if direction === 'asc'} + + {:else} + + {/if} + + {:else} + + {/if} +
- - {$i18n.t('Won')} + setSortKey('won')} + > +
+ {$i18n.t('Won')} + {#if orderBy === 'won'} + + {#if direction === 'asc'} + + {:else} + + {/if} + + {:else} + + {/if} +
- - {$i18n.t('Lost')} + setSortKey('lost')} + > +
+ {$i18n.t('Lost')} + {#if orderBy === 'lost'} + + {#if direction === 'asc'} + + {:else} + + {/if} + + {:else} + + {/if} +
- {#each rankedModels as model, modelIdx (model.id)} + {#each [...rankedModels].sort((a, b) => { + let aVal, bVal; + if (orderBy === 'name') { + aVal = a.name; + bVal = b.name; + return direction === 'asc' ? aVal.localeCompare(bVal) : bVal.localeCompare(aVal); + } else if (orderBy === 'rating') { + aVal = a.rating === '-' ? -Infinity : a.rating; + bVal = b.rating === '-' ? -Infinity : b.rating; + return direction === 'asc' ? aVal - bVal : bVal - aVal; + } else if (orderBy === 'won') { + aVal = a.stats.won === '-' ? -Infinity : Number(a.stats.won); + bVal = b.stats.won === '-' ? -Infinity : Number(b.stats.won); + return direction === 'asc' ? aVal - bVal : bVal - aVal; + } else if (orderBy === 'lost') { + aVal = a.stats.lost === '-' ? -Infinity : Number(a.stats.lost); + bVal = b.stats.lost === '-' ? -Infinity : Number(b.stats.lost); + return direction === 'asc' ? aVal - bVal : bVal - aVal; + } + return 0; + }) as model, modelIdx (model.id)}