Allow user access to Sentry Event IDs or Aggregate ID

Author: samholmes

src/components/cards/ErrorCard.tsx

@@ -1,3 +1,4 @@
+import Clipboard from '@react-native-clipboard/clipboard'
 import * as React from 'react'
 
 import { useHandler } from '../../hooks/useHandler'
@@ -6,7 +7,7 @@ import { useSelector } from '../../types/reactRedux'
 import { normalizeError } from '../../util/normalizeError'
 import { trackError } from '../../util/tracking'
 import { RawTextModal } from '../modals/RawTextModal'
-import { Airship } from '../services/AirshipInstance'
+import { Airship, showToast } from '../services/AirshipInstance'
 import { AlertCardUi4 } from './AlertCard'
 
 /**
@@ -36,51 +37,92 @@ export const ErrorCard: React.FC<Props> = props => {
   const { error } = props
 
   const isDevMode = useSelector(state => state.ui.settings.developerModeOn)
-  const [reportSent, setReportSent] = React.useState(false)
+  const [errorIdentifier, setErrorIdentifier] = React.useState<
+    { eventId: string } | { aggregateId: string }
+  >()
+
+  // Reset error identifier when error changes
+  React.useEffect(() => {
+    setErrorIdentifier(undefined)
+  }, [error])
 
   const handleReportError = useHandler((): void => {
     if (error != null) {
-      trackError(error, 'AlertDropdown_Report', {
+      const errorIdentifier = trackError(error, 'AlertDropdown_Report', {
         userReportedError: true
       })
-      setReportSent(true)
+      setErrorIdentifier(errorIdentifier)
+    }
+  })
+
+  const handleCopyEventId = useHandler((): void => {
+    if (errorIdentifier != null) {
+      const id =
+        'eventId' in errorIdentifier
+          ? errorIdentifier.eventId
+          : errorIdentifier.aggregateId
+      Clipboard.setString(id)
+      showToast(lstrings.fragment_error_report_id_copied)
     }
   })
 
+  const handleShowError = useHandler(async (): Promise<void> => {
+    await Airship.show(bridge => (
+      <RawTextModal bridge={bridge} body={normalizeError(error).toString()} />
+    ))
+  })
+
   // Happy path
   if (error instanceof I18nError) {
     return (
       <AlertCardUi4 type="error" title={error.title} body={error.message} />
     )
   }
 
+  const reportSent = errorIdentifier != null
+
+  const isAggregateError =
+    errorIdentifier != null && 'aggregateId' in errorIdentifier
+  const copyLabel = isAggregateError
+    ? lstrings.fragment_copy_aggregate_id
+    : lstrings.fragment_copy_event_id
+
   const buttonProps =
     isDevMode || __DEV__
       ? {
-          label: 'Show Error',
-          onPress: async () => {
-            await Airship.show(bridge => (
-              <RawTextModal
-                bridge={bridge}
-                body={normalizeError(error).toString()}
-              />
-            ))
-          }
+          label: lstrings.string_show_error,
+          onPress: handleShowError
+        }
+      : reportSent
+      ? {
+          label: copyLabel,
+          onPress: handleCopyEventId
         }
       : {
-          label: reportSent
-            ? lstrings.string_report_sent
-            : lstrings.string_report_error,
-          disabled: reportSent,
+          label: lstrings.string_report_error,
           onPress: handleReportError
         }
 
+  const idLabel =
+    errorIdentifier != null && 'eventId' in errorIdentifier
+      ? lstrings.fragment_event_id
+      : lstrings.fragment_aggregate_id
+  const idValue =
+    errorIdentifier != null
+      ? 'eventId' in errorIdentifier
+        ? errorIdentifier.eventId
+        : errorIdentifier.aggregateId
+      : ''
+  const bodyText = reportSent
+    ? `${lstrings.string_report_sent}\n\n${idLabel}: ${idValue}`
+    : lstrings.error_generic_message
+
   // Unhappy path
   return (
     <AlertCardUi4
       type="error"
       title={lstrings.error_unexpected_title}
-      body={lstrings.error_generic_message}
+      body={bodyText}
       button={buttonProps}
     />
   )

src/locales/en_US.ts

@@ -220,6 +220,11 @@ const strings = {
   fragment_request_address_uri_copied:
     'Request address URI copied to clipboard',
   fragment_copied: 'Successfully copied to clipboard',
+  fragment_aggregate_id: 'Aggregate ID',
+  fragment_copy_aggregate_id: 'Copy Aggregate ID',
+  fragment_copy_event_id: 'Copy Event ID',
+  fragment_event_id: 'Event ID',
+  fragment_error_report_id_copied: 'Error report ID copied',
   request_minimum_notification_title: 'Minimum Balance Required',
   request_xrp_minimum_notification_body_1xrp:
     'Ripple (XRP) wallets require a 1 XRP minimum balance. You must deposit at least 1 XRP to this address before this wallet will show a balance or transactions. 1 XRP will be unspendable for the lifetime of this wallet address.',
@@ -1407,7 +1412,8 @@ const strings = {
   string_max_cap: 'MAX',
   string_warning: 'Warning', // Generic string. Same with wc_smartcontract_warning_title
   string_report_error: 'Report Error',
-  string_report_sent: 'Report sent.',
+  string_report_sent: 'The report has been sent successfully.',
+  string_show_error: 'Show Error',
   string_best_rate_badge_text: 'Best\nRate',
 
   step_prefix_s: 'Step %s:',

src/locales/strings/enUS.json

@@ -134,6 +134,11 @@
   "fragment_request_subtitle": "Receive",
   "fragment_request_address_uri_copied": "Request address URI copied to clipboard",
   "fragment_copied": "Successfully copied to clipboard",
+  "fragment_aggregate_id": "Aggregate ID",
+  "fragment_copy_aggregate_id": "Copy Aggregate ID",
+  "fragment_copy_event_id": "Copy Event ID",
+  "fragment_event_id": "Event ID",
+  "fragment_error_report_id_copied": "Error report ID copied",
   "request_minimum_notification_title": "Minimum Balance Required",
   "request_xrp_minimum_notification_body_1xrp": "Ripple (XRP) wallets require a 1 XRP minimum balance. You must deposit at least 1 XRP to this address before this wallet will show a balance or transactions. 1 XRP will be unspendable for the lifetime of this wallet address.",
   "request_xrp_minimum_notification_alert_body_1xrp": "This wallet will always require a 1 XRP minimum",
@@ -1111,7 +1116,8 @@
   "string_max_cap": "MAX",
   "string_warning": "Warning",
   "string_report_error": "Report Error",
-  "string_report_sent": "Report sent.",
+  "string_report_sent": "The report has been sent successfully.",
+  "string_show_error": "Show Error",
   "string_best_rate_badge_text": "Best\nRate",
   "step_prefix_s": "Step %s:",
   "scan_as_in_scan_barcode": "Scan",

src/util/tracking.ts

@@ -190,7 +190,7 @@ export function trackError(
   error: unknown,
   nameTag?: string,
   metadata?: Record<string, any>
-): void {
+): { eventId: string } | { aggregateId: string } {
   const err = normalizeError(error)
 
   if (err instanceof AggregateErrorFix) {
@@ -202,10 +202,10 @@ export function trackError(
         trackError(e, nameTag, metadata)
       })
     })
-    return
+    return { aggregateId }
   }
 
-  captureException(err, scope => {
+  const eventId = captureException(err, scope => {
     scope.setTag('event.name', nameTag)
     if (metadata != null) {
       const context: Record<string, unknown> = {}
@@ -214,6 +214,7 @@ export function trackError(
     }
     return scope
   })
+  return { eventId }
 }
 
 /**