Enhance error reporting by adding version and build date to error emails. Update EmailTemplate to display version and build date if available. Modify ErrorEmailProps type to include optional version and buildDate fields. (#575)

Author: mdroidian

apps/roam/src/utils/sendErrorEmail.ts

@@ -1,5 +1,6 @@
 import { getNodeEnv } from "roamjs-components/util/env";
 import { ErrorEmailProps } from "@repo/types";
+import { getVersionWithDate } from "~/utils/getVersion";
 
 const sendErrorEmail = async ({
   error,
@@ -14,12 +15,15 @@ const sendErrorEmail = async ({
     getNodeEnv() === "development"
       ? "http://localhost:3000/api/errors"
       : "https://discoursegraphs.com/api/errors";
+  const { version, buildDate } = getVersionWithDate();
   const payload: ErrorEmailProps = {
     errorMessage: error.message,
     errorStack: error.stack || "",
     type,
     app: "Roam",
     graphName: window.roamAlphaAPI?.graph?.name || "unknown",
+    version,
+    buildDate,
     context,
   };
 

apps/website/app/api/errors/EmailTemplate.tsx

@@ -8,15 +8,19 @@ export const EmailTemplate = ({
   type,
   app,
   graphName,
+  version,
+  buildDate,
   context,
 }: ErrorEmailProps) => {
   return (
     <div>
       <h1>Error Report</h1>
 
-      <h2>Type: {type}</h2>
-      <h2>App: {app}</h2>
-      <h2>Graph Name: {graphName}</h2>
+      <span>Type: {type}</span>
+      <span>App: {app}</span>
+      <span>Graph Name: {graphName}</span>
+      {version && <span>Version: {version}</span>}
+      {buildDate && <span>Build Date: {buildDate}</span>}
 
       <div>
         <h2>Error Details</h2>

packages/types/index.ts

@@ -4,5 +4,7 @@ export type ErrorEmailProps = {
   type: string; // To identify the type of error, eg "Export Dialog Failed"
   app: "Roam" | "Obsidian";
   graphName: string;
+  version?: string;
+  buildDate?: string;
   context?: Record<string, unknown>;
 };