From 92b43c3b4bf469bacd879deb5d525d9471852413 Mon Sep 17 00:00:00 2001 From: Michael Gartner Date: Sat, 1 Mar 2025 20:24:12 -0600 Subject: [PATCH 1/2] create sendErrorEmail component, don't send if encrypted/offline --- src/components/Export.tsx | 51 ++++++++------------------- src/components/tldraw/Tldraw.tsx | 30 ++++++---------- src/utils/calcCanvasNodeSizeAndImg.ts | 28 +++++---------- src/utils/sendErrorEmail.ts | 35 ++++++++++++++++++ 4 files changed, 67 insertions(+), 77 deletions(-) create mode 100644 src/utils/sendErrorEmail.ts diff --git a/src/components/Export.tsx b/src/components/Export.tsx index babaf008..810c2959 100644 --- a/src/components/Export.tsx +++ b/src/components/Export.tsx @@ -50,6 +50,7 @@ import localStorageSet from "roamjs-components/util/localStorageSet"; import isLiveBlock from "roamjs-components/queries/isLiveBlock"; import createPage from "roamjs-components/writes/createPage"; import { createInitialTldrawProps } from "../utils/createInitialTldrawProps"; +import sendErrorEmail from "../utils/sendErrorEmail"; const ExportProgress = ({ id }: { id: string }) => { const [progress, setProgress] = useState(0); @@ -447,26 +448,14 @@ const ExportDialog: ExportDialogComponent = ({ } catch (e) { const error = e as Error; renderToast({ - content: "Looks like there was an error. The team has been notified.", + content: "Looks like there was an error.", intent: "danger", id: "query-builder-error", }); - apiPost({ - domain: "https://api.samepage.network", - path: "errors", - data: { - method: "extension-error", - type: "Query Builder Export Dialog Failed", - message: error.message, - stack: error.stack, - version: process.env.VERSION, - notebookUuid: JSON.stringify({ - owner: "RoamJS", - app: "query-builder", - workspace: window.roamAlphaAPI.graph.name, - }), - }, - }).catch(() => {}); + sendErrorEmail({ + error, + type: "Query Builder Export Dialog Failed", + }); } finally { setLoading(false); onClose(); @@ -719,28 +708,16 @@ const ExportDialog: ExportDialogComponent = ({ } } catch (e) { const error = e as Error; - apiPost({ - domain: "https://api.samepage.network", - path: "errors", + sendErrorEmail({ + type: "Query Builder Export Dialog Failed", + error, data: { - method: "extension-error", - type: "Query Builder Export Dialog Failed", - data: { - activeExportType, - filename, - results: - typeof results === "function" ? "dynamic" : results, - }, - message: error.message, - stack: error.stack, - version: process.env.VERSION, - notebookUuid: JSON.stringify({ - owner: "RoamJS", - app: "query-builder", - workspace: window.roamAlphaAPI.graph.name, - }), + activeExportType, + filename, + results: + typeof results === "function" ? "dynamic" : results, }, - }).catch(() => {}); + }); setDialogOpen(true); setError((e as Error).message); } finally { diff --git a/src/components/tldraw/Tldraw.tsx b/src/components/tldraw/Tldraw.tsx index 11e9e519..b824ae2e 100644 --- a/src/components/tldraw/Tldraw.tsx +++ b/src/components/tldraw/Tldraw.tsx @@ -60,7 +60,7 @@ import { DiscourseRelationUtil, } from "./DiscourseRelationsUtil"; import { isPageUid } from "../../utils/isPageUid"; -import apiPost from "roamjs-components/util/apiPost"; +import sendErrorEmail from "../../utils/sendErrorEmail"; declare global { interface Window { @@ -794,27 +794,17 @@ const TldrawCanvas = ({ title }: Props) => { const handleTldrawError = ( e: CustomEvent<{ message: string; stack: string | null }> ) => { - apiPost({ - domain: "https://api.samepage.network", - path: "errors", - data: { - method: "extension-error", - type: "Tldraw Error", + sendErrorEmail({ + type: "Tldraw Error", + error: { + name: "Tldraw Error", message: e.detail.message, - stack: e.detail.stack, - version: process.env.VERSION, - notebookUuid: JSON.stringify({ - owner: "RoamJS", - app: "query-builder", - workspace: window.roamAlphaAPI.graph.name, - }), - data: { - title, - }, + stack: e.detail.stack || undefined, }, - }).catch(() => {}); - - console.error("Tldraw Error:", e.detail); + data: { + title, + }, + }); }; document.addEventListener( diff --git a/src/utils/calcCanvasNodeSizeAndImg.ts b/src/utils/calcCanvasNodeSizeAndImg.ts index 27f62264..c3c0190c 100644 --- a/src/utils/calcCanvasNodeSizeAndImg.ts +++ b/src/utils/calcCanvasNodeSizeAndImg.ts @@ -8,7 +8,7 @@ import getDiscourseNodes from "./getDiscourseNodes"; import resolveRefs from "roamjs-components/dom/resolveRefs"; import { render as renderToast } from "roamjs-components/components/Toast"; import { loadImage } from "./loadImage"; -import apiPost from "roamjs-components/util/apiPost"; +import sendErrorEmail from "./sendErrorEmail"; const extractFirstImageUrl = (text: string): string | null => { const regex = /!\[.*?\]\((https:\/\/[^)]+)\)/; @@ -99,27 +99,15 @@ const calcCanvasNodeSizeAndImg = async ({ }; } catch (e) { const error = e as Error; - apiPost({ - domain: "https://api.samepage.network", - path: "errors", + sendErrorEmail({ + type: "Canvas Image Load Failed", + error, data: { - method: "extension-error", - type: "Canvas Image Load Failed", - message: error.message, - stack: error.stack, - version: process.env.VERSION, - notebookUuid: JSON.stringify({ - owner: "RoamJS", - app: "query-builder", - workspace: window.roamAlphaAPI.graph.name, - }), - data: { - uid, - nodeText, - imageUrl, - }, + uid, + nodeText, + imageUrl, }, - }).catch(() => {}); + }); renderToast({ id: "tldraw-image-load-fail", content: error.message, diff --git a/src/utils/sendErrorEmail.ts b/src/utils/sendErrorEmail.ts new file mode 100644 index 00000000..0820d4a6 --- /dev/null +++ b/src/utils/sendErrorEmail.ts @@ -0,0 +1,35 @@ +import apiPost from "roamjs-components/util/apiPost"; + +const sendErrorEmail = ({ + error, + data, + type, +}: { + error: Error; + data?: Record; + type: string; +}) => { + const isEncrypted = window.roamAlphaAPI.graph.isEncrypted; + const isOffline = window.roamAlphaAPI.graph.type === "offline"; + if (isEncrypted || isOffline) return; + + apiPost({ + domain: "https://api.samepage.network", + path: "errors", + data: { + method: "extension-error", + type, + message: error.message, + stack: error.stack, + version: process.env.VERSION, + notebookUuid: JSON.stringify({ + owner: "RoamJS", + app: "query-builder", + workspace: window.roamAlphaAPI.graph.name, + }), + data, + }, + }).catch(() => {}); +}; + +export default sendErrorEmail; From 634a59747da04d795a204c5aaf8a1ce79188d62a Mon Sep 17 00:00:00 2001 From: Michael Gartner Date: Sat, 1 Mar 2025 20:41:51 -0600 Subject: [PATCH 2/2] type safe error --- src/components/tldraw/Tldraw.tsx | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/src/components/tldraw/Tldraw.tsx b/src/components/tldraw/Tldraw.tsx index b824ae2e..d925ae0d 100644 --- a/src/components/tldraw/Tldraw.tsx +++ b/src/components/tldraw/Tldraw.tsx @@ -796,11 +796,7 @@ const TldrawCanvas = ({ title }: Props) => { ) => { sendErrorEmail({ type: "Tldraw Error", - error: { - name: "Tldraw Error", - message: e.detail.message, - stack: e.detail.stack || undefined, - }, + error: new Error(e.detail.message, { cause: e.detail.stack }), data: { title, },