welcome dialog; order UI facelift

src/charts/chart.js

@@ -85,10 +85,14 @@ const subscribeEvents = [
 
 let poolButtonTextElement = null
 
-export function initFeeDropdown() {
+function initFeeDropdown() {
     const button = widget.createButton()
     button.setAttribute('title', 'See Pool Info and Choose Fee');
-    button.addEventListener('click', function() { co.showPoolSelection = true });
+    button.addEventListener('click', function () {
+        co.showPoolSelection = true
+    });
+    button.id = 'pool-button'
+
     button.style.height = '34px';
     button.style.display = 'flex';
     button.style.alignItems = 'center';
@@ -98,13 +102,25 @@ export function initFeeDropdown() {
     button.addEventListener('mouseout', () => {
         button.style.backgroundColor = '';
     });
-    button.id = 'pool-button'
     button.style.margin = '2px 0';
     button.style.borderRadius = '4px';
     button.classList.add('pool-button')
 
+    let img = document.createElement('img');
+    img.src = '/arbitrum-logo.svg';
+    img.style.width = '1em';
+    img.style.marginRight = '0.2em';
+    button.appendChild(img);
+
+    img = document.createElement('img');
+    img.src = '/uniswap-logo.svg';
+    img.style.height = '1.25em';
+    img.style.marginRight = '0.2em';
+    img.style.backgroundColor = 'white';
+    img.style.borderRadius = '50%';
+    button.appendChild(img);
+
     const span = document.createElement('span');
-    span.textContent = 'Pool';
     span.style.marginY = 'auto';
     button.appendChild(span);
     poolButtonTextElement = span
@@ -115,7 +131,7 @@ export function initFeeDropdown() {
 export function updateFeeDropdown() {
     if (poolButtonTextElement===null) return
     const symbolItem = useChartOrderStore().selectedSymbol
-    let text = 'Pool '
+    let text = ''
     text += (symbolItem.fee / 10000).toFixed(2) + '%'
     const index = symbolItem.feeGroup.findIndex((p) => p[1] === symbolItem.fee)
     if (symbolItem.liquiditySymbol) {
@@ -128,6 +144,10 @@ export function updateFeeDropdown() {
     poolButtonTextElement.textContent = text
 }
 
+export function initTVButtons() {
+    initFeeDropdown();
+}
+
 export function initWidget(el) {
     const symbol = prefs.selectedTicker === null ? 'default' : prefs.selectedTicker
     const interval = prefs.selectedTimeframe === null ? '15' : prefs.selectedTimeframe
@@ -166,7 +186,7 @@ export function initWidget(el) {
     widget.subscribe('onSelectedLineToolChanged', onSelectedLineToolChanged)
     widget.subscribe('mouse_down', mouseDown)
     widget.subscribe('mouse_up', mouseUp)
-    widget.headerReady().then(()=>initFeeDropdown())
+    widget.headerReady().then(()=>initTVButtons())
     widget.onChartReady(initChart)
     console.log('tv widget initialized')
 }