@appsignal/react - npm Package Compare versions

Comparing version 1.0.25 to 1.0.26

CHANGELOG.md

 # AppSignal for react changelog
 
+## 1.0.26
+
+_Published on 2024-07-03._
+
+### Added
+
+- Add a span override prop to the `ErrorBoundary` and `LegacyBoundary` components.
+
+  Pass an override function to the error boundary component in order to set properties, such as tags, params or breadcrumbs, in the error span that will be sent to AppSignal.
+
+  The override function is only called when an error is about to be sent. This allows you to only perform expensive computation to add information to the error when an error will actually be reported.
+
+  When defined within a component, the function should be memoized with `useCallback` to prevent unnecessary re-renders:
+
+  ```jsx
+    export default const SomeComponent = ({ someProp }) => {
+      const override = useCallback((span) => {
+        span.setTags({ someProp })
+      }, [someProp]);
+
+      return (
+        <ErrorBoundary override={override}>
+          { /* Your component here */ }
+        </ErrorBoundary>
+      )
+    }
+  ```
+
+  (patch [2ae20c2](https://github.com/appsignal/appsignal-javascript/commit/2ae20c279bf8ef416019f523a56ecd35edbd23bc))
+
 ## 1.0.25
@@ -4,0 +34,0 @@

dist/cjs/ErrorBoundary.js

@@ -45,3 +45,3 @@ "use strict";
     ErrorBoundary.prototype.componentDidCatch = function (error) {
-        var _a = this.props, appsignal = _a.instance, action = _a.action, _b = _a.tags, tags = _b === void 0 ? {} : _b;
+        var _a = this.props, appsignal = _a.instance, action = _a.action, _b = _a.tags, tags = _b === void 0 ? {} : _b, override = _a.override;
         var span = appsignal.createSpan();
@@ -51,2 +51,5 @@ span.setError(error).setTags(__assign({ framework: "React" }, tags));
             span.setAction(action);
+        if (override) {
+            span = override(span, error);
+        }
         appsignal.send(span);
@@ -53,0 +56,0 @@ if (!this.state.error)

dist/cjs/LegacyBoundary.js

@@ -42,3 +42,3 @@ "use strict";
     LegacyBoundary.prototype.unstable_handleError = function (error) {
-        var _a = this.props, appsignal = _a.instance, action = _a.action, _b = _a.tags, tags = _b === void 0 ? {} : _b;
+        var _a = this.props, appsignal = _a.instance, action = _a.action, _b = _a.tags, tags = _b === void 0 ? {} : _b, override = _a.override;
         var name = error.name, message = error.message, stack = error.stack;
@@ -55,2 +55,5 @@ var span = appsignal.createSpan();
             span.setAction(action);
+        if (override) {
+            span = override(span, error);
+        }
         appsignal.send(span);
@@ -57,0 +60,0 @@ this.setState({ error: error });

dist/cjs/types/component.d.ts

@@ -1,3 +0,3 @@
-/// <reference types="react" />
-import type { JSClient } from "@appsignal/types";
+import type { JSClient, JSSpan } from "@appsignal/types";
+import type React from "react";
 export declare type Props = {
@@ -7,3 +7,4 @@ instance: JSClient;
     children: React.ReactNode;
-    fallback?: Function;
+    fallback?: (error?: Error) => React.ReactNode;
+    override?: (span: JSSpan, error?: Error) => JSSpan;
     tags?: {
@@ -10,0 +11,0 @@ [key: string]: string;

dist/esm/ErrorBoundary.js

@@ -39,3 +39,3 @@ var __extends = (this && this.__extends) || (function () {
     ErrorBoundary.prototype.componentDidCatch = function (error) {
-        var _a = this.props, appsignal = _a.instance, action = _a.action, _b = _a.tags, tags = _b === void 0 ? {} : _b;
+        var _a = this.props, appsignal = _a.instance, action = _a.action, _b = _a.tags, tags = _b === void 0 ? {} : _b, override = _a.override;
         var span = appsignal.createSpan();
@@ -45,2 +45,5 @@ span.setError(error).setTags(__assign({ framework: "React" }, tags));
             span.setAction(action);
+        if (override) {
+            span = override(span, error);
+        }
         appsignal.send(span);
@@ -47,0 +50,0 @@ if (!this.state.error)

dist/esm/LegacyBoundary.js

@@ -36,3 +36,3 @@ var __extends = (this && this.__extends) || (function () {
     LegacyBoundary.prototype.unstable_handleError = function (error) {
-        var _a = this.props, appsignal = _a.instance, action = _a.action, _b = _a.tags, tags = _b === void 0 ? {} : _b;
+        var _a = this.props, appsignal = _a.instance, action = _a.action, _b = _a.tags, tags = _b === void 0 ? {} : _b, override = _a.override;
         var name = error.name, message = error.message, stack = error.stack;
@@ -49,2 +49,5 @@ var span = appsignal.createSpan();
             span.setAction(action);
+        if (override) {
+            span = override(span, error);
+        }
         appsignal.send(span);
@@ -51,0 +54,0 @@ this.setState({ error: error });

dist/esm/types/component.d.ts

@@ -1,3 +0,3 @@
-/// <reference types="react" />
-import type { JSClient } from "@appsignal/types";
+import type { JSClient, JSSpan } from "@appsignal/types";
+import type React from "react";
 export declare type Props = {
@@ -7,3 +7,4 @@ instance: JSClient;
     children: React.ReactNode;
-    fallback?: Function;
+    fallback?: (error?: Error) => React.ReactNode;
+    override?: (span: JSSpan, error?: Error) => JSSpan;
     tags?: {
@@ -10,0 +11,0 @@ [key: string]: string;

package.json

 {
   "name": "@appsignal/react",
-  "version": "1.0.25",
+  "version": "1.0.26",
   "main": "dist/cjs/index.js",
@@ -5,0 +5,0 @@ "module": "dist/esm/index.js",

No alert changes

Improved metrics

Total package byte prevSize

39744

increased by7.85%

Lines of code

364

increased by4%

No dependency changes