Fix ag-ui-example frontend
This commit is contained in:
Yiorgis Gozadinos
parent
6f36085ac3
commit
abe01e4b99
3 changed files with 105 additions and 85 deletions
11
CHANGELOG.md
11
CHANGELOG.md
|
|
@ -1,6 +1,17 @@
|
||||||
# Changelog
|
# Changelog
|
||||||
## [Unreleased]
|
## [Unreleased]
|
||||||
|
|
||||||
|
### Fixed
|
||||||
|
|
||||||
|
- **LLM Schema Compliance**: Improved prompts to prevent LLMs from returning objects instead of plain strings for `list[str]` fields
|
||||||
|
- All graph prompts now explicitly state that list fields must contain plain strings only
|
||||||
|
- Added missing `query` and `confidence` fields to search agent output format documentation
|
||||||
|
- Fixes validation errors with less capable models that ignore JSON schema constraints
|
||||||
|
- **AG-UI Frontend Types**: Fixed TypeScript interfaces in ag-ui-research example to match backend Python models
|
||||||
|
- `EvaluationResult`: `confidence` → `confidence_score`, `should_continue` → `is_sufficient`, `gaps_identified` → `gaps`, `follow_up_questions` → `new_questions`, added `key_insights`
|
||||||
|
- `ResearchReport`: `question` → `title`, `summary` → `executive_summary`, `findings` → `main_findings`, removed `insights_used`/`methodology`, added `limitations`/`recommendations`/`sources_summary`
|
||||||
|
- Updated Final Report UI to display new fields (Recommendations, Limitations, Sources)
|
||||||
|
|
||||||
## [0.20.1] - 2025-12-11
|
## [0.20.1] - 2025-12-11
|
||||||
|
|
||||||
### Added
|
### Added
|
||||||
|
|
|
||||||
|
|
@ -53,20 +53,22 @@ interface ResearchContext {
|
||||||
}
|
}
|
||||||
|
|
||||||
interface EvaluationResult {
|
interface EvaluationResult {
|
||||||
confidence: number;
|
key_insights: string[];
|
||||||
|
new_questions: string[];
|
||||||
|
gaps: string[];
|
||||||
|
confidence_score: number;
|
||||||
|
is_sufficient: boolean;
|
||||||
reasoning: string;
|
reasoning: string;
|
||||||
should_continue: boolean;
|
|
||||||
gaps_identified: string[];
|
|
||||||
follow_up_questions: string[];
|
|
||||||
}
|
}
|
||||||
|
|
||||||
interface ResearchReport {
|
interface ResearchReport {
|
||||||
question: string;
|
title: string;
|
||||||
summary: string;
|
executive_summary: string;
|
||||||
findings: string[];
|
main_findings: string[];
|
||||||
conclusions: string[];
|
conclusions: string[];
|
||||||
insights_used: string[];
|
limitations: string[];
|
||||||
methodology: string;
|
recommendations: string[];
|
||||||
|
sources_summary: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
interface ResearchState {
|
interface ResearchState {
|
||||||
|
|
|
||||||
|
|
@ -58,20 +58,22 @@ interface ResearchContext {
|
||||||
}
|
}
|
||||||
|
|
||||||
interface EvaluationResult {
|
interface EvaluationResult {
|
||||||
confidence: number;
|
key_insights: string[];
|
||||||
|
new_questions: string[];
|
||||||
|
gaps: string[];
|
||||||
|
confidence_score: number;
|
||||||
|
is_sufficient: boolean;
|
||||||
reasoning: string;
|
reasoning: string;
|
||||||
should_continue: boolean;
|
|
||||||
gaps_identified: string[];
|
|
||||||
follow_up_questions: string[];
|
|
||||||
}
|
}
|
||||||
|
|
||||||
interface ResearchReport {
|
interface ResearchReport {
|
||||||
question: string;
|
title: string;
|
||||||
summary: string;
|
executive_summary: string;
|
||||||
findings: string[];
|
main_findings: string[];
|
||||||
conclusions: string[];
|
conclusions: string[];
|
||||||
insights_used: string[];
|
limitations: string[];
|
||||||
methodology: string;
|
recommendations: string[];
|
||||||
|
sources_summary: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
interface ResearchState {
|
interface ResearchState {
|
||||||
|
|
@ -179,7 +181,7 @@ export default function StateDisplay({ state }: StateDisplayProps) {
|
||||||
state.max_iterations > 0
|
state.max_iterations > 0
|
||||||
? (state.iterations / state.max_iterations) * 100
|
? (state.iterations / state.max_iterations) * 100
|
||||||
: 0;
|
: 0;
|
||||||
const confidence = state.last_eval?.confidence || 0;
|
const confidence = state.last_eval?.confidence_score || 0;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
|
|
@ -1040,7 +1042,7 @@ export default function StateDisplay({ state }: StateDisplayProps) {
|
||||||
color: "#2d3748",
|
color: "#2d3748",
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{state.result.question}
|
{state.result.title}
|
||||||
</h3>
|
</h3>
|
||||||
<div style={{ marginBottom: "1.5rem" }}>
|
<div style={{ marginBottom: "1.5rem" }}>
|
||||||
<h4
|
<h4
|
||||||
|
|
@ -1051,7 +1053,7 @@ export default function StateDisplay({ state }: StateDisplayProps) {
|
||||||
marginBottom: "0.5rem",
|
marginBottom: "0.5rem",
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
Summary
|
Executive Summary
|
||||||
</h4>
|
</h4>
|
||||||
<div
|
<div
|
||||||
style={{
|
style={{
|
||||||
|
|
@ -1060,7 +1062,7 @@ export default function StateDisplay({ state }: StateDisplayProps) {
|
||||||
lineHeight: "1.6",
|
lineHeight: "1.6",
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Markdown content={state.result.summary} />
|
<Markdown content={state.result.executive_summary} />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style={{ marginBottom: "1.5rem" }}>
|
<div style={{ marginBottom: "1.5rem" }}>
|
||||||
|
|
@ -1072,7 +1074,7 @@ export default function StateDisplay({ state }: StateDisplayProps) {
|
||||||
marginBottom: "0.5rem",
|
marginBottom: "0.5rem",
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
Key Findings
|
Main Findings
|
||||||
</h4>
|
</h4>
|
||||||
<ul
|
<ul
|
||||||
style={{
|
style={{
|
||||||
|
|
@ -1082,7 +1084,7 @@ export default function StateDisplay({ state }: StateDisplayProps) {
|
||||||
lineHeight: "1.6",
|
lineHeight: "1.6",
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{state.result.findings.map((finding, idx) => (
|
{state.result.main_findings.map((finding, idx) => (
|
||||||
<li
|
<li
|
||||||
key={`finding-${idx}-${finding.substring(0, 30)}`}
|
key={`finding-${idx}-${finding.substring(0, 30)}`}
|
||||||
style={{ marginBottom: "0.5rem" }}
|
style={{ marginBottom: "0.5rem" }}
|
||||||
|
|
@ -1121,27 +1123,68 @@ export default function StateDisplay({ state }: StateDisplayProps) {
|
||||||
))}
|
))}
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div style={{ marginBottom: "1.5rem" }}>
|
{state.result.recommendations.length > 0 && (
|
||||||
<h4
|
<div style={{ marginBottom: "1.5rem" }}>
|
||||||
style={{
|
<h4
|
||||||
fontSize: "0.875rem",
|
style={{
|
||||||
fontWeight: "600",
|
fontSize: "0.875rem",
|
||||||
color: "#718096",
|
fontWeight: "600",
|
||||||
marginBottom: "0.5rem",
|
color: "#718096",
|
||||||
}}
|
marginBottom: "0.5rem",
|
||||||
>
|
}}
|
||||||
Methodology
|
>
|
||||||
</h4>
|
Recommendations
|
||||||
<div
|
</h4>
|
||||||
style={{
|
<ul
|
||||||
fontSize: "0.875rem",
|
style={{
|
||||||
color: "#4a5568",
|
paddingLeft: "1.5rem",
|
||||||
lineHeight: "1.6",
|
fontSize: "0.875rem",
|
||||||
}}
|
color: "#4a5568",
|
||||||
>
|
lineHeight: "1.6",
|
||||||
<Markdown content={state.result.methodology} />
|
}}
|
||||||
|
>
|
||||||
|
{state.result.recommendations.map((rec, idx) => (
|
||||||
|
<li
|
||||||
|
key={`rec-${idx}-${rec.substring(0, 30)}`}
|
||||||
|
style={{ marginBottom: "0.5rem" }}
|
||||||
|
>
|
||||||
|
<Markdown content={rec} />
|
||||||
|
</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
)}
|
||||||
|
{state.result.limitations.length > 0 && (
|
||||||
|
<div style={{ marginBottom: "1.5rem" }}>
|
||||||
|
<h4
|
||||||
|
style={{
|
||||||
|
fontSize: "0.875rem",
|
||||||
|
fontWeight: "600",
|
||||||
|
color: "#718096",
|
||||||
|
marginBottom: "0.5rem",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Limitations
|
||||||
|
</h4>
|
||||||
|
<ul
|
||||||
|
style={{
|
||||||
|
paddingLeft: "1.5rem",
|
||||||
|
fontSize: "0.875rem",
|
||||||
|
color: "#4a5568",
|
||||||
|
lineHeight: "1.6",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{state.result.limitations.map((lim, idx) => (
|
||||||
|
<li
|
||||||
|
key={`lim-${idx}-${lim.substring(0, 30)}`}
|
||||||
|
style={{ marginBottom: "0.5rem" }}
|
||||||
|
>
|
||||||
|
<Markdown content={lim} />
|
||||||
|
</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
<div>
|
<div>
|
||||||
<h4
|
<h4
|
||||||
style={{
|
style={{
|
||||||
|
|
@ -1151,52 +1194,16 @@ export default function StateDisplay({ state }: StateDisplayProps) {
|
||||||
marginBottom: "0.5rem",
|
marginBottom: "0.5rem",
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
Insights Used ({state.result.insights_used.length})
|
Sources
|
||||||
</h4>
|
</h4>
|
||||||
<div
|
<div
|
||||||
style={{
|
style={{
|
||||||
display: "flex",
|
fontSize: "0.875rem",
|
||||||
flexDirection: "column",
|
color: "#4a5568",
|
||||||
gap: "0.5rem",
|
lineHeight: "1.6",
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{state.result.insights_used.map((insightId, idx) => {
|
<Markdown content={state.result.sources_summary} />
|
||||||
const insight = state.context.insights.find(
|
|
||||||
(i) => i.id === insightId,
|
|
||||||
);
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
key={`insight-${idx}-${insightId}`}
|
|
||||||
style={{
|
|
||||||
padding: "0.5rem",
|
|
||||||
background: "#f7fafc",
|
|
||||||
borderRadius: "4px",
|
|
||||||
border: "1px solid #e2e8f0",
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{insight ? (
|
|
||||||
<div
|
|
||||||
style={{
|
|
||||||
fontSize: "0.875rem",
|
|
||||||
color: "#2d3748",
|
|
||||||
lineHeight: "1.4",
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<Markdown content={insight.summary} />
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
<div
|
|
||||||
style={{
|
|
||||||
fontSize: "0.875rem",
|
|
||||||
color: "#718096",
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
Insight ID: {insightId}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue