wallet flow; new faucet; placing chart orders works!

src/components/chart/ChartOrders.vue

@@ -0,0 +1,17 @@
+<template>
+  <div class="d-flex flex-column h-100">
+    <toolbar title="Orders" icon="mdi-format-list-bulleted-square">
+    </toolbar>
+    <orders-view/>
+  </div>
+</template>
+
+<script setup>
+
+import Toolbar from "@/components/chart/Toolbar.vue";
+import OrdersView from "@/views/OrdersView.vue";
+</script>
+
+<style scoped lang="scss">
+
+</style>

src/components/chart/ChartVault.vue

@@ -0,0 +1,25 @@
+<template>
+  <div class="d-flex flex-column h-100">
+    <toolbar title="Assets" icon="mdi-currency-btc"></toolbar>
+    <needs-signer>
+      <vault :owner="s.account" :num="0"/>
+      <faucet variant="outlined" text="Get Free Testnet Coins!" style="width: 15em"/>
+    </needs-signer>
+  </div>
+</template>
+
+<script setup>
+
+import Toolbar from "@/components/chart/Toolbar.vue";
+import Vault from "@/components/Vault.vue";
+import NeedsSigner from "@/components/NeedsSigner.vue";
+import Faucet from "@/components/Faucet.vue";
+import {useStore} from "@/store/store.js";
+
+const s = useStore()
+
+</script>
+
+<style scoped lang="scss">
+
+</style>

src/components/chart/Toolbar.vue

@@ -1,12 +1,21 @@
 <template>
-  <div class="d-flex mb-1">
-    <span class="arrow align-self-start"><v-icon icon="mdi-arrow-up-bold" :color="theme.colors.success"/></span>
-    <span class="logo">dexorder</span>
-    <v-chip text="ALPHA" size='x-small' color="red" class="align-self-start pr-6" variant="text"/>
+  <div class="d-flex mb-1 align-center w-100">
+    <div class="d-flex align-end clickable" @click="$router.push('/place')">
+      <span class="arrow align-self-start"><v-icon icon="mdi-arrow-up-bold" :color="theme.colors.success"/></span>
+      <span class="logo">dexorder</span>
+      <v-chip text="ALPHA" size='x-small' color="red" class="align-self-start pr-6" variant="text"/>
+    </div>
+<!--
+    <div class="d-flex align-center">
+    </div>
+-->
     <slot/>
-    <div class="w-100 d-flex justify-end">
-      <v-btn variant="text" icon="mdi-safe-square" color="grey-darken-2" text="Vault" @click="$router.push('/vault')"></v-btn>
-      <v-btn variant="text" icon="mdi-information-outline" text="Order Status" @click="$router.push('/orders')"></v-btn>
+    <div class="ml-auto d-flex align-center">
+<!--      <v-icon :icon="icon" size="small"/>&nbsp;-->
+      <span class="title">{{title}}</span>
+      <toolbar-button icon="mdi-currency-btc" path="/vault"/>
+      <toolbar-button icon="mdi-format-list-bulleted-square" path="/orders"/>
+      <v-btn variant="text" icon="mdi-help-circle-outline" text="Info" @click="showCorp" disabled></v-btn>
     </div>
   </div>
 </template>
@@ -19,21 +28,17 @@ import {timestamp} from "@/misc.js";
 import {ShapeType} from "@/charts/shape.js";
 import {computed, ref} from "vue";
 import {useTheme} from "vuetify";
+import ToolbarButton from "@/components/chart/ToolbarButton.vue";
+
+const props = defineProps(['title', 'icon'])
 
 const s = useStore()
 const co = useChartOrderStore()
 
-const showCancel = ref(false)
-
 const theme = useTheme().current
 
-function cancelOrder() {
-  showCancel.value = true
-}
-
-
-function placeOrder() {
-
+function showCorp() {
+  window.open('https://dexorder.trade', 'dexorder')
 }
 
 </script>

src/components/chart/ToolbarButton.vue

@@ -0,0 +1,15 @@
+<template>
+  <v-btn :color="isCurrent?'primary':undefined" variant="text" :icon="icon" @click="$router.push(path)"/>
+</template>
+
+<script setup>
+import {computed} from "vue";
+import {useRoute} from "vue-router";
+
+const props = defineProps(['icon', 'path'])
+const isCurrent = computed(() => useRoute().path === props.path)
+</script>
+
+<style scoped lang="scss">
+
+</style>