symbol rework; fee % switching; symbol search improvements

src/components/Order.vue

@@ -30,9 +30,11 @@ import {pendOrder} from "@/blockchain/wallet.js";
 import router from "@/router/index.js";
 import PairChoice from "@/components/PairChoice.vue";
 import NeedsSigner from "@/components/NeedsSigner.vue";
+import {useChartOrderStore} from "@/orderbuild.js";
 
 const s = useStore()
 const os = useOrderStore()
+const co = useChartOrderStore()
 const props = defineProps(['title','subtitle','valid','tranches'])
 
 function placeOrder() {
@@ -40,12 +42,12 @@ function placeOrder() {
   const tb = os.tokenB;
   const tokenIn = os.buy ? tb.address : ta.address
   const tokenOut = os.buy ? ta.address : tb.address
-  const route = os.route
+  const symbol = co.selectedSymbol
   const amt = FixedNumber.fromString(os.totalAmount.toString(), {decimals: os.amountToken.decimals}).value
   const ts = props.tranches()
-  const order = newOrder(tokenIn, tokenOut, route.exchange, route.fee, amt, os.amountIsInput, ts) // todo: minAmount, outputToOwner, conditionalOrder
+  console.log('new order', symbol)
+  const order = newOrder(tokenIn, tokenOut, symbol.e, symbol.fee, amt, os.amountIsInput, ts) // todo: minAmount, outputToOwner, conditionalOrder
   pendOrder(order)
-  route('Status')
 }
 
 </script>

src/components/Status.vue

@@ -167,7 +167,7 @@ import {DISTANT_FUTURE, isOpen, OrderState} from "@/blockchain/orderlib.js";
 import Pulse from "@/components/Pulse.vue";
 import {OrderShapes} from "@/charts/ordershapes.js";
 import {useChartOrderStore} from "@/orderbuild.js";
-import {lookupSymbol} from "@/charts/datafeed.js";
+import {lookupSymbol, tickerForOrder} from "@/charts/datafeed.js";
 import {setSymbol} from "@/charts/chart.js";
 import {uniswapV3AveragePrice} from "@/blockchain/uniswap.js";
 
@@ -187,17 +187,14 @@ watch(selected, async ()=>{
   for (const order of orders.value)
     statusIndex[order.id] = order
   const selectedIndex = {}
+  const chainId = s.chainId
   for (const id of selected.value) {
     selectedIndex[id] = true
     const status = statusIndex[id];
     if (!(id in orderShapes)) {
-      let base = status.order.tokenIn
-      let quote = status.order.tokenOut
-      if (base > quote)
-        [base, quote] = [quote, base]
-	    const symbolKey = `${base}/${quote}`
-      const symbol = lookupSymbol(symbolKey)
-      if (co.selectedSymbol.ticker !== symbolKey) {
+      const ticker = tickerForOrder(chainId, status.order)
+      const symbol = lookupSymbol(ticker)
+      if (co.selectedSymbol.ticker !== ticker) {
         co.selectedSymbol = symbol
         await setSymbol(symbol)
       }

src/components/TokenRow.vue

@@ -3,16 +3,16 @@
     <td>
       <v-avatar v-if="imageSrc" :image="imageSrc" size="x-small"/>
     </td>
-    <td class="d-none d-sm-table-cell">{{ token.n || '' }}</td>
+    <td class="d-none d-sm-table-cell">{{ token?.n || '' }}</td>
     <td class="text-right">{{ fixed }}</td>
-    <td class="text-left">{{ token.s }}</td>
+    <td class="text-left">{{ token?.s }}</td>
     <!-- todo price and value columns -->
     <td>
       <v-menu>
         <template v-slot:activator="{ props }">
           <v-btn variant="plain" v-bind="props" icon="mdi-dots-vertical"/>
         </template>
-        <v-list>
+        <v-list v-if="token">
           <v-list-subheader :title="token.s"/>
           <v-list-item title="Withdraw" key="withdraw" value="withdraw" prepend-icon="mdi-arrow-down-bold"
           @click="()=>onWithdraw(token.a)"/>
@@ -26,16 +26,17 @@
 import {useStore} from "@/store/store";
 import {getToken} from "@/blockchain/token.js";
 import {FixedNumber} from "ethers";
-import {computed, ref} from "vue";
+import {computed} from "vue";
 
 const s = useStore()
 const props = defineProps(['chainId', 'addr', 'amount', 'onWithdraw'])
 const token = await getToken(props.chainId, props.addr)
-const fixed = computed(() => FixedNumber.fromValue(props.amount, token.d, {
+console.log('TokenRow token is', token)
+const fixed = computed(() => token ? FixedNumber.fromValue(props.amount, token.d, {
   width: 256,
   decimals: token.d
-}))
-const imageSrc = computed(() => token.image)
+}) : null)
+const imageSrc = computed(() => token ? token.image : null)
 </script>
 
 <style scoped lang="scss">

src/components/chart/ChartOrder.vue

@@ -60,6 +60,7 @@ import RowBar from "@/components/chart/RowBar.vue";
 import ColorBand from "@/components/chart/ColorBand.vue";
 import Color from "color";
 import {Exchange, newOrder} from "@/blockchain/orderlib.js";
+import {lookupSymbol} from "@/charts/datafeed.js";
 
 const props = defineProps(['order'])
 const s = useStore()
@@ -112,7 +113,6 @@ function buildOrder() {
   //     Tranche[] tranches;
   // }
   const symbol = co.selectedSymbol
-  const fee = co.selectedPool[1]
   const amountDec = order.amountIsTokenA ? symbol.base.d : symbol.quote.d
   const amount = BigInt(Math.trunc(order.amount * 10 ** amountDec))
   const amountIsInput = !!(order.amountIsTokenA ^ order.buy)
@@ -125,7 +125,7 @@ function buildOrder() {
     tranches = [...tranches, ...ts]
   }
 
-  return newOrder(tokenIn.value.a, tokenOut.value.a, Exchange.UniswapV3, fee, amount, amountIsInput, tranches)
+  return newOrder(tokenIn.value.a, tokenOut.value.a, symbol.exchangeId, symbol.fee, amount, amountIsInput, tranches)
 }