AdvancedParams.svelte 22.9 KB
Newer Older
Timothy J. Baek's avatar
Timothy J. Baek committed
1
<script lang="ts">
2
	import Switch from '$lib/components/common/Switch.svelte';
Timothy J. Baek's avatar
Timothy J. Baek committed
3
4
5
	import { getContext, createEventDispatcher } from 'svelte';

	const dispatch = createEventDispatcher();
6
7
8

	const i18n = getContext('i18n');

Timothy J. Baek's avatar
Timothy J. Baek committed
9
10
	export let admin = false;

Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
11
	export let params = {
Timothy J. Baek's avatar
Timothy J. Baek committed
12
		// Advanced
Timothy J. Baek's avatar
Timothy J. Baek committed
13
		seed: null,
Timothy J. Baek's avatar
Timothy J. Baek committed
14
		stop: null,
Timothy J. Baek's avatar
Timothy J. Baek committed
15
16
17
18
19
20
21
22
		temperature: null,
		frequency_penalty: null,
		repeat_last_n: null,
		mirostat: null,
		mirostat_eta: null,
		mirostat_tau: null,
		top_k: null,
		top_p: null,
Timothy J. Baek's avatar
Timothy J. Baek committed
23
		min_p: null,
Timothy J. Baek's avatar
Timothy J. Baek committed
24
25
		tfs_z: null,
		num_ctx: null,
Sam McLeod's avatar
Sam McLeod committed
26
27
		num_batch: null,
		num_keep: null,
Timothy J. Baek's avatar
Timothy J. Baek committed
28
		max_tokens: null,
29
30
31
		use_mmap: null,
		use_mlock: null,
		num_thread: null,
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
32
		template: null
Timothy J. Baek's avatar
Timothy J. Baek committed
33
	};
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
34
35
36

	let customFieldName = '';
	let customFieldValue = '';
Timothy J. Baek's avatar
Timothy J. Baek committed
37
38
39
40

	$: if (params) {
		dispatch('change', params);
	}
Timothy J. Baek's avatar
Timothy J. Baek committed
41
42
</script>

Timothy J. Baek's avatar
Timothy J. Baek committed
43
<div class=" space-y-1 text-xs">
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
44
45
46
47
48
	<div class=" py-0.5 w-full justify-between">
		<div class="flex w-full justify-between">
			<div class=" self-center text-xs font-medium">{$i18n.t('Seed')}</div>

			<button
