From c128a6d35a2558854498ff0918efded3df0baedd Mon Sep 17 00:00:00 2001
From: Max Novich <maksymstepanenko1990@gmail.com>
Date: Thu, 23 Jan 2025 09:56:06 -0800
Subject: [PATCH] add extension removal capability (#702)

---
 .../src/components/settings/Settings.tsx      | 36 +++++++++++++++++++
 .../extensions/ConfigureExtensionModal.tsx    | 11 ++++++
 2 files changed, 47 insertions(+)

diff --git a/ui/desktop/src/components/settings/Settings.tsx b/ui/desktop/src/components/settings/Settings.tsx
index 8b1f9f1c1d..cef572b5c0 100644
--- a/ui/desktop/src/components/settings/Settings.tsx
+++ b/ui/desktop/src/components/settings/Settings.tsx
@@ -184,6 +184,41 @@ export default function Settings() {
     }
   };
 
+  const handleExtensionRemove = async () => {
+    if (!extensionBeingConfigured) return;
+
+    try {
+      // First disable the extension if it's enabled
+      if (extensionBeingConfigured.enabled) {
+        const response = await fetch(getApiUrl('/extensions/remove'), {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+            'X-Secret-Key': getSecretKey(),
+          },
+          body: JSON.stringify(extensionBeingConfigured.name),
+        });
+
+        if (!response.ok) {
+          throw new Error('Failed to remove extension from backend');
+        }
+      }
+
+      // Then remove it from the local settings
+      setSettings((prev) => ({
+        ...prev,
+        extensions: prev.extensions.filter((ext) => ext.id !== extensionBeingConfigured.id),
+      }));
+
+      showToast(`Successfully removed ${extensionBeingConfigured.name} extension`, 'success');
+      setExtensionBeingConfigured(null);
+      navigate('/settings', { replace: true });
+    } catch (error) {
+      console.error('Error removing extension:', error);
+      showToast('Failed to remove extension', 'error');
+    }
+  };
+
   const handleNavClick = (section: string, e: React.MouseEvent) => {
     e.preventDefault();
     const scrollArea = document.querySelector('[data-radix-scroll-area-viewport]');
@@ -304,6 +339,7 @@ export default function Settings() {
         }}
         extension={extensionBeingConfigured}
         onSubmit={handleExtensionConfigSubmit}
+        onRemove={handleExtensionRemove}
       />
 
       <ManualExtensionModal
diff --git a/ui/desktop/src/components/settings/extensions/ConfigureExtensionModal.tsx b/ui/desktop/src/components/settings/extensions/ConfigureExtensionModal.tsx
index 5f186bd098..f1201f536c 100644
--- a/ui/desktop/src/components/settings/extensions/ConfigureExtensionModal.tsx
+++ b/ui/desktop/src/components/settings/extensions/ConfigureExtensionModal.tsx
@@ -10,6 +10,7 @@ interface ConfigureExtensionModalProps {
   isOpen: boolean;
   onClose: () => void;
   onSubmit: () => void;
+  onRemove: () => void;
   extension: FullExtensionConfig | null;
 }
 
@@ -17,6 +18,7 @@ export function ConfigureExtensionModal({
   isOpen,
   onClose,
   onSubmit,
+  onRemove,
   extension,
 }: ConfigureExtensionModalProps) {
   const [envValues, setEnvValues] = React.useState<Record<string, string>>({});
@@ -166,6 +168,15 @@ export function ConfigureExtensionModal({
               >
                 {isSubmitting ? 'Saving...' : 'Save Configuration'}
               </Button>
+              <Button
+                type="button"
+                variant="ghost"
+                onClick={onRemove}
+                disabled={isSubmitting}
+                className="w-full h-[60px] rounded-none border-t dark:border-gray-600 text-red-600 hover:bg-red-50 dark:hover:bg-red-900/20 dark:border-gray-600 text-lg font-regular"
+              >
+                Remove Extension
+              </Button>
               <Button
                 type="button"
                 variant="ghost"