import { Flex, Heading, Text, View } from "@phoenix/components";
import { useEvaluatorStore } from "@phoenix/contexts/EvaluatorContext";
import { ReadOnlyCategoricalConfig } from "./ReadOnlyCategoricalConfig";
import { ReadOnlyContinuousConfig } from "./ReadOnlyContinuousConfig";
/**
* A store-connected wrapper for displaying evaluator output configuration
* in built-in evaluator forms. Uses read-only display for name and values/bounds,
* but allows editing the optimization direction.
*/
export const BuiltInEvaluatorOutputConfig = () => {
const outputConfig = useEvaluatorStore((state) => state.outputConfigs[0]);
if (!outputConfig) {
return null;
}
const isCategorical = "values" in outputConfig;
return (
<View marginBottom="size-200" flex="none">
<Flex direction="column" gap="size-100">
<Heading level={2} weight="heavy">
Evaluator Annotation
</Heading>
<Text color="text-500">
The annotation that this evaluator will create.
</Text>
{isCategorical ? (
<ReadOnlyCategoricalConfig />
) : (
<ReadOnlyContinuousConfig />
)}
</Flex>
</View>
);
};
