Merge pull request #520 from rainlanguage/2024-04-02-debug-walletconnect

debug walletconnect
rainlanguage · Apr 4, 2024 · 5c48eff · 5c48eff
2 parents 42f7eef + 8d173d9
commit 5c48eff
Show file tree

Hide file tree

Showing 7 changed files with 268 additions and 161 deletions.
diff --git a/tauri-app/package-lock.json b/tauri-app/package-lock.json
diff --git a/tauri-app/package.json b/tauri-app/package.json
@@ -52,8 +52,10 @@
     "@sentry/sveltekit": "^7.107.0",
     "@square/svelte-store": "^1.0.18",
     "@tauri-apps/api": "^1.5.3",
-    "camelcase-keys": "^9.1.3",
+    "@walletconnect/ethereum-provider": "^2.11.3",
+    "@walletconnect/modal": "^2.6.2",
     "@web3modal/ethers5": "^4.1.1",
+    "camelcase-keys": "^9.1.3",
     "codemirror-rainlang": "^3.0.7",
     "dayjs": "^1.11.10",
     "ethers": "^5.7.2",
@@ -64,4 +66,4 @@
     "uuid": "^9.0.1",
     "viem": "^2.4.0"
   }
-}
+}
diff --git a/tauri-app/src/lib/components/InputWalletConnect.svelte b/tauri-app/src/lib/components/InputWalletConnect.svelte
@@ -1,10 +1,11 @@
 <script lang="ts">
   import IconWarning from "$lib/components/IconWarning.svelte";
-  import { walletconnectModal, walletconnectAccount } from '$lib/stores/walletconnect';
-  import { Alert, Button } from "flowbite-svelte";
+  import { Alert } from "flowbite-svelte";
+  import ButtonLoading from "./ButtonLoading.svelte";
+  import { walletconnectConnect, walletconnectIsDisconnecting, walletconnectAccount, walletconnectIsConnecting } from '$lib/stores/walletconnect';
 
   $: walletconnectLabel = $walletconnectAccount
-    ? `${$walletconnectAccount.slice(0, 5)}...${$walletconnectAccount.slice(-5)}`
+    ? `${$walletconnectAccount.slice(0, 5)}...${$walletconnectAccount.slice(-5)}  (click to disconnect)`
     : "CONNECT"
 </script>
 
@@ -15,14 +16,15 @@
   </Alert>
 
   <div class="flex flex-col w-full justify-between space-y-2">
-    <Button
+    <ButtonLoading
       color="blue"
       class="px-2 py-1"
       size="lg"
       pill
-      on:click={() => $walletconnectModal?.open()}
+      loading={$walletconnectIsDisconnecting || $walletconnectIsConnecting}
+      on:click={walletconnectConnect}
     >
     {walletconnectLabel}
-    </Button>
+    </ButtonLoading>
   </div>
 </div>