From 8c0789223f7a52635ecf4bbb3509ead23c459984 Mon Sep 17 00:00:00 2001
From: JunichiSugiura <jun.sugiura.jp@gmail.com>
Date: Thu, 30 May 2024 18:59:35 +0200
Subject: [PATCH] Show username and address after connect in example

---
 .../src/components/ConnectWallet.tsx                   | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/examples/starknet-react-next/src/components/ConnectWallet.tsx b/examples/starknet-react-next/src/components/ConnectWallet.tsx
index 08a18608e..1362d032c 100644
--- a/examples/starknet-react-next/src/components/ConnectWallet.tsx
+++ b/examples/starknet-react-next/src/components/ConnectWallet.tsx
@@ -1,11 +1,12 @@
 import { useAccount, useConnect, useDisconnect } from "@starknet-react/core";
+import CartridgeConnector from "@cartridge/connector"
 
 export function ConnectWallet() {
   const { connect, connectors } = useConnect();
   const { disconnect } = useDisconnect();
   const { address } = useAccount();
 
-  const connector = connectors[0];
+  const connector = connectors[0] as unknown as CartridgeConnector;
 
   return (
     <>
@@ -18,6 +19,13 @@ export function ConnectWallet() {
         >
           {address ? "Disconnect" : "Connect"}
         </button>
+
+        {address && (
+          <div>
+            <div>username: {connector.username()}</div>
+            <div>address: {address}</div>
+          </div>
+        )}
       </div>
     </>
   );