@ndlib/component-library 1.0.26 → 1.0.27
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.
|
@@ -32,7 +32,7 @@ export const Alerts = (_a) => {
|
|
|
32
32
|
return (_jsx(Box, Object.assign({}, rest, { children: alerts.map((alert, i) => {
|
|
33
33
|
const { type, description } = alert;
|
|
34
34
|
return (_jsx(Alert, { type: type, description: description, "data-nosnippet": true, sx: Object.assign({ mt: i ? '4px' : 0 }, alertStyles), dismiss: () => {
|
|
35
|
-
dismiss(alert.
|
|
35
|
+
dismiss(alert.id);
|
|
36
36
|
} }, i));
|
|
37
37
|
}) })));
|
|
38
38
|
};
|
|
@@ -41,6 +41,7 @@ const composeGraphqlQuery = ({ startTime, endTime, }) => {
|
|
|
41
41
|
sort: ["type:desc", "startTime:asc"]
|
|
42
42
|
) {
|
|
43
43
|
data {
|
|
44
|
+
id
|
|
44
45
|
attributes {
|
|
45
46
|
title
|
|
46
47
|
description
|
|
@@ -53,8 +54,8 @@ const composeGraphqlQuery = ({ startTime, endTime, }) => {
|
|
|
53
54
|
}
|
|
54
55
|
`,
|
|
55
56
|
variables: {
|
|
56
|
-
startTime
|
|
57
|
-
endTime
|
|
57
|
+
startTime,
|
|
58
|
+
endTime,
|
|
58
59
|
},
|
|
59
60
|
});
|
|
60
61
|
};
|
|
@@ -63,22 +64,16 @@ const useAlertsQuery = ({ domain = ALERT_DOMAIN.LIBRARY, endpoint = DEFAULT_ENDP
|
|
|
63
64
|
const [alerts, setAlerts] = useState([]);
|
|
64
65
|
useEffect(() => {
|
|
65
66
|
const fetchData = () => __awaiter(void 0, void 0, void 0, function* () {
|
|
66
|
-
var _a, _b
|
|
67
|
+
var _a, _b;
|
|
67
68
|
try {
|
|
68
|
-
const myHeaders = new Headers();
|
|
69
|
-
myHeaders.append('Content-Type', 'application/json');
|
|
70
69
|
const response = yield fetch(endpoint, {
|
|
71
70
|
method: 'POST',
|
|
72
|
-
headers:
|
|
73
|
-
body: composeGraphqlQuery({
|
|
74
|
-
startTime,
|
|
75
|
-
endTime,
|
|
76
|
-
}),
|
|
77
|
-
redirect: 'follow',
|
|
71
|
+
headers: { 'Content-Type': 'application/json' },
|
|
72
|
+
body: composeGraphqlQuery({ startTime, endTime }),
|
|
78
73
|
});
|
|
79
74
|
const json = yield response.json();
|
|
80
75
|
if ((_b = (_a = json === null || json === void 0 ? void 0 : json.data) === null || _a === void 0 ? void 0 : _a.alerts) === null || _b === void 0 ? void 0 : _b.data) {
|
|
81
|
-
const results =
|
|
76
|
+
const results = json.data.alerts.data.map((a) => (Object.assign({ id: a.id }, a.attributes)));
|
|
82
77
|
setAlerts(results);
|
|
83
78
|
}
|
|
84
79
|
}
|
|
@@ -110,23 +105,20 @@ export const AlertsProvider = ({ domain = ALERT_DOMAIN.LIBRARY, endpoint, startT
|
|
|
110
105
|
const [dismissedAlerts, setDismissedAlerts] = useState(storedDismissedAlerts ? JSON.parse(storedDismissedAlerts) : []);
|
|
111
106
|
const dismiss = (id) => {
|
|
112
107
|
if (!dismissedAlerts.includes(id)) {
|
|
113
|
-
const newDismissed = dismissedAlerts
|
|
108
|
+
const newDismissed = [...dismissedAlerts, id];
|
|
114
109
|
storage.setItem(DISMISSED_ALERTS_STORAGE_KEY, JSON.stringify(newDismissed));
|
|
115
110
|
setDismissedAlerts(newDismissed);
|
|
116
111
|
}
|
|
117
112
|
};
|
|
118
113
|
const filteredAlerts = alerts
|
|
119
|
-
.filter((alert) => !dismissedAlerts.includes(alert.
|
|
114
|
+
.filter((alert) => !dismissedAlerts.includes(alert.id))
|
|
120
115
|
.filter((alert) => { var _a; return (_a = alert === null || alert === void 0 ? void 0 : alert.domains) === null || _a === void 0 ? void 0 : _a.includes(domain); });
|
|
121
|
-
return (_jsx(AlertsContext.Provider, Object.assign({ value: {
|
|
122
|
-
alerts: filteredAlerts,
|
|
123
|
-
dismiss,
|
|
124
|
-
} }, { children: children })));
|
|
116
|
+
return (_jsx(AlertsContext.Provider, Object.assign({ value: { alerts: filteredAlerts, dismiss } }, { children: children })));
|
|
125
117
|
};
|
|
126
|
-
export const useAlerts = (pageAlerts) => {
|
|
118
|
+
export const useAlerts = (pageAlerts = []) => {
|
|
127
119
|
const { alerts: allAlerts, dismiss } = React.useContext(AlertsContext);
|
|
128
|
-
const alerts = pageAlerts
|
|
129
|
-
? allAlerts.filter((alert) => alert.global || pageAlerts.includes(alert.
|
|
120
|
+
const alerts = pageAlerts.length > 0
|
|
121
|
+
? allAlerts.filter((alert) => alert.global || pageAlerts.includes(alert.id))
|
|
130
122
|
: allAlerts.filter((alert) => alert.global);
|
|
131
123
|
return {
|
|
132
124
|
alerts,
|
|
@@ -18,7 +18,7 @@ describe('AlertsProvider and useAlerts', () => {
|
|
|
18
18
|
});
|
|
19
19
|
const mockAlerts = [
|
|
20
20
|
{
|
|
21
|
-
|
|
21
|
+
id: '1',
|
|
22
22
|
domains: ['library'],
|
|
23
23
|
startTime: '2020-09-06T04:00:00.000Z',
|
|
24
24
|
endTime: '2020-09-09T04:00:00.000Z',
|
|
@@ -28,7 +28,7 @@ describe('AlertsProvider and useAlerts', () => {
|
|
|
28
28
|
global: true,
|
|
29
29
|
},
|
|
30
30
|
{
|
|
31
|
-
|
|
31
|
+
id: '2',
|
|
32
32
|
title: 'Test Alert 2',
|
|
33
33
|
type: 'Warning',
|
|
34
34
|
description: 'Issue with Primo',
|
|
@@ -36,7 +36,7 @@ describe('AlertsProvider and useAlerts', () => {
|
|
|
36
36
|
global: false,
|
|
37
37
|
},
|
|
38
38
|
{
|
|
39
|
-
|
|
39
|
+
id: '3',
|
|
40
40
|
domains: ['library'],
|
|
41
41
|
startTime: '2020-09-06T04:00:00.000Z',
|
|
42
42
|
endTime: '2020-09-09T04:00:00.000Z',
|
|
@@ -61,7 +61,7 @@ describe('AlertsProvider and useAlerts', () => {
|
|
|
61
61
|
});
|
|
62
62
|
const TestComponent = () => {
|
|
63
63
|
const { alerts } = useAlerts();
|
|
64
|
-
return (_jsx("div", { children: alerts.map((alert) => (_jsx("div", { children: alert.title }, alert.
|
|
64
|
+
return (_jsx("div", { children: alerts.map((alert) => (_jsx("div", { children: alert.title }, alert.id))) }));
|
|
65
65
|
};
|
|
66
66
|
render(_jsx(AlertsProvider, { children: _jsx(TestComponent, {}) }));
|
|
67
67
|
yield waitFor(() => {
|
|
@@ -77,7 +77,7 @@ describe('AlertsProvider and useAlerts', () => {
|
|
|
77
77
|
const { alerts } = useAlerts();
|
|
78
78
|
return (_jsx("div", { children: alerts.length === 0
|
|
79
79
|
? 'No Alerts'
|
|
80
|
-
: alerts.map((alert) => _jsx("div", { children: alert.title }, alert.
|
|
80
|
+
: alerts.map((alert) => _jsx("div", { children: alert.title }, alert.id)) }));
|
|
81
81
|
};
|
|
82
82
|
render(_jsx(AlertsProvider, { children: _jsx(TestComponent, {}) }));
|
|
83
83
|
yield waitFor(() => {
|
|
@@ -92,7 +92,7 @@ describe('AlertsProvider and useAlerts', () => {
|
|
|
92
92
|
const { alerts } = useAlerts();
|
|
93
93
|
return (_jsx("div", { children: alerts.length === 0
|
|
94
94
|
? 'No Alerts'
|
|
95
|
-
: alerts.map((alert) => _jsx("div", { children: alert.title }, alert.
|
|
95
|
+
: alerts.map((alert) => _jsx("div", { children: alert.title }, alert.id)) }));
|
|
96
96
|
};
|
|
97
97
|
render(_jsx(AlertsProvider, { children: _jsx(TestComponent, {}) }));
|
|
98
98
|
yield waitFor(() => {
|
|
@@ -105,7 +105,7 @@ describe('AlertsProvider and useAlerts', () => {
|
|
|
105
105
|
const { alerts } = useAlerts();
|
|
106
106
|
return (_jsx("div", { children: alerts.length === 0
|
|
107
107
|
? 'No Alerts'
|
|
108
|
-
: alerts.map((alert) => _jsx("div", { children: alert.title }, alert.
|
|
108
|
+
: alerts.map((alert) => _jsx("div", { children: alert.title }, alert.id)) }));
|
|
109
109
|
};
|
|
110
110
|
render(_jsx(AlertsProvider, { children: _jsx(TestComponent, {}) }));
|
|
111
111
|
yield waitFor(() => {
|