wallet flow; new faucet; placing chart orders works!

src/components/NeedsSigner.vue

@@ -1,29 +1,32 @@
 <template>
-  <NeedsProvider>
-    <slot v-if="ok"/>
-    <phone-card v-if="!ok">
-      <v-card-title><v-icon icon="mdi-reload-alert" color="warning"/> Connect Wallet</v-card-title>
-      <v-card-text>
-        Please select an account to use from your wallet.
-      </v-card-text>
-      <v-card-actions>
-        <btn icon="mdi-wallet-outline" color="warning" @click="connectWallet">Connect Wallet</btn>
-      </v-card-actions>
-    </phone-card>
-  </NeedsProvider>
+  <needs-provider>
+    <slot v-if="ok" v-bind="$props"/>
+    <div v-if="!ok">
+      <btn icon="mdi-wallet-outline" color="warning" variant="outlined" @click="connect" :disabled="disabled" text="Connect Wallet"/>
+    </div>
+  </needs-provider>
 </template>
 
 <script setup>
 import {useStore} from "@/store/store";
 import NeedsProvider from "@/components/NeedsProvider.vue";
-import {computed} from "vue";
-import PhoneCard from "@/components/PhoneCard.vue";
+import {computed, ref} from "vue";
 import {connectWallet} from "@/blockchain/wallet.js";
 import Btn from "@/components/Btn.vue";
 
 const s = useStore()
-
 const ok = computed(()=>s.account!==null)
+const disabled = ref(false)
+
+async function connect() {
+  disabled.value = true
+  try {
+    await connectWallet(s.chainId)
+  }
+  finally {
+    disabled.value = false
+  }
+}
 
 </script>