@uipath/apollo-react 3.69.0 → 3.69.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (30) hide show
  1. package/dist/canvas/components/StageNode/AdhocTask.cjs +3 -67
  2. package/dist/canvas/components/StageNode/AdhocTask.d.ts.map +1 -1
  3. package/dist/canvas/components/StageNode/AdhocTask.js +3 -57
  4. package/dist/canvas/components/StageNode/DraggableTask.cjs +5 -143
  5. package/dist/canvas/components/StageNode/DraggableTask.d.ts +1 -2
  6. package/dist/canvas/components/StageNode/DraggableTask.d.ts.map +1 -1
  7. package/dist/canvas/components/StageNode/DraggableTask.js +5 -140
  8. package/dist/canvas/components/StageNode/DraggableTask.types.d.ts +0 -5
  9. package/dist/canvas/components/StageNode/DraggableTask.types.d.ts.map +1 -1
  10. package/dist/canvas/components/StageNode/StageNode.stories.cjs +63 -3
  11. package/dist/canvas/components/StageNode/StageNode.stories.d.ts.map +1 -1
  12. package/dist/canvas/components/StageNode/StageNode.stories.js +63 -3
  13. package/dist/canvas/components/StageNode/StageTaskDragOverlay.cjs +2 -2
  14. package/dist/canvas/components/StageNode/StageTaskDragOverlay.d.ts.map +1 -1
  15. package/dist/canvas/components/StageNode/StageTaskDragOverlay.js +1 -1
  16. package/dist/canvas/components/StageNode/TaskContent.cjs +273 -0
  17. package/dist/canvas/components/StageNode/TaskContent.d.ts +9 -0
  18. package/dist/canvas/components/StageNode/TaskContent.d.ts.map +1 -0
  19. package/dist/canvas/components/StageNode/TaskContent.js +229 -0
  20. package/dist/canvas/icons/TimelinePlayIcon.cjs +1 -1
  21. package/dist/canvas/icons/TimelinePlayIcon.js +1 -1
  22. package/dist/canvas/icons/index.cjs +1 -5
  23. package/dist/canvas/icons/index.d.ts +0 -1
  24. package/dist/canvas/icons/index.d.ts.map +1 -1
  25. package/dist/canvas/icons/index.js +1 -2
  26. package/package.json +4 -4
  27. package/dist/canvas/icons/PlayIcon.cjs +0 -46
  28. package/dist/canvas/icons/PlayIcon.d.ts +0 -5
  29. package/dist/canvas/icons/PlayIcon.d.ts.map +0 -1
  30. package/dist/canvas/icons/PlayIcon.js +0 -12
@@ -2135,15 +2135,75 @@ const AdhocTasks = {
2135
2135
  [
2136
2136
  {
2137
2137
  id: '3',
2138
+ label: 'Adhoc - Bkgd Check',
2139
+ icon: /*#__PURE__*/ jsx(VerificationIcon, {}),
2140
+ isAdhoc: true
2141
+ }
2142
+ ],
2143
+ [
2144
+ {
2145
+ id: '4',
2146
+ label: 'Adhoc - Review Docs',
2147
+ icon: /*#__PURE__*/ jsx(DocumentIcon, {}),
2148
+ isAdhoc: true
2149
+ }
2150
+ ],
2151
+ [
2152
+ {
2153
+ id: '5',
2138
2154
  label: 'Regular Processing',
2139
2155
  icon: /*#__PURE__*/ jsx(ProcessIcon, {})
2140
2156
  }
2141
2157
  ]
2142
2158
  ]
2143
2159
  },
