@equinor/cpl-error-snackbar-react 0.0.0 → 0.0.2

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 (5) hide show
  1. package/dist/index.d.mts +27 -6
  2. package/dist/index.d.ts +27 -6
  3. package/dist/index.js +15 -37
  4. package/dist/index.mjs +15 -37
  5. package/package.json +1 -1
package/dist/index.d.mts CHANGED
@@ -65,9 +65,31 @@ interface AccessRequirement {
65
65
  */
66
66
  wasEvaluated: boolean;
67
67
  }
68
+ interface ErrorSnackbarObject {
69
+ id: string;
70
+ error: Error;
71
+ metadata?: object;
72
+ }
68
73
 
69
74
  interface ErrorSnackbarProps {
75
+ /**
76
+ * The error to display.
77
+ */
70
78
  error: Error;
79
+ /**
80
+ * Optional metadata to be included when copying the error.
81
+ *
82
+ * @example
83
+ * const errorMetadata = {
84
+ * url: 'https://.../api/users'
85
+ * method: 'PATCH',
86
+ * payload: {
87
+ * id: 1,
88
+ * username: 'user1'
89
+ * }
90
+ * }
91
+ */
92
+ errorMetadata?: object;
71
93
  onClose: () => void;
72
94
  /**
73
95
  * Provide custom icon if needed. Fallback to default 'error_filled' from EDS if not provided.
@@ -80,15 +102,14 @@ interface ErrorSnackbarProps {
80
102
  */
81
103
  hideCopyToClipboardButton?: boolean;
82
104
  }
83
- declare function ErrorSnackbar({ error, icon, onClose, hideCopyToClipboardButton, }: ErrorSnackbarProps): react_jsx_runtime.JSX.Element;
105
+ /**
106
+ * Component displaying various errors in as a snackbar. This is a base component and a part of `ErrorSnackbarFixedList`.
107
+ */
108
+ declare function ErrorSnackbar({ error, errorMetadata: metadata, icon, onClose, hideCopyToClipboardButton, }: ErrorSnackbarProps): react_jsx_runtime.JSX.Element;
84
109
 
85
- interface ErrorSnackbarObject {
86
- id: string;
87
- error: Error;
88
- }
89
110
  type ErrorSnackbarState = {
90
111
  errorSnackbarObjects: ErrorSnackbarObject[];
91
- addError: (error: Error) => string;
112
+ addError: (error: Error, metadata?: object) => string;
92
113
  removeErrorSnackbarObjectById: (id: string) => void;
93
114
  removeAllErrorSnackbarObjects: () => void;
94
115
  };
package/dist/index.d.ts CHANGED
@@ -65,9 +65,31 @@ interface AccessRequirement {
65
65
  */
66
66
  wasEvaluated: boolean;
67
67
  }
68
+ interface ErrorSnackbarObject {
69
+ id: string;
70
+ error: Error;
71
+ metadata?: object;
72
+ }
68
73
 
69
74
  interface ErrorSnackbarProps {
75
+ /**
76
+ * The error to display.
77
+ */
70
78
  error: Error;
79
+ /**
80
+ * Optional metadata to be included when copying the error.
81
+ *
82
+ * @example
83
+ * const errorMetadata = {
84
+ * url: 'https://.../api/users'
85
+ * method: 'PATCH',
86
+ * payload: {
87
+ * id: 1,
88
+ * username: 'user1'
89
+ * }
90
+ * }
91
+ */
92
+ errorMetadata?: object;
71
93
  onClose: () => void;
72
94
  /**
73
95
  * Provide custom icon if needed. Fallback to default 'error_filled' from EDS if not provided.
@@ -80,15 +102,14 @@ interface ErrorSnackbarProps {
80
102
  */
81
103
  hideCopyToClipboardButton?: boolean;
82
104
  }
83
- declare function ErrorSnackbar({ error, icon, onClose, hideCopyToClipboardButton, }: ErrorSnackbarProps): react_jsx_runtime.JSX.Element;
105
+ /**
106
+ * Component displaying various errors in as a snackbar. This is a base component and a part of `ErrorSnackbarFixedList`.
107
+ */
108
+ declare function ErrorSnackbar({ error, errorMetadata: metadata, icon, onClose, hideCopyToClipboardButton, }: ErrorSnackbarProps): react_jsx_runtime.JSX.Element;
84
109
 
