more tracking; hide arb from welcome splash

src/blockchain/wallet.js

@@ -7,6 +7,7 @@ import {defineStore} from "pinia";
 import {computed, ref} from "vue";
 import {metadataMap, version} from "@/version.js";
 import {CancelAllTransaction, TransactionState, TransactionType} from "@/blockchain/transaction.js";
+import {track} from "@/track.js";
 
 
 export let provider = null
@@ -90,6 +91,7 @@ function changeAccounts(chainId, accounts) {
     const addr = accounts[0]
     if (addr !== store.account) {
       console.log('account logged in', addr)
+      track('login', {chainId, address: addr})
       store.account = addr
       store.vaults = []
       // one of these two methods will call flushTransactions()

src/charts/datafeed.js

@@ -9,6 +9,7 @@ import {ohlcStart} from "@/charts/chart-misc.js";
 import {timestamp, USD_FIAT} from "@/common.js";
 import {erc20Contract} from "@/blockchain/contract.js";
 import {provider} from "@/blockchain/wallet.js";
+import {track} from "@/track.js";
 
 const DEBUG_LOGGING = false
 const log = DEBUG_LOGGING ? console.log : ()=>{}
@@ -356,6 +357,8 @@ export const DataFeed = {
 					result.push(_symbols[ticker])
 					seen[ticker] = true
 				}
+		if (userInput.length>=3)
+			track('search', {search_term: userInput})
 		onResultReadyCallback(result);
 	},
 

src/components/NeedsSigner.vue

@@ -68,7 +68,6 @@ function reload() {
 }
 
 async function connect() {
-  track('connect_wallet')
   disabled.value = true
   try {
     await addNetworkAndConnectWallet(s.chainId);

src/components/OneTimeHint.vue

@@ -12,9 +12,11 @@ const props = defineProps({
   name: {type: String, required: true},
   when: {type: Boolean, default: true}, // optional conditional for when to show
   after: {type: String, default: null}, // set to the name of another hint that must happen before this hint, to chain hints into a tutorial.
+  onComplete: {type: Function, default: null},
 })
 
 const forceClose = ref(false)
+const shown = ref(false)
 
 const show = computed({
   get() {
@@ -23,11 +25,13 @@ const show = computed({
     const afterOk = props.after === null || prefs.hints[props.after];
     const result = !forceClose.value && !shownBefore && whenOk && afterOk
     // console.log(`show ${props.name}? ${result} <=`, !forceClose.value, whenOk, afterOk, prefs.hints)
-    if (result)
+    if (result) {
+      shown.value = true
       prefs.hints[props.name] = true
+    }
     return result
   },
-  set(v) { if(!v) forceClose.value=true; }
+  set(v) { if(!v) { forceClose.value=true; if (shown.value && props.onComplete) props.onComplete(); } }
 })
 </script>
 

src/components/WelcomeDialog.vue

@@ -18,6 +18,7 @@
           <v-list-item prepend-icon="mdi-chart-line"><b>Breakout Orders</b> <small>buy <i>above</i> a price level</small></v-list-item>
           <v-list-item prepend-icon="mdi-plus-minus"><b>Stop-loss</b> <small>coming soon</small></v-list-item>
 <!--          <v-list-item prepend-icon="mdi-cancel">One-click Cancel All</v-list-item>-->
+<!--
           <v-list-item>
             <template #prepend>
               <v-avatar image="/arbitrum-logo.svg" size="1.5em" class="mr-4"/>
@@ -26,6 +27,7 @@
               <b>Arbitrum One</b> support <small>fast and cheap</small>
             </template>
           </v-list-item>
+-->
           <v-list-item>
             <template #prepend>
               <v-avatar image="/uniswap-logo.svg" size="1.5em" class="mr-4" style="background-color: white"/>
@@ -51,7 +53,7 @@ import Logo from "@/components/Logo.vue";
 const modelValue = defineModel()
 
 function tryIt() {
-  track('try-it')
+  track('tutorial_begin')
   modelValue.value = false
 }
 

src/components/chart/ChartPlaceOrder.vue

@@ -149,7 +149,7 @@ watchEffect(()=>{
 let built = []
 
 async function placeOrder() {
-  track('place_order')
+  track('place-order')
   const chartOrders = co.orders;
   const allWarns = []
   built = []

src/components/chart/DiagonalBuilder.vue

@@ -89,7 +89,10 @@
         </tr>
       </tbody>
     </table>
-    <one-time-hint name="click-chart" activator="#tv-widget" location="center" :when="builder.lineA===null && !co.drew" text="Click the chart!"/>
+    <one-time-hint name="click-chart" activator="#tv-widget" location="center"
+                   :when="builder.lineA===null && !co.drew" text="Click the chart!"
+                   :on-complete="()=>track('click-chart')"
+    />
   </rung-builder>
 </template>
 
@@ -104,6 +107,7 @@ import {vectorEquals, vectorInterpolate} from "@/vector.js";
 import AbsoluteTimeEntry from "@/components/AbsoluteTimeEntry.vue";
 import {useStore} from "@/store/store.js";
 import OneTimeHint from "@/components/OneTimeHint.vue";
+import {track} from "@/track.js";
 
 const s = useStore()
 const co = useChartOrderStore()

src/components/chart/LimitBuilder.vue

@@ -37,7 +37,10 @@
       </tr>
       </tbody>
     </table>
-    <one-time-hint name="click-chart" activator="#tv-widget" location="center" :when="priceA===null" text="Click the chart!"/>
+    <one-time-hint name="click-chart" activator="#tv-widget" location="center"
+                   :when="priceA===null" text="Click the chart!"
+                   :on-complete="()=>track('click-chart')"
+    />
   </rung-builder>
 </template>
 
@@ -50,6 +53,7 @@ import RungBuilder from "@/components/chart/RungBuilder.vue";
 import {computed, ref} from "vue";
 import {allocationText, HLine} from "@/charts/shape.js";
 import OneTimeHint from "@/components/OneTimeHint.vue";
+import {track} from "@/track.js";
 
 const s = useStore()
 const os = useOrderStore()

src/components/chart/RungBuilder.vue

@@ -21,7 +21,9 @@
       />
       <one-time-hint name="rungs" activator="#rungs" after="choose-builder"
                      text="↓ Try increasing rungs!" location="top"
-                     :when="rungs===1&&endpoints[0]!==null"/>
+                     :when="rungs===1&&endpoints[0]!==null"
+                     :on-complete="()=>track('rungs')"
+      />
       <v-tooltip v-if="builder.breakout!==undefined"
                  :text="order.buy?'Breakout orders buy above the breakout line':'Breakdown orders sell below the breakdown line'">
         <template #activator="{ props }">
@@ -54,7 +56,9 @@
         </div>
         <one-time-hint name="balance-slider" activator="#balance-slider" after="rungs"
                text="↓ Slide the amount balance ↓" location="top"
-               :when="balance100===0"/>
+               :when="balance100===0"
+               :on-complete="()=>track('balance-slider')"
+        />
         <v-text-field type="number" v-model="balance100" min="-100" max="100"
                       density="compact" hide-details variant="outlined" label="Balance" step="5"
                       class="balance">
@@ -88,6 +92,7 @@ import {
 } from "@/vector.js";
 import {logicalXOR} from "@/common.js";
 import OneTimeHint from "@/components/OneTimeHint.vue";
+import {track} from "@/track.js";
 
 const co = useChartOrderStore()
 const endpoints = defineModel('modelValue')  // 2-item list of points/values

src/socket.js

@@ -6,7 +6,12 @@ import { DataFeed } from "./charts/datafeed";
 import {notifyFillEvent} from "@/notify.js";
 import {refreshOHLCSubs} from "@/blockchain/ohlcs.js";
 
-export const socket = io(import.meta.env.VITE_WS_URL || undefined, {transports: ["websocket"]})
+const socketOptions = {
+    transports: ["websocket"],
+    pingInterval: 25000, // PING every 25 seconds
+    pingTimeout: 60000 // Timeout if no PONG in 60 seconds
+}
+export const socket = io(import.meta.env.VITE_WS_URL || undefined, socketOptions)
 
 socket.on('connect', () => {
     console.log(new Date(), 'ws connected')

src/track.js

@@ -1,12 +1,15 @@
-export let tracking_enabled = true
+export let tracking_enabled = window.gtag !== undefined
 
-export function track(event, info) {
+if(tracking_enabled)
+    console.log('gtag', tracking_enabled)
+else
+    console.log('tracking disabled')
+
+export function track(...args) {
     if (tracking_enabled) {
-        if (window.gtag !== undefined)
-            window.gtag('event', event, info)
-        else {
-            console.log('gtag not available')
-            tracking_enabled = false
+        try {
+            window.gtag('event', ...args)
+        } catch (e) {
         }
     }
 }