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

update error view in new logs

Browse source
This commit is contained in:
anovazzi1 2024-06-14 20:26:19 -03:00
commit 9fdd7aa5f8
4 changed files with 72 additions and 47 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/frontend/src/CustomNodes/GenericNode/components/outputModal/components/switchOutputView/index.tsx
View file

@ -41,7 +41,7 @@ const SwitchOutputView: React.FC<SwitchOutputViewProps> = ({
<Case condition={!resultType || resultType === "unknown"}>
<div>NO OUTPUT</div>
</Case>
<Case condition={resultType === "ValueError"}>
<Case condition={resultType === "error" || resultType === "ValueError"}>
<ErrorOutput value={resultMessage}></ErrorOutput>
</Case>

41
src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
View file

@ -109,12 +109,23 @@ export default function ParameterComponent({
}
};
const logTypeIsError = (data: any) => {
if (!outputName) return;
const logs = (data?.logs[outputName] ?? [])[0];
if (Array.isArray(logs) && logs.length > 1) {
return logs.some(
(log) => log.type === "error" || log.type === "ValueError",
);
} else {
return logs?.type === "error" || logs?.type === "ValueError";
}
};
const flowPoolNode = (flowPool[data.id] ?? [])[
(flowPool[data.id]?.length ?? 1) - 1
];
const displayOutputPreview =
!!flowPool[data.id] &&
flowPool[data.id][flowPool[data.id].length - 1]?.valid &&
logHasMessage(flowPool[data.id][flowPool[data.id].length - 1]?.data);
let hasOutputs;
@ -123,6 +134,7 @@ export default function ParameterComponent({
}
const unknownOutput = logTypeIsUnknown(flowPoolNode?.data);
const errorOutput = logTypeIsError(flowPoolNode?.data);
const preventDefault = true;
@ -374,15 +386,24 @@ export default function ParameterComponent({
onClick={() => setOpenOutputModal(true)}
data-testid={`output-inspection-${title.toLowerCase()}`}
>
<IconComponent
className={classNames(
"h-5 w-5 rounded-md",
displayOutputPreview && !unknownOutput
? " hover:text-medium-indigo"
: " cursor-not-allowed text-muted-foreground",
)}
name={"ScanEye"}
/>
{errorOutput ? (
<IconComponent
className={classNames(
"h-5 w-5 rounded-md text-status-red",
)}
name={"X"}
/>
) : (
<IconComponent
className={classNames(
"h-5 w-5 rounded-md",
displayOutputPreview && !unknownOutput
? " hover:text-medium-indigo"
: " cursor-not-allowed text-muted-foreground",
)}
name={"ScanEye"}
/>
)}
</Button>
</ShadTooltip>
)}

55
src/frontend/src/CustomNodes/GenericNode/index.tsx
View file

@ -69,14 +69,14 @@ export default function GenericNode({
const [nodeName, setNodeName] = useState(data.node!.display_name);
const [inputDescription, setInputDescription] = useState(false);
const [nodeDescription, setNodeDescription] = useState(
data.node?.description!
data.node?.description!,
);
const [isOutdated, setIsOutdated] = useState(false);
const buildStatus = useFlowStore(
(state) => state.flowBuildStatus[data.id]?.status
(state) => state.flowBuildStatus[data.id]?.status,
);
const lastRunTime = useFlowStore(
(state) => state.flowBuildStatus[data.id]?.timestamp
(state) => state.flowBuildStatus[data.id]?.timestamp,
);
const [validationStatus, setValidationStatus] =
useState<VertexBuildTypeAPI | null>(null);
@ -93,7 +93,7 @@ export default function GenericNode({
data.node!,
setNode,
setIsOutdated,
updateNodeInternals
updateNodeInternals,
);
const name = nodeIconsLucide[data.type] ? data.type : types[data.type];
@ -120,12 +120,12 @@ export default function GenericNode({
selected: boolean,
showNode: boolean,
buildStatus: BuildStatus | undefined,
validationStatus: VertexBuildTypeAPI | null
validationStatus: VertexBuildTypeAPI | null,
) => {
const specificClassFromBuildStatus = getSpecificClassFromBuildStatus(
buildStatus,
validationStatus,
isDark
isDark,
);
const baseBorderClass = getBaseBorderClass(selected);
@ -134,7 +134,7 @@ export default function GenericNode({
baseBorderClass,
nodeSizeClass,
"generic-node-div group/node",
specificClassFromBuildStatus
specificClassFromBuildStatus,
);
return names;
};
@ -168,8 +168,8 @@ export default function GenericNode({
}
useCheckCodeValidity(data, templates, setIsOutdated, types);
useValidationStatusString(validationStatus, setValidationString);
useUpdateValidationStatus(data?.id, flowPool, setValidationStatus);
useValidationStatusString(validationStatus, setValidationString);
const iconNodeRender = useIconNodeRender(
data,
@ -179,7 +179,7 @@ export default function GenericNode({
showNode,
isEmoji,
nodeIconFragment,
checkNodeIconFragment
checkNodeIconFragment,
);
function countHandles(): void {
@ -362,7 +362,7 @@ export default function GenericNode({
selected,
showNode,
buildStatus,
validationStatus
validationStatus,
)}
>
{data.node?.beta && showNode && (
@ -510,7 +510,7 @@ export default function GenericNode({
}
title={getFieldTitle(
data.node?.template!,
templateField
templateField,
)}
info={data.node?.template[templateField].info}
name={templateField}
@ -538,7 +538,7 @@ export default function GenericNode({
proxy={data.node?.template[templateField].proxy}
showNode={showNode}
/>
)
),
)}
{/* <ParameterComponent
index={0}
@ -581,6 +581,11 @@ export default function GenericNode({
) : (
<div className="max-h-100 p-2">
<div>
{validationString && (
<div className="ml-1 pb-2 text-status-red">
{validationString}
</div>
)}
{lastRunTime && (
<div className="justify-left flex font-normal text-muted-foreground">
<div>{RUN_TIMESTAMP_PREFIX}</div>
@ -641,7 +646,7 @@ export default function GenericNode({
? "pb-8"
: "pb-8 pt-5"
: "",
"relative"
"relative",
)}
>
{/* increase height!! */}
@ -698,7 +703,7 @@ export default function GenericNode({
!data.node?.description) &&
nameEditable
? "font-light italic"
: ""
: "",
)}
onDoubleClick={(e) => {
setInputDescription(true);
@ -768,13 +773,13 @@ export default function GenericNode({
}
title={getFieldTitle(
data.node?.template!,
templateField
templateField,
)}
info={data.node?.template[templateField].info}
name={templateField}
tooltipTitle={
data.node?.template[templateField].input_types?.join(
"\n"
"\n",
) ?? data.node?.template[templateField].type
}
required={data.node!.template[templateField].required}
@ -801,7 +806,7 @@ export default function GenericNode({
<div
className={classNames(
Object.keys(data.node!.template).length < 1 ? "hidden" : "",
"flex-max-width justify-center"
"flex-max-width justify-center",
)}
>
{" "}
@ -812,9 +817,9 @@ export default function GenericNode({
renderOutputParameter(
output,
data.node!.outputs?.findIndex(
(out) => out.name === output.name
) ?? idx
)
(out) => out.name === output.name,
) ?? idx,
),
)}
<div
className={cn(showHiddenOutputs ? "" : "h-0 overflow-hidden")}
@ -825,9 +830,9 @@ export default function GenericNode({
renderOutputParameter(
output,
data.node!.outputs?.findIndex(
(out) => out.name === output.name
) ?? idx
)
(out) => out.name === output.name,
) ?? idx,
),
)}
</div>
</div>
@ -838,7 +843,7 @@ export default function GenericNode({
(shownOutputs && shownOutputs.length > 0) ||
showHiddenOutputs
? "bottom-5"
: "bottom-1.5"
: "bottom-1.5",
)}
>
<Button
@ -852,7 +857,7 @@ export default function GenericNode({
strokeWidth={1.5}
className={cn(
"h-5 w-5 pt-px text-muted-foreground group-hover:text-medium-indigo group-hover/node:opacity-100",
showHiddenOutputs ? "rotate-180 transform" : ""
showHiddenOutputs ? "rotate-180 transform" : "",
)}
/>
</Button>

21
src/frontend/src/CustomNodes/hooks/use-validation-status-string.tsx
View file

@ -2,21 +2,20 @@ import { useEffect } from "react";
const useValidationStatusString = (validationStatus, setValidationString) => {
useEffect(() => {
if (validationStatus?.data.logs) {
if (validationStatus?.data?.logs) {
// if it is not a string turn it into a string
console.log("validationStatus", validationStatus);
let newValidationString = "";
if (Array.isArray(validationStatus.data.logs)) {
newValidationString = validationStatus.data.logs
.map((log) => (log?.message ? log.message : JSON.stringify(log)))
.join("\n");
}
if (typeof newValidationString !== "string") {
newValidationString = JSON.stringify(validationStatus.data.logs);
}
Object.values(validationStatus?.data?.logs).forEach((log: any) => {
log.forEach((logItem) => {
if (logItem.type === "error" || logItem.type === "ValueError") {
newValidationString += `${logItem.message}\n`;
}
});
});
setValidationString(newValidationString);
}
}, [validationStatus, validationStatus?.data.logs, setValidationString]);
}, [validationStatus, validationStatus?.data?.logs, setValidationString]);
};
export default useValidationStatusString;