85
- interface ErrorSnackbarObject {
86
- id: string;
87
- error: Error;
88
- }
89
110
  type ErrorSnackbarState = {
90
111
  errorSnackbarObjects: ErrorSnackbarObject[];
91
- addError: (error: Error) => string;
112
+ addError: (error: Error, metadata?: object) => string;
92
113
  removeErrorSnackbarObjectById: (id: string) => void;
93
114
  removeAllErrorSnackbarObjects: () => void;
94
115
  };
package/dist/index.js CHANGED
@@ -107,6 +107,7 @@ var import_styled_components2 = __toESM(require("styled-components"));
107
107
  var import_jsx_runtime2 = require("react/jsx-runtime");
108
108
  function ErrorSnackbar({
109
109
  error,
110
+ errorMetadata: metadata,
110
111
  icon,
111
112
  onClose,
112
113
  hideCopyToClipboardButton = false
@@ -160,7 +161,7 @@ function ErrorSnackbar({
160
161
  error.traceId
161
162
  ] })
162
163
  ] }),
163
- !hideCopyToClipboardButton && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(CopyWrapper, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(CopyToClipboardButton, { value: JSON.stringify(error, null, 2) }) })
164
+ !hideCopyToClipboardButton && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(CopyWrapper, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(CopyToClipboardButton, { value: JSON.stringify({ error, metadata }, null, 2) }) })
164
165
  ] })
165
166
  ] });
166
167
  }
@@ -239,9 +240,9 @@ function ErrorSnackbarContextProvider({
239
240
  initialErrorSnackbarObjects
240
241
  );
241
242
  const addError = (0, import_react2.useCallback)(
242
- (error) => {
243
+ (error, metadata) => {
243
244
  const id = crypto.randomUUID();
244
- setErrorSnackbarObjects([{ id, error }, ...errorSnackbarObjects]);
245
+ setErrorSnackbarObjects([{ id, error, metadata }, ...errorSnackbarObjects]);
245
246
  return id;
246
247
  },
247
248
  [errorSnackbarObjects]
@@ -269,26 +270,20 @@ function ErrorSnackbarContextProvider({
269
270
  // src/ErrorSnackbarFixedList.tsx
270
271
  var import_styled_components3 = __toESM(require("styled-components"));
271
272
  var import_jsx_runtime4 = require("react/jsx-runtime");
272
- var ERROR_SNACKBARS_FIXED_WRAPPER_TESTID = "error-snackbars-fixed-wrapper";
273
+ var ERROR_SNACKBARS_FIXED_LIST_TESTID = "error-snackbars-fixed-wrapper";
273
274
  function ErrorSnackbarFixedList({
274
275
  disablePositionFixed = false,
275
276
  errorSnackbarObjects,
276
277
  removeErrorSnackbarObjectById
277
278
  }) {
278
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
279
- FixedWrapper,
279
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FixedWrapper, { $disablePositionFixed: disablePositionFixed, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SnackbarList, { "data-testid": ERROR_SNACKBARS_FIXED_LIST_TESTID, children: errorSnackbarObjects.map((errorSnackbarObject) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
280
+ ErrorSnackbar,
280
281
  {
281
- $disablePositionFixed: disablePositionFixed,
282
- "data-testid": ERROR_SNACKBARS_FIXED_WRAPPER_TESTID,
283
- children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SnackbarList, { children: errorSnackbarObjects.map((errorSnackbarObject) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
284
- ErrorSnackbar,
285
- {
286
- error: errorSnackbarObject.error,
287
- onClose: () => removeErrorSnackbarObjectById(errorSnackbarObject.id)
288
- }
289
- ) }, errorSnackbarObject.id)) })
282
+ error: errorSnackbarObject.error,
283
+ errorMetadata: errorSnackbarObject.metadata,
284
+ onClose: () => removeErrorSnackbarObjectById(errorSnackbarObject.id)
290
285
  }
291
- );
286
+ ) }, errorSnackbarObject.id)) }) });
292
287
  }
293
288
  var SnackbarList = import_styled_components3.default.ul`
294
289
  list-style: none;
@@ -298,6 +293,8 @@ var SnackbarList = import_styled_components3.default.ul`
298
293
  width: 50rem;
