diff --git a/packages/twenty-front/src/modules/workflow/hooks/useWorkflowRun.ts b/packages/twenty-front/src/modules/workflow/hooks/useWorkflowRun.ts index 860f21d35..cd414e735 100644 --- a/packages/twenty-front/src/modules/workflow/hooks/useWorkflowRun.ts +++ b/packages/twenty-front/src/modules/workflow/hooks/useWorkflowRun.ts @@ -3,6 +3,7 @@ import { useFindOneRecord } from '@/object-record/hooks/useFindOneRecord'; import { WorkflowRun } from '@/workflow/types/Workflow'; import { workflowRunSchema } from '@/workflow/validation-schemas/workflowSchema'; import { useMemo } from 'react'; +import { isDefined } from 'twenty-shared/utils'; export const useWorkflowRun = ({ workflowRunId, @@ -14,13 +15,18 @@ export const useWorkflowRun = ({ objectRecordId: workflowRunId, }); - const { success, data: record } = useMemo( - () => workflowRunSchema.safeParse(rawRecord), - [rawRecord], - ); + const { + success, + data: record, + error, + } = useMemo(() => workflowRunSchema.safeParse(rawRecord), [rawRecord]); + + if (!isDefined(rawRecord)) { + return undefined; + } if (!success) { - return undefined; + throw error; } return record; diff --git a/packages/twenty-front/src/modules/workflow/validation-schemas/workflowSchema.ts b/packages/twenty-front/src/modules/workflow/validation-schemas/workflowSchema.ts index b740a993d..44793cb92 100644 --- a/packages/twenty-front/src/modules/workflow/validation-schemas/workflowSchema.ts +++ b/packages/twenty-front/src/modules/workflow/validation-schemas/workflowSchema.ts @@ -271,7 +271,7 @@ export const workflowTriggerSchema = z.discriminatedUnion('type', [ // Step output schemas export const workflowExecutorOutputSchema = z.object({ result: z.any().optional(), - error: z.string().optional(), + error: z.any().optional(), pendingEvent: z.boolean().optional(), }); @@ -286,7 +286,7 @@ export const workflowRunOutputSchema = z.object({ steps: z.array(workflowActionSchema), }), stepsOutput: workflowRunOutputStepsOutputSchema.optional(), - error: z.string().optional(), + error: z.any().optional(), }); export const workflowRunContextSchema = z.record(z.any()); diff --git a/packages/twenty-front/src/modules/workflow/workflow-steps/components/WorkflowRunStepOutputDetail.tsx b/packages/twenty-front/src/modules/workflow/workflow-steps/components/WorkflowRunStepOutputDetail.tsx index 2bec95129..5da5840d1 100644 --- a/packages/twenty-front/src/modules/workflow/workflow-steps/components/WorkflowRunStepOutputDetail.tsx +++ b/packages/twenty-front/src/modules/workflow/workflow-steps/components/WorkflowRunStepOutputDetail.tsx @@ -67,7 +67,13 @@ export const WorkflowRunStepOutputDetail = ({ stepId }: { stepId: string }) => { ? getTriggerHeaderType(stepDefinition.definition) : i18n._(getActionHeaderTypeOrThrow(stepDefinition.definition.type)); - const setRedHighlightingForEveryNode: GetJsonNodeHighlighting = () => 'red'; + const setRedHighlightingForEveryNode: GetJsonNodeHighlighting = (keyPath) => { + if (keyPath === 'error') { + return 'red'; + } + + return undefined; + }; return ( <> diff --git a/packages/twenty-ui/src/json-visualizer/__stories__/JsonTree.stories.tsx b/packages/twenty-ui/src/json-visualizer/__stories__/JsonTree.stories.tsx index d2a1df6d0..d73f10558 100644 --- a/packages/twenty-ui/src/json-visualizer/__stories__/JsonTree.stories.tsx +++ b/packages/twenty-ui/src/json-visualizer/__stories__/JsonTree.stories.tsx @@ -571,6 +571,9 @@ export const RedHighlighting: Story = { value: { name: 'John Doe', age: 30, + address: { + city: 'Paris', + }, }, getNodeHighlighting: () => 'red', }, diff --git a/packages/twenty-ui/src/json-visualizer/components/JsonNestedNode.tsx b/packages/twenty-ui/src/json-visualizer/components/JsonNestedNode.tsx index 06b1d8373..3fdb1a9af 100644 --- a/packages/twenty-ui/src/json-visualizer/components/JsonNestedNode.tsx +++ b/packages/twenty-ui/src/json-visualizer/components/JsonNestedNode.tsx @@ -25,8 +25,9 @@ const StyledLabelContainer = styled.div` gap: ${({ theme }) => theme.spacing(2)}; `; -const StyledElementsCount = styled.span` - color: ${({ theme }) => theme.font.color.tertiary}; +const StyledElementsCount = styled.span<{ variant?: 'red' }>` + color: ${({ theme, variant }) => + variant === 'red' ? theme.font.color.danger : theme.font.color.tertiary}; `; const StyledJsonList = styled(JsonList)``.withComponent(motion.ul); @@ -118,13 +119,25 @@ export const JsonNestedNode = ({ - + {renderElementsCount && ( - + {renderElementsCount(elements.length)} )} diff --git a/packages/twenty-ui/src/json-visualizer/components/internal/JsonArrow.tsx b/packages/twenty-ui/src/json-visualizer/components/internal/JsonArrow.tsx index 46da248dc..73737db9b 100644 --- a/packages/twenty-ui/src/json-visualizer/components/internal/JsonArrow.tsx +++ b/packages/twenty-ui/src/json-visualizer/components/internal/JsonArrow.tsx @@ -6,16 +6,20 @@ import { useJsonTreeContextOrThrow } from '@ui/json-visualizer/hooks/useJsonTree import { ANIMATION } from '@ui/theme'; import { motion } from 'framer-motion'; -const StyledButton = styled(motion.button)` +const StyledButton = styled(motion.button)<{ variant?: 'blue' | 'red' }>` align-items: center; - border-color: ${({ theme }) => theme.border.color.medium}; + background-color: ${({ theme, variant }) => + variant === 'red' + ? theme.background.danger + : theme.background.transparent.lighter}; + border-color: ${({ theme, variant }) => + variant === 'red' ? theme.border.color.danger : theme.border.color.medium}; border-radius: ${({ theme }) => theme.border.radius.sm}; border-style: solid; border-width: 1px; display: flex; justify-content: center; padding-inline: ${({ theme }) => theme.spacing(1)}; - background-color: ${({ theme }) => theme.background.transparent.lighter}; height: 24px; width: 24px; box-sizing: border-box; @@ -31,7 +35,7 @@ export const JsonArrow = ({ }: { isOpen: boolean; onClick: () => void; - variant?: 'blue'; + variant?: 'blue' | 'red'; }) => { const theme = useTheme(); @@ -39,7 +43,7 @@ export const JsonArrow = ({ useJsonTreeContextOrThrow(); return ( - + {isOpen ? arrowButtonExpandedLabel : arrowButtonCollapsedLabel} @@ -47,7 +51,11 @@ export const JsonArrow = ({