@rh-support/components 2.0.7 → 2.0.8
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/lib/cjs/AlertMessage/AlertMessage.js +4 -4
- package/lib/cjs/ConfirmationModal/ConfirmationContext.js +13 -41
- package/lib/cjs/ConfirmationModal/ConfirmationDialog.js +5 -5
- package/lib/cjs/CoverSpinner/CoverSpinner.js +1 -1
- package/lib/cjs/CustomContentLoader/CustomContentLoader.js +4 -4
- package/lib/cjs/CustomTextInput/CustomTextInput.js +8 -19
- package/lib/cjs/DropDownList/AsyncDropDownList.js +5 -5
- package/lib/cjs/DropDownList/DropDownList.js +45 -75
- package/lib/cjs/DropDownList/DropdownWrapper.js +7 -18
- package/lib/cjs/DropDownList/MultiSelectDropdownList.js +3 -3
- package/lib/cjs/DropDownList/SearchableList.js +41 -55
- package/lib/cjs/DropDownList/SelectList.js +15 -26
- package/lib/cjs/DropDownList/async.js +28 -38
- package/lib/cjs/DropDownList/dropdownUtils.js +9 -20
- package/lib/cjs/DropDownList/withMulti.js +15 -26
- package/lib/cjs/ErrorBoundary/ErrorBoundary.js +18 -47
- package/lib/cjs/ErrorBoundary/ErrorBoundaryFallbackComponent.js +10 -10
- package/lib/cjs/ErrorPages/Generic403.js +2 -2
- package/lib/cjs/FeedbackForm/FeedbackForm.js +24 -52
- package/lib/cjs/Functional/CaseContactsSelectorExternal.js +81 -154
- package/lib/cjs/InlineEdit/InlineEdit.js +56 -142
- package/lib/cjs/InlineEdit/NewInlineEdit.js +60 -145
- package/lib/cjs/LanguageSelector/LanguageSelector.js +10 -26
- package/lib/cjs/LoadingDots/LoadingDots.js +3 -3
- package/lib/cjs/LoadingIndicator/LoadingIndicator.js +3 -3
- package/lib/cjs/LoginModal/LoginModal.js +3 -3
- package/lib/cjs/MarkdownEditor/MarkdownEditor.js +113 -165
- package/lib/cjs/MoreOrLess/MoreOrLess.js +20 -40
- package/lib/cjs/PaginatedList/PaginatedList.js +15 -31
- package/lib/cjs/PaginationCompact/PaginationCompact.js +14 -31
- package/lib/cjs/ProgressBar/CircularProgressBar/CircularProgressBar.js +14 -14
- package/lib/cjs/ProgressBar/CircularProgressBar/Path.js +20 -18
- package/lib/cjs/ProgressBar/ProgressBar.js +8 -19
- package/lib/cjs/PromisifyModal/PromisifyModal.js +19 -36
- package/lib/cjs/SubscriptionAbuse/SubscriptionAbuseModal.js +5 -5
- package/lib/cjs/SubscriptionAbuse/const.js +3 -3
- package/lib/cjs/SupportFeedbackForm/SupportFeedbackForm.js +8 -24
- package/lib/cjs/SupportFeedbackForm/SupportFeedbackModal.js +50 -120
- package/lib/cjs/Table/PFTable.js +52 -89
- package/lib/cjs/Table/Table.js +12 -29
- package/lib/cjs/Table/TableColumnSelector.js +14 -15
- package/lib/cjs/Table/TablePagination.js +8 -8
- package/lib/cjs/Table/TableProvider.js +6 -6
- package/lib/cjs/TermsAndConditions/AcceptTermsModal.js +46 -100
- package/lib/cjs/TextAreaAutosize/TextAreaAutosize.js +35 -62
- package/lib/cjs/TextAreaResizable/TextAreaResizable.js +9 -25
- package/lib/cjs/ToastNotification/ToastNotification.js +35 -70
- package/lib/cjs/TopContentSearch/TopContentSearch.js +48 -113
- package/lib/cjs/ValueChangedIcon/ValueChangedIcon.js +13 -29
- package/lib/cjs/helperFunctions/errorMessage.js +13 -13
- package/lib/cjs/hooks/useBreakpoint.js +26 -43
- package/lib/cjs/hooks/useCopyToClipboard.js +8 -24
- package/lib/cjs/hooks/useDebounce.js +13 -38
- package/lib/cjs/hooks/useFetch.js +47 -123
- package/lib/cjs/hooks/useForceUpdate.js +2 -18
- package/lib/cjs/hooks/useForkRef.js +3 -3
- package/lib/cjs/hooks/useIsMounted.js +4 -4
- package/lib/cjs/hooks/useLRUCache.js +11 -11
- package/lib/cjs/hooks/useLocalStorage.js +7 -23
- package/lib/cjs/hooks/useOnScreen.js +5 -24
- package/lib/cjs/hooks/usePolling.js +8 -30
- package/lib/cjs/hooks/usePrevious.js +3 -3
- package/lib/cjs/hooks/useTitle.js +4 -4
- package/lib/cjs/hooks/useUndo.js +49 -72
- package/package.json +6 -7
|
@@ -1,15 +1,4 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __assign = (this && this.__assign) || function () {
|
|
3
|
-
__assign = Object.assign || function(t) {
|
|
4
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
-
s = arguments[i];
|
|
6
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
-
t[p] = s[p];
|
|
8
|
-
}
|
|
9
|
-
return t;
|
|
10
|
-
};
|
|
11
|
-
return __assign.apply(this, arguments);
|
|
12
|
-
};
|
|
13
2
|
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
14
3
|
if (k2 === undefined) k2 = k;
|
|
15
4
|
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
|
@@ -38,70 +27,27 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
|
|
|
38
27
|
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
39
28
|
});
|
|
40
29
|
};
|
|
41
|
-
var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
42
|
-
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
|
|
43
|
-
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
|
44
|
-
function verb(n) { return function (v) { return step([n, v]); }; }
|
|
45
|
-
function step(op) {
|
|
46
|
-
if (f) throw new TypeError("Generator is already executing.");
|
|
47
|
-
while (_) try {
|
|
48
|
-
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
|
|
49
|
-
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
50
|
-
switch (op[0]) {
|
|
51
|
-
case 0: case 1: t = op; break;
|
|
52
|
-
case 4: _.label++; return { value: op[1], done: false };
|
|
53
|
-
case 5: _.label++; y = op[1]; op = [0]; continue;
|
|
54
|
-
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
|
55
|
-
default:
|
|
56
|
-
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
|
57
|
-
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
|
58
|
-
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
|
59
|
-
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
|
60
|
-
if (t[2]) _.ops.pop();
|
|
61
|
-
_.trys.pop(); continue;
|
|
62
|
-
}
|
|
63
|
-
op = body.call(thisArg, _);
|
|
64
|
-
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
|
65
|
-
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
66
|
-
}
|
|
67
|
-
};
|
|
68
|
-
var __read = (this && this.__read) || function (o, n) {
|
|
69
|
-
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
70
|
-
if (!m) return o;
|
|
71
|
-
var i = m.call(o), r, ar = [], e;
|
|
72
|
-
try {
|
|
73
|
-
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
|
74
|
-
}
|
|
75
|
-
catch (error) { e = { error: error }; }
|
|
76
|
-
finally {
|
|
77
|
-
try {
|
|
78
|
-
if (r && !r.done && (m = i["return"])) m.call(i);
|
|
79
|
-
}
|
|
80
|
-
finally { if (e) throw e.error; }
|
|
81
|
-
}
|
|
82
|
-
return ar;
|
|
83
|
-
};
|
|
84
30
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
85
31
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
86
32
|
};
|
|
87
33
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
88
34
|
exports.TopContentSearch = exports.getTopContentUrl = void 0;
|
|
89
35
|
require("./topContentSearch.scss");
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
36
|
+
const react_core_1 = require("@patternfly/react-core");
|
|
37
|
+
const utils_1 = require("@rh-support/utils");
|
|
38
|
+
const js_worker_search_1 = __importStar(require("js-worker-search"));
|
|
39
|
+
const debounce_1 = __importDefault(require("lodash/debounce"));
|
|
40
|
+
const flatMap_1 = __importDefault(require("lodash/flatMap"));
|
|
41
|
+
const isEmpty_1 = __importDefault(require("lodash/isEmpty"));
|
|
42
|
+
const mark_js_1 = __importDefault(require("mark.js"));
|
|
43
|
+
const react_1 = __importStar(require("react"));
|
|
44
|
+
const react_i18next_1 = require("react-i18next");
|
|
45
|
+
const getTopContentUrl = (contentUrl) => {
|
|
100
46
|
// There is some data urls (e.g. /solutions/articles/etc.) that aren't valid urls
|
|
101
47
|
// this adds the access.redhat.com to make them valid urls, otherwise the top content edit functionality won't work
|
|
102
48
|
// for product/versions that already have data not created by users.
|
|
103
49
|
if (contentUrl.startsWith('/')) {
|
|
104
|
-
return
|
|
50
|
+
return `https://${utils_1.getAccessHostname()}${contentUrl}`;
|
|
105
51
|
}
|
|
106
52
|
return contentUrl;
|
|
107
53
|
};
|
|
@@ -111,44 +57,42 @@ var CustomEvents;
|
|
|
111
57
|
CustomEvents["inputChange"] = "top-content-filter-input-change";
|
|
112
58
|
CustomEvents["inputClear"] = "top-content-filter-input-clear";
|
|
113
59
|
})(CustomEvents || (CustomEvents = {}));
|
|
114
|
-
function TopContentSearch(
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
var t = react_i18next_1.useTranslation().t;
|
|
119
|
-
var searchWorkerRef = react_1.useRef(new js_worker_search_1.default({
|
|
60
|
+
function TopContentSearch({ topContentData = [], topContentResultsWrapperRef = { current: {} }, onSearch, dataTrackingId, enableEventTracking = false, }) {
|
|
61
|
+
const [searchText, setSearchText] = react_1.useState('');
|
|
62
|
+
const { t } = react_i18next_1.useTranslation();
|
|
63
|
+
const searchWorkerRef = react_1.useRef(new js_worker_search_1.default({
|
|
120
64
|
indexMode: js_worker_search_1.INDEX_MODES.ALL_SUBSTRINGS,
|
|
121
65
|
caseSensitive: false,
|
|
122
66
|
matchAnyToken: true,
|
|
123
67
|
}));
|
|
124
|
-
|
|
125
|
-
react_1.useEffect(
|
|
126
|
-
topContentData.forEach(
|
|
127
|
-
item.content.forEach(
|
|
128
|
-
searchWorkerRef.current.indexDocument(content.topContentId, content.contentTitle
|
|
68
|
+
const searchWrapperRef = react_1.useRef(null);
|
|
69
|
+
react_1.useEffect(() => {
|
|
70
|
+
topContentData.forEach((item) => {
|
|
71
|
+
item.content.forEach((content) => {
|
|
72
|
+
searchWorkerRef.current.indexDocument(content.topContentId, `${content.contentTitle} ${exports.getTopContentUrl(content.contentUrl)}`);
|
|
129
73
|
});
|
|
130
74
|
});
|
|
131
75
|
searchText && handleSearch(searchText);
|
|
132
76
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
133
77
|
}, [topContentData]);
|
|
134
78
|
// to log custom events for dtm tracking.
|
|
135
|
-
|
|
79
|
+
const logCustomEvent = (eventName, event) => {
|
|
136
80
|
if (!enableEventTracking || !searchWrapperRef.current || !event || !eventName)
|
|
137
81
|
return;
|
|
138
82
|
utils_1.dtmTrackEvent(searchWrapperRef, eventName, event);
|
|
139
83
|
};
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
84
|
+
const highlightSearchResults = react_1.useCallback((searchTerm) => {
|
|
85
|
+
const d = topContentResultsWrapperRef.current;
|
|
86
|
+
const markInstance = new mark_js_1.default(d);
|
|
143
87
|
markInstance.unmark({
|
|
144
|
-
done:
|
|
88
|
+
done: () => {
|
|
145
89
|
if (isEmpty_1.default(searchTerm))
|
|
146
90
|
return;
|
|
147
91
|
markInstance.mark(searchTerm, { separateWordSearch: true });
|
|
148
92
|
},
|
|
149
93
|
});
|
|
150
94
|
}, [topContentResultsWrapperRef]);
|
|
151
|
-
|
|
95
|
+
const onSearchInputClear = react_1.useCallback((event) => {
|
|
152
96
|
logCustomEvent(CustomEvents.inputClear, event);
|
|
153
97
|
setSearchText('');
|
|
154
98
|
highlightSearchResults('');
|
|
@@ -156,41 +100,32 @@ function TopContentSearch(_a) {
|
|
|
156
100
|
},
|
|
157
101
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
158
102
|
[highlightSearchResults, topContentData]);
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
if (filteredContentLength > 0 && contentFound < contentIds.length) {
|
|
176
|
-
contentFound = contentFound + filteredContentLength;
|
|
177
|
-
return [__assign(__assign({}, item), { content: filteredContent })];
|
|
178
|
-
}
|
|
179
|
-
else {
|
|
180
|
-
return [];
|
|
181
|
-
}
|
|
182
|
-
});
|
|
183
|
-
onSearch(query, filteredData);
|
|
184
|
-
highlightSearchResults(query);
|
|
185
|
-
logCustomEvent(CustomEvents.inputChange, { bubbles: true, detail: { query: query } });
|
|
186
|
-
return [2 /*return*/];
|
|
103
|
+
const handleSearch = react_1.useCallback((query) => __awaiter(this, void 0, void 0, function* () {
|
|
104
|
+
if (!query) {
|
|
105
|
+
onSearchInputClear();
|
|
106
|
+
return;
|
|
107
|
+
}
|
|
108
|
+
const contentIds = yield searchWorkerRef.current.search(query);
|
|
109
|
+
let contentFound = 0;
|
|
110
|
+
const filteredData = flatMap_1.default(topContentData, (item) => {
|
|
111
|
+
const filteredContent = item.content.filter((item) => contentIds.includes(item.topContentId));
|
|
112
|
+
const filteredContentLength = filteredContent.length;
|
|
113
|
+
if (filteredContentLength > 0 && contentFound < contentIds.length) {
|
|
114
|
+
contentFound = contentFound + filteredContentLength;
|
|
115
|
+
return [Object.assign(Object.assign({}, item), { content: filteredContent })];
|
|
116
|
+
}
|
|
117
|
+
else {
|
|
118
|
+
return [];
|
|
187
119
|
}
|
|
188
120
|
});
|
|
189
|
-
|
|
121
|
+
onSearch(query, filteredData);
|
|
122
|
+
highlightSearchResults(query);
|
|
123
|
+
logCustomEvent(CustomEvents.inputChange, { bubbles: true, detail: { query } });
|
|
124
|
+
}),
|
|
190
125
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
191
126
|
[highlightSearchResults, topContentData, onSearchInputClear]);
|
|
192
|
-
|
|
193
|
-
|
|
127
|
+
const debounceSearch = react_1.useMemo(() => debounce_1.default(handleSearch, 500), [handleSearch]);
|
|
128
|
+
const onSearchInputChange = (value) => {
|
|
194
129
|
setSearchText(value);
|
|
195
130
|
debounceSearch(value);
|
|
196
131
|
};
|
|
@@ -18,63 +18,47 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
18
18
|
__setModuleDefault(result, mod);
|
|
19
19
|
return result;
|
|
20
20
|
};
|
|
21
|
-
var __read = (this && this.__read) || function (o, n) {
|
|
22
|
-
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
23
|
-
if (!m) return o;
|
|
24
|
-
var i = m.call(o), r, ar = [], e;
|
|
25
|
-
try {
|
|
26
|
-
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
|
27
|
-
}
|
|
28
|
-
catch (error) { e = { error: error }; }
|
|
29
|
-
finally {
|
|
30
|
-
try {
|
|
31
|
-
if (r && !r.done && (m = i["return"])) m.call(i);
|
|
32
|
-
}
|
|
33
|
-
finally { if (e) throw e.error; }
|
|
34
|
-
}
|
|
35
|
-
return ar;
|
|
36
|
-
};
|
|
37
21
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
38
22
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
39
23
|
};
|
|
40
24
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
41
25
|
exports.ValueChangedIcon = void 0;
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
26
|
+
const react_core_1 = require("@patternfly/react-core");
|
|
27
|
+
const lightbulb_icon_1 = __importDefault(require("@patternfly/react-icons/dist/js/icons/lightbulb-icon"));
|
|
28
|
+
const debounce_1 = __importDefault(require("lodash/debounce"));
|
|
29
|
+
const react_1 = __importStar(require("react"));
|
|
46
30
|
function ValueChangedIcon(props) {
|
|
47
31
|
// removed 2 min refresh functionality so this icon never needs to be shown
|
|
48
32
|
// TODO: Reimplement "setShow"
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
33
|
+
const [show] = react_1.useState(false);
|
|
34
|
+
const [tooltipContent, setTooltipContent] = react_1.useState();
|
|
35
|
+
const [currentValue, setCurrentValue] = react_1.useState(props.value);
|
|
36
|
+
const [previousValue, setPreviousValue] = react_1.useState();
|
|
37
|
+
const [clearTTDebounce, setClearTTDebounce] = react_1.useState();
|
|
54
38
|
if (clearTTDebounce) {
|
|
55
39
|
clearTTDebounce();
|
|
56
40
|
setClearTTDebounce(undefined);
|
|
57
41
|
}
|
|
58
|
-
react_1.useEffect(
|
|
42
|
+
react_1.useEffect(() => {
|
|
59
43
|
if (props.isLocalChange) {
|
|
60
44
|
props.afterLocalChange();
|
|
61
45
|
setPreviousValue(currentValue);
|
|
62
46
|
return;
|
|
63
47
|
}
|
|
64
|
-
|
|
48
|
+
const showTT = props.comparator
|
|
65
49
|
? props.comparator(currentValue, previousValue)
|
|
66
50
|
: previousValue !== currentValue;
|
|
67
51
|
if (!!previousValue && !props.isLocalChange && showTT) {
|
|
68
52
|
// setShow(true);
|
|
69
53
|
setTooltipContent(props.getTooltipContent(currentValue, previousValue));
|
|
70
54
|
setPreviousValue(currentValue);
|
|
71
|
-
setClearTTDebounce(debounce_1.default(
|
|
55
|
+
setClearTTDebounce(debounce_1.default(() => {
|
|
72
56
|
setTooltipContent(null);
|
|
73
57
|
// setShow(false);
|
|
74
58
|
}, 6000));
|
|
75
59
|
}
|
|
76
60
|
}, [props, previousValue, currentValue]);
|
|
77
|
-
react_1.useEffect(
|
|
61
|
+
react_1.useEffect(() => {
|
|
78
62
|
if (currentValue !== props.value) {
|
|
79
63
|
setPreviousValue(!!currentValue ? currentValue : props.value);
|
|
80
64
|
setCurrentValue(props.value);
|
|
@@ -5,21 +5,21 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
6
|
exports.errorMessageTitle = exports.formattedApiErrorMessage = void 0;
|
|
7
7
|
require("./errorMessage.scss");
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
8
|
+
const react_core_1 = require("@patternfly/react-core");
|
|
9
|
+
const external_link_alt_icon_1 = __importDefault(require("@patternfly/react-icons/dist/js/icons/external-link-alt-icon"));
|
|
10
|
+
const isEmpty_1 = __importDefault(require("lodash/isEmpty"));
|
|
11
|
+
const react_1 = __importDefault(require("react"));
|
|
12
|
+
const SupportFeedbackForm_1 = require("../SupportFeedbackForm");
|
|
13
|
+
const defaultTitle = "Sorry, we're experiencing an error";
|
|
14
|
+
const errorMessageButtonLabel = 'contact us';
|
|
15
|
+
const defaultErrorMessage = (react_1.default.createElement("p", { className: "pf-u-mb-0" },
|
|
16
16
|
"Try refreshing the page. Please ",
|
|
17
17
|
react_1.default.createElement(SupportFeedbackForm_1.SupportFeedbackForm, { isInline: true, buttonLabel: errorMessageButtonLabel }),
|
|
18
18
|
" if the problem persists.",
|
|
19
19
|
react_1.default.createElement("br", null),
|
|
20
20
|
react_1.default.createElement(react_core_1.Button, { variant: "link", component: "a", href: "https://status.redhat.com/", "data-tracking-id": "redirect-status-portal-button", target: "_blank", icon: react_1.default.createElement(external_link_alt_icon_1.default, { className: "status-portal-button-icon" }), iconPosition: "right", className: "pf-u-pl-0", isInline: true, "aria-label": "View status page" }, "View status page"),
|
|
21
21
|
' '));
|
|
22
|
-
|
|
22
|
+
const defaultErrorObj = {
|
|
23
23
|
500: {
|
|
24
24
|
title: defaultTitle,
|
|
25
25
|
message: defaultErrorMessage,
|
|
@@ -44,7 +44,7 @@ var defaultErrorObj = {
|
|
|
44
44
|
// the error argument need a better typing here. We want to make sure that user is passing an error object and not an error string
|
|
45
45
|
function formattedApiErrorMessage(error, customMessage) {
|
|
46
46
|
var _a, _b, _c;
|
|
47
|
-
|
|
47
|
+
const errorCode = parseInt((error === null || error === void 0 ? void 0 : error.code) || (error === null || error === void 0 ? void 0 : error.status)) || '';
|
|
48
48
|
if (!customMessage)
|
|
49
49
|
customMessage = {};
|
|
50
50
|
// Note: We show default error message on 503 error codes
|
|
@@ -78,9 +78,9 @@ function formattedApiErrorMessage(error, customMessage) {
|
|
|
78
78
|
}
|
|
79
79
|
else {
|
|
80
80
|
// api call error
|
|
81
|
-
|
|
81
|
+
const message = (error === null || error === void 0 ? void 0 : error.statusText) || (error === null || error === void 0 ? void 0 : error.responseText) || '';
|
|
82
82
|
// error.message -> javascript error
|
|
83
|
-
|
|
83
|
+
const isNotProperUXError = isEmpty_1.default(message) || (message === null || message === void 0 ? void 0 : message.length) > 200 || (error === null || error === void 0 ? void 0 : error.message) || (error === null || error === void 0 ? void 0 : error.detailMessage);
|
|
84
84
|
return isNotProperUXError ? defaultErrorMessage : message;
|
|
85
85
|
}
|
|
86
86
|
}
|
|
@@ -89,7 +89,7 @@ function errorMessageTitle(error, customError) {
|
|
|
89
89
|
var _a, _b;
|
|
90
90
|
if (!customError)
|
|
91
91
|
customError = {};
|
|
92
|
-
|
|
92
|
+
const errorCode = parseInt((error === null || error === void 0 ? void 0 : error.code) || (error === null || error === void 0 ? void 0 : error.status)) || '';
|
|
93
93
|
return ((_a = customError[errorCode]) === null || _a === void 0 ? void 0 : _a.title) || ((_b = defaultErrorObj[errorCode]) === null || _b === void 0 ? void 0 : _b.title) || defaultTitle;
|
|
94
94
|
}
|
|
95
95
|
exports.errorMessageTitle = errorMessageTitle;
|
|
@@ -18,71 +18,54 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
18
18
|
__setModuleDefault(result, mod);
|
|
19
19
|
return result;
|
|
20
20
|
};
|
|
21
|
-
var __read = (this && this.__read) || function (o, n) {
|
|
22
|
-
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
23
|
-
if (!m) return o;
|
|
24
|
-
var i = m.call(o), r, ar = [], e;
|
|
25
|
-
try {
|
|
26
|
-
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
|
27
|
-
}
|
|
28
|
-
catch (error) { e = { error: error }; }
|
|
29
|
-
finally {
|
|
30
|
-
try {
|
|
31
|
-
if (r && !r.done && (m = i["return"])) m.call(i);
|
|
32
|
-
}
|
|
33
|
-
finally { if (e) throw e.error; }
|
|
34
|
-
}
|
|
35
|
-
return ar;
|
|
36
|
-
};
|
|
37
21
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
38
22
|
exports.BreakpointProvider = exports.useBreakpoint = void 0;
|
|
39
|
-
|
|
23
|
+
const react_1 = __importStar(require("react"));
|
|
40
24
|
// https://medium.com/better-programming/how-to-use-media-queries-programmatically-in-react-4d6562c3bc97
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
xs:
|
|
45
|
-
sm:
|
|
46
|
-
md:
|
|
47
|
-
lg:
|
|
48
|
-
xl:
|
|
25
|
+
const defaultValue = {};
|
|
26
|
+
const BreakpointContext = react_1.default.createContext(defaultValue);
|
|
27
|
+
const defaultQueries = {
|
|
28
|
+
xs: `(min-width: 0px)`,
|
|
29
|
+
sm: `(min-width: 576px)`,
|
|
30
|
+
md: `(min-width: 768px)`,
|
|
31
|
+
lg: `(min-width: 992px)`,
|
|
32
|
+
xl: `(min-width: 1300px)`,
|
|
49
33
|
};
|
|
50
|
-
function BreakpointProvider(
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
var updatedMatches = keys.reduce(function (acc, media) {
|
|
34
|
+
function BreakpointProvider({ children, queries = defaultQueries }) {
|
|
35
|
+
const [queryMatch, setQueryMatch] = react_1.useState({});
|
|
36
|
+
react_1.useEffect(() => {
|
|
37
|
+
const mediaQueryLists = {};
|
|
38
|
+
const keys = Object.keys(queries);
|
|
39
|
+
let isAttached = false;
|
|
40
|
+
const handleQueryListener = () => {
|
|
41
|
+
const updatedMatches = keys.reduce((acc, media) => {
|
|
59
42
|
acc[media] = !!(mediaQueryLists[media] && mediaQueryLists[media].matches);
|
|
60
43
|
return acc;
|
|
61
44
|
}, {});
|
|
62
45
|
setQueryMatch(updatedMatches);
|
|
63
46
|
};
|
|
64
47
|
if (window && window.matchMedia) {
|
|
65
|
-
|
|
66
|
-
keys.forEach(
|
|
48
|
+
const matches = {};
|
|
49
|
+
keys.forEach((media) => {
|
|
67
50
|
if (typeof queries[media] === 'string') {
|
|
68
51
|
mediaQueryLists[media] = window.matchMedia(queries[media]);
|
|
69
|
-
|
|
52
|
+
matches[media] = mediaQueryLists[media].matches;
|
|
70
53
|
}
|
|
71
54
|
else {
|
|
72
|
-
|
|
55
|
+
matches[media] = false;
|
|
73
56
|
}
|
|
74
57
|
});
|
|
75
|
-
setQueryMatch(
|
|
58
|
+
setQueryMatch(matches);
|
|
76
59
|
isAttached = true;
|
|
77
|
-
keys.forEach(
|
|
60
|
+
keys.forEach((media) => {
|
|
78
61
|
if (typeof queries[media] === 'string') {
|
|
79
62
|
mediaQueryLists[media].addListener(handleQueryListener);
|
|
80
63
|
}
|
|
81
64
|
});
|
|
82
65
|
}
|
|
83
|
-
return
|
|
66
|
+
return () => {
|
|
84
67
|
if (isAttached) {
|
|
85
|
-
keys.forEach(
|
|
68
|
+
keys.forEach((media) => {
|
|
86
69
|
if (typeof queries[media] === 'string') {
|
|
87
70
|
mediaQueryLists[media].removeListener(handleQueryListener);
|
|
88
71
|
}
|
|
@@ -94,7 +77,7 @@ function BreakpointProvider(_a) {
|
|
|
94
77
|
}
|
|
95
78
|
exports.BreakpointProvider = BreakpointProvider;
|
|
96
79
|
function useBreakpoint() {
|
|
97
|
-
|
|
80
|
+
const context = react_1.useContext(BreakpointContext);
|
|
98
81
|
if (context === defaultValue) {
|
|
99
82
|
throw new Error('useBreakpoint must be used within a BreakpointProvider');
|
|
100
83
|
}
|
|
@@ -1,25 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __read = (this && this.__read) || function (o, n) {
|
|
3
|
-
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
4
|
-
if (!m) return o;
|
|
5
|
-
var i = m.call(o), r, ar = [], e;
|
|
6
|
-
try {
|
|
7
|
-
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
|
8
|
-
}
|
|
9
|
-
catch (error) { e = { error: error }; }
|
|
10
|
-
finally {
|
|
11
|
-
try {
|
|
12
|
-
if (r && !r.done && (m = i["return"])) m.call(i);
|
|
13
|
-
}
|
|
14
|
-
finally { if (e) throw e.error; }
|
|
15
|
-
}
|
|
16
|
-
return ar;
|
|
17
|
-
};
|
|
18
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
19
3
|
exports.useCopyToClipboard = exports.selectText = void 0;
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
4
|
+
const react_1 = require("react");
|
|
5
|
+
const react_i18next_1 = require("react-i18next");
|
|
6
|
+
const selectText = (elem) => {
|
|
23
7
|
var range = document.createRange();
|
|
24
8
|
range.selectNode(elem);
|
|
25
9
|
window.getSelection().removeAllRanges();
|
|
@@ -27,9 +11,9 @@ var selectText = function (elem) {
|
|
|
27
11
|
};
|
|
28
12
|
exports.selectText = selectText;
|
|
29
13
|
function useCopyToClipboard(ref) {
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
14
|
+
const [clipboardText, setClipboardText] = react_1.useState('');
|
|
15
|
+
const { t } = react_i18next_1.useTranslation();
|
|
16
|
+
const copyToClipboard = () => {
|
|
33
17
|
exports.selectText(ref.current);
|
|
34
18
|
try {
|
|
35
19
|
document.execCommand('copy');
|
|
@@ -48,8 +32,8 @@ function useCopyToClipboard(ref) {
|
|
|
48
32
|
}
|
|
49
33
|
};
|
|
50
34
|
return {
|
|
51
|
-
clipboardText
|
|
52
|
-
copyToClipboard
|
|
35
|
+
clipboardText,
|
|
36
|
+
copyToClipboard,
|
|
53
37
|
};
|
|
54
38
|
}
|
|
55
39
|
exports.useCopyToClipboard = useCopyToClipboard;
|
|
@@ -1,65 +1,40 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __read = (this && this.__read) || function (o, n) {
|
|
3
|
-
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
4
|
-
if (!m) return o;
|
|
5
|
-
var i = m.call(o), r, ar = [], e;
|
|
6
|
-
try {
|
|
7
|
-
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
|
8
|
-
}
|
|
9
|
-
catch (error) { e = { error: error }; }
|
|
10
|
-
finally {
|
|
11
|
-
try {
|
|
12
|
-
if (r && !r.done && (m = i["return"])) m.call(i);
|
|
13
|
-
}
|
|
14
|
-
finally { if (e) throw e.error; }
|
|
15
|
-
}
|
|
16
|
-
return ar;
|
|
17
|
-
};
|
|
18
|
-
var __spreadArray = (this && this.__spreadArray) || function (to, from) {
|
|
19
|
-
for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
|
|
20
|
-
to[j] = from[i];
|
|
21
|
-
return to;
|
|
22
|
-
};
|
|
23
2
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
24
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
25
4
|
};
|
|
26
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
27
6
|
exports.useDeepCompareDebounce = exports.useDebounce = void 0;
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
7
|
+
const debounce_1 = __importDefault(require("lodash/debounce"));
|
|
8
|
+
const react_1 = require("react");
|
|
9
|
+
const use_deep_compare_effect_1 = __importDefault(require("use-deep-compare-effect"));
|
|
31
10
|
// Takes a callback that is called after a debounce delay based on the dependencies array
|
|
32
11
|
// Its just a wrapper over useEffect and debounce function which cancels previous callback each time
|
|
33
|
-
function useDebounce(callback, dependencies, wait, options) {
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
react_1.useEffect(function () {
|
|
37
|
-
var handler = debounce_1.default(function () {
|
|
12
|
+
function useDebounce(callback, dependencies, wait = 0, options = {}) {
|
|
13
|
+
react_1.useEffect(() => {
|
|
14
|
+
const handler = debounce_1.default(() => {
|
|
38
15
|
callback();
|
|
39
16
|
}, wait, options);
|
|
40
17
|
handler();
|
|
41
18
|
// Clears the previous callback
|
|
42
|
-
return
|
|
19
|
+
return () => {
|
|
43
20
|
handler.cancel();
|
|
44
21
|
};
|
|
45
22
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
46
|
-
},
|
|
23
|
+
}, [wait, ...dependencies]);
|
|
47
24
|
}
|
|
48
25
|
exports.useDebounce = useDebounce;
|
|
49
|
-
function useDeepCompareDebounce(callback, dependencies, wait, options) {
|
|
50
|
-
|
|
51
|
-
if (options === void 0) { options = {}; }
|
|
52
|
-
use_deep_compare_effect_1.default(function () {
|
|
26
|
+
function useDeepCompareDebounce(callback, dependencies, wait = 0, options = {}) {
|
|
27
|
+
use_deep_compare_effect_1.default(() => {
|
|
53
28
|
//instead of useeffect use the deepcompare libary
|
|
54
|
-
|
|
29
|
+
const handler = debounce_1.default(() => {
|
|
55
30
|
callback();
|
|
56
31
|
}, wait, options);
|
|
57
32
|
handler();
|
|
58
33
|
// Clears the previous callback
|
|
59
|
-
return
|
|
34
|
+
return () => {
|
|
60
35
|
handler.cancel();
|
|
61
36
|
};
|
|
62
37
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
63
|
-
},
|
|
38
|
+
}, [wait, ...dependencies]);
|
|
64
39
|
}
|
|
65
40
|
exports.useDeepCompareDebounce = useDeepCompareDebounce;
|