299
294
  max-width: calc(100dvw - 4rem);
300
295
 
296
+ overflow: auto;
297
+
301
298
  // Add gap between list items
302
299
  li + li {
303
300
  margin-top: 0.5rem;
@@ -308,6 +305,7 @@ var FixedWrapper = import_styled_components3.default.div`
308
305
  gap: 0.5rem;
309
306
  flex: 1;
310
307
  flex-direction: column;
308
+ align-items: center;
311
309
 
312
310
  ${({ $disablePositionFixed }) => {
313
311
  if ($disablePositionFixed) {
@@ -319,7 +317,6 @@ var FixedWrapper = import_styled_components3.default.div`
319
317
  left: 0;
320
318
  width: 100%;
321
319
  max-height: 90%;
322
- overflow: auto;
323
320
  `;
324
321
  }};
325
322
  `;
@@ -356,26 +353,7 @@ function parseUnknownError(unknownError) {
356
353
  title: getTypedPropertyIfExists(unknownError, "title", "string") || "Unkown Error",
357
354
  status: getTypedPropertyIfExists(unknownError, "status", "number") || -1,
358
355
  detail: getTypedPropertyIfExists(unknownError, "detail", "string"),
359
- error: innerError != null ? innerError : {
360
- code: "Forbidden",
361
- message: "You do not meet any of the requirements to access the underlying data.",
362
- accessRequirements: [
363
- {
364
- code: "TrustedApplication",
365
- description: "Application user (Azure AD Application registration) with established trust.",
366
- outcome: "User is not application user.",
367
- wasEvaluated: true
368
- },
369
- {
370
- code: "AccountClassification",
371
- description: "User must be of type Employee.",
372
- outcome: "Your account classification is Consultant.",
373
- wasEvaluated: true
374
- }
375
- ]
376
- },
377
- traceId: "00-32714e8408ffd5ef675807bfe44f3190-c21117102fa5ac81-00",
378
- timestamp: "2024-06-27T11:13:22.0185894+00:00"
356
+ error: innerError
379
357
  };
380
358
  }
381
359
  function parseInnerError(rawInnerError) {
package/dist/index.mjs CHANGED
@@ -66,6 +66,7 @@ import styled2 from "styled-components";
66
66
  import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
67
67
  function ErrorSnackbar({
68
68
  error,
69
+ errorMetadata: metadata,
69
70
  icon,
70
71
  onClose,
71
72
  hideCopyToClipboardButton = false
@@ -119,7 +120,7 @@ function ErrorSnackbar({
119
120
  error.traceId
120
121
  ] })
121
122
  ] }),
122
- !hideCopyToClipboardButton && /* @__PURE__ */ jsx2(CopyWrapper, { children: /* @__PURE__ */ jsx2(CopyToClipboardButton, { value: JSON.stringify(error, null, 2) }) })
123
+ !hideCopyToClipboardButton && /* @__PURE__ */ jsx2(CopyWrapper, { children: /* @__PURE__ */ jsx2(CopyToClipboardButton, { value: JSON.stringify({ error, metadata }, null, 2) }) })
123
124
  ] })
124
125
  ] });
125
126
  }
