Skip to content

Commit a32f9bc

Browse files
committed
feat: adding error state
1 parent 9c05093 commit a32f9bc

1 file changed

Lines changed: 108 additions & 71 deletions

File tree

src/packages/ce/src/flow/views/FlowExecutionResultView.tsx

Lines changed: 108 additions & 71 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,8 @@ import {
44
ExecutionError,
55
ExecutionParameterResult,
66
ExecutionResult,
7-
Flow, FunctionDefinition,
7+
Flow,
8+
FunctionDefinition,
89
Maybe,
910
Namespace,
1011
NamespaceProject,
@@ -24,6 +25,10 @@ import {
2425
MenuItem,
2526
MenuPortal,
2627
MenuTrigger,
28+
ScrollArea,
29+
ScrollAreaScrollbar,
30+
ScrollAreaThumb,
31+
ScrollAreaViewport,
2732
Spacing,
2833
Text,
2934
Tooltip,
@@ -274,11 +279,11 @@ export const FlowExecutionResultView: React.FC = () => {
274279
item.type === "node" ? item?.data?.payload?.functionDefinition?.displayIcon : item.type === "function" ? item?.data?.payload?.displayIcon : item?.data?.payload?.type?.displayIcon,
275280
)
276281

277-
return <Tooltip key={item.id}>
282+
return <Tooltip key={item.id} delayDuration={700}>
278283
<TooltipTrigger asChild>
279284
<Flex align={"center"} justify={"start"} w={"100%"} h={"100%"}
280285
style={{cursor: "pointer"}}>
281-
<Card color={"primary"}
286+
<Card color={item.data.error ? "error" : "primary"}
282287
className={`d-flow-node`}
283288
paddingSize={"xs"}
284289
py={"0.35"}
@@ -316,80 +321,112 @@ export const FlowExecutionResultView: React.FC = () => {
316321
</TooltipTrigger>
317322
<TooltipPortal>
318323
<TooltipContent forceMount sideOffset={8} align={"start"}
319-
maw={"300px"}>
320-
<Flex align={"center"} justify={"space-between"}
321-
style={{gap: "0.7rem"}}>
322-
<Flex align={"center"} style={{gap: "0.35rem"}}>
323-
<DisplayIcon size={16}
324-
style={{
325-
minWidth: "16px",
326-
minHeight: "16px",
327-
}}
328-
color={hashToColor(item?.data?.payload?.id ?? "")}/>
329-
<Text size={"md"}
330-
style={{
331-
overflow: "hidden",
332-
position: "relative"
333-
}}>
334-
{item?.data?.displayMessage}
335-
</Text>
336-
</Flex>
337-
<Text size={"sm"} hierarchy={"tertiary"}>
338-
{getRelativeValue(item.end - item.start)}
339-
</Text>
340-
</Flex>
341-
<Spacing spacing={"xs"}/>
324+
maw={"300px"}
325+
mah={"var(--radix-popper-available-height)"}>
326+
<ScrollArea h={"var(--radix-popper-available-height)"}>
327+
<ScrollAreaViewport>
328+
<div>
342329

343-
<>
344-
<Text size={"md"}>
345-
{item.type === "node" || item.type === "function" ? "Parameters" : "Input"}
346-
</Text>
347-
{item.type === "node" || item.type === "function" ? item.data.input?.map((input: ExecutionParameterResult, index: number) => {
330+
<Flex align={"center"} justify={"space-between"}
331+
style={{gap: "0.7rem"}}>
332+
<Flex align={"center"} style={{gap: "0.35rem"}}>
333+
<DisplayIcon size={16}
334+
style={{
335+
minWidth: "16px",
336+
minHeight: "16px",
337+
}}
338+
color={hashToColor(item?.data?.payload?.id ?? "")}/>
339+
<Text size={"md"}
340+
style={{
341+
overflow: "hidden",
342+
position: "relative"
343+
}}>
344+
{item?.data?.displayMessage}
345+
</Text>
346+
</Flex>
347+
<Text size={"sm"} hierarchy={"tertiary"}>
348+
{getRelativeValue(item.end - item.start)}
349+
</Text>
350+
</Flex>
351+
<Spacing spacing={"xs"}/>
348352

349-
//TODO: for item.type === function this is wrong
350-
const parameter: ParameterDefinition = item?.data?.payload?.functionDefinition?.parameterDefinitions?.nodes?.[index]
353+
<>
354+
<Text size={"md"}>
355+
{item.type === "node" || item.type === "function" ? "Parameters" : "Input"}
356+
</Text>
357+
{item.type === "node" || item.type === "function" ? item.data.input?.map((input: ExecutionParameterResult, index: number) => {
351358

352-
return <div key={input.id}>
353-
<Text size={"sm"} hierarchy={"tertiary"}>
354-
{parameter?.names?.[0]?.content}
355-
</Text>
356-
<Editor readonly showTooltips={false}
357-
language={"json"}
358-
initialValue={input.value}
359-
customSuggestionComponent={false}
360-
basicSetup={{
361-
highlightActiveLine: false,
362-
highlightActiveLineGutter: false,
363-
}}/>
364-
</div>
359+
//TODO: for item.type === function this is wrong
360+
const parameter: ParameterDefinition = item?.data?.payload?.functionDefinition?.parameterDefinitions?.nodes?.[index]
365361

366-
}) : item.type === "trigger" ? (
367-
<Editor readonly showTooltips={false} language={"json"}
368-
initialValue={item.data.input}
369-
customSuggestionComponent={false}
370-
basicSetup={{
371-
highlightActiveLine: false,
372-
highlightActiveLineGutter: false,
373-
}}/>
374-
) : null}
375-
</>
362+
return <div key={input.id}>
363+
<Text size={"sm"}
364+
hierarchy={"tertiary"}>
365+
{parameter?.names?.[0]?.content}
366+
</Text>
367+
<Editor readonly showTooltips={false}
368+
language={"json"}
369+
initialValue={input.value}
370+
customSuggestionComponent={false}
371+
basicSetup={{
372+
highlightActiveLine: false,
373+
highlightActiveLineGutter: false,
374+
}}/>
375+
</div>
376376

377-
<Spacing spacing={"xs"}/>
378-
{
379-
item.data.success && (
380-
<div>
381-
<Text size={"md"}>
382-
Result
383-
</Text>
384-
<Editor readonly showTooltips={false} language={"json"}
385-
initialValue={item.data.success}
386-
basicSetup={{
387-
highlightActiveLine: false,
388-
highlightActiveLineGutter: false,
389-
}}/>
377+
}) : item.type === "trigger" ? (
378+
<Editor readonly showTooltips={false}
379+
language={"json"}
380+
initialValue={item.data.input}
381+
customSuggestionComponent={false}
382+
basicSetup={{
383+
highlightActiveLine: false,
384+
highlightActiveLineGutter: false,
385+
}}/>
386+
) : null}
387+
{
388+
item.data.error ? (
389+
<>
390+
<Text size={"md"}>
391+
Error
392+
</Text>
393+
<Editor readonly
394+
showTooltips={false}
395+
language={"json"}
396+
initialValue={item.data.error}
397+
customSuggestionComponent={false}
398+
basicSetup={{
399+
highlightActiveLine: false,
400+
highlightActiveLineGutter: false,
401+
}}/>
402+
</>
403+
) : null
404+
}
405+
</>
406+
407+
<Spacing spacing={"xs"}/>
408+
{
409+
item.data.success && (
410+
<div>
411+
<Text size={"md"}>
412+
Result
413+
</Text>
414+
<Editor readonly showTooltips={false}
415+
language={"json"}
416+
initialValue={item.data.success}
417+
basicSetup={{
418+
highlightActiveLine: false,
419+
highlightActiveLineGutter: false,
420+
}}/>
421+
</div>
422+
)
423+
}
390424
</div>
391-
)
392-
}
425+
</ScrollAreaViewport>
426+
<ScrollAreaScrollbar orientation={"vertical"}>
427+
<ScrollAreaThumb/>
428+
</ScrollAreaScrollbar>
429+
</ScrollArea>
393430
</TooltipContent>
394431
</TooltipPortal>
395432
</Tooltip>

0 commit comments

Comments
 (0)