2144
- onTaskPlay: (taskId)=>{
2145
- console.log(`Play task: ${taskId}`);
2146
- }
2160
+ execution: {
2161
+ stageStatus: {
2162
+ status: 'InProgress',
2163
+ label: 'In progress',
2164
+ duration: 'SLA: 3h 45m'
2165
+ },
2166
+ taskStatus: {
2167
+ 1: {
2168
+ status: 'Completed',
2169
+ label: 'Verify Address',
2170
+ duration: '1h 20m',
2171
+ retryDuration: '35m',
2172
+ badge: 'Reworked',
2173
+ badgeStatus: 'warning',
2174
+ retryCount: 2
2175
+ },
2176
+ 2: {
2177
+ status: 'Failed',
2178
+ label: 'Verify Identity',
2179
+ duration: '45m',
2180
+ message: 'Identity verification failed - document expired',
2181
+ badge: 'Action needed',
2182
+ badgeStatus: 'error'
2183
+ },
2184
+ 3: {
2185
+ status: 'InProgress',
2186
+ label: 'Background Check'
2187
+ },
2188
+ 4: {
2189
+ status: 'InProgress',
2190
+ label: 'Review Docs',
2191
+ duration: '30m',
2192
+ retryDuration: '10m',
2193
+ badge: 'Reworked',
2194
+ badgeStatus: 'info',
2195
+ retryCount: 1
2196
+ },
2197
+ 5: {
2198
+ status: 'InProgress',
2199
+ label: 'Regular Processing'
2200
+ }
2201
+ }
2202
+ },
2203
+ onTaskPlay: (taskId)=>new Promise((resolve)=>setTimeout(()=>{
2204
+ resolve();
2205
+ console.log(`Play task: ${taskId}`);
2206
+ }, 5000))
2147
2207
  }
2148
2208
  }
2149
2209
  ]
@@ -31,8 +31,8 @@ const core_namespaceObject = require("@dnd-kit/core");
31
31
  const react_cjs_namespaceObject = require("../../xyflow/react.cjs");
32
32
  const external_react_namespaceObject = require("react");
33
33
  const external_react_dom_namespaceObject = require("react-dom");
34
- const external_DraggableTask_cjs_namespaceObject = require("./DraggableTask.cjs");
35
34
  const external_StageNode_styles_cjs_namespaceObject = require("./StageNode.styles.cjs");
