From c32448689a5dd86d21264002d4deef482e5f0d01 Mon Sep 17 00:00:00 2001
From: Matthew Diamant <mdiamant@squareup.com>
Date: Thu, 13 Mar 2025 12:43:08 -0700
Subject: [PATCH] feat: Copy error message button in toast (#1658)

---
 .../src/{extensions.ts => extensions.tsx}     | 20 ++++++++++++++++++-
 1 file changed, 19 insertions(+), 1 deletion(-)
 rename ui/desktop/src/{extensions.ts => extensions.tsx} (94%)

diff --git a/ui/desktop/src/extensions.ts b/ui/desktop/src/extensions.tsx
similarity index 94%
rename from ui/desktop/src/extensions.ts
rename to ui/desktop/src/extensions.tsx
index cf06fb59..6df915e1 100644
--- a/ui/desktop/src/extensions.ts
+++ b/ui/desktop/src/extensions.tsx
@@ -1,3 +1,4 @@
+import React from 'react';
 import { getApiUrl, getSecretKey } from './config';
 import { type View } from './App';
 import { type SettingsViewOptions } from './components/settings/SettingsView';
@@ -103,9 +104,26 @@ export async function addExtension(
     }
 
     const errorMessage = `Error adding ${extension.name} extension ${data.message ? `. ${data.message}` : ''}`;
+    const ErrorMsg = ({ closeToast }: { closeToast?: () => void }) => (
+      <div className="flex flex-col gap-1">
+        <div>Error adding {extension.name} extension</div>
+        <div>
+          <button
+            className="text-sm rounded px-2 py-1 bg-gray-400 hover:bg-gray-300 text-white cursor-pointer"
+            onClick={() => {
+              navigator.clipboard.writeText(data.message);
+              closeToast();
+            }}
+          >
+            Copy error message
+          </button>
+        </div>
+      </div>
+    );
+
     console.error(errorMessage);
     if (toastId) toast.dismiss(toastId);
-    toast.error(errorMessage);
+    toast(ErrorMsg, { type: 'error', autoClose: false });
 
     return response;
   } catch (error) {