Skip to content

Commit 0e45c5d

Browse files
deafnvdeafnv
committed
[UI] add toggles for openai tools (#842)
1 parent 4f85544 commit 0e45c5d

File tree

2 files changed

+149
-37
lines changed

2 files changed

+149
-37
lines changed

‎services/app/src/lib/components/tables/(sub)/ColumnSettings.svelte‎

Lines changed: 120 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@
1919
import ModelSelect from '$lib/components/preset/ModelSelect.svelte';
2020
import PromptEditor from '$lib/components/preset/PromptEditor.svelte';
2121
import Range from '$lib/components/Range.svelte';
22+
import Checkbox from '$lib/components/Checkbox.svelte';
2223
import { toast, CustomToastDesc } from '$lib/components/ui/sonner';
2324
import { Label } from '$lib/components/ui/label';
2425
import { Button } from '$lib/components/ui/button';
@@ -343,6 +344,14 @@
343344
) {
344345
selectedGenConfig.max_tokens = modelDetails.context_length;
345346
}
347+
348+
// Removes openai only tools for non-openai models
349+
if (!modelDetails?.id.startsWith('openai/')) {
350+
const filterTools = selectedGenConfig.tools?.filter(
351+
(tool) => !['web_search', 'code_interpreter'].includes(tool.type)
352+
);
353+
selectedGenConfig.tools = filterTools?.length === 0 ? null : filterTools;
354+
}
346355
}}
347356
class="w-64 border-transparent bg-[#F9FAFB] hover:bg-[#e1e2e6] data-dark:bg-[#42464e]"
348357
/>
@@ -669,42 +678,118 @@
669678
/>
670679
</div>
671680

