Skip to content

Commit

Permalink
feat: Allow passing run context in UI (#340)
Browse files Browse the repository at this point in the history
  • Loading branch information
@johnjcsmith
johnjcsmith authored Dec 19, 2024
1 parent 8b01ba3 commit 521f264
Show file tree
Hide file tree
Showing 3 changed files with 107 additions and 39 deletions.
28 changes: 19 additions & 9 deletions app/components/chat/prompt-textarea.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,13 +16,14 @@ import { TemplateSearch } from "./template-search";

export type RunConfiguration = {
attachedFunctions: string[];
structuredOutput: string | null;
resultSchema: string | null;
reasoningTraces: boolean;
prompt: string;
template?: {
id: string;
input: Record<string, string>;
};
runContext: string | null;
};

export function PromptTextarea({ clusterId }: { clusterId: string }) {
Expand All @@ -48,14 +49,16 @@ export function PromptTextarea({ clusterId }: { clusterId: string }) {

const [runConfig, setRunConfig] = useState({
attachedFunctions: [] as string[],
structuredOutput: null as string | null,
resultSchema: null as string | null,
reasoningTraces: true,
runContext: null as string | null,
});

const handleConfigChange = (newConfig: {
attachedFunctions: string[];
structuredOutput: string | null;
resultSchema: string | null;
reasoningTraces: boolean;
runContext: string | null;
}) => {
setRunConfig(newConfig);
};
Expand All @@ -80,8 +83,12 @@ export function PromptTextarea({ clusterId }: { clusterId: string }) {
body.initialPrompt = config.prompt.replace(/{{.*?}}/g, "");
}

if (config.structuredOutput) {
body.resultSchema = JSON.parse(config.structuredOutput);
if(config.runContext) {
body.context = JSON.parse(config.runContext);
}

if (config.resultSchema) {
body.resultSchema = JSON.parse(config.resultSchema);
}

if (config.attachedFunctions && config.attachedFunctions.length > 0) {
Expand Down Expand Up @@ -119,8 +126,9 @@ export function PromptTextarea({ clusterId }: { clusterId: string }) {
setStoredInputs({});
setRunConfig({
attachedFunctions: [],
structuredOutput: null,
resultSchema: null,
reasoningTraces: true,
runContext: null
});
}

Expand Down Expand Up @@ -149,9 +157,10 @@ export function PromptTextarea({ clusterId }: { clusterId: string }) {

onSubmit({
attachedFunctions: runConfig.attachedFunctions,
structuredOutput: runConfig.structuredOutput,
resultSchema: runConfig.resultSchema,
reasoningTraces: runConfig.reasoningTraces,
prompt: updatedPrompt,
runContext: runConfig.runContext,
template: selectedTemplate
? {
id: selectedTemplate.id,
Expand All @@ -177,9 +186,10 @@ export function PromptTextarea({ clusterId }: { clusterId: string }) {
}) => {
setRunConfig({
attachedFunctions: template.attachedFunctions,
structuredOutput: template.structuredOutput
resultSchema: template.structuredOutput
? JSON.stringify(template.structuredOutput)
: null,
runContext: null,
reasoningTraces: true,
});
template.initialPrompt && setPrompt(template.initialPrompt);
Expand Down Expand Up @@ -249,7 +259,7 @@ export function PromptTextarea({ clusterId }: { clusterId: string }) {
clusterId={clusterId}
config={{
attachedFunctions: runConfig.attachedFunctions,
structuredOutput: runConfig.structuredOutput,
resultSchema: runConfig.resultSchema,
prompt,
}}
/>
Expand Down
108 changes: 83 additions & 25 deletions app/components/chat/run-config.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,13 +11,15 @@ import { Checkbox } from "../ui/checkbox";
type RunConfigProps = {
config: {
attachedFunctions: string[];
structuredOutput: string | null;
resultSchema: string | null;
reasoningTraces: boolean;
runContext: string | null;
};
onConfigChange: (newConfig: {
attachedFunctions: string[];
structuredOutput: string | null;
resultSchema: string | null;
reasoningTraces: boolean;
runContext: string | null;
}) => void;
};

Expand All @@ -27,36 +29,53 @@ const RunConfig: React.FC<RunConfigProps> = ({ config, onConfigChange }) => {
config.attachedFunctions.filter(Boolean),
);

const [structuredOutput, setStructuredOutput] = useState<string | null>(
config.structuredOutput,

const [runContext, setRunContext] = useState<string | null>(
config.runContext ? JSON.stringify(config.runContext) : null,
);

const [resultSchema, setResultSchema] = useState<string | null>(
config.resultSchema,
);

const [reasoningTraces, setReasoningTraces] = useState(
config.reasoningTraces,
);

const hasConfig = attachedFunctions.length > 0 || !!structuredOutput;
const hasConfig = attachedFunctions.length > 0 || !!resultSchema;

const handleApplyConfig = () => {
if (structuredOutput) {
if (resultSchema) {
try {
JSON.parse(structuredOutput);
setJsonInvalid(false);
JSON.parse(resultSchema);
setResultSchemaJsonInvalid(false);
} catch (e) {
toast.error("Invalid JSON in structured output");
toast.error("Invalid JSON in result schema");
return;
}
}

if (runContext) {
try {
JSON.parse(runContext);
setRunContextJsonInvalid(false);
} catch (e) {
toast.error("Invalid JSON in run context");
return;
}
}

onConfigChange({
attachedFunctions,
structuredOutput,
resultSchema,
reasoningTraces,
runContext,
});
setIsOpen(false);
};

const [jsonInvalid, setJsonInvalid] = useState(false);
const [resultSchemaJsonInvalid, setResultSchemaJsonInvalid] = useState(false);
const [runContextJsonInvalid, setRunContextJsonInvalid] = useState(false);

return (
<Popover open={isOpen} onOpenChange={setIsOpen}>
Expand All @@ -72,6 +91,11 @@ const RunConfig: React.FC<RunConfigProps> = ({ config, onConfigChange }) => {
<PopoverContent className="w-[400px]">
<div className="space-y-4">
<h3 className="font-semibold">Run Configuration</h3>
<p className="text-xs text-gray-500">
<a href="https://docs.inferable.ai/pages/runs#options" className="underline">
Options
</a> to invoke the run with
</p>
<div className="space-x-2 flex flex-row items-center">
<Checkbox
checked={reasoningTraces}
Expand All @@ -91,34 +115,68 @@ const RunConfig: React.FC<RunConfigProps> = ({ config, onConfigChange }) => {
/>
</div>
<div className="space-y-2">
<Label htmlFor="input-structured-output">
Structured Output (JSON Schema)
<Label htmlFor="input-result-schema">
Result Schema (JSON Schema)
</Label>
<p className="text-xs text-gray-500">
A{" "}
<a href="https://docs.inferable.ai/pages/runs#resultschema" className="underline">
Result Schema
</a>{" "}
that the run must return
</p>
<Textarea
id="input-result-schema"
value={resultSchema ?? ""}
onChange={(e) => setResultSchema(e.target.value || null)}
onBlur={() => {
if (resultSchema) {
try {
JSON.parse(resultSchema);
setResultSchemaJsonInvalid(false);
} catch (e) {
setResultSchemaJsonInvalid(true);
}
} else {
setResultSchemaJsonInvalid(false);
}
}}
/>
{resultSchemaJsonInvalid && (
<p className="text-xs text-red-500">Invalid JSON</p>
)}

</div>

<div className="space-y-2">
<Label htmlFor="input-run-context">
Run Context
</Label>
<p className="text-xs text-gray-500">
A{" "}
<a href="https://json-schema.org/" className="underline">
JSON Schema
<a href="https://docs.inferable.ai/pages/runs#context" className="underline">
Run Context
</a>{" "}
that describes the structured output the run must return.
object which is passed to all calls
</p>
<Textarea
id="input-structured-output"
value={structuredOutput ?? ""}
onChange={(e) => setStructuredOutput(e.target.value || null)}
id="input-run-context"
value={runContext ?? ""}
onChange={(e) => setRunContext(e.target.value || null)}
onBlur={() => {
if (structuredOutput) {
if (runContext) {
try {
JSON.parse(structuredOutput);
setJsonInvalid(false);
JSON.parse(runContext);
setRunContextJsonInvalid(false);
} catch (e) {
setJsonInvalid(true);
setRunContextJsonInvalid(true);
}
} else {
setJsonInvalid(false);
setRunContextJsonInvalid(false);
}
}}
/>
{jsonInvalid && (
{runContextJsonInvalid && (
<p className="text-xs text-red-500">Invalid JSON</p>
)}
</div>
Expand Down
10 changes: 5 additions & 5 deletions app/components/chat/sdk-commands.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ type SDKCommandsProps = {
clusterId: string;
config: {
attachedFunctions: string[];
structuredOutput: string | null;
resultSchema: string | null;
prompt: string;
};
};
Expand All @@ -30,9 +30,9 @@ const SDKCommands: React.FC<SDKCommandsProps> = ({ clusterId, config }) => {
message: config.prompt,
};

if (config.structuredOutput) {
if (config.resultSchema) {
body.result = {
schema: config.structuredOutput,
schema: config.resultSchema,
};
}

Expand All @@ -54,8 +54,8 @@ const SDKCommands: React.FC<SDKCommandsProps> = ({ clusterId, config }) => {
command += `\\\n --attachedFunctions '${config.attachedFunctions.join(",")}' `;
}

if (config.structuredOutput) {
command += `\\\n --resultSchema '${JSON.stringify(JSON.parse(config.structuredOutput), null, 2)}' `;
if (config.resultSchema) {
command += `\\\n --resultSchema '${JSON.stringify(JSON.parse(config.resultSchema), null, 2)}' `;
}

command += `"${config.prompt}" `;
Expand Down

0 comments on commit 521f264

Please sign in to comment.