1<script lang="ts">
2 import { ChatScreen, DialogModelNotAvailable } from '$lib/components/app';
3 import { chatStore } from '$lib/stores/chat.svelte';
4 import { conversationsStore, isConversationsInitialized } from '$lib/stores/conversations.svelte';
5 import { modelsStore, modelOptions } from '$lib/stores/models.svelte';
6 import { onMount } from 'svelte';
7 import { page } from '$app/state';
8 import { replaceState } from '$app/navigation';
9
10 let qParam = $derived(page.url.searchParams.get('q'));
11 let modelParam = $derived(page.url.searchParams.get('model'));
12 let newChatParam = $derived(page.url.searchParams.get('new_chat'));
13
14 // Dialog state for model not available error
15 let showModelNotAvailable = $state(false);
16 let requestedModelName = $state('');
17 let availableModelNames = $derived(modelOptions().map((m) => m.model));
18
19 /**
20 * Clear URL params after message is sent to prevent re-sending on refresh
21 */
22 function clearUrlParams() {
23 const url = new URL(page.url);
24
25 url.searchParams.delete('q');
26 url.searchParams.delete('model');
27 url.searchParams.delete('new_chat');
28
29 replaceState(url.toString(), {});
30 }
31
32 async function handleUrlParams() {
33 await modelsStore.fetch();
34
35 if (modelParam) {
36 const model = modelsStore.findModelByName(modelParam);
37
38 if (model) {
39 try {
40 await modelsStore.selectModelById(model.id);
41 } catch (error) {
42 console.error('Failed to select model:', error);
43 requestedModelName = modelParam;
44 showModelNotAvailable = true;
45
46 return;
47 }
48 } else {
49 requestedModelName = modelParam;
50 showModelNotAvailable = true;
51
52 return;
53 }
54 }
55
56 // Handle ?q= parameter - create new conversation and send message
57 if (qParam !== null) {
58 await conversationsStore.createConversation();
59 await chatStore.sendMessage(qParam);
60 clearUrlParams();
61 } else if (modelParam || newChatParam === 'true') {
62 clearUrlParams();
63 }
64 }
65
66 onMount(async () => {
67 if (!isConversationsInitialized()) {
68 await conversationsStore.initialize();
69 }
70
71 conversationsStore.clearActiveConversation();
72 chatStore.clearUIState();
73
74 // Handle URL params only if we have ?q= or ?model= or ?new_chat=true
75 if (qParam !== null || modelParam !== null || newChatParam === 'true') {
76 await handleUrlParams();
77 }
78 });
79</script>
80
81<svelte:head>
82 <title>llama.cpp - AI Chat Interface</title>
83</svelte:head>
84
85<ChatScreen showCenteredEmpty={true} />
86
87<DialogModelNotAvailable
88 bind:open={showModelNotAvailable}
89 modelName={requestedModelName}
90 availableModels={availableModelNames}
91/>