@configura/debug-react 2.1.0-alpha.3 → 2.2.0-alpha.0
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/.eslintrc.json +5 -5
- package/.postcssrc.json +8 -8
- package/LICENSE +201 -201
- package/dist/LogMessageView.d.ts +5 -5
- package/dist/LogMessageView.js +8 -8
- package/dist/LogMessagesView.d.ts +5 -5
- package/dist/LogMessagesView.js +10 -10
- package/dist/TextualConfigurationView.d.ts +7 -7
- package/dist/TextualConfigurationView.js +58 -58
- package/dist/css/debug.css.map +1 -1
- package/dist/exerciser/Exerciser.d.ts +37 -37
- package/dist/exerciser/Exerciser.js +155 -155
- package/dist/exerciser/ExerciserReportFilterView.d.ts +9 -9
- package/dist/exerciser/ExerciserReportFilterView.js +205 -205
- package/dist/exerciser/ExerciserReportItem.d.ts +10 -10
- package/dist/exerciser/ExerciserReportItem.js +1 -1
- package/dist/exerciser/ExerciserReportItemView.d.ts +6 -6
- package/dist/exerciser/ExerciserReportItemView.js +53 -53
- package/dist/exerciser/ExerciserReportView.d.ts +7 -7
- package/dist/exerciser/ExerciserReportView.js +8 -8
- package/dist/exerciser/ExerciserRun.d.ts +19 -19
- package/dist/exerciser/ExerciserRun.js +158 -158
- package/dist/exerciser/ExerciserSetup.d.ts +15 -15
- package/dist/exerciser/ExerciserSetup.js +54 -54
- package/dist/exerciser/FilterSelect.d.ts +8 -8
- package/dist/exerciser/FilterSelect.js +40 -40
- package/dist/hooks.d.ts +2 -2
- package/dist/hooks.js +7 -7
- package/dist/index.d.ts +12 -12
- package/dist/index.js +12 -12
- package/dist/productConfiguration/DebugAdditionalProductView.d.ts +3 -3
- package/dist/productConfiguration/DebugAdditionalProductView.js +6 -6
- package/dist/productConfiguration/DebugFeatureCommon.d.ts +10 -10
- package/dist/productConfiguration/DebugFeatureCommon.js +35 -35
- package/dist/productConfiguration/DebugFeatureGroupView.d.ts +4 -4
- package/dist/productConfiguration/DebugFeatureGroupView.js +20 -20
- package/dist/productConfiguration/DebugFeatureView.d.ts +4 -4
- package/dist/productConfiguration/DebugFeatureView.js +8 -8
- package/dist/productConfiguration/DebugMiscFileView.d.ts +3 -3
- package/dist/productConfiguration/DebugMiscFileView.js +10 -10
- package/dist/productConfiguration/DebugNoteView.d.ts +3 -3
- package/dist/productConfiguration/DebugNoteView.js +10 -10
- package/dist/productConfiguration/DebugOptionCommon.d.ts +10 -10
- package/dist/productConfiguration/DebugOptionCommon.js +30 -30
- package/dist/productConfiguration/DebugOptionView.d.ts +4 -4
- package/dist/productConfiguration/DebugOptionView.js +8 -8
- package/dist/productConfiguration/DebugProductCommon.d.ts +9 -9
- package/dist/productConfiguration/DebugProductCommon.js +40 -40
- package/dist/productConfiguration/DebugProductConfigurationView.d.ts +16 -16
- package/dist/productConfiguration/DebugProductConfigurationView.js +26 -26
- package/dist/productConfiguration/DebugRowsFactory.d.ts +9 -9
- package/dist/productConfiguration/DebugRowsFactory.js +31 -31
- package/dist/productConfiguration/DebugTable.d.ts +8 -8
- package/dist/productConfiguration/DebugTable.js +8 -8
- package/dist/productConfiguration/debugComponentsHelper.d.ts +3 -3
- package/dist/productConfiguration/debugComponentsHelper.js +36 -36
- package/dist/productConfiguration/index.d.ts +8 -8
- package/dist/productConfiguration/index.js +8 -8
- package/package.json +7 -7
|
@@ -1,205 +1,205 @@
|
|
|
1
|
-
import { LogLevel, mapQueryString, toError } from "@configura/web-utilities";
|
|
2
|
-
import React, { useEffect, useMemo } from "react";
|
|
3
|
-
import { useHistory } from "react-router";
|
|
4
|
-
import { useMemoized, useMemoized2 } from "../hooks.js";
|
|
5
|
-
function getLogFilter(query) {
|
|
6
|
-
const q = mapQueryString(query);
|
|
7
|
-
return {
|
|
8
|
-
filterByRegex: q.get("filterByRegex") || "",
|
|
9
|
-
includeMatches: q.get("includeMatches") ? true : false,
|
|
10
|
-
minimumDuration: q.get("minimumDuration") || "",
|
|
11
|
-
showFlawless: q.get("showFlawless") ? true : false,
|
|
12
|
-
showErrors: q.get("showErrors") ? true : false,
|
|
13
|
-
showWarnings: q.get("showWarnings") ? true : false,
|
|
14
|
-
showInfo: q.get("showInfo") ? true : false,
|
|
15
|
-
filterOutLogMessage: q.get("filterOutLogMessage") || "",
|
|
16
|
-
};
|
|
17
|
-
}
|
|
18
|
-
function serializeBool(key, obj) {
|
|
19
|
-
const val = obj[key];
|
|
20
|
-
return val ? `&${key}=1` : ``;
|
|
21
|
-
}
|
|
22
|
-
function serializeString(key, obj) {
|
|
23
|
-
const val = obj[key];
|
|
24
|
-
return val ? `&${key}=${encodeURIComponent(val)}` : ``;
|
|
25
|
-
}
|
|
26
|
-
function serializeLogFilter(filter) {
|
|
27
|
-
return (serializeString("filterByRegex", filter) +
|
|
28
|
-
serializeBool("includeMatches", filter) +
|
|
29
|
-
serializeString("minimumDuration", filter) +
|
|
30
|
-
serializeBool("showFlawless", filter) +
|
|
31
|
-
serializeBool("showErrors", filter) +
|
|
32
|
-
serializeBool("showWarnings", filter) +
|
|
33
|
-
serializeBool("showInfo", filter) +
|
|
34
|
-
serializeString("filterOutLogMessage", filter)).replace(/^&/, "?");
|
|
35
|
-
}
|
|
36
|
-
function parseRegex(value) {
|
|
37
|
-
try {
|
|
38
|
-
return new RegExp(value, "gi");
|
|
39
|
-
}
|
|
40
|
-
catch (e) {
|
|
41
|
-
return toError(e);
|
|
42
|
-
}
|
|
43
|
-
}
|
|
44
|
-
function parseNumber(value) {
|
|
45
|
-
return value === "" ? 0 : Math.floor(parseFloat(value));
|
|
46
|
-
}
|
|
47
|
-
function parseSet(value) {
|
|
48
|
-
return new Set(value
|
|
49
|
-
.split(",")
|
|
50
|
-
.map((p) => parseInt(p))
|
|
51
|
-
.filter((n) => !Number.isNaN(n)));
|
|
52
|
-
}
|
|
53
|
-
function spaceCamel(camelCase) {
|
|
54
|
-
return camelCase.replace(/([A-Z][a-z])/g, " $1");
|
|
55
|
-
}
|
|
56
|
-
function BoolFilter(props) {
|
|
57
|
-
const { name, value } = props;
|
|
58
|
-
return (React.createElement("div", { className: "cfgExerciserControl" },
|
|
59
|
-
React.createElement("label", { htmlFor: name, className: "cfgExerciserControl__label" },
|
|
60
|
-
React.createElement("input", { id: name, type: "checkbox", checked: !value, onChange: (event) => props.updateFilter(name, !event.target.checked) }),
|
|
61
|
-
" ",
|
|
62
|
-
spaceCamel(name))));
|
|
63
|
-
}
|
|
64
|
-
function RegExpFilter(props) {
|
|
65
|
-
const { name, value, parsed } = props;
|
|
66
|
-
const err = parsed instanceof Error && parsed;
|
|
67
|
-
return (React.createElement("div", { className: "cfgExerciserControl" },
|
|
68
|
-
React.createElement("label", { htmlFor: name, className: "cfgExerciserControl__label" }, spaceCamel(name)),
|
|
69
|
-
React.createElement("input", { id: name, type: "text", value: value, onChange: (event) => props.updateFilter(name, event.target.value) }),
|
|
70
|
-
err && React.createElement("div", { className: "cfgExerciserControl__error" },
|
|
71
|
-
" ",
|
|
72
|
-
err.message)));
|
|
73
|
-
}
|
|
74
|
-
function NumberFilter(props) {
|
|
75
|
-
const { name, value, parsed } = props;
|
|
76
|
-
return (React.createElement("div", { className: "cfgExerciserControl" },
|
|
77
|
-
React.createElement("label", { htmlFor: name, className: "cfgExerciserControl__label" }, spaceCamel(name)),
|
|
78
|
-
React.createElement("input", { id: name, type: "text", value: value, onChange: (event) => props.updateFilter(name, event.target.value) }),
|
|
79
|
-
Number.isNaN(parsed) && (React.createElement("div", { className: "cfgExerciserControl__error" },
|
|
80
|
-
" ",
|
|
81
|
-
value,
|
|
82
|
-
" is not a number"))));
|
|
83
|
-
}
|
|
84
|
-
function sortMap(map, sort) {
|
|
85
|
-
return Array.from(map).sort(sort);
|
|
86
|
-
}
|
|
87
|
-
const sortLogMessages = (l, r) => {
|
|
88
|
-
const [, lMessageAndLevel] = l;
|
|
89
|
-
const [, rMessageAndLevel] = r;
|
|
90
|
-
const lLevel = lMessageAndLevel.level;
|
|
91
|
-
const rLevel = rMessageAndLevel.level;
|
|
92
|
-
if (lLevel !== rLevel) {
|
|
93
|
-
return lLevel.localeCompare(rLevel);
|
|
94
|
-
}
|
|
95
|
-
const lMessage = lMessageAndLevel.message;
|
|
96
|
-
const rMessage = rMessageAndLevel.message;
|
|
97
|
-
if (lMessage === rMessage) {
|
|
98
|
-
return 0;
|
|
99
|
-
}
|
|
100
|
-
return lMessage.toLocaleLowerCase().localeCompare(rMessage.toLocaleLowerCase());
|
|
101
|
-
};
|
|
102
|
-
function LogMessageFilter(props) {
|
|
103
|
-
const { name, parsed } = props;
|
|
104
|
-
const messages = useMemoized2(sortMap, props.logMessageMap, sortLogMessages);
|
|
105
|
-
return (React.createElement("div", null, messages.length === 0 ? (React.createElement("p", null, "No messages yet.")) : (messages.map(([hash, { level, count, message }]) => {
|
|
106
|
-
const id = `${name}-${hash}`;
|
|
107
|
-
return (React.createElement("label", { key: id, className: `cfgDebugLog__item--severity${level} cfgExerciserFilter__logMessage cfgExerciserControl`, htmlFor: id },
|
|
108
|
-
React.createElement("input", { id: id, type: "checkbox", onChange: (event) => {
|
|
109
|
-
const next = new Set(parsed);
|
|
110
|
-
event.target.checked ? next.delete(hash) : next.add(hash);
|
|
111
|
-
props.updateFilter(name, Array.from(next.keys()).join(","));
|
|
112
|
-
}, checked: !parsed.has(hash) }),
|
|
113
|
-
React.createElement("span", null, count),
|
|
114
|
-
" × ",
|
|
115
|
-
React.createElement("span", null, message)));
|
|
116
|
-
}))));
|
|
117
|
-
}
|
|
118
|
-
function applyLogFilter(allReportItems, filterStringParsed, includeMatches, filterDurationParsed, showFlawless, showErrors, showWarnings, showInfo, filterOutLogMessageParsed) {
|
|
119
|
-
if (filterStringParsed instanceof Error || Number.isNaN(filterDurationParsed)) {
|
|
120
|
-
return allReportItems;
|
|
121
|
-
}
|
|
122
|
-
return allReportItems.filter((item) => {
|
|
123
|
-
const { duration, logMessages, productUrl } = item;
|
|
124
|
-
if (isFinite(filterDurationParsed) &&
|
|
125
|
-
0 < filterDurationParsed &&
|
|
126
|
-
duration !== undefined &&
|
|
127
|
-
duration < filterDurationParsed) {
|
|
128
|
-
return false;
|
|
129
|
-
}
|
|
130
|
-
const hasError = (logMessages || []).some((logMessage) => logMessage.level === LogLevel.Error);
|
|
131
|
-
const hasWarning = (logMessages || []).some((logMessage) => logMessage.level === LogLevel.Warn);
|
|
132
|
-
const hasInfo = (logMessages || []).some((logMessage) => logMessage.level === LogLevel.Info);
|
|
133
|
-
if (!((!showFlawless && !hasError && !hasWarning) ||
|
|
134
|
-
(!showErrors && hasError) ||
|
|
135
|
-
(!showWarnings && hasWarning) ||
|
|
136
|
-
(!showInfo && hasInfo))) {
|
|
137
|
-
return false;
|
|
138
|
-
}
|
|
139
|
-
if (logMessages.length !== 0 &&
|
|
140
|
-
logMessages.every((logMessage) => filterOutLogMessageParsed.has(logMessage.levelMessageHash))) {
|
|
141
|
-
return false;
|
|
142
|
-
}
|
|
143
|
-
const filterText = productUrl +
|
|
144
|
-
" " +
|
|
145
|
-
(logMessages || []).reduce((a, logMessage) => {
|
|
146
|
-
a += logMessage.message + " ";
|
|
147
|
-
a += logMessage.optionalParams.join(" ");
|
|
148
|
-
return a;
|
|
149
|
-
}, "");
|
|
150
|
-
if (includeMatches === filterStringParsed.test(filterText)) {
|
|
151
|
-
return false;
|
|
152
|
-
}
|
|
153
|
-
return true;
|
|
154
|
-
});
|
|
155
|
-
}
|
|
156
|
-
export const ExerciserReportFilterView = (props) => {
|
|
157
|
-
const { className, logMessageMap, allReportItems, setFilteredReportItems } = props;
|
|
158
|
-
const history = useHistory();
|
|
159
|
-
const filter = getLogFilter(history.location.search);
|
|
160
|
-
const serialized = serializeLogFilter(filter);
|
|
161
|
-
useEffect(() => {
|
|
162
|
-
history.replace(history.location.pathname + serialized);
|
|
163
|
-
}, [history, serialized]);
|
|
164
|
-
function updateFilter(key, val) {
|
|
165
|
-
const newFilter = Object.assign({}, filter);
|
|
166
|
-
newFilter[key] = val;
|
|
167
|
-
const serialized = serializeLogFilter(newFilter);
|
|
168
|
-
history.replace(history.location.pathname + serialized);
|
|
169
|
-
}
|
|
170
|
-
const { minimumDuration, showErrors, showFlawless, includeMatches, filterOutLogMessage, filterByRegex, showWarnings, showInfo, } = filter;
|
|
171
|
-
const filterStringParsed = useMemoized(parseRegex, filterByRegex);
|
|
172
|
-
const filterDurationParsed = useMemoized(parseNumber, minimumDuration);
|
|
173
|
-
const filterOutLogMessageParsed = useMemoized(parseSet, filterOutLogMessage);
|
|
174
|
-
const filteredItems = useMemo(() => applyLogFilter(allReportItems, filterStringParsed, includeMatches, filterDurationParsed, showFlawless, showErrors, showWarnings, showInfo, filterOutLogMessageParsed), [
|
|
175
|
-
allReportItems,
|
|
176
|
-
filterStringParsed,
|
|
177
|
-
includeMatches,
|
|
178
|
-
filterDurationParsed,
|
|
179
|
-
showFlawless,
|
|
180
|
-
showErrors,
|
|
181
|
-
showWarnings,
|
|
182
|
-
showInfo,
|
|
183
|
-
filterOutLogMessageParsed,
|
|
184
|
-
]);
|
|
185
|
-
useEffect(() => {
|
|
186
|
-
setFilteredReportItems(filteredItems);
|
|
187
|
-
}, [filteredItems, setFilteredReportItems]);
|
|
188
|
-
return (React.createElement("div", { className: className },
|
|
189
|
-
React.createElement("h2", null, "Report Filter"),
|
|
190
|
-
React.createElement("h3", null, "By Product"),
|
|
191
|
-
React.createElement(RegExpFilter, { name: "filterByRegex", value: filterByRegex, parsed: filterStringParsed, updateFilter: updateFilter }),
|
|
192
|
-
React.createElement(BoolFilter, { name: "includeMatches", value: includeMatches, updateFilter: updateFilter }),
|
|
193
|
-
React.createElement(NumberFilter, { name: "minimumDuration", value: minimumDuration, parsed: filterDurationParsed, updateFilter: updateFilter }),
|
|
194
|
-
React.createElement(BoolFilter, { name: "showFlawless", value: showFlawless, updateFilter: updateFilter }),
|
|
195
|
-
React.createElement(BoolFilter, { name: "showWarnings", value: showWarnings, updateFilter: updateFilter }),
|
|
196
|
-
React.createElement(BoolFilter, { name: "showInfo", value: showInfo, updateFilter: updateFilter }),
|
|
197
|
-
React.createElement(BoolFilter, { name: "showErrors", value: showErrors, updateFilter: updateFilter }),
|
|
198
|
-
React.createElement("h3", null, "By Message"),
|
|
199
|
-
React.createElement(LogMessageFilter, { name: "filterOutLogMessage", parsed: filterOutLogMessageParsed, updateFilter: updateFilter, logMessageMap: logMessageMap }),
|
|
200
|
-
React.createElement("p", null,
|
|
201
|
-
"Showing ",
|
|
202
|
-
filteredItems.length,
|
|
203
|
-
"/",
|
|
204
|
-
allReportItems.length)));
|
|
205
|
-
};
|
|
1
|
+
import { LogLevel, mapQueryString, toError } from "@configura/web-utilities";
|
|
2
|
+
import React, { useEffect, useMemo } from "react";
|
|
3
|
+
import { useHistory } from "react-router";
|
|
4
|
+
import { useMemoized, useMemoized2 } from "../hooks.js";
|
|
5
|
+
function getLogFilter(query) {
|
|
6
|
+
const q = mapQueryString(query);
|
|
7
|
+
return {
|
|
8
|
+
filterByRegex: q.get("filterByRegex") || "",
|
|
9
|
+
includeMatches: q.get("includeMatches") ? true : false,
|
|
10
|
+
minimumDuration: q.get("minimumDuration") || "",
|
|
11
|
+
showFlawless: q.get("showFlawless") ? true : false,
|
|
12
|
+
showErrors: q.get("showErrors") ? true : false,
|
|
13
|
+
showWarnings: q.get("showWarnings") ? true : false,
|
|
14
|
+
showInfo: q.get("showInfo") ? true : false,
|
|
15
|
+
filterOutLogMessage: q.get("filterOutLogMessage") || "",
|
|
16
|
+
};
|
|
17
|
+
}
|
|
18
|
+
function serializeBool(key, obj) {
|
|
19
|
+
const val = obj[key];
|
|
20
|
+
return val ? `&${key}=1` : ``;
|
|
21
|
+
}
|
|
22
|
+
function serializeString(key, obj) {
|
|
23
|
+
const val = obj[key];
|
|
24
|
+
return val ? `&${key}=${encodeURIComponent(val)}` : ``;
|
|
25
|
+
}
|
|
26
|
+
function serializeLogFilter(filter) {
|
|
27
|
+
return (serializeString("filterByRegex", filter) +
|
|
28
|
+
serializeBool("includeMatches", filter) +
|
|
29
|
+
serializeString("minimumDuration", filter) +
|
|
30
|
+
serializeBool("showFlawless", filter) +
|
|
31
|
+
serializeBool("showErrors", filter) +
|
|
32
|
+
serializeBool("showWarnings", filter) +
|
|
33
|
+
serializeBool("showInfo", filter) +
|
|
34
|
+
serializeString("filterOutLogMessage", filter)).replace(/^&/, "?");
|
|
35
|
+
}
|
|
36
|
+
function parseRegex(value) {
|
|
37
|
+
try {
|
|
38
|
+
return new RegExp(value, "gi");
|
|
39
|
+
}
|
|
40
|
+
catch (e) {
|
|
41
|
+
return toError(e);
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
function parseNumber(value) {
|
|
45
|
+
return value === "" ? 0 : Math.floor(parseFloat(value));
|
|
46
|
+
}
|
|
47
|
+
function parseSet(value) {
|
|
48
|
+
return new Set(value
|
|
49
|
+
.split(",")
|
|
50
|
+
.map((p) => parseInt(p))
|
|
51
|
+
.filter((n) => !Number.isNaN(n)));
|
|
52
|
+
}
|
|
53
|
+
function spaceCamel(camelCase) {
|
|
54
|
+
return camelCase.replace(/([A-Z][a-z])/g, " $1");
|
|
55
|
+
}
|
|
56
|
+
function BoolFilter(props) {
|
|
57
|
+
const { name, value } = props;
|
|
58
|
+
return (React.createElement("div", { className: "cfgExerciserControl" },
|
|
59
|
+
React.createElement("label", { htmlFor: name, className: "cfgExerciserControl__label" },
|
|
60
|
+
React.createElement("input", { id: name, type: "checkbox", checked: !value, onChange: (event) => props.updateFilter(name, !event.target.checked) }),
|
|
61
|
+
" ",
|
|
62
|
+
spaceCamel(name))));
|
|
63
|
+
}
|
|
64
|
+
function RegExpFilter(props) {
|
|
65
|
+
const { name, value, parsed } = props;
|
|
66
|
+
const err = parsed instanceof Error && parsed;
|
|
67
|
+
return (React.createElement("div", { className: "cfgExerciserControl" },
|
|
68
|
+
React.createElement("label", { htmlFor: name, className: "cfgExerciserControl__label" }, spaceCamel(name)),
|
|
69
|
+
React.createElement("input", { id: name, type: "text", value: value, onChange: (event) => props.updateFilter(name, event.target.value) }),
|
|
70
|
+
err && React.createElement("div", { className: "cfgExerciserControl__error" },
|
|
71
|
+
" ",
|
|
72
|
+
err.message)));
|
|
73
|
+
}
|
|
74
|
+
function NumberFilter(props) {
|
|
75
|
+
const { name, value, parsed } = props;
|
|
76
|
+
return (React.createElement("div", { className: "cfgExerciserControl" },
|
|
77
|
+
React.createElement("label", { htmlFor: name, className: "cfgExerciserControl__label" }, spaceCamel(name)),
|
|
78
|
+
React.createElement("input", { id: name, type: "text", value: value, onChange: (event) => props.updateFilter(name, event.target.value) }),
|
|
79
|
+
Number.isNaN(parsed) && (React.createElement("div", { className: "cfgExerciserControl__error" },
|
|
80
|
+
" ",
|
|
81
|
+
value,
|
|
82
|
+
" is not a number"))));
|
|
83
|
+
}
|
|
84
|
+
function sortMap(map, sort) {
|
|
85
|
+
return Array.from(map).sort(sort);
|
|
86
|
+
}
|
|
87
|
+
const sortLogMessages = (l, r) => {
|
|
88
|
+
const [, lMessageAndLevel] = l;
|
|
89
|
+
const [, rMessageAndLevel] = r;
|
|
90
|
+
const lLevel = lMessageAndLevel.level;
|
|
91
|
+
const rLevel = rMessageAndLevel.level;
|
|
92
|
+
if (lLevel !== rLevel) {
|
|
93
|
+
return lLevel.localeCompare(rLevel);
|
|
94
|
+
}
|
|
95
|
+
const lMessage = lMessageAndLevel.message;
|
|
96
|
+
const rMessage = rMessageAndLevel.message;
|
|
97
|
+
if (lMessage === rMessage) {
|
|
98
|
+
return 0;
|
|
99
|
+
}
|
|
100
|
+
return lMessage.toLocaleLowerCase().localeCompare(rMessage.toLocaleLowerCase());
|
|
101
|
+
};
|
|
102
|
+
function LogMessageFilter(props) {
|
|
103
|
+
const { name, parsed } = props;
|
|
104
|
+
const messages = useMemoized2(sortMap, props.logMessageMap, sortLogMessages);
|
|
105
|
+
return (React.createElement("div", null, messages.length === 0 ? (React.createElement("p", null, "No messages yet.")) : (messages.map(([hash, { level, count, message }]) => {
|
|
106
|
+
const id = `${name}-${hash}`;
|
|
107
|
+
return (React.createElement("label", { key: id, className: `cfgDebugLog__item--severity${level} cfgExerciserFilter__logMessage cfgExerciserControl`, htmlFor: id },
|
|
108
|
+
React.createElement("input", { id: id, type: "checkbox", onChange: (event) => {
|
|
109
|
+
const next = new Set(parsed);
|
|
110
|
+
event.target.checked ? next.delete(hash) : next.add(hash);
|
|
111
|
+
props.updateFilter(name, Array.from(next.keys()).join(","));
|
|
112
|
+
}, checked: !parsed.has(hash) }),
|
|
113
|
+
React.createElement("span", null, count),
|
|
114
|
+
" × ",
|
|
115
|
+
React.createElement("span", null, message)));
|
|
116
|
+
}))));
|
|
117
|
+
}
|
|
118
|
+
function applyLogFilter(allReportItems, filterStringParsed, includeMatches, filterDurationParsed, showFlawless, showErrors, showWarnings, showInfo, filterOutLogMessageParsed) {
|
|
119
|
+
if (filterStringParsed instanceof Error || Number.isNaN(filterDurationParsed)) {
|
|
120
|
+
return allReportItems;
|
|
121
|
+
}
|
|
122
|
+
return allReportItems.filter((item) => {
|
|
123
|
+
const { duration, logMessages, productUrl } = item;
|
|
124
|
+
if (isFinite(filterDurationParsed) &&
|
|
125
|
+
0 < filterDurationParsed &&
|
|
126
|
+
duration !== undefined &&
|
|
127
|
+
duration < filterDurationParsed) {
|
|
128
|
+
return false;
|
|
129
|
+
}
|
|
130
|
+
const hasError = (logMessages || []).some((logMessage) => logMessage.level === LogLevel.Error);
|
|
131
|
+
const hasWarning = (logMessages || []).some((logMessage) => logMessage.level === LogLevel.Warn);
|
|
132
|
+
const hasInfo = (logMessages || []).some((logMessage) => logMessage.level === LogLevel.Info);
|
|
133
|
+
if (!((!showFlawless && !hasError && !hasWarning) ||
|
|
134
|
+
(!showErrors && hasError) ||
|
|
135
|
+
(!showWarnings && hasWarning) ||
|
|
136
|
+
(!showInfo && hasInfo))) {
|
|
137
|
+
return false;
|
|
138
|
+
}
|
|
139
|
+
if (logMessages.length !== 0 &&
|
|
140
|
+
logMessages.every((logMessage) => filterOutLogMessageParsed.has(logMessage.levelMessageHash))) {
|
|
141
|
+
return false;
|
|
142
|
+
}
|
|
143
|
+
const filterText = productUrl +
|
|
144
|
+
" " +
|
|
145
|
+
(logMessages || []).reduce((a, logMessage) => {
|
|
146
|
+
a += logMessage.message + " ";
|
|
147
|
+
a += logMessage.optionalParams.join(" ");
|
|
148
|
+
return a;
|
|
149
|
+
}, "");
|
|
150
|
+
if (includeMatches === filterStringParsed.test(filterText)) {
|
|
151
|
+
return false;
|
|
152
|
+
}
|
|
153
|
+
return true;
|
|
154
|
+
});
|
|
155
|
+
}
|
|
156
|
+
export const ExerciserReportFilterView = (props) => {
|
|
157
|
+
const { className, logMessageMap, allReportItems, setFilteredReportItems } = props;
|
|
158
|
+
const history = useHistory();
|
|
159
|
+
const filter = getLogFilter(history.location.search);
|
|
160
|
+
const serialized = serializeLogFilter(filter);
|
|
161
|
+
useEffect(() => {
|
|
162
|
+
history.replace(history.location.pathname + serialized);
|
|
163
|
+
}, [history, serialized]);
|
|
164
|
+
function updateFilter(key, val) {
|
|
165
|
+
const newFilter = Object.assign({}, filter);
|
|
166
|
+
newFilter[key] = val;
|
|
167
|
+
const serialized = serializeLogFilter(newFilter);
|
|
168
|
+
history.replace(history.location.pathname + serialized);
|
|
169
|
+
}
|
|
170
|
+
const { minimumDuration, showErrors, showFlawless, includeMatches, filterOutLogMessage, filterByRegex, showWarnings, showInfo, } = filter;
|
|
171
|
+
const filterStringParsed = useMemoized(parseRegex, filterByRegex);
|
|
172
|
+
const filterDurationParsed = useMemoized(parseNumber, minimumDuration);
|
|
173
|
+
const filterOutLogMessageParsed = useMemoized(parseSet, filterOutLogMessage);
|
|
174
|
+
const filteredItems = useMemo(() => applyLogFilter(allReportItems, filterStringParsed, includeMatches, filterDurationParsed, showFlawless, showErrors, showWarnings, showInfo, filterOutLogMessageParsed), [
|
|
175
|
+
allReportItems,
|
|
176
|
+
filterStringParsed,
|
|
177
|
+
includeMatches,
|
|
178
|
+
filterDurationParsed,
|
|
179
|
+
showFlawless,
|
|
180
|
+
showErrors,
|
|
181
|
+
showWarnings,
|
|
182
|
+
showInfo,
|
|
183
|
+
filterOutLogMessageParsed,
|
|
184
|
+
]);
|
|
185
|
+
useEffect(() => {
|
|
186
|
+
setFilteredReportItems(filteredItems);
|
|
187
|
+
}, [filteredItems, setFilteredReportItems]);
|
|
188
|
+
return (React.createElement("div", { className: className },
|
|
189
|
+
React.createElement("h2", null, "Report Filter"),
|
|
190
|
+
React.createElement("h3", null, "By Product"),
|
|
191
|
+
React.createElement(RegExpFilter, { name: "filterByRegex", value: filterByRegex, parsed: filterStringParsed, updateFilter: updateFilter }),
|
|
192
|
+
React.createElement(BoolFilter, { name: "includeMatches", value: includeMatches, updateFilter: updateFilter }),
|
|
193
|
+
React.createElement(NumberFilter, { name: "minimumDuration", value: minimumDuration, parsed: filterDurationParsed, updateFilter: updateFilter }),
|
|
194
|
+
React.createElement(BoolFilter, { name: "showFlawless", value: showFlawless, updateFilter: updateFilter }),
|
|
195
|
+
React.createElement(BoolFilter, { name: "showWarnings", value: showWarnings, updateFilter: updateFilter }),
|
|
196
|
+
React.createElement(BoolFilter, { name: "showInfo", value: showInfo, updateFilter: updateFilter }),
|
|
197
|
+
React.createElement(BoolFilter, { name: "showErrors", value: showErrors, updateFilter: updateFilter }),
|
|
198
|
+
React.createElement("h3", null, "By Message"),
|
|
199
|
+
React.createElement(LogMessageFilter, { name: "filterOutLogMessage", parsed: filterOutLogMessageParsed, updateFilter: updateFilter, logMessageMap: logMessageMap }),
|
|
200
|
+
React.createElement("p", null,
|
|
201
|
+
"Showing ",
|
|
202
|
+
filteredItems.length,
|
|
203
|
+
"/",
|
|
204
|
+
allReportItems.length)));
|
|
205
|
+
};
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import { GeneratedProductConfiguration } from "@configura/web-api";
|
|
2
|
-
import { LogMessage } from "@configura/web-utilities";
|
|
3
|
-
export interface ExerciserReportItem {
|
|
4
|
-
productWithConfiguration?: GeneratedProductConfiguration;
|
|
5
|
-
productUrl: string;
|
|
6
|
-
logMessages: LogMessage[];
|
|
7
|
-
imageDataUrl?: string | undefined;
|
|
8
|
-
duration: number;
|
|
9
|
-
randId: number;
|
|
10
|
-
}
|
|
1
|
+
import { GeneratedProductConfiguration } from "@configura/web-api";
|
|
2
|
+
import { LogMessage } from "@configura/web-utilities";
|
|
3
|
+
export interface ExerciserReportItem {
|
|
4
|
+
productWithConfiguration?: GeneratedProductConfiguration;
|
|
5
|
+
productUrl: string;
|
|
6
|
+
logMessages: LogMessage[];
|
|
7
|
+
imageDataUrl?: string | undefined;
|
|
8
|
+
duration: number;
|
|
9
|
+
randId: number;
|
|
10
|
+
}
|
|
11
11
|
//# sourceMappingURL=ExerciserReportItem.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export {};
|
|
1
|
+
export {};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { ExerciserReportItem } from "./ExerciserReportItem.js";
|
|
3
|
-
export declare const ExerciserReportItemView: React.FC<{
|
|
4
|
-
item: ExerciserReportItem;
|
|
5
|
-
showImg?: boolean;
|
|
6
|
-
}>;
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { ExerciserReportItem } from "./ExerciserReportItem.js";
|
|
3
|
+
export declare const ExerciserReportItemView: React.FC<{
|
|
4
|
+
item: ExerciserReportItem;
|
|
5
|
+
showImg?: boolean;
|
|
6
|
+
}>;
|
|
7
7
|
//# sourceMappingURL=ExerciserReportItemView.d.ts.map
|
|
@@ -1,53 +1,53 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { Link } from "react-router-dom";
|
|
3
|
-
import { LogMessagesView } from "../LogMessagesView.js";
|
|
4
|
-
export const ExerciserReportItemView = ({ item, showImg = true }) => {
|
|
5
|
-
const { duration, productWithConfiguration, logMessages, imageDataUrl, productUrl } = item;
|
|
6
|
-
if (productWithConfiguration === undefined) {
|
|
7
|
-
return null;
|
|
8
|
-
}
|
|
9
|
-
const { product } = productWithConfiguration;
|
|
10
|
-
const { catId } = product;
|
|
11
|
-
return (React.createElement("div", { className: "cfgExerciserReportItem" },
|
|
12
|
-
React.createElement("div", { className: "cfgExerciserReportItem__info" },
|
|
13
|
-
React.createElement("p", null,
|
|
14
|
-
React.createElement("strong", null,
|
|
15
|
-
"PartNumber (",
|
|
16
|
-
productWithConfiguration.productIndex + 1,
|
|
17
|
-
" /",
|
|
18
|
-
" ",
|
|
19
|
-
productWithConfiguration.productCount,
|
|
20
|
-
"):",
|
|
21
|
-
" "),
|
|
22
|
-
product.partNumber),
|
|
23
|
-
React.createElement("p", null,
|
|
24
|
-
React.createElement("strong", null, "PriceList: "),
|
|
25
|
-
catId.priceList),
|
|
26
|
-
React.createElement("p", null,
|
|
27
|
-
React.createElement("strong", null, "Vendor: "),
|
|
28
|
-
catId.vendor),
|
|
29
|
-
React.createElement("p", null,
|
|
30
|
-
React.createElement("strong", null,
|
|
31
|
-
"ProductCatalogue (",
|
|
32
|
-
productWithConfiguration.catalogueIndex + 1,
|
|
33
|
-
" /",
|
|
34
|
-
" ",
|
|
35
|
-
productWithConfiguration.catalogueCount,
|
|
36
|
-
") :",
|
|
37
|
-
" "),
|
|
38
|
-
catId.enterprise,
|
|
39
|
-
" / ",
|
|
40
|
-
catId.prdCat,
|
|
41
|
-
" /",
|
|
42
|
-
"",
|
|
43
|
-
catId.prdCatVersion),
|
|
44
|
-
productUrl !== "" && (React.createElement(Link, { className: "cfgExerciserLink", to: productUrl }, productUrl)),
|
|
45
|
-
duration && (React.createElement("p", null,
|
|
46
|
-
React.createElement("strong", null, "Duration:"),
|
|
47
|
-
" ",
|
|
48
|
-
duration.toFixed(0),
|
|
49
|
-
" ms")),
|
|
50
|
-
React.createElement(LogMessagesView, { messages: logMessages })),
|
|
51
|
-
imageDataUrl && showImg && (React.createElement("div", { className: "cfgExerciserReportItem__image" },
|
|
52
|
-
React.createElement("img", { src: imageDataUrl, alt: "Product preview" })))));
|
|
53
|
-
};
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { Link } from "react-router-dom";
|
|
3
|
+
import { LogMessagesView } from "../LogMessagesView.js";
|
|
4
|
+
export const ExerciserReportItemView = ({ item, showImg = true }) => {
|
|
5
|
+
const { duration, productWithConfiguration, logMessages, imageDataUrl, productUrl } = item;
|
|
6
|
+
if (productWithConfiguration === undefined) {
|
|
7
|
+
return null;
|
|
8
|
+
}
|
|
9
|
+
const { product } = productWithConfiguration;
|
|
10
|
+
const { catId } = product;
|
|
11
|
+
return (React.createElement("div", { className: "cfgExerciserReportItem" },
|
|
12
|
+
React.createElement("div", { className: "cfgExerciserReportItem__info" },
|
|
13
|
+
React.createElement("p", null,
|
|
14
|
+
React.createElement("strong", null,
|
|
15
|
+
"PartNumber (",
|
|
16
|
+
productWithConfiguration.productIndex + 1,
|
|
17
|
+
" /",
|
|
18
|
+
" ",
|
|
19
|
+
productWithConfiguration.productCount,
|
|
20
|
+
"):",
|
|
21
|
+
" "),
|
|
22
|
+
product.partNumber),
|
|
23
|
+
React.createElement("p", null,
|
|
24
|
+
React.createElement("strong", null, "PriceList: "),
|
|
25
|
+
catId.priceList),
|
|
26
|
+
React.createElement("p", null,
|
|
27
|
+
React.createElement("strong", null, "Vendor: "),
|
|
28
|
+
catId.vendor),
|
|
29
|
+
React.createElement("p", null,
|
|
30
|
+
React.createElement("strong", null,
|
|
31
|
+
"ProductCatalogue (",
|
|
32
|
+
productWithConfiguration.catalogueIndex + 1,
|
|
33
|
+
" /",
|
|
34
|
+
" ",
|
|
35
|
+
productWithConfiguration.catalogueCount,
|
|
36
|
+
") :",
|
|
37
|
+
" "),
|
|
38
|
+
catId.enterprise,
|
|
39
|
+
" / ",
|
|
40
|
+
catId.prdCat,
|
|
41
|
+
" /",
|
|
42
|
+
"",
|
|
43
|
+
catId.prdCatVersion),
|
|
44
|
+
productUrl !== "" && (React.createElement(Link, { className: "cfgExerciserLink", to: productUrl }, productUrl)),
|
|
45
|
+
duration && (React.createElement("p", null,
|
|
46
|
+
React.createElement("strong", null, "Duration:"),
|
|
47
|
+
" ",
|
|
48
|
+
duration.toFixed(0),
|
|
49
|
+
" ms")),
|
|
50
|
+
React.createElement(LogMessagesView, { messages: logMessages })),
|
|
51
|
+
imageDataUrl && showImg && (React.createElement("div", { className: "cfgExerciserReportItem__image" },
|
|
52
|
+
React.createElement("img", { src: imageDataUrl, alt: "Product preview" })))));
|
|
53
|
+
};
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { ExerciserReportItem } from "./ExerciserReportItem.js";
|
|
3
|
-
declare type Props = {
|
|
4
|
-
items: ExerciserReportItem[];
|
|
5
|
-
};
|
|
6
|
-
export declare const ExerciserReportView: React.FC<Props>;
|
|
7
|
-
export {};
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { ExerciserReportItem } from "./ExerciserReportItem.js";
|
|
3
|
+
declare type Props = {
|
|
4
|
+
items: ExerciserReportItem[];
|
|
5
|
+
};
|
|
6
|
+
export declare const ExerciserReportView: React.FC<Props>;
|
|
7
|
+
export {};
|
|
8
8
|
//# sourceMappingURL=ExerciserReportView.d.ts.map
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { ExerciserReportItemView } from "./ExerciserReportItemView.js";
|
|
3
|
-
export const ExerciserReportView = (props) => {
|
|
4
|
-
const { items } = props;
|
|
5
|
-
return (React.createElement("div", null,
|
|
6
|
-
React.createElement("h2", null, "Report"),
|
|
7
|
-
items.map((item) => (React.createElement(ExerciserReportItemView, { item: item, key: item.randId })))));
|
|
8
|
-
};
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { ExerciserReportItemView } from "./ExerciserReportItemView.js";
|
|
3
|
+
export const ExerciserReportView = (props) => {
|
|
4
|
+
const { items } = props;
|
|
5
|
+
return (React.createElement("div", null,
|
|
6
|
+
React.createElement("h2", null, "Report"),
|
|
7
|
+
items.map((item) => (React.createElement(ExerciserReportItemView, { item: item, key: item.randId })))));
|
|
8
|
+
};
|
|
@@ -1,20 +1,20 @@
|
|
|
1
|
-
import { DtoProductParamsWithCid, GeneratedProductConfiguration } from "@configura/web-api";
|
|
2
|
-
import { AggregatedLoadingObservable, LogLevel } from "@configura/web-utilities";
|
|
3
|
-
import { ExerciserAction } from "./Exerciser.js";
|
|
4
|
-
import { ExerciserReportItem } from "./ExerciserReportItem.js";
|
|
5
|
-
export declare type ExerciserLogMessage = {
|
|
6
|
-
message: string;
|
|
7
|
-
level: LogLevel;
|
|
8
|
-
count: number;
|
|
9
|
-
};
|
|
10
|
-
export declare type ExerciserLogMessagesMap = Map<number, ExerciserLogMessage>;
|
|
11
|
-
interface Props {
|
|
12
|
-
addErrorReportItem: (err: unknown) => void;
|
|
13
|
-
addReportItem: (item: ExerciserReportItem) => void;
|
|
14
|
-
loadingObservable: AggregatedLoadingObservable;
|
|
15
|
-
productIterator: AsyncIterableIterator<GeneratedProductConfiguration | Error>;
|
|
16
|
-
generateExerciserUrl: (action: ExerciserAction, lang: string, params: Partial<DtoProductParamsWithCid>) => string;
|
|
17
|
-
}
|
|
18
|
-
export declare function ExerciserRunner(props: Props): JSX.Element | null;
|
|
19
|
-
export {};
|
|
1
|
+
import { DtoProductParamsWithCid, GeneratedProductConfiguration } from "@configura/web-api";
|
|
2
|
+
import { AggregatedLoadingObservable, LogLevel } from "@configura/web-utilities";
|
|
3
|
+
import { ExerciserAction } from "./Exerciser.js";
|
|
4
|
+
import { ExerciserReportItem } from "./ExerciserReportItem.js";
|
|
5
|
+
export declare type ExerciserLogMessage = {
|
|
6
|
+
message: string;
|
|
7
|
+
level: LogLevel;
|
|
8
|
+
count: number;
|
|
9
|
+
};
|
|
10
|
+
export declare type ExerciserLogMessagesMap = Map<number, ExerciserLogMessage>;
|
|
11
|
+
interface Props {
|
|
12
|
+
addErrorReportItem: (err: unknown) => void;
|
|
13
|
+
addReportItem: (item: ExerciserReportItem) => void;
|
|
14
|
+
loadingObservable: AggregatedLoadingObservable;
|
|
15
|
+
productIterator: AsyncIterableIterator<GeneratedProductConfiguration | Error>;
|
|
16
|
+
generateExerciserUrl: (action: ExerciserAction, lang: string, params: Partial<DtoProductParamsWithCid>) => string;
|
|
17
|
+
}
|
|
18
|
+
export declare function ExerciserRunner(props: Props): JSX.Element | null;
|
|
19
|
+
export {};
|
|
20
20
|
//# sourceMappingURL=ExerciserRun.d.ts.map
|