35
+ const external_TaskContent_cjs_namespaceObject = require("./TaskContent.cjs");
36
36
  const StageTaskDragOverlay = ({ activeTask, isActiveTaskParallel, taskWidthStyle })=>{
37
37
  const zoom = (0, react_cjs_namespaceObject.useStore)((state)=>state.transform[2]);
38
38
  const dragOverlayStyle = (0, external_react_namespaceObject.useMemo)(()=>({
@@ -52,7 +52,7 @@ const StageTaskDragOverlay = ({ activeTask, isActiveTaskParallel, taskWidthStyle
52
52
  cursor: 'grabbing',
53
53
  ...taskWidthStyle
54
54
  },
55
- children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_DraggableTask_cjs_namespaceObject.TaskContent, {
55
+ children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_TaskContent_cjs_namespaceObject.TaskContent, {
56
56
  task: activeTask,
57
57
  isDragging: true
58
58
  })
@@ -1 +1 @@
1
- {"version":3,"file":"StageTaskDragOverlay.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageTaskDragOverlay.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AAEnE,eAAO,MAAM,oBAAoB,GAAI,uDAIlC,yBAAyB,uCA4B3B,CAAC"}
1
+ {"version":3,"file":"StageTaskDragOverlay.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageTaskDragOverlay.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AAGnE,eAAO,MAAM,oBAAoB,GAAI,uDAIlC,yBAAyB,uCA4B3B,CAAC"}
@@ -3,8 +3,8 @@ import { DragOverlay } from "@dnd-kit/core";
3
3
  import { useStore } from "../../xyflow/react.js";
4
4
  import { useMemo } from "react";
5
5
  import { createPortal } from "react-dom";
6
- import { TaskContent } from "./DraggableTask.js";
7
6
  import { StageTask } from "./StageNode.styles.js";
7
+ import { TaskContent } from "./TaskContent.js";
8
8
  const StageTaskDragOverlay = ({ activeTask, isActiveTaskParallel, taskWidthStyle })=>{
9
9
  const zoom = useStore((state)=>state.transform[2]);
10
10
  const dragOverlayStyle = useMemo(()=>({
@@ -0,0 +1,273 @@
1
+ "use strict";
2
+ var __webpack_require__ = {};
3
+ (()=>{
4
+ __webpack_require__.n = (module)=>{
5
+ var getter = module && module.__esModule ? ()=>module['default'] : ()=>module;
6
+ __webpack_require__.d(getter, {
7
+ a: getter
8
+ });
9
+ return getter;
10
+ };
11
+ })();
12
+ (()=>{
13
+ __webpack_require__.d = (exports1, definition)=>{
14
+ for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
15
+ enumerable: true,
16
+ get: definition[key]
17
+ });
18
+ };
19
+ })();
20
+ (()=>{
21
+ __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
22
+ })();
23
+ (()=>{
24
+ __webpack_require__.r = (exports1)=>{
25
+ if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
26
+ value: 'Module'
27
+ });
28
+ Object.defineProperty(exports1, '__esModule', {
29
+ value: true
30
+ });
31
+ };
32
+ })();
33
+ var __webpack_exports__ = {};
34
+ __webpack_require__.r(__webpack_exports__);
35
+ __webpack_require__.d(__webpack_exports__, {
36
+ TaskContent: ()=>TaskContent
37
+ });
38
+ const jsx_runtime_namespaceObject = require("react/jsx-runtime");
39
+ const apollo_core_namespaceObject = require("@uipath/apollo-core");
40
+ const index_cjs_namespaceObject = require("../../layouts/index.cjs");
41
+ const external_material_index_cjs_namespaceObject = require("../../../material/index.cjs");
42
+ const external_debounce_namespaceObject = require("debounce");
43
+ var external_debounce_default = /*#__PURE__*/ __webpack_require__.n(external_debounce_namespaceObject);
44
+ const external_react_namespaceObject = require("react");
45
+ const external_icons_index_cjs_namespaceObject = require("../../icons/index.cjs");
46
+ const external_ExecutionStatusIcon_index_cjs_namespaceObject = require("../ExecutionStatusIcon/index.cjs");
47
+ const external_StageNode_styles_cjs_namespaceObject = require("./StageNode.styles.cjs");
48
+ const ProcessNodeIcon = ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("svg", {
49
+ viewBox: "0 0 24 24",
50
+ fill: "none",
51
+ stroke: "currentColor",
52
+ strokeWidth: "1.5",
53
+ children: [
54
+ /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("rect", {
55
+ x: "3",
56
+ y: "3",
57
+ width: "7",
58
+ height: "7",
59
+ rx: "1"
60
+ }),
61
+ /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("rect", {
62
+ x: "14",
63
+ y: "3",
64
+ width: "7",
65
+ height: "7",
66
+ rx: "1"
67
+ }),
68
+ /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("rect", {
69
+ x: "3",
70
+ y: "14",
71
+ width: "7",
72
+ height: "7",
73
+ rx: "1"
74
+ }),
75
+ /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("rect", {
76
+ x: "14",
77
+ y: "14",
78
+ width: "7",
79
+ height: "7",
80
+ rx: "1"
81
+ })
82
+ ]
83
+ });
84
+ const generateBadgeText = (taskExecution)=>{
85
+ if (!taskExecution.badge) return;
86
+ if (taskExecution.retryCount && taskExecution.retryCount > 1) return `${taskExecution.badge} x${taskExecution.retryCount}`;
87
+ return taskExecution.badge;
88
+ };
89
+ const TaskPlayButton = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(({ taskId, onTaskPlay, small })=>{
90
+ const [playLoading, setPlayLoading] = (0, external_react_namespaceObject.useState)(false);
91
+ const debouncedTaskPlay = (0, external_react_namespaceObject.useMemo)(()=>external_debounce_default()(async (id)=>{
92
+ setPlayLoading(true);
93
+ try {
94
+ await onTaskPlay(id);
95
+ } catch {} finally{
96
+ setPlayLoading(false);
97
+ }
98
+ }, 500, {
99
+ immediate: true
100
+ }), [
101
+ onTaskPlay
102
+ ]);
103
+ const handlePlayClick = (0, external_react_namespaceObject.useCallback)((e)=>{
104
+ e.stopPropagation();
105
+ e.preventDefault();
106
+ debouncedTaskPlay(taskId);
107
+ }, [
108
+ debouncedTaskPlay,
109
+ taskId
110
+ ]);
111
+ const iconSize = small ? 18 : 22;
112
+ const buttonSize = small ? '20px' : apollo_core_namespaceObject.Spacing.SpacingL;
113
+ return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTooltip, {
114
+ content: "Trigger task",
115
+ placement: "top",
116
+ children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApIconButton, {
117
+ "data-testid": `stage-task-play-${taskId}`,
118
+ onClick: handlePlayClick,
119
+ onMouseDown: (e)=>e.stopPropagation(),
120
+ onKeyDown: (e)=>e.stopPropagation(),
121
+ className: "task-menu-icon-button",
122
+ sx: {
123
+ color: 'var(--uix-canvas-icon-default) !important',
124
+ minWidth: 'unset !important',
125
+ width: `${buttonSize} !important`,
126
+ height: `${buttonSize} !important`,
127
+ padding: '0 !important',
128
+ ...small && {
129
+ marginRight: '-2px'
130
+ }
131
+ },
132
+ children: playLoading ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApCircularProgress, {
133
+ size: iconSize - 2
134
+ }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_icons_index_cjs_namespaceObject.TimelinePlayIcon, {
135
+ w: iconSize,
136
+ h: iconSize
137
+ })
138
+ })
139
+ });
140
+ });
141
+ const TaskContent = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(({ task, taskExecution, isDragging, onTaskPlay })=>{
142
+ const hasExecutionStatus = !!taskExecution?.status;
143
+ const hasSecondRowContent = taskExecution && (taskExecution.duration || taskExecution.retryDuration || taskExecution.badge);
144
+ const showPlayButtonSmall = onTaskPlay && hasExecutionStatus;
145
+ return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(jsx_runtime_namespaceObject.Fragment, {
146
+ children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(index_cjs_namespaceObject.Column, {
147
+ flex: 1,
148
+ style: {
149
+ overflow: 'hidden',
150
+ textOverflow: 'ellipsis',
151
+ whiteSpace: 'nowrap'
152
+ },
153
+ gap: apollo_core_namespaceObject.Padding.PadXs,
154
+ children: [
155
+ /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(index_cjs_namespaceObject.Row, {
156
+ align: "center",
157
+ justify: "space-between",
158
+ children: [
159
+ /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(index_cjs_namespaceObject.Row, {
160
+ gap: apollo_core_namespaceObject.Spacing.SpacingXs,
161
+ align: "center",
162
+ style: {
163
+ overflow: 'hidden',
164
+ textOverflow: 'ellipsis',
165
+ whiteSpace: 'nowrap'
166
+ },
167
+ children: [
168
+ /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_styles_cjs_namespaceObject.StageTaskIcon, {
169
+ children: task.icon ?? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ProcessNodeIcon, {})
170
+ }),
171
+ /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTooltip, {
172
+ content: task.label,
173
+ placement: "top",
174
+ smartTooltip: true,
175
+ ...isDragging && {
176
+ isOpen: false
177
+ },
178
+ children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTypography, {
179
+ variant: apollo_core_namespaceObject.FontVariantToken.fontSizeM,
180
+ color: "var(--uix-canvas-foreground)",
181
+ style: {
182
+ overflow: 'hidden',
183
+ textOverflow: 'ellipsis',
184
+ whiteSpace: 'nowrap'
185
+ },
186
+ children: task.label
187
+ })
188
+ })
189
+ ]
190
+ }),
191
+ /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(index_cjs_namespaceObject.Row, {
192
+ align: "center",
193
+ gap: apollo_core_namespaceObject.Spacing.SpacingXs,
194
+ style: {
195
+ flexShrink: 0
196
+ },
197
+ children: [
198
+ hasExecutionStatus && (taskExecution.message ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTooltip, {
199
+ content: taskExecution.message,
200
+ placement: "top",
201
+ children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApIconButton, {
202
+ size: "small",
203
+ children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_ExecutionStatusIcon_index_cjs_namespaceObject.ExecutionStatusIcon, {
204
+ status: taskExecution.status
205
+ })
206
+ })
207
+ }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_ExecutionStatusIcon_index_cjs_namespaceObject.ExecutionStatusIcon, {
208
+ status: taskExecution.status
209
+ })),
210
+ showPlayButtonSmall && !hasSecondRowContent && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(TaskPlayButton, {
211
+ taskId: task.id,
212
+ onTaskPlay: onTaskPlay,
213
+ small: true
214
+ }),
215
+ onTaskPlay && !hasExecutionStatus && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(TaskPlayButton, {
216
+ taskId: task.id,
217
+ onTaskPlay: onTaskPlay
218
+ })
219
+ ]
220
+ })
221
+ ]
222
+ }),
223
+ taskExecution && hasSecondRowContent && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(index_cjs_namespaceObject.Row, {
224
+ align: "center",
225
+ justify: "space-between",
226
+ children: [
227
+ /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(index_cjs_namespaceObject.Row, {
228
+ gap: '2px',
229
+ children: [
230
+ taskExecution?.duration && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTypography, {
231
+ variant: apollo_core_namespaceObject.FontVariantToken.fontSizeS,
232
+ color: "var(--uix-canvas-foreground-de-emp)",
233
+ children: taskExecution.duration
234
+ }),
235
+ taskExecution?.retryDuration && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_styles_cjs_namespaceObject.StageTaskRetryDuration, {
236
+ status: taskExecution.badgeStatus ?? 'warning',
237
+ children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTypography, {
238
+ variant: apollo_core_namespaceObject.FontVariantToken.fontSizeS,
239
+ color: "inherit",
240
+ children: `(+${taskExecution.retryDuration})`
241
+ })
242
+ })
243
+ ]
244
+ }),
245
+ /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(index_cjs_namespaceObject.Row, {
246
+ align: "center",
247
+ gap: apollo_core_namespaceObject.Spacing.SpacingXs,
248
+ children: [
249
+ taskExecution?.badge && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApBadge, {
250
+ size: external_material_index_cjs_namespaceObject.BadgeSize.SMALL,
251
+ status: taskExecution.badgeStatus,
252
+ label: generateBadgeText(taskExecution) ?? ''
253
+ }),
254
+ showPlayButtonSmall && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(TaskPlayButton, {
255
+ taskId: task.id,
256
+ onTaskPlay: onTaskPlay,
257
+ small: true
258
+ })
259
+ ]
260
+ })
261
+ ]
262
+ })
263
+ ]
264
+ })
265
+ });
266
+ });
267
+ exports.TaskContent = __webpack_exports__.TaskContent;
268
+ for(var __rspack_i in __webpack_exports__)if (-1 === [
269
+ "TaskContent"
270
+ ].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
271
+ Object.defineProperty(exports, '__esModule', {
272
+ value: true
273
+ });
@@ -0,0 +1,9 @@
1
+ import type { StageTaskExecution, StageTaskItem } from './StageNode.types';
2
+ export interface TaskContentProps {
3
+ task: StageTaskItem;
4
+ taskExecution?: StageTaskExecution;
5
+ isDragging?: boolean;
6
+ onTaskPlay?: (taskId: string) => Promise<void>;
7
+ }
8
+ export declare const TaskContent: import("react").MemoExoticComponent<({ task, taskExecution, isDragging, onTaskPlay }: TaskContentProps) => import("react/jsx-runtime").JSX.Element>;
9
+ //# sourceMappingURL=TaskContent.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TaskContent.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/TaskContent.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AA4F3E,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,aAAa,CAAC;IACpB,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CAChD;AAED,eAAO,MAAM,WAAW,wFAC4B,gBAAgB,6CA6FnE,CAAC"}
@@ -0,0 +1,229 @@
1
+ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
2
+ import { FontVariantToken, Padding, Spacing } from "@uipath/apollo-core";
3
+ import { Column, Row } from "../../layouts/index.js";
4
+ import { ApBadge, ApCircularProgress, ApIconButton, ApTooltip, ApTypography, BadgeSize } from "../../../material/index.js";
5
+ import debounce from "debounce";
6
+ import { memo, useCallback, useMemo, useState } from "react";
7
+ import { TimelinePlayIcon } from "../../icons/index.js";
8
+ import { ExecutionStatusIcon } from "../ExecutionStatusIcon/index.js";
9
+ import { StageTaskIcon, StageTaskRetryDuration } from "./StageNode.styles.js";
10
+ const ProcessNodeIcon = ()=>/*#__PURE__*/ jsxs("svg", {
11
+ viewBox: "0 0 24 24",
12
+ fill: "none",
13
+ stroke: "currentColor",
14
+ strokeWidth: "1.5",
15
+ children: [
16
+ /*#__PURE__*/ jsx("rect", {
17
+ x: "3",
18
+ y: "3",
19
+ width: "7",
20
+ height: "7",
21
+ rx: "1"
22
+ }),
23
+ /*#__PURE__*/ jsx("rect", {
24
+ x: "14",
25
+ y: "3",
26
+ width: "7",
27
+ height: "7",
28
+ rx: "1"
29
+ }),
30
+ /*#__PURE__*/ jsx("rect", {
31
+ x: "3",
32
+ y: "14",
33
+ width: "7",
34
+ height: "7",
35
+ rx: "1"
36
+ }),
37
+ /*#__PURE__*/ jsx("rect", {
38
+ x: "14",
39
+ y: "14",
40
+ width: "7",
41
+ height: "7",
42
+ rx: "1"
43
+ })
44
+ ]
45
+ });
46
+ const generateBadgeText = (taskExecution)=>{
47
+ if (!taskExecution.badge) return;
48
+ if (taskExecution.retryCount && taskExecution.retryCount > 1) return `${taskExecution.badge} x${taskExecution.retryCount}`;
49
+ return taskExecution.badge;
50
+ };
51
+ const TaskPlayButton = /*#__PURE__*/ memo(({ taskId, onTaskPlay, small })=>{
52
+ const [playLoading, setPlayLoading] = useState(false);
53
+ const debouncedTaskPlay = useMemo(()=>debounce(async (id)=>{
54
+ setPlayLoading(true);
55
+ try {
56
+ await onTaskPlay(id);
57
+ } catch {} finally{
58
+ setPlayLoading(false);
59
+ }
60
+ }, 500, {
61
+ immediate: true
62
+ }), [
63
+ onTaskPlay
64
+ ]);
65
+ const handlePlayClick = useCallback((e)=>{
66
+ e.stopPropagation();
67
+ e.preventDefault();
68
+ debouncedTaskPlay(taskId);
69
+ }, [
70
+ debouncedTaskPlay,
71
+ taskId
72
+ ]);
73
+ const iconSize = small ? 18 : 22;
74
+ const buttonSize = small ? '20px' : Spacing.SpacingL;
75
+ return /*#__PURE__*/ jsx(ApTooltip, {
76
+ content: "Trigger task",
77
+ placement: "top",
78
+ children: /*#__PURE__*/ jsx(ApIconButton, {
79
+ "data-testid": `stage-task-play-${taskId}`,
80
+ onClick: handlePlayClick,
81
+ onMouseDown: (e)=>e.stopPropagation(),
82
+ onKeyDown: (e)=>e.stopPropagation(),
83
+ className: "task-menu-icon-button",
84
+ sx: {
85
+ color: 'var(--uix-canvas-icon-default) !important',
86
+ minWidth: 'unset !important',
87
+ width: `${buttonSize} !important`,
88
+ height: `${buttonSize} !important`,
89
+ padding: '0 !important',
90
+ ...small && {
91
+ marginRight: '-2px'
92
+ }
93
+ },
94
+ children: playLoading ? /*#__PURE__*/ jsx(ApCircularProgress, {
95
+ size: iconSize - 2
96
+ }) : /*#__PURE__*/ jsx(TimelinePlayIcon, {
97
+ w: iconSize,
98
+ h: iconSize
99
+ })
100
+ })
101
+ });
102
+ });
103
+ const TaskContent = /*#__PURE__*/ memo(({ task, taskExecution, isDragging, onTaskPlay })=>{
104
+ const hasExecutionStatus = !!taskExecution?.status;
105
+ const hasSecondRowContent = taskExecution && (taskExecution.duration || taskExecution.retryDuration || taskExecution.badge);
106
+ const showPlayButtonSmall = onTaskPlay && hasExecutionStatus;
107
+ return /*#__PURE__*/ jsx(Fragment, {
108
+ children: /*#__PURE__*/ jsxs(Column, {
109
+ flex: 1,
110
+ style: {
111
+ overflow: 'hidden',
112
+ textOverflow: 'ellipsis',
113
+ whiteSpace: 'nowrap'
114
+ },
115
+ gap: Padding.PadXs,
116
+ children: [
117
+ /*#__PURE__*/ jsxs(Row, {
118
+ align: "center",
119
+ justify: "space-between",
120
+ children: [
121
+ /*#__PURE__*/ jsxs(Row, {
122
+ gap: Spacing.SpacingXs,
123
+ align: "center",
124
+ style: {
125
+ overflow: 'hidden',
126
+ textOverflow: 'ellipsis',
127
+ whiteSpace: 'nowrap'
128
+ },
129
+ children: [
130
+ /*#__PURE__*/ jsx(StageTaskIcon, {
131
+ children: task.icon ?? /*#__PURE__*/ jsx(ProcessNodeIcon, {})
132
+ }),
133
+ /*#__PURE__*/ jsx(ApTooltip, {
134
+ content: task.label,
135
+ placement: "top",
136
+ smartTooltip: true,
137
+ ...isDragging && {
138
+ isOpen: false
139
+ },
140
+ children: /*#__PURE__*/ jsx(ApTypography, {
141
+ variant: FontVariantToken.fontSizeM,
142
+ color: "var(--uix-canvas-foreground)",
143
+ style: {
144
+ overflow: 'hidden',
145
+ textOverflow: 'ellipsis',
146
+ whiteSpace: 'nowrap'
147
+ },
148
+ children: task.label
149
+ })
150
+ })
151
+ ]
152
+ }),
153
+ /*#__PURE__*/ jsxs(Row, {
154
+ align: "center",
155
+ gap: Spacing.SpacingXs,
156
+ style: {
157
+ flexShrink: 0
158
+ },
159
+ children: [
160
+ hasExecutionStatus && (taskExecution.message ? /*#__PURE__*/ jsx(ApTooltip, {
161
+ content: taskExecution.message,
162
+ placement: "top",
163
+ children: /*#__PURE__*/ jsx(ApIconButton, {
164
+ size: "small",
165
+ children: /*#__PURE__*/ jsx(ExecutionStatusIcon, {
166
+ status: taskExecution.status
167
+ })
168
+ })
169
+ }) : /*#__PURE__*/ jsx(ExecutionStatusIcon, {
170
+ status: taskExecution.status
171
+ })),
172
+ showPlayButtonSmall && !hasSecondRowContent && /*#__PURE__*/ jsx(TaskPlayButton, {
173
+ taskId: task.id,
174
+ onTaskPlay: onTaskPlay,
175
+ small: true
176
+ }),
177
+ onTaskPlay && !hasExecutionStatus && /*#__PURE__*/ jsx(TaskPlayButton, {
178
+ taskId: task.id,
179
+ onTaskPlay: onTaskPlay
180
+ })
181
+ ]
182
+ })
183
+ ]
184
+ }),
185
+ taskExecution && hasSecondRowContent && /*#__PURE__*/ jsxs(Row, {
186
+ align: "center",
187
+ justify: "space-between",
188
+ children: [
189
+ /*#__PURE__*/ jsxs(Row, {
190
+ gap: '2px',
191
+ children: [
192
+ taskExecution?.duration && /*#__PURE__*/ jsx(ApTypography, {
193
+ variant: FontVariantToken.fontSizeS,
194
+ color: "var(--uix-canvas-foreground-de-emp)",
195
+ children: taskExecution.duration
196
+ }),
197
+ taskExecution?.retryDuration && /*#__PURE__*/ jsx(StageTaskRetryDuration, {
198
+ status: taskExecution.badgeStatus ?? 'warning',
199
+ children: /*#__PURE__*/ jsx(ApTypography, {
200
+ variant: FontVariantToken.fontSizeS,
201
+ color: "inherit",
202
+ children: `(+${taskExecution.retryDuration})`
203
+ })
204
+ })
205
+ ]
206
+ }),
207
+ /*#__PURE__*/ jsxs(Row, {
208
+ align: "center",
209
+ gap: Spacing.SpacingXs,
210
+ children: [
211
+ taskExecution?.badge && /*#__PURE__*/ jsx(ApBadge, {
212
+ size: BadgeSize.SMALL,
213
+ status: taskExecution.badgeStatus,
214
+ label: generateBadgeText(taskExecution) ?? ''
215
+ }),
216
+ showPlayButtonSmall && /*#__PURE__*/ jsx(TaskPlayButton, {
217
+ taskId: task.id,
218
+ onTaskPlay: onTaskPlay,
219
+ small: true
220
+ })
221
+ ]
222
+ })
223
+ ]
224
+ })
225
+ ]
226
+ })
227
+ });
228
+ });
229
+ export { TaskContent };
@@ -27,7 +27,7 @@ __webpack_require__.d(__webpack_exports__, {
27
27
  TimelinePlayIcon: ()=>TimelinePlayIcon
28
28
  });
29
29
  const jsx_runtime_namespaceObject = require("react/jsx-runtime");
30
- const TimelinePlayIcon = ({ w = 24, h = 25, color = '#526069' })=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("svg", {
30
+ const TimelinePlayIcon = ({ w = 24, h = 25, color = 'currentColor' })=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("svg", {
31
31
  "data-testid": "timeline-play-icon",
32
32
  xmlns: "http://www.w3.org/2000/svg",
33
33
  width: w,
@@ -1,5 +1,5 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
- const TimelinePlayIcon = ({ w = 24, h = 25, color = '#526069' })=>/*#__PURE__*/ jsx("svg", {
2
+ const TimelinePlayIcon = ({ w = 24, h = 25, color = 'currentColor' })=>/*#__PURE__*/ jsx("svg", {
3
3
  "data-testid": "timeline-play-icon",
4
4
  xmlns: "http://www.w3.org/2000/svg",
5
5
  width: w,