jyapayne/langflow
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

fix: errors exhibition and printing (#5892)

Browse source 
* Added onBuildError to error case on buildVertices

* add onBuildError just if there's no source

* refactor: Update markdown rendering in alert components

* Fixed list on error

* Fixed md exibition of error

* Fixed exibition for component erorrs

* Made errors be generated with the correct map

* Removed markdown from unused places

* Update src/frontend/src/utils/buildUtils.ts

Co-authored-by: Cristhian Zanforlin Lousa <cristhian.lousa@gmail.com>

* Update src/frontend/src/utils/buildUtils.ts

Co-authored-by: Cristhian Zanforlin Lousa <cristhian.lousa@gmail.com>

---------

Co-authored-by: anovazzi1 <otavio2204@gmail.com>
Co-authored-by: Cristhian Zanforlin Lousa <cristhian.lousa@gmail.com>
This commit is contained in:
Lucas Oliveira 2025-01-23 16:31:07 -03:00 • committed by GitHub
commit 07bf8311bb
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 67 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

31
src/frontend/src/alerts/alertDropDown/components/singleAlertComponent/index.tsx
View file

@ -1,5 +1,7 @@
import { CustomLink } from "@/customization/components/custom-link";
import { useState } from "react";
import Markdown from "react-markdown";
import remarkGfm from "remark-gfm";
import IconComponent from "../../../../components/common/genericIconComponent";
import { SingleAlertComponentType } from "../../../../types/alerts";
@ -28,10 +30,35 @@ export default function SingleAlert({
</h3>
{dropItem.list ? (
<div className="mt-2 text-sm text-error-foreground">
<ul className="list-disc space-y-1 pl-5">
<ul className="list-disc space-y-1 pl-5 align-top">
{dropItem.list.map((item, idx) => (
<li className="word-break-break-word" key={idx}>
{item}
<Markdown
linkTarget="_blank"
remarkPlugins={[remarkGfm]}
className="align-text-top"
components={{
a: ({ node, ...props }) => (
<a
href={props.href}
target="_blank"
className="underline"
rel="noopener noreferrer"
>
{props.children}
</a>
),
p({ node, ...props }) {
return (
<span className="inline-block w-fit max-w-full align-text-top">
{props.children}
</span>
);
},
}}
>
{Array.isArray(item) ? item.join("\n") : item}
</Markdown>
</li>
))}
</ul>

38
src/frontend/src/alerts/error/index.tsx
View file

@ -1,5 +1,7 @@
import { Transition } from "@headlessui/react";
import { useEffect, useState } from "react";
import Markdown from "react-markdown";
import remarkGfm from "remark-gfm";
import IconComponent from "../../components/common/genericIconComponent";
import { ErrorAlertType } from "../../types/alerts";
@ -23,7 +25,6 @@ export default function ErrorAlert({
return (
<Transition
className="relative"
show={show}
appear={true}
enter="transition-transform duration-500 ease-out"
@ -54,11 +55,38 @@ export default function ErrorAlert({
<h3 className="error-build-foreground line-clamp-2">{title}</h3>
{list?.length !== 0 &&
list?.some((item) => item !== null && item !== undefined) ? (
<div className="error-build-message-div">
<ul className="error-build-message-list">
<div className="mt-2 text-sm text-error-foreground">
<ul className="list-disc space-y-1 pl-5 align-top">
{list.map((item, index) => (
<li key={index} className="line-clamp-5">
{item}
<li key={index} className="word-break-break-word">
<span className="">
<Markdown
linkTarget="_blank"
remarkPlugins={[remarkGfm]}
className="align-text-top"
components={{
a: ({ node, ...props }) => (
<a
href={props.href}
target="_blank"
className="underline"
rel="noopener noreferrer"
>
{props.children}
</a>
),
p({ node, ...props }) {
return (
<span className="inline-block w-fit max-w-full align-text-top">
{props.children}
</span>
);
},
}}
>
{Array.isArray(item) ? item.join("\n") : item}
</Markdown>
</span>
</li>
))}
</ul>

8
src/frontend/src/utils/buildUtils.ts
View file

@ -248,7 +248,7 @@ export async function buildFlowVertices({
if (!buildData.valid) {
// lots is a dictionary with the key the output field name and the value the log object
// logs: { [key: string]: { message: any; type: string }[] };
const errorMessages = Object.keys(buildData.data.outputs).map(
const errorMessages = Object.keys(buildData.data.outputs).flatMap(
(key) => {
const outputs = buildData.data.outputs[key];
if (Array.isArray(outputs)) {
@ -317,9 +317,11 @@ export async function buildFlowVertices({
return true;
}
case "error": {
useFlowStore.getState().setIsBuilding(false);
if (data.category === "error") {
if (data?.category === "error") {
useMessagesStore.getState().addMessage(data);
if (data?.properties?.source?.id === null) {
onBuildError!("Error Building Flow", [data.text]);
}
}
buildResults.push(false);
return true;