672-
<div class="flex flex-col space-y-1">
673-
<Label class="text-xs sm:text-sm">Reasoning effort</Label>
674-
675-
<Select.Root
676-
allowDeselect
677-
type="single"
678-
bind:value={() => selectedGenConfig.reasoning_effort ?? '',
679-
(v) => (selectedGenConfig.reasoning_effort = v || null)}
680-
>
681-
<Select.Trigger
682-
title="Reasoning effort"
683-
class="mb-1 flex h-10 min-w-full items-center justify-between gap-8 border-transparent bg-[#F2F4F7] pl-3 pr-2 hover:bg-[#e1e2e6] data-dark:bg-[#42464e]"
684-
>
685-
{#snippet children()}
686-
<span
687-
class="line-clamp-1 w-full whitespace-nowrap text-left font-normal capitalize"
688-
>
689-
{selectedGenConfig.reasoning_effort ?? 'Default'}
690-
</span>
691-
{/snippet}
692-
</Select.Trigger>
693-
<Select.Content
694-
data-testid="org-plan-select-list"
695-
class="max-h-64 overflow-y-auto"
681+
{#if $modelsAvailable
682+
.find((val) => val.id == selectedGenConfig.model)
683+
?.capabilities.includes('reasoning')}
684+
<div class="flex flex-col space-y-1">
685+
<Label class="text-xs sm:text-sm">Reasoning effort</Label>
686+
687+
<Select.Root
688+
allowDeselect
689+
type="single"
690+
bind:value={() => selectedGenConfig.reasoning_effort ?? '',
691+
(v) => (selectedGenConfig.reasoning_effort = v || null)}
696692
>
697-
{#each reasoningEffortEnum as reasoningEffort}
698-
<Select.Item
699-
value={reasoningEffort}
700-
class="flex cursor-pointer justify-between gap-10 capitalize"
701-
>
702-
{reasoningEffort}
703-
</Select.Item>
704-
{/each}
705-
</Select.Content>
706-
</Select.Root>
707-
</div>
693+
<Select.Trigger
694+
title="Reasoning effort"
695+
class="mb-1 flex h-10 min-w-full items-center justify-between gap-8 border-transparent bg-[#F2F4F7] pl-3 pr-2 hover:bg-[#e1e2e6] data-dark:bg-[#42464e]"
696+
>
697+
{#snippet children()}
698+
<span
699+
class="line-clamp-1 w-full whitespace-nowrap text-left font-normal capitalize"
700+
>
701+
{selectedGenConfig.reasoning_effort ?? 'Default'}
702+
</span>
703+
{/snippet}
704+
</Select.Trigger>
705+
<Select.Content
706+
data-testid="org-plan-select-list"
707+
class="max-h-64 overflow-y-auto"
708+
>
709+
{#each reasoningEffortEnum as reasoningEffort}
710+
<Select.Item
711+
value={reasoningEffort}
712+
class="flex cursor-pointer justify-between gap-10 capitalize"
713+
>
714+
{reasoningEffort}
715+
</Select.Item>
716+
{/each}
717+
</Select.Content>
718+
</Select.Root>
719+
</div>
720+
{/if}
721+
722+
{#if selectedGenConfig.model?.startsWith('openai/')}
723+
<div class="flex flex-col gap-2 space-y-1">
724+
<Label class="text-xs sm:text-sm">OpenAI Tools</Label>
725+
726+
<div class="flex items-center gap-2 pl-1">
727+
<Checkbox
728+
disabled={readonly}
729+
id="openai-tool-websearch"
730+
name="openai-tool-websearch"
731+
class="[&>svg]:h-3 [&>svg]:w-3 [&>svg]:translate-x-[1px]"
732+
bind:checked={() =>
733+
!!selectedGenConfig.tools?.find(
734+
(tool) => tool.type === 'web_search'
735+
),
736+
() => {
737+
if (
738+
selectedGenConfig.tools?.find(
739+
(tool) => tool.type === 'web_search'
740+
)
741+
) {
742+
const filterTools = selectedGenConfig.tools.filter(
743+
(tool) => tool.type !== 'web_search'
744+
);
745+
selectedGenConfig.tools =
746+
filterTools.length === 0 ? null : filterTools;
747+
} else {
748+
selectedGenConfig.tools = [
749+
...(selectedGenConfig.tools ?? []),
750+
{ type: 'web_search' }
751+
];
752+
}
753+
}}
754+
/>
755+
756+
<Label for="openai-tool-websearch">Web Search</Label>
757+
</div>
758+
759+
<div class="flex items-center gap-2 pl-1">
760+
<Checkbox
761+
disabled={readonly}
762+
id="openai-tool-codeinterpreter"
763+
name="openai-tool-codeinterpreter"
764+
class="[&>svg]:h-3 [&>svg]:w-3 [&>svg]:translate-x-[1px]"
765+
bind:checked={() =>
766+
!!selectedGenConfig.tools?.find(
767+
(tool) => tool.type === 'code_interpreter'
768+
),
769+
() => {
770+
if (
771+
selectedGenConfig.tools?.find(
772+
(tool) => tool.type === 'code_interpreter'
773+
)
774+
) {
775+
const filterTools = selectedGenConfig.tools.filter(
776+
(tool) => tool.type !== 'code_interpreter'
777+
);
778+
selectedGenConfig.tools =
779+
filterTools.length === 0 ? null : filterTools;
780+
} else {
781+
selectedGenConfig.tools = [
782+
...(selectedGenConfig.tools ?? []),
783+
{ type: 'code_interpreter' }
784+
];
785+
}
786+
}}
787+
/>
788+
789+
<Label for="openai-tool-codeinterpreter">Code Interpreter</Label>
790+
</div>
791+
</div>
792+
{/if}
708793
</div>
709794
</div>
710795
</div>

‎services/app/src/lib/types.ts‎

Lines changed: 29 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import type { AxiosRequestConfig } from 'axios';
22
import type { Component } from 'svelte';
33
import { z } from 'zod';
4-
import type { genTableDTypes, userRoles } from './constants';
4+
import type { genTableDTypes, MODEL_CAPABILITIES, userRoles } from './constants';
55

66
export type AvailableModel = {
77
id: string;
@@ -21,7 +21,7 @@ export type ModelConfig = {
2121
type: 'completion' | 'llm' | 'embed' | 'rerank';
2222
name: string;
2323
owned_by: string | null;
24-
capabilities: ('completion' | 'chat' | 'tool' | 'image' | 'audio' | 'embed' | 'rerank')[];
24+
capabilities: (typeof MODEL_CAPABILITIES)[number][];
2525
context_length: number;
2626
languages: string[];
2727
max_output_tokens: number | null;
@@ -232,6 +232,32 @@ export interface PythonGenConfig {
232232
python_code: string;
233233
}
234234

235+
export interface WebSearchTool {
236+
type: 'web_search';
237+
}
238+
export interface CodeInterpreterTool {
239+
type: 'code_interpreter';
240+
container?: {
241+
type: 'auto';
242+
};
243+
}
244+
export interface FunctionTool {
245+
type: 'function';
246+
function: {
247+
name: string;
248+
description?: string | null;
249+
parameters?: {
250+
type: string;
251+
properties: {
252+
type: string;
253+
description: string;
254+
enum: string[];
255+
};
256+
} | null;
257+
strict?: boolean;
258+
};
259+
}
260+
235261
export interface LLMGenConfig {
236262
object: 'gen_config.llm';
237263
model?: string;
@@ -247,6 +273,7 @@ export interface LLMGenConfig {
247273
concat_reranker_input?: boolean;
248274
inline_citations?: boolean;
249275
} | null;
276+
tools?: (WebSearchTool | CodeInterpreterTool | FunctionTool)[] | null;
250277
temperature?: number;
251278
top_p?: number;
252279
stop?: string[] | null;

0 commit comments

Comments
 (0)