@@ -198,9 +199,9 @@ function ErrorSnackbarContextProvider({
198
199
  initialErrorSnackbarObjects
199
200
  );
200
201
  const addError = useCallback(
201
- (error) => {
202
+ (error, metadata) => {
202
203
  const id = crypto.randomUUID();
203
- setErrorSnackbarObjects([{ id, error }, ...errorSnackbarObjects]);
204
+ setErrorSnackbarObjects([{ id, error, metadata }, ...errorSnackbarObjects]);
204
205
  return id;
205
206
  },
206
207
  [errorSnackbarObjects]
@@ -228,26 +229,20 @@ function ErrorSnackbarContextProvider({
228
229
  // src/ErrorSnackbarFixedList.tsx
229
230
  import styled3 from "styled-components";
230
231
  import { jsx as jsx4 } from "react/jsx-runtime";
231
- var ERROR_SNACKBARS_FIXED_WRAPPER_TESTID = "error-snackbars-fixed-wrapper";
232
+ var ERROR_SNACKBARS_FIXED_LIST_TESTID = "error-snackbars-fixed-wrapper";
232
233
  function ErrorSnackbarFixedList({
233
234
  disablePositionFixed = false,
234
235
  errorSnackbarObjects,
235
236
  removeErrorSnackbarObjectById
236
237
  }) {
237
- return /* @__PURE__ */ jsx4(
238
- FixedWrapper,
238
+ return /* @__PURE__ */ jsx4(FixedWrapper, { $disablePositionFixed: disablePositionFixed, children: /* @__PURE__ */ jsx4(SnackbarList, { "data-testid": ERROR_SNACKBARS_FIXED_LIST_TESTID, children: errorSnackbarObjects.map((errorSnackbarObject) => /* @__PURE__ */ jsx4("li", { children: /* @__PURE__ */ jsx4(
239
+ ErrorSnackbar,
239
240
  {
240
- $disablePositionFixed: disablePositionFixed,
241
- "data-testid": ERROR_SNACKBARS_FIXED_WRAPPER_TESTID,
242
- children: /* @__PURE__ */ jsx4(SnackbarList, { children: errorSnackbarObjects.map((errorSnackbarObject) => /* @__PURE__ */ jsx4("li", { children: /* @__PURE__ */ jsx4(
243
- ErrorSnackbar,
244
- {
245
- error: errorSnackbarObject.error,
246
- onClose: () => removeErrorSnackbarObjectById(errorSnackbarObject.id)
247
- }
248
- ) }, errorSnackbarObject.id)) })
241
+ error: errorSnackbarObject.error,
242
+ errorMetadata: errorSnackbarObject.metadata,
243
+ onClose: () => removeErrorSnackbarObjectById(errorSnackbarObject.id)
249
244
  }
250
- );
245
+ ) }, errorSnackbarObject.id)) }) });
251
246
  }
252
247
  var SnackbarList = styled3.ul`
253
248
  list-style: none;
@@ -257,6 +252,8 @@ var SnackbarList = styled3.ul`
257
252
  width: 50rem;
258
253
  max-width: calc(100dvw - 4rem);
259
254
 
255
+ overflow: auto;
256
+
260
257
  // Add gap between list items
261
258
  li + li {
262
259
  margin-top: 0.5rem;
@@ -267,6 +264,7 @@ var FixedWrapper = styled3.div`
267
264
  gap: 0.5rem;
268
265
  flex: 1;
269
266
  flex-direction: column;
267
+ align-items: center;
270
268
 
271
269
  ${({ $disablePositionFixed }) => {
272
270
  if ($disablePositionFixed) {
@@ -278,7 +276,6 @@ var FixedWrapper = styled3.div`
278
276
  left: 0;
279
277
  width: 100%;
280
278
  max-height: 90%;
281
- overflow: auto;
282
279
  `;
283
280
  }};
284
281
  `;
@@ -315,26 +312,7 @@ function parseUnknownError(unknownError) {
315
312
  title: getTypedPropertyIfExists(unknownError, "title", "string") || "Unkown Error",
316
313
  status: getTypedPropertyIfExists(unknownError, "status", "number") || -1,
317
314
  detail: getTypedPropertyIfExists(unknownError, "detail", "string"),
318
- error: innerError != null ? innerError : {
319
- code: "Forbidden",
320
- message: "You do not meet any of the requirements to access the underlying data.",
321
- accessRequirements: [
322
- {
323
- code: "TrustedApplication",
324
- description: "Application user (Azure AD Application registration) with established trust.",
325
- outcome: "User is not application user.",
326
- wasEvaluated: true
327
- },
328
- {
329
- code: "AccountClassification",
330
- description: "User must be of type Employee.",
331
- outcome: "Your account classification is Consultant.",
332
- wasEvaluated: true
333
- }
334
- ]
335
- },
336
- traceId: "00-32714e8408ffd5ef675807bfe44f3190-c21117102fa5ac81-00",
337
- timestamp: "2024-06-27T11:13:22.0185894+00:00"
315
+ error: innerError
338
316
  };
339
317
  }
340
318
  function parseInnerError(rawInnerError) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@equinor/cpl-error-snackbar-react",
3
- "version": "0.0.0",
3
+ "version": "0.0.2",
4
4
  "license": "MIT",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.mjs",