Skip to content

Commit 24e0413

Browse files
gary149gary149
committed
typo
1 parent ca9d5ef commit 24e0413

File tree

3 files changed

+60
-54
lines changed

3 files changed

+60
-54
lines changed

‎src/lib/components/InferencePlayground/InferencePlayground.svelte‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
handleStreamingResponse,
1010
handleNonStreamingResponse,
1111
isSystemPromptSupported,
12-
FEATUED_MODELS_IDS,
12+
FEATURED_MODELS_IDS,
1313
} from "./inferencePlaygroundUtils";
1414
1515
import { onDestroy, onMount } from "svelte";
@@ -30,7 +30,7 @@
3030
const modelFromQueryParam = models.find(model => model.id === modelIdFromQueryParam);
3131
3232
let conversation: Conversation = {
33-
model: modelFromQueryParam ?? models.find(m => FEATUED_MODELS_IDS.includes(m.id)) ?? models[0],
33+
model: modelFromQueryParam ?? models.find(m => FEATURED_MODELS_IDS.includes(m.id)) ?? models[0],
3434
config: defaultGenerationConfig,
3535
messages: [{ ...startMessageUser }],
3636
systemMessage: startMessageSystem,

‎src/lib/components/InferencePlayground/InferencePlaygroundModelSelectorModal.svelte‎

Lines changed: 55 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
44
import { createEventDispatcher, tick } from "svelte";
55
6-
import { FEATUED_MODELS_IDS } from "./inferencePlaygroundUtils";
6+
import { FEATURED_MODELS_IDS } from "./inferencePlaygroundUtils";
77
import IconSearch from "../Icons/IconSearch.svelte";
88
import IconStar from "../Icons/IconStar.svelte";
99
@@ -17,8 +17,8 @@
1717
1818
const dispatch = createEventDispatcher<{ modelSelected: string; close: void }>();
1919
20-
let featuredModels = models.filter(m => FEATUED_MODELS_IDS.includes(m.id));
21-
let otherModels = models.filter(m => !FEATUED_MODELS_IDS.includes(m.id));
20+
let featuredModels = models.filter(m => FEATURED_MODELS_IDS.includes(m.id));
21+
let otherModels = models.filter(m => !FEATURED_MODELS_IDS.includes(m.id));
2222
2323
if (featuredModels.findIndex(model => model.id === conversation.model.id) !== -1) {
2424
highlightIdx = featuredModels.findIndex(model => model.id === conversation.model.id);
@@ -83,14 +83,14 @@
8383
function filterModels(query: string) {
8484
featuredModels = models.filter(m =>
8585
query
86-
? FEATUED_MODELS_IDS.includes(m.id) && m.id.toLocaleLowerCase().includes(query.toLocaleLowerCase().trim())
87-
: FEATUED_MODELS_IDS.includes(m.id)
86+
? FEATURED_MODELS_IDS.includes(m.id) && m.id.toLocaleLowerCase().includes(query.toLocaleLowerCase().trim())
87+
: FEATURED_MODELS_IDS.includes(m.id)
8888
);
8989
9090
otherModels = models.filter(m =>
9191
query
92-
? !FEATUED_MODELS_IDS.includes(m.id) && m.id.toLocaleLowerCase().includes(query.toLocaleLowerCase().trim())
93-
: !FEATUED_MODELS_IDS.includes(m.id)
92+
? !FEATURED_MODELS_IDS.includes(m.id) && m.id.toLocaleLowerCase().includes(query.toLocaleLowerCase().trim())
93+
: !FEATURED_MODELS_IDS.includes(m.id)
9494
);
9595
}
9696
</script>
@@ -119,56 +119,60 @@
119119
/>
120120
</div>
121121
<div class="max-h-[300px] overflow-y-auto overflow-x-hidden">
122-
<div>
123-
<div class="px-2 py-1.5 text-xs font-medium text-gray-500">Trending</div>
122+
{#if featuredModels.length}
124123
<div>
125-
{#each featuredModels as model, idx}
126-
{@const [nameSpace, modelName] = model.id.split("/")}
127-
<button
128-
class="flex w-full cursor-pointer items-center px-2 py-1.5 text-sm {highlightIdx === idx
129-
? 'highlighted bg-gray-100 dark:bg-gray-800'
130-
: ''}"
131-
on:mouseenter={() => highlightRow(idx)}
132-
on:click={() => {
133-
dispatch("modelSelected", model.id);
134-
dispatch("close");
135-
}}
136-
>
137-
<IconStar classNames="lucide lucide-star mr-2 h-4 w-4 text-yellow-400" />
138-
<span class="inline-flex items-center"
139-
><span class="text-gray-500 dark:text-gray-400">{nameSpace}</span><span
140-
class="mx-1 text-gray-300 dark:text-gray-700">/</span
141-
><span class="text-black dark:text-white">{modelName}</span></span
124+
<div class="px-2 py-1.5 text-xs font-medium text-gray-500">Trending</div>
125+
<div>
126+
{#each featuredModels as model, idx}
127+
{@const [nameSpace, modelName] = model.id.split("/")}
128+
<button
129+
class="flex w-full cursor-pointer items-center px-2 py-1.5 text-sm {highlightIdx === idx
130+
? 'highlighted bg-gray-100 dark:bg-gray-800'
131+
: ''}"
132+
on:mouseenter={() => highlightRow(idx)}
133+
on:click={() => {
134+
dispatch("modelSelected", model.id);
135+
dispatch("close");
136+
}}
142137
>
143-
</button>
144-
{/each}
138+
<IconStar classNames="lucide lucide-star mr-1.5 size-4 text-yellow-400" />
139+
<span class="inline-flex items-center"
140+
><span class="text-gray-500 dark:text-gray-400">{nameSpace}</span><span
141+
class="mx-1 text-gray-300 dark:text-gray-700">/</span
142+
><span class="text-black dark:text-white">{modelName}</span></span
143+
>
144+
</button>
145+
{/each}
146+
</div>
145147
</div>
146-
</div>
147-
<div>
148-
<div class="px-2 py-1.5 text-xs font-medium text-gray-500">Other Models</div>
148+
{/if}
149+
{#if otherModels.length}
149150
<div>
150-
{#each otherModels as model, _idx}
151-
{@const [nameSpace, modelName] = model.id.split("/")}
152-
{@const idx = featuredModels.length + _idx}
153-
<button
154-
class="flex w-full cursor-pointer items-center px-2 py-1.5 text-sm {highlightIdx === idx
155-
? 'highlighted bg-gray-100 dark:bg-gray-800'
156-
: ''}"
157-
on:mouseenter={() => highlightRow(idx)}
158-
on:click={() => {
159-
dispatch("modelSelected", model.id);
160-
dispatch("close");
161-
}}
162-
>
163-
<span class="inline-flex items-center"
164-
><span class="text-gray-500 dark:text-gray-400">{nameSpace}</span><span
165-
class="mx-1 text-gray-300 dark:text-gray-700">/</span
166-
><span class="text-black dark:text-white">{modelName}</span></span
151+
<div class="px-2 py-1.5 text-xs font-medium text-gray-500">Other Models</div>
152+
<div>
153+
{#each otherModels as model, _idx}
154+
{@const [nameSpace, modelName] = model.id.split("/")}
155+
{@const idx = featuredModels.length + _idx}
156+
<button
157+
class="flex w-full cursor-pointer items-center px-2 py-1.5 text-sm {highlightIdx === idx
158+
? 'highlighted bg-gray-100 dark:bg-gray-800'
159+
: ''}"
160+
on:mouseenter={() => highlightRow(idx)}
161+
on:click={() => {
162+
dispatch("modelSelected", model.id);
163+
dispatch("close");
164+
}}
167165
>
168-
</button>
169-
{/each}
166+
<span class="inline-flex items-center"
167+
><span class="text-gray-500 dark:text-gray-400">{nameSpace}</span><span
168+
class="mx-1 text-gray-300 dark:text-gray-700">/</span
169+
><span class="text-black dark:text-white">{modelName}</span></span
170+
>
171+
</button>
172+
{/each}
173+
</div>
170174
</div>
171-
</div>
175+
{/if}
172176
</div>
173177
</div>
174178
</div>

‎src/lib/components/InferencePlayground/inferencePlaygroundUtils.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,9 @@ export function isSystemPromptSupported(model: ModelEntryWithTokenizer) {
6565
return model.tokenizerConfig?.chat_template?.includes("system");
6666
}
6767

68-
export const FEATUED_MODELS_IDS = [
68+
export const FEATURED_MODELS_IDS = [
69+
"Qwen/Qwen2.5-72B-Instruct",
70+
"meta-llama/Meta-Llama-3.1-70B-Instruct",
6971
"meta-llama/Meta-Llama-3.1-70B-Instruct",
7072
"meta-llama/Meta-Llama-3.1-8B-Instruct",
7173
"google/gemma-2-9b-it",

0 commit comments

Comments
 (0)