49
				class="p-1 px-3 text-xs flex rounded transition flex-shrink-0 outline-none"
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
50
51
52
53
54
55
56
57
58
59
60
				type="button"
				on:click={() => {
					params.seed = (params?.seed ?? null) === null ? 0 : null;
				}}
			>
				{#if (params?.seed ?? null) === null}
					<span class="ml-2 self-center"> {$i18n.t('Default')} </span>
				{:else}
					<span class="ml-2 self-center"> {$i18n.t('Custom')} </span>
				{/if}
			</button>
Timothy J. Baek's avatar
Timothy J. Baek committed
61
62
		</div>

Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
63
64
65
66
67
68
69
70
71
72
73
74
		{#if (params?.seed ?? null) !== null}
			<div class="flex mt-0.5 space-x-2">
				<div class=" flex-1">
					<input
						class="w-full rounded-lg py-2 px-4 text-sm dark:text-gray-300 dark:bg-gray-850 outline-none"
						type="number"
						placeholder="Enter Seed"
						bind:value={params.seed}
						autocomplete="off"
						min="0"
					/>
				</div>
Timothy J. Baek's avatar
Timothy J. Baek committed
75
			</div>
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
76
77
78
79
80
81
82
83
		{/if}
	</div>

	<div class=" py-0.5 w-full justify-between">
		<div class="flex w-full justify-between">
			<div class=" self-center text-xs font-medium">{$i18n.t('Stop Sequence')}</div>

			<button
84
				class="p-1 px-3 text-xs flex rounded transition flex-shrink-0 outline-none"
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
85
86
87
88
89
90
91
92
93
94
95
				type="button"
				on:click={() => {
					params.stop = (params?.stop ?? null) === null ? '' : null;
				}}
			>
				{#if (params?.stop ?? null) === null}
					<span class="ml-2 self-center"> {$i18n.t('Default')} </span>
				{:else}
					<span class="ml-2 self-center"> {$i18n.t('Custom')} </span>
				{/if}
			</button>
Timothy J. Baek's avatar
Timothy J. Baek committed
96
		</div>
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
97
98
99
100
101
102
103
104
105
106
107
108
109
110

		{#if (params?.stop ?? null) !== null}
			<div class="flex mt-0.5 space-x-2">
				<div class=" flex-1">
					<input
						class="w-full rounded-lg py-2 px-4 text-sm dark:text-gray-300 dark:bg-gray-850 outline-none"
						type="text"
						placeholder={$i18n.t('Enter stop sequence')}
						bind:value={params.stop}
						autocomplete="off"
					/>
				</div>
			</div>
		{/if}
Timothy J. Baek's avatar
Timothy J. Baek committed
111
112
113
114
	</div>

	<div class=" py-0.5 w-full justify-between">
		<div class="flex w-full justify-between">
115
			<div class=" self-center text-xs font-medium">{$i18n.t('Temperature')}</div>
Timothy J. Baek's avatar
Timothy J. Baek committed
116
117

			<button
118
				class="p-1 px-3 text-xs flex rounded transition flex-shrink-0 outline-none"
Timothy J. Baek's avatar
Timothy J. Baek committed
119
120
				type="button"
				on:click={() => {
Timothy J. Baek's avatar
Timothy J. Baek committed
121
					params.temperature = (params?.temperature ?? null) === null ? 0.8 : null;
Timothy J. Baek's avatar
Timothy J. Baek committed
122
123
				}}
			>
Timothy J. Baek's avatar
Timothy J. Baek committed
124
				{#if (params?.temperature ?? null) === null}
125
					<span class="ml-2 self-center"> {$i18n.t('Default')} </span>
Timothy J. Baek's avatar
Timothy J. Baek committed
126
				{:else}
127
					<span class="ml-2 self-center"> {$i18n.t('Custom')} </span>
Timothy J. Baek's avatar
Timothy J. Baek committed
128
129
130
131
				{/if}
			</button>
		</div>

Timothy J. Baek's avatar
Timothy J. Baek committed
132
		{#if (params?.temperature ?? null) !== null}
Timothy J. Baek's avatar
Timothy J. Baek committed
133
134
135
136
137
138
139
140
			<div class="flex mt-0.5 space-x-2">
				<div class=" flex-1">
					<input
						id="steps-range"
						type="range"
						min="0"
						max="1"
						step="0.05"
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
141
						bind:value={params.temperature}
Timothy J. Baek's avatar
Timothy J. Baek committed
142
143
144
145
146
						class="w-full h-2 rounded-lg appearance-none cursor-pointer dark:bg-gray-700"
					/>
				</div>
				<div>
					<input
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
147
						bind:value={params.temperature}
Timothy J. Baek's avatar
Timothy J. Baek committed
148
149
150
151
						type="number"
						class=" bg-transparent text-center w-14"
						min="0"
						max="1"
Timothy J. Baek's avatar
Timothy J. Baek committed
152
						step="any"
Timothy J. Baek's avatar
Timothy J. Baek committed
153
154
155
156
157
158
159
160
					/>
				</div>
			</div>
		{/if}
	</div>

	<div class=" py-0.5 w-full justify-between">
		<div class="flex w-full justify-between">
161
			<div class=" self-center text-xs font-medium">{$i18n.t('Mirostat')}</div>
Timothy J. Baek's avatar
Timothy J. Baek committed
162
163

			<button
164
				class="p-1 px-3 text-xs flex rounded transition flex-shrink-0 outline-none"
Timothy J. Baek's avatar
Timothy J. Baek committed
165
166
				type="button"
				on:click={() => {
Timothy J. Baek's avatar
Timothy J. Baek committed
167
					params.mirostat = (params?.mirostat ?? null) === null ? 0 : null;
Timothy J. Baek's avatar
Timothy J. Baek committed
168
169
				}}
			>
Timothy J. Baek's avatar
Timothy J. Baek committed
170
				{#if (params?.mirostat ?? null) === null}
171
					<span class="ml-2 self-center">{$i18n.t('Default')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
172
				{:else}
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
173
					<span class="ml-2 self-center">{$i18n.t('Custom')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
174
175
176
177
				{/if}
			</button>
		</div>

Timothy J. Baek's avatar
Timothy J. Baek committed
178
		{#if (params?.mirostat ?? null) !== null}
Timothy J. Baek's avatar
Timothy J. Baek committed
179
180
181
182
183
184
185
186
			<div class="flex mt-0.5 space-x-2">
				<div class=" flex-1">
					<input
						id="steps-range"
						type="range"
						min="0"
						max="2"
						step="1"
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
187
						bind:value={params.mirostat}
Timothy J. Baek's avatar
Timothy J. Baek committed
188
189
190
191
192
						class="w-full h-2 rounded-lg appearance-none cursor-pointer dark:bg-gray-700"
					/>
				</div>
				<div>
					<input
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
193
						bind:value={params.mirostat}
Timothy J. Baek's avatar
Timothy J. Baek committed
194
195
196
197
198
199
200
201
202
203
204
205
206
						type="number"
						class=" bg-transparent text-center w-14"
						min="0"
						max="2"
						step="1"
					/>
				</div>
			</div>
		{/if}
	</div>

	<div class=" py-0.5 w-full justify-between">
		<div class="flex w-full justify-between">
207
			<div class=" self-center text-xs font-medium">{$i18n.t('Mirostat Eta')}</div>
Timothy J. Baek's avatar
Timothy J. Baek committed
208
209

			<button
210
				class="p-1 px-3 text-xs flex rounded transition flex-shrink-0 outline-none"
Timothy J. Baek's avatar
Timothy J. Baek committed
211
212
				type="button"
				on:click={() => {
Timothy J. Baek's avatar
Timothy J. Baek committed
213
					params.mirostat_eta = (params?.mirostat_eta ?? null) === null ? 0.1 : null;
Timothy J. Baek's avatar
Timothy J. Baek committed
214
215
				}}
			>
Timothy J. Baek's avatar
Timothy J. Baek committed
216
				{#if (params?.mirostat_eta ?? null) === null}
217
					<span class="ml-2 self-center">{$i18n.t('Default')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
218
				{:else}
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
219
					<span class="ml-2 self-center">{$i18n.t('Custom')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
220
221
222
223
				{/if}
			</button>
		</div>

Timothy J. Baek's avatar
Timothy J. Baek committed
224
		{#if (params?.mirostat_eta ?? null) !== null}
Timothy J. Baek's avatar
Timothy J. Baek committed
225
226
227
228
229
230
231
232
			<div class="flex mt-0.5 space-x-2">
				<div class=" flex-1">
					<input
						id="steps-range"
						type="range"
						min="0"
						max="1"
						step="0.05"
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
233
						bind:value={params.mirostat_eta}
Timothy J. Baek's avatar
Timothy J. Baek committed
234
235
236
237
238
						class="w-full h-2 rounded-lg appearance-none cursor-pointer dark:bg-gray-700"
					/>
				</div>
				<div>
					<input
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
239
						bind:value={params.mirostat_eta}
Timothy J. Baek's avatar
Timothy J. Baek committed
240
241
242
243
						type="number"
						class=" bg-transparent text-center w-14"
						min="0"
						max="1"
Timothy J. Baek's avatar
Timothy J. Baek committed
244
						step="any"
Timothy J. Baek's avatar
Timothy J. Baek committed
245
246
247
248
249
250
251
252
					/>
				</div>
			</div>
		{/if}
	</div>

	<div class=" py-0.5 w-full justify-between">
		<div class="flex w-full justify-between">
253
			<div class=" self-center text-xs font-medium">{$i18n.t('Mirostat Tau')}</div>
Timothy J. Baek's avatar
Timothy J. Baek committed
254
255

			<button
256
				class="p-1 px-3 text-xs flex rounded transition flex-shrink-0 outline-none"
Timothy J. Baek's avatar
Timothy J. Baek committed
257
258
				type="button"
				on:click={() => {
Timothy J. Baek's avatar
Timothy J. Baek committed
259
					params.mirostat_tau = (params?.mirostat_tau ?? null) === null ? 5.0 : null;
Timothy J. Baek's avatar
Timothy J. Baek committed
260
261
				}}
			>
Timothy J. Baek's avatar
Timothy J. Baek committed
262
				{#if (params?.mirostat_tau ?? null) === null}
263
					<span class="ml-2 self-center">{$i18n.t('Default')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
264
				{:else}
265
					<span class="ml-2 self-center">{$i18n.t('Custom')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
266
267
268
269
				{/if}
			</button>
		</div>

Timothy J. Baek's avatar
Timothy J. Baek committed
270
		{#if (params?.mirostat_tau ?? null) !== null}
Timothy J. Baek's avatar
Timothy J. Baek committed
271
272
273
274
275
276
277
278
			<div class="flex mt-0.5 space-x-2">
				<div class=" flex-1">
					<input
						id="steps-range"
						type="range"
						min="0"
						max="10"
						step="0.5"
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
279
						bind:value={params.mirostat_tau}
Timothy J. Baek's avatar
Timothy J. Baek committed
280
281
282
283
284
						class="w-full h-2 rounded-lg appearance-none cursor-pointer dark:bg-gray-700"
					/>
				</div>
				<div>
					<input
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
285
						bind:value={params.mirostat_tau}
Timothy J. Baek's avatar
Timothy J. Baek committed
286
287
288
289
						type="number"
						class=" bg-transparent text-center w-14"
						min="0"
						max="10"
Timothy J. Baek's avatar
Timothy J. Baek committed
290
						step="any"
Timothy J. Baek's avatar
Timothy J. Baek committed
291
292
293
294
295
296
297
298
					/>
				</div>
			</div>
		{/if}
	</div>

	<div class=" py-0.5 w-full justify-between">
		<div class="flex w-full justify-between">
299
			<div class=" self-center text-xs font-medium">{$i18n.t('Top K')}</div>
Timothy J. Baek's avatar
Timothy J. Baek committed
300
301

			<button
302
				class="p-1 px-3 text-xs flex rounded transition flex-shrink-0 outline-none"
Timothy J. Baek's avatar
Timothy J. Baek committed
303
304
				type="button"
				on:click={() => {
Timothy J. Baek's avatar
Timothy J. Baek committed
305
					params.top_k = (params?.top_k ?? null) === null ? 40 : null;
Timothy J. Baek's avatar
Timothy J. Baek committed
306
307
				}}
			>
Timothy J. Baek's avatar
Timothy J. Baek committed
308
				{#if (params?.top_k ?? null) === null}
309
					<span class="ml-2 self-center">{$i18n.t('Default')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
310
				{:else}
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
311
					<span class="ml-2 self-center">{$i18n.t('Custom')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
312
313
314
315
				{/if}
			</button>
		</div>

Timothy J. Baek's avatar
Timothy J. Baek committed
316
		{#if (params?.top_k ?? null) !== null}
Timothy J. Baek's avatar
Timothy J. Baek committed
317
318
319
320
321
322
323
324
			<div class="flex mt-0.5 space-x-2">
				<div class=" flex-1">
					<input
						id="steps-range"
						type="range"
						min="0"
						max="100"
						step="0.5"
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
325
						bind:value={params.top_k}
Timothy J. Baek's avatar
Timothy J. Baek committed
326
327
328
329
330
						class="w-full h-2 rounded-lg appearance-none cursor-pointer dark:bg-gray-700"
					/>
				</div>
				<div>
					<input
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
331
						bind:value={params.top_k}
Timothy J. Baek's avatar
Timothy J. Baek committed
332
333
334
335
						type="number"
						class=" bg-transparent text-center w-14"
						min="0"
						max="100"
Timothy J. Baek's avatar
Timothy J. Baek committed
336
						step="any"
Timothy J. Baek's avatar
Timothy J. Baek committed
337
338
339
340
341
342
343
344
					/>
				</div>
			</div>
		{/if}
	</div>

	<div class=" py-0.5 w-full justify-between">
		<div class="flex w-full justify-between">
345
			<div class=" self-center text-xs font-medium">{$i18n.t('Top P')}</div>
Timothy J. Baek's avatar
Timothy J. Baek committed
346
347

			<button
348
				class="p-1 px-3 text-xs flex rounded transition flex-shrink-0 outline-none"
Timothy J. Baek's avatar
Timothy J. Baek committed
349
350
				type="button"
				on:click={() => {
Timothy J. Baek's avatar
Timothy J. Baek committed
351
					params.top_p = (params?.top_p ?? null) === null ? 0.9 : null;
Timothy J. Baek's avatar
Timothy J. Baek committed
352
353
				}}
			>
Timothy J. Baek's avatar
Timothy J. Baek committed
354
				{#if (params?.top_p ?? null) === null}
355
					<span class="ml-2 self-center">{$i18n.t('Default')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
356
				{:else}
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
357
					<span class="ml-2 self-center">{$i18n.t('Custom')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
358
359
360
361
				{/if}
			</button>
		</div>

Timothy J. Baek's avatar
Timothy J. Baek committed
362
		{#if (params?.top_p ?? null) !== null}
Timothy J. Baek's avatar
Timothy J. Baek committed
363
364
365
366
367
368
369
370
			<div class="flex mt-0.5 space-x-2">
				<div class=" flex-1">
					<input
						id="steps-range"
						type="range"
						min="0"
						max="1"
						step="0.05"
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
371
						bind:value={params.top_p}
Timothy J. Baek's avatar
Timothy J. Baek committed
372
373
374
375
376
						class="w-full h-2 rounded-lg appearance-none cursor-pointer dark:bg-gray-700"
					/>
				</div>
				<div>
					<input
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
377
						bind:value={params.top_p}
Timothy J. Baek's avatar
Timothy J. Baek committed
378
379
380
381
						type="number"
						class=" bg-transparent text-center w-14"
						min="0"
						max="1"
Timothy J. Baek's avatar
Timothy J. Baek committed
382
						step="any"
Timothy J. Baek's avatar
Timothy J. Baek committed
383
384
385
386
387
388
					/>
				</div>
			</div>
		{/if}
	</div>

Timothy J. Baek's avatar
Timothy J. Baek committed
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
	<div class=" py-0.5 w-full justify-between">
		<div class="flex w-full justify-between">
			<div class=" self-center text-xs font-medium">{$i18n.t('Min P')}</div>

			<button
				class="p-1 px-3 text-xs flex rounded transition flex-shrink-0 outline-none"
				type="button"
				on:click={() => {
					params.min_p = (params?.min_p ?? null) === null ? 0.0 : null;
				}}
			>
				{#if (params?.min_p ?? null) === null}
					<span class="ml-2 self-center">{$i18n.t('Default')}</span>
				{:else}
					<span class="ml-2 self-center">{$i18n.t('Custom')}</span>
				{/if}
			</button>
		</div>

		{#if (params?.min_p ?? null) !== null}
			<div class="flex mt-0.5 space-x-2">
				<div class=" flex-1">
					<input
						id="steps-range"
						type="range"
						min="0"
						max="1"
						step="0.05"
						bind:value={params.min_p}
						class="w-full h-2 rounded-lg appearance-none cursor-pointer dark:bg-gray-700"
					/>
				</div>
				<div>
					<input
						bind:value={params.min_p}
						type="number"
						class=" bg-transparent text-center w-14"
						min="0"
						max="1"
						step="any"
					/>
				</div>
			</div>
		{/if}
	</div>

Timothy J. Baek's avatar
Timothy J. Baek committed
435
436
	<div class=" py-0.5 w-full justify-between">
		<div class="flex w-full justify-between">
Timothy J. Baek's avatar
Timothy J. Baek committed
437
			<div class=" self-center text-xs font-medium">{$i18n.t('Frequency Penalty')}</div>
Timothy J. Baek's avatar
Timothy J. Baek committed
438
439

			<button
440
				class="p-1 px-3 text-xs flex rounded transition flex-shrink-0 outline-none"
Timothy J. Baek's avatar
Timothy J. Baek committed
441
442
				type="button"
				on:click={() => {
Timothy J. Baek's avatar
Timothy J. Baek committed
443
					params.frequency_penalty = (params?.frequency_penalty ?? null) === null ? 1.1 : null;
Timothy J. Baek's avatar
Timothy J. Baek committed
444
445
				}}
			>
Timothy J. Baek's avatar
Timothy J. Baek committed
446
				{#if (params?.frequency_penalty ?? null) === null}
447
					<span class="ml-2 self-center">{$i18n.t('Default')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
448
				{:else}
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
449
					<span class="ml-2 self-center">{$i18n.t('Custom')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
450
451
452
453
				{/if}
			</button>
		</div>

Timothy J. Baek's avatar
Timothy J. Baek committed
454
		{#if (params?.frequency_penalty ?? null) !== null}
Timothy J. Baek's avatar
Timothy J. Baek committed
455
456
457
458
459
460
461
462
			<div class="flex mt-0.5 space-x-2">
				<div class=" flex-1">
					<input
						id="steps-range"
						type="range"
						min="0"
						max="2"
						step="0.05"
463
						bind:value={params.frequency_penalty}
Timothy J. Baek's avatar
Timothy J. Baek committed
464
465
466
467
468
						class="w-full h-2 rounded-lg appearance-none cursor-pointer dark:bg-gray-700"
					/>
				</div>
				<div>
					<input
469
						bind:value={params.frequency_penalty}
Timothy J. Baek's avatar
Timothy J. Baek committed
470
471
472
473
						type="number"
						class=" bg-transparent text-center w-14"
						min="0"
						max="2"
Timothy J. Baek's avatar
Timothy J. Baek committed
474
						step="any"
Timothy J. Baek's avatar
Timothy J. Baek committed
475
476
477
478
479
480
481
482
					/>
				</div>
			</div>
		{/if}
	</div>

	<div class=" py-0.5 w-full justify-between">
		<div class="flex w-full justify-between">
483
			<div class=" self-center text-xs font-medium">{$i18n.t('Repeat Last N')}</div>
Timothy J. Baek's avatar
Timothy J. Baek committed
484
485

			<button
486
				class="p-1 px-3 text-xs flex rounded transition flex-shrink-0 outline-none"
Timothy J. Baek's avatar
Timothy J. Baek committed
487
488
				type="button"
				on:click={() => {
Timothy J. Baek's avatar
Timothy J. Baek committed
489
					params.repeat_last_n = (params?.repeat_last_n ?? null) === null ? 64 : null;
Timothy J. Baek's avatar
Timothy J. Baek committed
490
491
				}}
			>
Timothy J. Baek's avatar
Timothy J. Baek committed
492
				{#if (params?.repeat_last_n ?? null) === null}
493
					<span class="ml-2 self-center">{$i18n.t('Default')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
494
				{:else}
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
495
					<span class="ml-2 self-center">{$i18n.t('Custom')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
496
497
498
499
				{/if}
			</button>
		</div>

Timothy J. Baek's avatar
Timothy J. Baek committed
500
		{#if (params?.repeat_last_n ?? null) !== null}
Timothy J. Baek's avatar
Timothy J. Baek committed
501
502
503
504
505
506
507
508
			<div class="flex mt-0.5 space-x-2">
				<div class=" flex-1">
					<input
						id="steps-range"
						type="range"
						min="-1"
						max="128"
						step="1"
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
509
						bind:value={params.repeat_last_n}
Timothy J. Baek's avatar
Timothy J. Baek committed
510
511
512
513
514
						class="w-full h-2 rounded-lg appearance-none cursor-pointer dark:bg-gray-700"
					/>
				</div>
				<div>
					<input
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
515
						bind:value={params.repeat_last_n}
Timothy J. Baek's avatar
Timothy J. Baek committed
516
517
518
519
520
521
522
523
524
525
526
527
528
						type="number"
						class=" bg-transparent text-center w-14"
						min="-1"
						max="128"
						step="1"
					/>
				</div>
			</div>
		{/if}
	</div>

	<div class=" py-0.5 w-full justify-between">
		<div class="flex w-full justify-between">
529
			<div class=" self-center text-xs font-medium">{$i18n.t('Tfs Z')}</div>
Timothy J. Baek's avatar
Timothy J. Baek committed
530
531

			<button
532
				class="p-1 px-3 text-xs flex rounded transition flex-shrink-0 outline-none"
Timothy J. Baek's avatar
Timothy J. Baek committed
533
534
				type="button"
				on:click={() => {
Timothy J. Baek's avatar
Timothy J. Baek committed
535
					params.tfs_z = (params?.tfs_z ?? null) === null ? 1 : null;
Timothy J. Baek's avatar
Timothy J. Baek committed
536
537
				}}
			>
Timothy J. Baek's avatar
Timothy J. Baek committed
538
				{#if (params?.tfs_z ?? null) === null}
539
					<span class="ml-2 self-center">{$i18n.t('Default')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
540
				{:else}
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
541
					<span class="ml-2 self-center">{$i18n.t('Custom')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
542
543
544
545
				{/if}
			</button>
		</div>

Timothy J. Baek's avatar
Timothy J. Baek committed
546
		{#if (params?.tfs_z ?? null) !== null}
Timothy J. Baek's avatar
Timothy J. Baek committed
547
548
549
550
551
552
553
554
			<div class="flex mt-0.5 space-x-2">
				<div class=" flex-1">
					<input
						id="steps-range"
						type="range"
						min="0"
						max="2"
						step="0.05"
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
555
						bind:value={params.tfs_z}
Timothy J. Baek's avatar
Timothy J. Baek committed
556
557
558
559
560
						class="w-full h-2 rounded-lg appearance-none cursor-pointer dark:bg-gray-700"
					/>
				</div>
				<div>
					<input
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
561
						bind:value={params.tfs_z}
Timothy J. Baek's avatar
Timothy J. Baek committed
562
563
564
565
						type="number"
						class=" bg-transparent text-center w-14"
						min="0"
						max="2"
Timothy J. Baek's avatar
Timothy J. Baek committed
566
						step="any"
Timothy J. Baek's avatar
Timothy J. Baek committed
567
568
569
570
571
572
573
574
					/>
				</div>
			</div>
		{/if}
	</div>

	<div class=" py-0.5 w-full justify-between">
		<div class="flex w-full justify-between">
575
			<div class=" self-center text-xs font-medium">{$i18n.t('Context Length')}</div>
Timothy J. Baek's avatar
Timothy J. Baek committed
576
577

			<button
578
				class="p-1 px-3 text-xs flex rounded transition flex-shrink-0 outline-none"
Timothy J. Baek's avatar
Timothy J. Baek committed
579
580
				type="button"
				on:click={() => {
Timothy J. Baek's avatar
Timothy J. Baek committed
581
					params.num_ctx = (params?.num_ctx ?? null) === null ? 2048 : null;
Timothy J. Baek's avatar
Timothy J. Baek committed
582
583
				}}
			>
Timothy J. Baek's avatar
Timothy J. Baek committed
584
				{#if (params?.num_ctx ?? null) === null}
585
					<span class="ml-2 self-center">{$i18n.t('Default')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
586
				{:else}
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
587
					<span class="ml-2 self-center">{$i18n.t('Custom')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
588
589
590
591
				{/if}
			</button>
		</div>

Timothy J. Baek's avatar
Timothy J. Baek committed
592
		{#if (params?.num_ctx ?? null) !== null}
Timothy J. Baek's avatar
Timothy J. Baek committed
593
594
595
596
597
			<div class="flex mt-0.5 space-x-2">
				<div class=" flex-1">
					<input
						id="steps-range"
						type="range"
Timothy J. Baek's avatar
Timothy J. Baek committed
598
						min="-1"
Timothy J. Baek's avatar
Timothy J. Baek committed
599
						max="10240000"
Timothy J. Baek's avatar
Timothy J. Baek committed
600
						step="1"
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
601
						bind:value={params.num_ctx}
Timothy J. Baek's avatar
Timothy J. Baek committed
602
603
604
605
606
						class="w-full h-2 rounded-lg appearance-none cursor-pointer dark:bg-gray-700"
					/>
				</div>
				<div class="">
					<input
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
607
						bind:value={params.num_ctx}
Timothy J. Baek's avatar
Timothy J. Baek committed
608
609
						type="number"
						class=" bg-transparent text-center w-14"
Timothy J. Baek's avatar
Timothy J. Baek committed
610
						min="-1"
Timothy J. Baek's avatar
Timothy J. Baek committed
611
						step="1"
Timothy J. Baek's avatar
Timothy J. Baek committed
612
613
614
615
616
					/>
				</div>
			</div>
		{/if}
	</div>
617

Sam McLeod's avatar
Sam McLeod committed
618
619
620
621
622
	<div class=" py-0.5 w-full justify-between">
		<div class="flex w-full justify-between">
			<div class=" self-center text-xs font-medium">{$i18n.t('Batch Size (num_batch)')}</div>

			<button
623
				class="p-1 px-3 text-xs flex rounded transition flex-shrink-0 outline-none"
Sam McLeod's avatar
Sam McLeod committed
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
				type="button"
				on:click={() => {
					params.num_batch = (params?.num_batch ?? null) === null ? 512 : null;
				}}
			>
				{#if (params?.num_batch ?? null) === null}
					<span class="ml-2 self-center">{$i18n.t('Default')}</span>
				{:else}
					<span class="ml-2 self-center">{$i18n.t('Custom')}</span>
				{/if}
			</button>
		</div>

		{#if (params?.num_batch ?? null) !== null}
			<div class="flex mt-0.5 space-x-2">
				<div class=" flex-1">
					<input
						id="steps-range"
						type="range"
						min="256"
						max="8192"
						step="256"
						bind:value={params.num_batch}
						class="w-full h-2 rounded-lg appearance-none cursor-pointer dark:bg-gray-700"
					/>
				</div>
				<div class="">
					<input
						bind:value={params.num_batch}
						type="number"
						class=" bg-transparent text-center w-14"
						min="256"
						step="256"
					/>
				</div>
			</div>
		{/if}
	</div>

	<div class=" py-0.5 w-full justify-between">
		<div class="flex w-full justify-between">
			<div class=" self-center text-xs font-medium">
				{$i18n.t('Tokens To Keep On Context Refresh (num_keep)')}
			</div>

			<button
670
				class="p-1 px-3 text-xs flex rounded transition flex-shrink-0 outline-none"
Sam McLeod's avatar
Sam McLeod committed
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
				type="button"
				on:click={() => {
					params.num_keep = (params?.num_keep ?? null) === null ? 24 : null;
				}}
			>
				{#if (params?.num_keep ?? null) === null}
					<span class="ml-2 self-center">{$i18n.t('Default')}</span>
				{:else}
					<span class="ml-2 self-center">{$i18n.t('Custom')}</span>
				{/if}
			</button>
		</div>

		{#if (params?.num_keep ?? null) !== null}
			<div class="flex mt-0.5 space-x-2">
				<div class=" flex-1">
					<input
						id="steps-range"
						type="range"
						min="-1"
						max="10240000"
						step="1"
						bind:value={params.num_keep}
						class="w-full h-2 rounded-lg appearance-none cursor-pointer dark:bg-gray-700"
					/>
				</div>
				<div class="">
					<input
						bind:value={params.num_keep}
						type="number"
						class=" bg-transparent text-center w-14"
						min="-1"
						step="1"
					/>
				</div>
			</div>
		{/if}
	</div>

Timothy J. Baek's avatar
Timothy J. Baek committed
710
711
	<div class=" py-0.5 w-full justify-between">
		<div class="flex w-full justify-between">
712
			<div class=" self-center text-xs font-medium">{$i18n.t('Max Tokens (num_predict)')}</div>
Timothy J. Baek's avatar
Timothy J. Baek committed
713
714

			<button
715
				class="p-1 px-3 text-xs flex rounded transition flex-shrink-0 outline-none"
Timothy J. Baek's avatar
Timothy J. Baek committed
716
717
				type="button"
				on:click={() => {
Timothy J. Baek's avatar
Timothy J. Baek committed
718
					params.max_tokens = (params?.max_tokens ?? null) === null ? 128 : null;
Timothy J. Baek's avatar
Timothy J. Baek committed
719
720
				}}
			>
Timothy J. Baek's avatar
Timothy J. Baek committed
721
				{#if (params?.max_tokens ?? null) === null}
722
					<span class="ml-2 self-center">{$i18n.t('Default')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
723
				{:else}
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
724
					<span class="ml-2 self-center">{$i18n.t('Custom')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
725
726
727
728
				{/if}
			</button>
		</div>

Timothy J. Baek's avatar
Timothy J. Baek committed
729
		{#if (params?.max_tokens ?? null) !== null}
Timothy J. Baek's avatar
Timothy J. Baek committed
730
731
732
733
734
735
736
737
			<div class="flex mt-0.5 space-x-2">
				<div class=" flex-1">
					<input
						id="steps-range"
						type="range"
						min="-2"
						max="16000"
						step="1"
738
						bind:value={params.max_tokens}
Timothy J. Baek's avatar
Timothy J. Baek committed
739
740
741
742
743
						class="w-full h-2 rounded-lg appearance-none cursor-pointer dark:bg-gray-700"
					/>
				</div>
				<div class="">
					<input
744
						bind:value={params.max_tokens}
Timothy J. Baek's avatar
Timothy J. Baek committed
745
746
747
748
749
750
751
752
753
754
						type="number"
						class=" bg-transparent text-center w-14"
						min="-2"
						max="16000"
						step="1"
					/>
				</div>
			</div>
		{/if}
	</div>
755

Timothy J. Baek's avatar
Timothy J. Baek committed
756
757
758
759
760
761
	{#if admin}
		<div class=" py-0.5 w-full justify-between">
			<div class="flex w-full justify-between">
				<div class=" self-center text-xs font-medium">{$i18n.t('use_mmap (Ollama)')}</div>

				<button
762
					class="p-1 px-3 text-xs flex rounded transition flex-shrink-0 outline-none"
Timothy J. Baek's avatar
Timothy J. Baek committed
763
764
765
766
767
768
769
770
					type="button"
					on:click={() => {
						params.use_mmap = (params?.use_mmap ?? null) === null ? true : null;
					}}
				>
					{#if (params?.use_mmap ?? null) === null}
						<span class="ml-2 self-center">{$i18n.t('Default')}</span>
					{:else}
771
						<span class="ml-2 self-center">{$i18n.t('Custom')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
772
773
774
					{/if}
				</button>
			</div>
775
776
777
778
779
780
781
782
783
784
785
786

			{#if (params?.use_mmap ?? null) !== null}
				<div class="flex justify-between items-center mt-1">
					<div class="text-xs text-gray-500">
						{params.use_mmap ? 'Enabled' : 'Disabled'}
					</div>

					<div class=" pr-2">
						<Switch bind:state={params.use_mmap} />
					</div>
				</div>
			{/if}
787
788
		</div>

Timothy J. Baek's avatar
Timothy J. Baek committed
789
790
791
792
793
		<div class=" py-0.5 w-full justify-between">
			<div class="flex w-full justify-between">
				<div class=" self-center text-xs font-medium">{$i18n.t('use_mlock (Ollama)')}</div>

				<button
794
					class="p-1 px-3 text-xs flex rounded transition flex-shrink-0 outline-none"
Timothy J. Baek's avatar
Timothy J. Baek committed
795
796
797
798
799
800
801
802
					type="button"
					on:click={() => {
						params.use_mlock = (params?.use_mlock ?? null) === null ? true : null;
					}}
				>
					{#if (params?.use_mlock ?? null) === null}
						<span class="ml-2 self-center">{$i18n.t('Default')}</span>
					{:else}
803
						<span class="ml-2 self-center">{$i18n.t('Custom')}</span>
Timothy J. Baek's avatar
Timothy J. Baek committed
804
805
806
					{/if}
				</button>
			</div>
807
808
809
810
811
812
813
814
815
816
817
818

			{#if (params?.use_mlock ?? null) !== null}
				<div class="flex justify-between items-center mt-1">
					<div class="text-xs text-gray-500">
						{params.use_mlock ? 'Enabled' : 'Disabled'}
					</div>

					<div class=" pr-2">
						<Switch bind:state={params.use_mlock} />
					</div>
				</div>
			{/if}
819
820
		</div>

Timothy J. Baek's avatar
Timothy J. Baek committed
821
822
823
824
825
		<div class=" py-0.5 w-full justify-between">
			<div class="flex w-full justify-between">
				<div class=" self-center text-xs font-medium">{$i18n.t('num_thread (Ollama)')}</div>

				<button
826
					class="p-1 px-3 text-xs flex rounded transition flex-shrink-0 outline-none"
Timothy J. Baek's avatar
Timothy J. Baek committed
827
828
829
830
831
832
833
834
835
836
837
838
					type="button"
					on:click={() => {
						params.num_thread = (params?.num_thread ?? null) === null ? 2 : null;
					}}
				>
					{#if (params?.num_thread ?? null) === null}
						<span class="ml-2 self-center">{$i18n.t('Default')}</span>
					{:else}
						<span class="ml-2 self-center">{$i18n.t('Custom')}</span>
					{/if}
				</button>
			</div>
839

Timothy J. Baek's avatar
Timothy J. Baek committed
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
			{#if (params?.num_thread ?? null) !== null}
				<div class="flex mt-0.5 space-x-2">
					<div class=" flex-1">
						<input
							id="steps-range"
							type="range"
							min="1"
							max="256"
							step="1"
							bind:value={params.num_thread}
							class="w-full h-2 rounded-lg appearance-none cursor-pointer dark:bg-gray-700"
						/>
					</div>
					<div class="">
						<input
							bind:value={params.num_thread}
							type="number"
							class=" bg-transparent text-center w-14"
							min="1"
							max="256"
							step="1"
						/>
					</div>
				</div>
			{/if}
865
866
		</div>

Timothy J. Baek's avatar
Timothy J. Baek committed
867
868
869
870
871
		<!-- <div class=" py-0.5 w-full justify-between">
			<div class="flex w-full justify-between">
				<div class=" self-center text-xs font-medium">{$i18n.t('Template')}</div>

				<button
872
					class="p-1 px-3 text-xs flex rounded transition flex-shrink-0 outline-none"
Timothy J. Baek's avatar
Timothy J. Baek committed
873
874
875
876
877
878
879
880
881
882
883
					type="button"
					on:click={() => {
						params.template = (params?.template ?? null) === null ? '' : null;
					}}
				>
					{#if (params?.template ?? null) === null}
						<span class="ml-2 self-center">{$i18n.t('Default')}</span>
					{:else}
						<span class="ml-2 self-center">{$i18n.t('Custom')}</span>
					{/if}
				</button>
884
885
			</div>

Timothy J. Baek's avatar
Timothy J. Baek committed
886
887
888
889
890
891
892
893
894
895
			{#if (params?.template ?? null) !== null}
				<div class="flex mt-0.5 space-x-2">
					<div class=" flex-1">
						<textarea
							class="px-3 py-1.5 text-sm w-full bg-transparent border dark:border-gray-600 outline-none rounded-lg -mb-1"
							placeholder="Write your model template content here"
							rows="4"
							bind:value={params.template}
						/>
					</div>
Timothy J. Baek's avatar
refac  
Timothy J. Baek committed
896
				</div>
Timothy J. Baek's avatar
Timothy J. Baek committed
897
898
899
			{/if}
		</div> -->
	{/if}
Timothy J. Baek's avatar
Timothy J. Baek committed
900
</div>