diff --git a/agenta-web/src/components/EvaluationTable/ABTestingEvaluationTable.tsx b/agenta-web/src/components/EvaluationTable/ABTestingEvaluationTable.tsx index eb113d2633..25688f7714 100644 --- a/agenta-web/src/components/EvaluationTable/ABTestingEvaluationTable.tsx +++ b/agenta-web/src/components/EvaluationTable/ABTestingEvaluationTable.tsx @@ -1,7 +1,19 @@ import {useState, useEffect} from "react" import type {ColumnType} from "antd/es/table" import {CaretRightOutlined, LineChartOutlined} from "@ant-design/icons" -import {Button, Col, Input, Row, Space, Spin, Table, Typography, message} from "antd" +import { + Button, + Card, + Col, + Input, + Row, + Space, + Spin, + Statistic, + Table, + Typography, + message, +} from "antd" import { updateEvaluationScenario, callVariant, @@ -74,6 +86,19 @@ const useStyles = createUseStyles({ recordInput: { marginBottom: 10, }, + card: { + marginBottom: 20, + }, + statCorrect: { + "& .ant-statistic-content-value": { + color: "#3f8600", + }, + }, + statWrong: { + "& .ant-statistic-content-value": { + color: "#cf1322", + }, + }, }) const ABTestingEvaluationTable: React.FC = ({ @@ -93,6 +118,14 @@ const ABTestingEvaluationTable: React.FC = ({ const [rows, setRows] = useState([]) const [evaluationStatus, setEvaluationStatus] = useState(evaluation.status) const [evaluationResults, setEvaluationResults] = useState(null) + let num_of_rows = evaluationResults?.votes_data.nb_of_rows || 0 + let flag_votes = evaluationResults?.votes_data.flag_votes?.number_of_votes || 0 + let appVariant1 = + evaluationResults?.votes_data?.variants_votes_data?.[evaluation.variants[0]?.variantName] + ?.number_of_votes || 0 + let appVariant2 = + evaluationResults?.votes_data?.variants_votes_data?.[evaluation.variants[1]?.variantName] + ?.number_of_votes || 0 useEffect(() => { if (evaluationScenarios) { @@ -120,7 +153,7 @@ const ABTestingEvaluationTable: React.FC = ({ }) .catch((err) => console.error("Failed to fetch results:", err)) } - }, [evaluationStatus, evaluation.id]) + }, [evaluationStatus, evaluation.id, rows]) const handleVoteClick = (rowIndex: number, vote: string) => { const evaluation_scenario_id = rows[rowIndex].id @@ -192,6 +225,7 @@ const ABTestingEvaluationTable: React.FC = ({ if (idx === columnsDataNames.length - 1) { if (count === 1 || count === rowIndex) { message.success("Evaluation Results Saved") + setEvaluationStatus(EvaluationFlow.EVALUATION_FINISHED) } } } catch (e) { @@ -250,9 +284,6 @@ const ABTestingEvaluationTable: React.FC = ({ {evaluation.testset.name} ) - ), dataIndex: "inputs", @@ -341,12 +372,45 @@ const ABTestingEvaluationTable: React.FC = ({
- exportABTestingEvaluationData(evaluation, rows)} - disabled={evaluationStatus !== EvaluationFlow.EVALUATION_FINISHED} - > - Export results - + + + exportABTestingEvaluationData(evaluation, rows)} + disabled={evaluationStatus !== EvaluationFlow.EVALUATION_FINISHED} + > + Export results + + + + + + + + + + + + + + + + + +