@orchestrator-ui/orchestrator-ui-components 6.7.3 → 6.7.5
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.
- package/.turbo/turbo-build.log +5 -5
- package/.turbo/turbo-lint.log +1 -1
- package/.turbo/turbo-test.log +9 -9
- package/CHANGELOG.md +14 -0
- package/dist/index.d.ts +4 -2
- package/dist/index.js +667 -638
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
- package/src/components/WfoAgent/WfoAgentChart/WfoAgentLineChart.tsx +2 -0
- package/src/components/WfoAgent/WfoAgentChart/WfoAgentPieChart.tsx +2 -0
- package/src/components/WfoPydanticForm/WfoPydanticForm.tsx +19 -1
- package/src/components/WfoPydanticForm/fields/WfoCallout.tsx +23 -0
- package/src/components/WfoPydanticForm/fields/index.ts +1 -0
- package/src/components/WfoWorkflowSteps/WfoStep/WfoCodeViewSelector.tsx +35 -25
- package/src/configuration/version.ts +1 -1
- package/src/messages/en-GB.json +1 -1
- package/src/messages/nl-NL.json +1 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@orchestrator-ui/orchestrator-ui-components",
|
|
3
|
-
"version": "6.7.
|
|
3
|
+
"version": "6.7.5",
|
|
4
4
|
"license": "Apache-2.0",
|
|
5
5
|
"description": "Library of UI Components used to display the workflow orchestrator frontend",
|
|
6
6
|
"author": {
|
|
@@ -54,7 +54,7 @@
|
|
|
54
54
|
"next-query-params": "^5.0.0",
|
|
55
55
|
"object-hash": "^3.0.0",
|
|
56
56
|
"prism-themes": "^1.9.0",
|
|
57
|
-
"pydantic-forms": "^0.
|
|
57
|
+
"pydantic-forms": "^0.10.0",
|
|
58
58
|
"react-diff-view": "^3.2.0",
|
|
59
59
|
"react-draggable": "^4.4.6",
|
|
60
60
|
"react-redux": "^9.1.2",
|
|
@@ -9,6 +9,8 @@ import {
|
|
|
9
9
|
Position,
|
|
10
10
|
Settings,
|
|
11
11
|
} from '@elastic/charts';
|
|
12
|
+
import '@elastic/charts/dist/theme_only_dark.css';
|
|
13
|
+
import '@elastic/charts/dist/theme_only_light.css';
|
|
12
14
|
|
|
13
15
|
import { useOrchestratorTheme } from '@/hooks';
|
|
14
16
|
import { AggregationResultsData } from '@/types';
|
|
@@ -18,7 +18,12 @@ import {
|
|
|
18
18
|
zodValidationPresets,
|
|
19
19
|
} from 'pydantic-forms';
|
|
20
20
|
|
|
21
|
-
import {
|
|
21
|
+
import {
|
|
22
|
+
PATH_TASKS,
|
|
23
|
+
PATH_WORKFLOWS,
|
|
24
|
+
WfoCallout,
|
|
25
|
+
WfoLoading,
|
|
26
|
+
} from '@/components';
|
|
22
27
|
import { StartWorkflowPayload } from '@/pages/processes/WfoStartProcessPage';
|
|
23
28
|
import { HttpStatus, isFetchBaseQueryError, isRecord } from '@/rtk';
|
|
24
29
|
import { useStartProcessMutation } from '@/rtk/endpoints/forms';
|
|
@@ -202,6 +207,19 @@ export const useWfoPydanticFormConfig = () => {
|
|
|
202
207
|
},
|
|
203
208
|
validator: zodValidationPresets.multiSelect,
|
|
204
209
|
},
|
|
210
|
+
{
|
|
211
|
+
id: 'callout',
|
|
212
|
+
ElementMatch: {
|
|
213
|
+
isControlledElement: false,
|
|
214
|
+
Element: WfoCallout,
|
|
215
|
+
},
|
|
216
|
+
matcher: ({ type, format }) => {
|
|
217
|
+
return (
|
|
218
|
+
type === PydanticFormFieldType.STRING &&
|
|
219
|
+
format === ('callout' as PydanticFormFieldFormat)
|
|
220
|
+
);
|
|
221
|
+
},
|
|
222
|
+
},
|
|
205
223
|
...currentMatchers
|
|
206
224
|
.filter((matcher) => matcher.id !== 'text')
|
|
207
225
|
.filter((matcher) => matcher.id !== 'array')
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
|
|
3
|
+
import { PydanticFormElementProps } from 'pydantic-forms';
|
|
4
|
+
|
|
5
|
+
import { EuiCallOut } from '@elastic/eui';
|
|
6
|
+
|
|
7
|
+
const CALLOUT_COLORS = ['primary', 'success', 'warning', 'danger', 'accent'];
|
|
8
|
+
|
|
9
|
+
export const WfoCallout = ({ pydanticFormField }: PydanticFormElementProps) => {
|
|
10
|
+
const { header, message, icon_type, message_type } =
|
|
11
|
+
pydanticFormField.default;
|
|
12
|
+
const color = CALLOUT_COLORS.includes(message_type)
|
|
13
|
+
? message_type
|
|
14
|
+
: 'primary';
|
|
15
|
+
|
|
16
|
+
return (
|
|
17
|
+
<div data-testid={pydanticFormField.id} css={{ marginBottom: '2rem' }}>
|
|
18
|
+
<EuiCallOut title={header} iconType={icon_type} color={color}>
|
|
19
|
+
<p>{message}</p>
|
|
20
|
+
</EuiCallOut>
|
|
21
|
+
</div>
|
|
22
|
+
);
|
|
23
|
+
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, { useCallback } from 'react';
|
|
1
|
+
import React, { useCallback, useState } from 'react';
|
|
2
2
|
|
|
3
3
|
import { useTranslations } from 'next-intl';
|
|
4
4
|
|
|
@@ -27,22 +27,26 @@ export const WfoCodeViewSelector = ({
|
|
|
27
27
|
|
|
28
28
|
const isSelected = (buttonView: CodeView): boolean =>
|
|
29
29
|
buttonView === codeView;
|
|
30
|
+
const [showTooltips, setShowTooltips] = useState<boolean>(true);
|
|
30
31
|
|
|
31
32
|
const codeViewOptions = [
|
|
32
33
|
{
|
|
33
34
|
id: CodeView.JSON,
|
|
34
35
|
label: t('codeView.json'),
|
|
36
|
+
onMouseLeave: () => setShowTooltips(true),
|
|
35
37
|
iconType: () => (
|
|
36
|
-
<
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
38
|
+
<div onClick={() => setShowTooltips(false)}>
|
|
39
|
+
<WfoBracketSquare
|
|
40
|
+
color={
|
|
41
|
+
isSelected(CodeView.JSON)
|
|
42
|
+
? theme.colors.ghost
|
|
43
|
+
: theme.colors.textPrimary
|
|
44
|
+
}
|
|
45
|
+
/>
|
|
46
|
+
</div>
|
|
43
47
|
),
|
|
44
48
|
'data-test-id': 'jsonCodeViewButton',
|
|
45
|
-
toolTipContent: t('codeView.json'),
|
|
49
|
+
toolTipContent: showTooltips ? t('codeView.json') : undefined,
|
|
46
50
|
style: {
|
|
47
51
|
backgroundColor: isSelected(CodeView.JSON)
|
|
48
52
|
? theme.colors.textPrimary
|
|
@@ -52,17 +56,20 @@ export const WfoCodeViewSelector = ({
|
|
|
52
56
|
{
|
|
53
57
|
id: CodeView.TABLE,
|
|
54
58
|
label: t('codeView.table'),
|
|
59
|
+
onMouseLeave: () => setShowTooltips(true),
|
|
55
60
|
iconType: () => (
|
|
56
|
-
<
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
61
|
+
<div onClick={() => setShowTooltips(false)}>
|
|
62
|
+
<WfoTableCells
|
|
63
|
+
color={
|
|
64
|
+
isSelected(CodeView.TABLE)
|
|
65
|
+
? theme.colors.ghost
|
|
66
|
+
: theme.colors.textPrimary
|
|
67
|
+
}
|
|
68
|
+
/>
|
|
69
|
+
</div>
|
|
63
70
|
),
|
|
64
71
|
'data-test-id': 'tableCodeViewButton',
|
|
65
|
-
toolTipContent: t('codeView.table'),
|
|
72
|
+
toolTipContent: showTooltips ? t('codeView.table') : undefined,
|
|
66
73
|
style: {
|
|
67
74
|
backgroundColor: isSelected(CodeView.TABLE)
|
|
68
75
|
? theme.colors.textPrimary
|
|
@@ -72,17 +79,20 @@ export const WfoCodeViewSelector = ({
|
|
|
72
79
|
{
|
|
73
80
|
id: CodeView.RAW,
|
|
74
81
|
label: t('codeView.raw'),
|
|
82
|
+
onMouseLeave: () => setShowTooltips(true),
|
|
75
83
|
iconType: () => (
|
|
76
|
-
<
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
84
|
+
<div onClick={() => setShowTooltips(false)}>
|
|
85
|
+
<WfoCommandLine
|
|
86
|
+
color={
|
|
87
|
+
isSelected(CodeView.RAW)
|
|
88
|
+
? theme.colors.ghost
|
|
89
|
+
: theme.colors.textPrimary
|
|
90
|
+
}
|
|
91
|
+
/>
|
|
92
|
+
</div>
|
|
83
93
|
),
|
|
84
94
|
'data-test-id': 'rawCodeViewButton',
|
|
85
|
-
toolTipContent: t('codeView.raw'),
|
|
95
|
+
toolTipContent: showTooltips ? t('codeView.raw') : undefined,
|
|
86
96
|
style: {
|
|
87
97
|
backgroundColor: isSelected(CodeView.RAW)
|
|
88
98
|
? theme.colors.textPrimary
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export const ORCHESTRATOR_UI_LIBRARY_VERSION = '6.7.
|
|
1
|
+
export const ORCHESTRATOR_UI_LIBRARY_VERSION = '6.7.5';
|
package/src/messages/en-GB.json
CHANGED