diff --git a/studio/frontend/src/features/canvas-lab/components/inline/inline-expression.tsx b/studio/frontend/src/features/canvas-lab/components/inline/inline-expression.tsx index 775c38498d..a50061ca9f 100644 --- a/studio/frontend/src/features/canvas-lab/components/inline/inline-expression.tsx +++ b/studio/frontend/src/features/canvas-lab/components/inline/inline-expression.tsx @@ -1,3 +1,4 @@ +import { Badge } from "@/components/ui/badge"; import { Input } from "@/components/ui/input"; import { Select, @@ -7,7 +8,9 @@ import { SelectValue, } from "@/components/ui/select"; import type { ReactElement } from "react"; +import { useCanvasLabStore } from "../../stores/canvas-lab"; import type { ExpressionConfig, ExpressionDtype } from "../../types"; +import { getAvailableVariables } from "../../utils/variables"; import { InlineField } from "./inline-field"; type InlineExpressionProps = { @@ -21,35 +24,56 @@ export function InlineExpression({ config, onUpdate, }: InlineExpressionProps): ReactElement { + const configs = useCanvasLabStore((state) => state.configs); + const vars = getAvailableVariables(configs, config.id); + return ( -
- - + onUpdate({ dtype: value as ExpressionDtype }) + } + > + + + + + {DTYPE_OPTIONS.map((dtype) => ( + + {dtype} + + ))} + + + + + onUpdate({ expr: event.target.value })} + /> + +
+ {vars.length > 0 && ( +
+

Available references

+
+ {vars.map((v) => ( + + {v} + ))} - - - - - onUpdate({ expr: event.target.value })} - /> - +
+
+ )} ); } diff --git a/studio/frontend/src/features/canvas-lab/dialogs/expression/expression-dialog.tsx b/studio/frontend/src/features/canvas-lab/dialogs/expression/expression-dialog.tsx index 44cb4d8d04..3b3be9c019 100644 --- a/studio/frontend/src/features/canvas-lab/dialogs/expression/expression-dialog.tsx +++ b/studio/frontend/src/features/canvas-lab/dialogs/expression/expression-dialog.tsx @@ -8,6 +8,7 @@ import { import { Textarea } from "@/components/ui/textarea"; import type { ReactElement } from "react"; import type { ExpressionConfig, ExpressionDtype } from "../../types"; +import { AvailableVariables } from "../shared/available-variables"; import { NameField } from "../shared/name-field"; const DTYPE_OPTIONS: ExpressionDtype[] = ["str", "int", "float", "bool"]; @@ -31,6 +32,7 @@ export function ExpressionDialog({ }; return (
+ onUpdate({ name: value })} diff --git a/studio/frontend/src/features/canvas-lab/dialogs/llm/llm-dialog.tsx b/studio/frontend/src/features/canvas-lab/dialogs/llm/llm-dialog.tsx index 9320af9f1b..76963d56ef 100644 --- a/studio/frontend/src/features/canvas-lab/dialogs/llm/llm-dialog.tsx +++ b/studio/frontend/src/features/canvas-lab/dialogs/llm/llm-dialog.tsx @@ -17,7 +17,7 @@ import { import { Textarea } from "@/components/ui/textarea"; import { type ReactElement, useEffect, useRef, useState } from "react"; import type { LlmConfig, Score } from "../../types"; -import { AvailableVariables } from "./available-variables"; +import { AvailableVariables } from "../shared/available-variables"; import { NameField } from "../shared/name-field"; const CODE_LANG_OPTIONS = [ diff --git a/studio/frontend/src/features/canvas-lab/dialogs/processors-dialog.tsx b/studio/frontend/src/features/canvas-lab/dialogs/processors-dialog.tsx index e4416fe6ad..539bdd46cb 100644 --- a/studio/frontend/src/features/canvas-lab/dialogs/processors-dialog.tsx +++ b/studio/frontend/src/features/canvas-lab/dialogs/processors-dialog.tsx @@ -7,6 +7,7 @@ import { VisuallyHidden } from "radix-ui"; import { type ReactElement, useMemo } from "react"; import type { CanvasProcessorConfig } from "../types"; import { buildDefaultSchemaTransform } from "../utils/processors"; +import { AvailableVariables } from "./shared/available-variables"; type ProcessorsDialogProps = { open: boolean; onOpenChange: (open: boolean) => void; @@ -72,7 +73,7 @@ export function ProcessorsDialog({ Processors
-
+

Schema transform

@@ -87,6 +88,7 @@ export function ProcessorsDialog({ {schemaProcessor && (

+