Thomas G. Lopes commited on
Commit
9662103
·
1 Parent(s): e8b5344

make stores ssr proof

Browse files
src/lib/stores/models.ts CHANGED
@@ -1,8 +1,33 @@
 
1
  import type { ModelEntryWithTokenizer } from "$lib/components/InferencePlayground/types";
2
- import { safePage } from "$lib/utils/store";
3
- import { derived } from "svelte/store";
4
 
5
- export const models = derived(safePage, $page => {
6
- const res: ModelEntryWithTokenizer[] = $page?.data?.models ?? [];
7
- return res;
8
- });
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ import { page } from "$app/stores";
2
  import type { ModelEntryWithTokenizer } from "$lib/components/InferencePlayground/types";
3
+ import { effect } from "$lib/utils/effect";
4
+ import { get, writable } from "svelte/store";
5
 
6
+ function createModelsStore() {
7
+ let hasStarted = false;
8
+ const store = writable<ModelEntryWithTokenizer[]>([]);
9
+
10
+ function init() {
11
+ store.set(get(page)?.data.models ?? []);
12
+ hasStarted = true;
13
+ }
14
+
15
+ const subscribe: (typeof store)["subscribe"] = (...args) => {
16
+ if (!hasStarted) init();
17
+ hasStarted = true;
18
+ const unsubs = [
19
+ effect(page, $page => {
20
+ store.set($page.data.models);
21
+ }),
22
+ store.subscribe(...args),
23
+ ];
24
+
25
+ return () => {
26
+ unsubs.forEach(unsub => unsub());
27
+ };
28
+ };
29
+
30
+ return { ...store, subscribe };
31
+ }
32
+
33
+ export const models = createModelsStore();
src/lib/stores/session.ts CHANGED
@@ -11,50 +11,61 @@ import type { ChatCompletionInputMessage } from "@huggingface/tasks";
11
  import { partialSet, safePage } from "$lib/utils/store";
12
 
13
  export function createSessionStore() {
14
- const startMessageUser: ChatCompletionInputMessage = { role: "user", content: "" };
15
- const modelIdsFromQueryParam = get(safePage)?.url?.searchParams?.get("modelId")?.split(",");
16
- const modelsFromQueryParam = modelIdsFromQueryParam?.map(id => get(models).find(model => model.id === id));
17
- const systemMessage: ChatCompletionInputMessage = {
18
- role: "system",
19
- content: modelIdsFromQueryParam?.[0] ? (defaultSystemMessage?.[modelIdsFromQueryParam[0]] ?? "") : "",
20
- };
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
21
 
22
- const store = writable<Session>({
23
- conversations: [
24
- {
25
- model: get(models).find(m => FEATURED_MODELS_IDS.includes(m.id)) ??
26
- get(models)[0] ?? {
27
- id: "",
28
- downloads: 0,
29
- gated: false,
30
- likes: 0,
31
- name: "",
32
- private: false,
33
- tokenizerConfig: {},
34
- updatedAt: new Date(),
35
- },
36
- config: { ...defaultGenerationConfig },
37
- messages: [{ ...startMessageUser }],
38
- systemMessage,
39
- streaming: true,
40
- },
41
- ],
42
- });
43
-
44
- if (modelsFromQueryParam?.length) {
45
- const conversations = modelsFromQueryParam.map(model => {
46
- return {
47
- model,
48
- config: { ...defaultGenerationConfig },
49
- messages: [{ ...startMessageUser }],
50
- systemMessage,
51
- streaming: true,
52
- };
53
- }) as [Conversation] | [Conversation, Conversation];
54
- partialSet(store, { conversations });
55
  }
56
 
57
- return store;
 
 
 
 
 
 
58
  }
59
 
60
  export const session = createSessionStore();
 
11
  import { partialSet, safePage } from "$lib/utils/store";
12
 
13
  export function createSessionStore() {
14
+ let hasStarted = false;
15
+ const store = writable<Session>();
16
+
17
+ function init() {
18
+ const startMessageUser: ChatCompletionInputMessage = { role: "user", content: "" };
19
+ const modelIdsFromQueryParam = get(safePage)?.url?.searchParams?.get("modelId")?.split(",");
20
+ const modelsFromQueryParam = modelIdsFromQueryParam?.map(id => get(models).find(model => model.id === id));
21
+ const systemMessage: ChatCompletionInputMessage = {
22
+ role: "system",
23
+ content: modelIdsFromQueryParam?.[0] ? (defaultSystemMessage?.[modelIdsFromQueryParam[0]] ?? "") : "",
24
+ };
25
+
26
+ store.set({
27
+ conversations: [
28
+ {
29
+ model: get(models).find(m => FEATURED_MODELS_IDS.includes(m.id)) ??
30
+ get(models)[0] ?? {
31
+ id: "",
32
+ downloads: 0,
33
+ gated: false,
34
+ likes: 0,
35
+ name: "",
36
+ private: false,
37
+ tokenizerConfig: {},
38
+ updatedAt: new Date(),
39
+ },
40
+ config: { ...defaultGenerationConfig },
41
+ messages: [{ ...startMessageUser }],
42
+ systemMessage,
43
+ streaming: true,
44
+ },
45
+ ],
46
+ });
47
 
48
+ if (modelsFromQueryParam?.length) {
49
+ const conversations = modelsFromQueryParam.map(model => {
50
+ return {
51
+ model,
52
+ config: { ...defaultGenerationConfig },
53
+ messages: [{ ...startMessageUser }],
54
+ systemMessage,
55
+ streaming: true,
56
+ };
57
+ }) as [Conversation] | [Conversation, Conversation];
58
+ partialSet(store, { conversations });
59
+ }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
60
  }
61
 
62
+ const subscribe: (typeof store)["subscribe"] = (...args) => {
63
+ if (!hasStarted) init();
64
+ hasStarted = true;
65
+ return store.subscribe(...args);
66
+ };
67
+
68
+ return { ...store, subscribe };
69
  }
70
 
71
  export const session = createSessionStore();
src/routes/{+layout.server.ts → +page.server.ts} RENAMED
@@ -1,9 +1,9 @@
1
  import type { ModelEntryWithTokenizer } from "$lib/components/InferencePlayground/types";
2
  import type { ModelEntry } from "@huggingface/hub";
3
- import type { LayoutServerLoad } from "./$types";
4
  import { env } from "$env/dynamic/private";
5
 
6
- export const load: LayoutServerLoad = async ({ fetch }) => {
7
  const apiUrl =
8
  "https://huggingface.co/api/models?pipeline_tag=text-generation&inference_provider=hf-inference&filter=conversational";
9
  const HF_TOKEN = env.HF_TOKEN;
 
1
  import type { ModelEntryWithTokenizer } from "$lib/components/InferencePlayground/types";
2
  import type { ModelEntry } from "@huggingface/hub";
3
+ import type { PageServerLoad } from "./$types";
4
  import { env } from "$env/dynamic/private";
5
 
6
+ export const load: PageServerLoad = async ({ fetch }) => {
7
  const apiUrl =
8
  "https://huggingface.co/api/models?pipeline_tag=text-generation&inference_provider=hf-inference&filter=conversational";
9
  const HF_TOKEN = env.HF_TOKEN;