diff --git a/atproto-notifications/package-lock.json b/atproto-notifications/package-lock.json index deb3491..1fca723 100644 --- a/atproto-notifications/package-lock.json +++ b/atproto-notifications/package-lock.json @@ -15,6 +15,7 @@ "psl": "^1.15.0", "react": "^19.1.0", "react-dom": "^19.1.0", + "react-error-boundary": "^6.0.0", "react-router": "^7.6.3", "react-time-ago": "^7.3.3", "reactjs-popup": "^2.0.6" @@ -36,6 +37,9 @@ "../lexicons": { "version": "0.0.1", "dependencies": { + "@atcute/client": "^4.0.3", + "@atcute/identity-resolver": "^1.1.3", + "jsonpath-plus": "^10.3.0", "psl": "^1.15.0" } }, @@ -329,6 +333,15 @@ "@babel/core": "^7.0.0-0" } }, + "node_modules/@babel/runtime": { + "version": "7.27.6", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.27.6.tgz", + "integrity": "sha512-vbavdySgbTTrmFE+EsiqUTzlOr5bzlnJtUv9PynGCAKvfQqjIXbvFdumPM/GxMDfyuGMJaJAU6TO4zc1Jf1i8Q==", + "license": "MIT", + "engines": { + "node": ">=6.9.0" + } + }, "node_modules/@babel/template": { "version": "7.27.2", "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.27.2.tgz", @@ -3077,6 +3090,18 @@ "react": "^19.1.0" } }, + "node_modules/react-error-boundary": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/react-error-boundary/-/react-error-boundary-6.0.0.tgz", + "integrity": "sha512-gdlJjD7NWr0IfkPlaREN2d9uUZUlksrfOx7SX62VRerwXbMY6ftGCIZua1VG1aXFNOimhISsTq+Owp725b9SiA==", + "license": "MIT", + "dependencies": { + "@babel/runtime": "^7.12.5" + }, + "peerDependencies": { + "react": ">=16.13.1" + } + }, "node_modules/react-is": { "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", diff --git a/atproto-notifications/package.json b/atproto-notifications/package.json index d20d065..adb76f2 100644 --- a/atproto-notifications/package.json +++ b/atproto-notifications/package.json @@ -18,6 +18,7 @@ "psl": "^1.15.0", "react": "^19.1.0", "react-dom": "^19.1.0", + "react-error-boundary": "^6.0.0", "react-router": "^7.6.3", "react-time-ago": "^7.3.3", "reactjs-popup": "^2.0.6" diff --git a/atproto-notifications/src/components/Notification.css b/atproto-notifications/src/components/Notification.css index d4ba7f8..df75597 100644 --- a/atproto-notifications/src/components/Notification.css +++ b/atproto-notifications/src/components/Notification.css @@ -22,6 +22,14 @@ a.notification:hover { border-bottom-color: hsla(0, 0%, 0%, 0.3); } +.notification.error { + background: hsla(347, 72%, 20%, 0.333); + align-items: center; +} +.notification.error p { + margin: 0; +} + .handle { color: skyblue; } diff --git a/atproto-notifications/src/components/Notification.tsx b/atproto-notifications/src/components/Notification.tsx index d19af95..1624bda 100644 --- a/atproto-notifications/src/components/Notification.tsx +++ b/atproto-notifications/src/components/Notification.tsx @@ -7,6 +7,16 @@ import { Fetch } from './Fetch'; import './Notification.css'; +export function fallbackRender({ error, resetErrorBoundary }) { + console.error('rendering fallback for error', error); + return ( +
sorry, something went wrong trying to show this notification
+ +