order workflow

src/components/Orders.vue

@@ -43,7 +43,10 @@
         <pair-price :base-addr="item.order.tokenIn" :quote-addr="item.order.tokenOut" :value="item.avg" :show-btn="true"/>
       </template>
       <template v-slot:item.status="{ item }">
-        <v-chip v-if="item.state===OrderState.Signing" prepend-icon="mdi-signature" color="yellow">Signing</v-chip>
+        <v-chip v-if="item.state===PendingOrderState.Submitted || item.state===PendingOrderState.Signing"
+                prepend-icon="mdi-signature">Wallet Signing</v-chip>
+        <v-chip v-if="item.state===PendingOrderState.Rejected" prepend-icon="mdi-cancel">Rejected</v-chip>
+        <v-chip v-if="item.state===PendingOrderState.Sent" prepend-icon="mdi-send">Sent</v-chip>
         <v-chip v-if="item.state===OrderState.Open" class="d-none d-lg-inline-flex" prepend-icon="mdi-dots-horizontal"
                 color="green">Open
         </v-chip>
@@ -103,7 +106,6 @@
         </tr>
       </template>
     </v-data-table>
-    <new-order class="mx-3 mb-3"/>
     <btn icon="mdi-delete-alert" color="red" class="mx-3 mb-3" @click="cancelAll(vaultAddr)">Cancel All Orders</btn>
   </div>
 </template>
@@ -113,7 +115,7 @@ import {FixedNumber} from "ethers";
 import {useStore} from "@/store/store";
 import {computed, defineAsyncComponent, ref} from "vue";
 import Btn from "@/components/Btn.vue"
-import {cancelAll, cancelOrder} from "@/blockchain/wallet.js";
+import {cancelAll, cancelOrder, PendingOrderState, useWalletStore} from "@/blockchain/wallet.js";
 import {dateString, pairPriceAddr} from "@/misc.js";
 import {isOpen, OrderState} from "@/blockchain/orderlib.js";
 import NewOrder from "@/components/NewOrder.vue";
@@ -123,6 +125,7 @@ const TokenAmount = defineAsyncComponent(()=>import('./TokenAmount.vue'))
 const TokenSymbol = defineAsyncComponent(()=>import('./TokenSymbol.vue'))
 
 const s = useStore()
+const ws = useWalletStore()
 const props = defineProps(['vault'])
 const vaultAddr = computed(()=>props.vault?props.vault:s.vault)
 const inverted = ref({})
@@ -196,6 +199,18 @@ const orders = computed(()=>{
   // ]
   const result = []
 
+  // in-flight orders
+  for (const pend of ws.pendingOrders) {
+    console.log('pended order', pend)
+    result.splice(0, 0, {
+      start: pend.placementTime,
+      order: pend.order,
+      filled: 0,
+      state: pend.state
+    })
+  }
+
+  // historical orders
   if( vaultAddr.value in s.orders ) {
     for (const [index, status] of Object.entries(s.orders[vaultAddr.value]).reverse()) {
       const st = {...status}