From 92d67413773b91f4088b3ac7d3c236d859de976b Mon Sep 17 00:00:00 2001
From: taitsengstock <taitsengstock@gmail.com>
Date: Fri, 19 Dec 2025 16:44:55 +1100
Subject: [PATCH] Improved UX for wallet integration

---
 .../overlays/add-connection-overlay.tsx       | 15 +++++++++++
 .../overlays/edit-connection-overlay.tsx      | 15 +++++++++++
 components/workflow/config/action-config.tsx  | 27 ++++++++++---------
 keeperhub/plugins/web3/index.ts               | 18 ++++---------
 plugins/registry.ts                           |  5 ++++
 5 files changed, 55 insertions(+), 25 deletions(-)

diff --git a/components/overlays/add-connection-overlay.tsx b/components/overlays/add-connection-overlay.tsx
index 999cc2db0..2449d7f55 100644
--- a/components/overlays/add-connection-overlay.tsx
+++ b/components/overlays/add-connection-overlay.tsx
@@ -14,6 +14,9 @@ import {
   aiGatewayTeamsLoadingAtom,
 } from "@/lib/ai-gateway/state";
 import { api } from "@/lib/api-client";
+// start keeperhub
+import { getCustomIntegrationFormHandler } from "@/lib/extension-registry";
+// end keeperhub
 import type { IntegrationType } from "@/lib/types/integration";
 import {
   getIntegration,
@@ -361,6 +364,18 @@ export function ConfigureConnectionOverlay({
 
   // Render config fields
   const renderConfigFields = () => {
+    // start keeperhub - check for custom form handlers (e.g., web3 wallet)
+    const customHandler = getCustomIntegrationFormHandler(type);
+    if (customHandler) {
+      return customHandler({
+        integrationType: type,
+        isEditMode: false,
+        config,
+        updateConfig,
+      });
+    }
+    // end keeperhub
+
     if (type === "database") {
       return (
         <SecretField
diff --git a/components/overlays/edit-connection-overlay.tsx b/components/overlays/edit-connection-overlay.tsx
index 10e7b7f6f..3d43c4b72 100644
--- a/components/overlays/edit-connection-overlay.tsx
+++ b/components/overlays/edit-connection-overlay.tsx
@@ -9,7 +9,10 @@ import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { useIsMobile } from "@/hooks/use-mobile";
 import { api, type Integration } from "@/lib/api-client";
+// start keeperhub
+import { getCustomIntegrationFormHandler } from "@/lib/extension-registry";
 import { getIntegration, getIntegrationLabels } from "@/plugins";
+// end keeperhub
 import { ConfirmOverlay } from "./confirm-overlay";
 import { Overlay } from "./overlay";
 import { useOverlay } from "./overlay-provider";
@@ -267,6 +270,18 @@ export function EditConnectionOverlay({
 
   // Render config fields
   const renderConfigFields = () => {
+    // start keeperhub - check for custom form handlers (e.g., web3 wallet display)
+    const customHandler = getCustomIntegrationFormHandler(integration.type);
+    if (customHandler) {
+      return customHandler({
+        integrationType: integration.type,
+        isEditMode: true,
+        config,
+        updateConfig,
+      });
+    }
+    // end keeperhub
+
     if (integration.type === "database") {
       return (
         <SecretField
diff --git a/components/workflow/config/action-config.tsx b/components/workflow/config/action-config.tsx
index 8a1d7f6dc..b85ec4148 100644
--- a/components/workflow/config/action-config.tsx
+++ b/components/workflow/config/action-config.tsx
@@ -26,7 +26,6 @@ import {
   TooltipProvider,
   TooltipTrigger,
 } from "@/components/ui/tooltip";
-// start keeperhub
 import { integrationRequiresCredentials } from "@/keeperhub/lib/integration-helpers";
 // end keeperhub
 import { aiGatewayStatusAtom } from "@/lib/ai-gateway/state";
@@ -39,6 +38,7 @@ import {
   findActionById,
   getActionsByCategory,
   getAllIntegrations,
+  getIntegration,
 } from "@/plugins";
 import { ActionConfigRenderer } from "./action-config-renderer";
 import { SchemaBuilder, type SchemaField } from "./schema-builder";
@@ -524,17 +524,20 @@ export function ActionConfig({
                 </Tooltip>
               </TooltipProvider>
             </div>
-            {hasExistingConnections && (
-              <Button
-                className="size-6"
-                disabled={disabled}
-                onClick={handleAddSecondaryConnection}
-                size="icon"
-                variant="ghost"
-              >
-                <Plus className="size-4" />
-              </Button>
-            )}
+            {/* start keeperhub - hide + button for singleConnection integrations */}
+            {hasExistingConnections &&
+              !getIntegration(integrationType)?.singleConnection && (
+                <Button
+                  className="size-6"
+                  disabled={disabled}
+                  onClick={handleAddSecondaryConnection}
+                  size="icon"
+                  variant="ghost"
+                >
+                  <Plus className="size-4" />
+                </Button>
+              )}
+            {/* end keeperhub */}
           </div>
           <IntegrationSelector
             disabled={disabled}
diff --git a/keeperhub/plugins/web3/index.ts b/keeperhub/plugins/web3/index.ts
index 9115e57a0..17b8b43aa 100644
--- a/keeperhub/plugins/web3/index.ts
+++ b/keeperhub/plugins/web3/index.ts
@@ -9,19 +9,11 @@ const web3Plugin: IntegrationPlugin = {
 
   icon: Web3Icon,
 
-  // Minimal form field - Web3 uses PARA wallet (user must create manually)
-  // This field is informational only and not used
-  formFields: [
-    {
-      id: "info",
-      label: "Para Wallet",
-      type: "text",
-      placeholder: "Create a wallet to use Web3 actions",
-      configKey: "info",
-      helpText:
-        "You'll need to create a Para wallet to use Web3 actions in your workflows.",
-    },
-  ],
+  // Web3 uses Para wallet - one wallet per user
+  singleConnection: true,
+
+  // No form fields - wallet creation is handled by the custom form handler
+  formFields: [],
 
   // No test function needed - no credentials to test
   // testConfig is optional, so we omit it
diff --git a/plugins/registry.ts b/plugins/registry.ts
index defe6738c..2766dc480 100644
--- a/plugins/registry.ts
+++ b/plugins/registry.ts
@@ -175,6 +175,11 @@ export type IntegrationPlugin = {
   // Defaults to true for backward compatibility
   requiresCredentials?: boolean;
 
+  // Whether only one connection is allowed per user
+  // Set to true for integrations with unique constraints (e.g., web3 wallet)
+  // When true, the "+" button to add more connections will be hidden
+  singleConnection?: boolean;
+
   // Form fields for the integration dialog
   formFields: Array<{
     id: string;