Code

feat: improve Orderbook UI#556

Code

Merged

dib542 merged 193 commits intomainduality-labs/duality-web-app:mainfrom 555-improve-orderbook-order-cardduality-labs/duality-web-app:555-improve-orderbook-order-cardCopy head branch name to clipboardJun 5, 2024

+3,231-1,143

Commits

Commits on May 9, 2024

• feat: move Swap/Limit and Buy/Sell controls to radio group controls

  dib542

  committed
  1d5dcb1

Commits on May 10, 2024

• feat: remove "HALF" wallet amount shortcut button from token input

  dib542

  committed
  cc01915

• feat: allow custom header text on token input

  dib542

  committed
  1a2780d

• feat: allow token change to be optional on token input

  dib542

  committed
  6108a63

• feat: replace token amount with amountIn amountOut input groups

  dib542

  committed
  828005b

• feat: allow maxValue=0 to remove "MAX" shortcut button on token input

  dib542

  committed
  1e6300c

• feat: improve estimated trade price

  dib542

  committed
  56b9324

• feat: improve estimated (validating) trade price part 2

  dib542

  committed
  13e732f

• feat: enforce order type change with price tab type change

  dib542

  committed
  b0ac12d

• feat: refine Expiration control setting in Limit Order card

  dib542

  committed
  eea0679

• feat: reduce recomputation on expiration time changes

  dib542

  committed
  f9f96f6

• feat: put Swap/Limit Buy/Sell buttons in card header

  dib542

  committed
  d31a947

• Revert "feat: put Swap/Limit Buy/Sell buttons in card header"

  Show description for 3b5529d
  dib542

  committed
  3b5529d

• feat: focus on input control when click input group

  dib542

  committed
  56e96a1

• feat: remove less useful simulation result information

  dib542

  committed
  b5b47bb

• fix: initial state then type amountOut fix, price was 0

  dib542

  committed
  d09be32

• feat: make easier to focus on text inputs from anywhere in group

  dib542

  committed
  eb661dd

• feat: add basic styling of limit price input

  dib542

  committed
  1b68d7e

• feat: refine design of Expiry control to single click to custom

  dib542

  committed
  a8265e5

• feat: enable RadioButtonGroup to skip buttons of no description

  dib542

  committed
  da8c7b3

• feat: add LimitPrice input, connected to all other input fields

  dib542

  committed
  e4712bb

• feat: remove Swap/Limit buttons to make card header more compact

  dib542

  committed
  49fa8cb

• Revert "feat: remove Swap/Limit buttons to make card header more compact"

  Show description for ba40847
  dib542

  committed
  ba40847

• feat: control LimitPrice visibility with Swap tab only

  dib542

  committed
  1abd58c

• feat: put Swap/Limit Buy/Sell buttons in card header

  dib542

  committed
  1bf3321

• feat: stop LimitOrder card from scrolling

  dib542

  committed
  0873663

Commits on May 14, 2024

• refactor: remove grid layout from TokenInputGroup

  dib542

  committed
  93e850b

• refactor: don't redefine border width and style twice

  dib542

  committed
  4fd2e5d

• fix: align header text and header button text using extra margins

  dib542

  committed
  6ef30e3

• feat: allow extra subheader fields to TokenInputGroup

  dib542

  committed
  0c8a556

• feat: display error state if user has insufficient funds for order

  dib542

  committed
  6423f7e

• feat: display zero balance to explain why there is no trade preview

  dib542

  committed
  f9b01ea

• fix: prevent estimated trades from going above user's input balance:

  Show description for 8427ff9
  dib542

  committed
  8427ff9

• fix: make order confirmation button state based on simulation result

  Show description for 676ec6b
  dib542

  committed
  676ec6b

• feat: add inactive state to token input to indicate validating results

  dib542

  committed
  19b4e07

• feat: improve unconnected wallet state

  dib542

  committed
  d3ff604

• fix: improve isLoading state:

  Show description for b541823
  dib542

  committed
  b541823

• fix: estimation limit should be in base denom not display denom

  dib542

  committed
  abcb189

Commits on May 15, 2024

• feat: make chart a dynamic height

  dib542

  committed
  5ed9606

• feat: make chart row wider if possible

  dib542

  committed
  28bf86e

• feat: create space for a chart-depth connection element

  dib542

  committed
  c709438

• feat: use custom colors on TradingView chart

  dib542

  committed
  3d03a36

• feat: decouple chart from depth

  dib542

  committed
  a44dbe9

• feat: add more chart resolutions, default to 5 minute wicks

  dib542

  committed
  f6fd635

• feat: hide the pools tab (but keep the page available)

  Show description for 13a0886
  dib542

  committed
  13a0886

Commits on May 16, 2024

• Revert "feat: add more chart resolutions, default to 5 minute wicks"

  Show description for c1d5a48
  dib542

  committed
  c1d5a48

• feat: switch "Order" heading to "Trade"

  dib542

  committed
  a216658

• refactor: use NumberInput for limit order input:

  Show description for 3fc1f79
  dib542

  committed
  3fc1f79

• feat: add error style for "0" limit price

  dib542

  committed
  954985d

• feat: abstract out LimitPriceInput component

  dib542

  committed
  1d06407

• fix: tabbing in TokenInputGroup where Tokens cannot be changed

  dib542

  committed
  d2524dd

• feat: allow input focus on LimitPrice group click

  dib542

  committed
  2fde683

• fix: allow unrounded numbers in Custom time amount input

  dib542

  committed
  b5f1ca4

• feat: allow "Custom" PriceLimit shortcut button:

  Show description for 7998a0b
  dib542

  committed
  7998a0b

• feat: select all limit price input on "Custom" price limit shortcut

  dib542

  committed
  5934992

• feat: refine expiration time shortcuts

  dib542

  committed
  4f0f5a6

• feat: allow expiration time shortcut to prefill custom expiration time

  dib542

  committed
  b11da0d

• fix: change form values before animation makes the change visible

  dib542

  committed
  7512029

• feat: refine wording of "My Orders" table

  dib542

  committed
  a309054

• feat: make focusability of limit order inputs more visible:

  Show description for e031c6a
  dib542

  committed
  e031c6a

• Revert "Revert "feat: add more chart resolutions, default to 5 minute wicks""

  Show description for a616019
  dib542

  committed
  a616019

Commits on May 17, 2024

• feat: add normal page-card background to OrderbookChart card

  dib542

  committed
  73daf77

• feat: visually connect the chart and depth cards with background color

  dib542

  committed
  a8a9b41

• feat: add order depth price indication tracking

  dib542

  committed
  d808330

• fix: higher prices should be at the top of the depth table

  dib542

  committed
  7409a57

• feat: show priceIndication on depth table

  dib542

  committed
  5144c80

• feat: add depth price indication line on depth table hover

  dib542

  committed
  85eeecc

• fix: Tab components were causing abrupt re-renders when not needed

  dib542

  committed
  2a9625c

• fix: ensure chart style overrides are applied properly

  dib542

  committed
  24ee5e8

• feat: show Orderbook depth price indication on Orderbook chart

  dib542

  committed
  6952382

• fix: switch to useState for chart tracking: to be able to react to

  dib542

  committed
  129ae48

Commits on May 18, 2024

• feat: connect chart and depth components by price

  dib542

  committed
  a233b00

• fix: remove non-zero depth rows

  dib542

  committed
  fdea84a

• feat: add pixel to overlap depth table border

  dib542

  committed
  aaa1e7a

• feat: use a bezier curve to join lines

  dib542

  committed
  b4566d3

• feat: ease up on connection line sharpness

  dib542

  committed
  936019e

• feat: add connection area drawings

  dib542

  committed
  6ba4283

Commits on May 19, 2024

• feat: combine price indication and offset together

  dib542

  committed
  e26e247

• feat: improve indexer to add each new update in onAccumulated metadata

  dib542

  committed
  9b8eb8a

• feat: add useBuckets hook for bucketing to a specific price resolution

  dib542

  committed
  05b264c

Commits on May 20, 2024

• fix: remove unused bucket transition style calculations

  dib542

  committed
  eb13c1f

• fix: chart-connector height should grow and shrink depending on its container

  dib542

  committed
  108574f

• fix: allow dynamic row count in Orderbook depth table

  dib542

  committed
  2a07cef

• fix: align the set price line from the Orderbook depth with connector

  dib542

  committed
  4d4742a

• refactor: make column widths easier to understand

  dib542

  committed
  05a298d

• feat: use buckets hook for Orderbook depth table

  dib542

  committed
  d560f86

• refactor: simplify PriceOffset type

  dib542

  committed
  32ceff0

• feat: expand ConnectionArea type

  dib542

  committed
  9c6fab3

• fix: table row keys were inefficient or not present

  dib542

  committed
  2809187

• feat: add tracking for bucket price position offsets of Depth table

  dib542

  committed
  ed3741e

• fix: make prices explicit: price was being confused for displayPrice

  dib542

  committed
  46a5c91

• refactor: store Buckets in inner/outer bounds rather than lower/upper:

  Show description for 248bc6b
  dib542

  committed
  248bc6b

• feat: draw bucket price connections

  dib542

  committed
  36b04b1

• feat: add depthPriceIndication hover state to bucket connections

  dib542

  committed
  5543643

Commits on May 21, 2024

• feat: draw liquidity and cumulative liquidity buckets in connector

  dib542

  committed
  d4afb38

• feat: add half-pixel indicator of liquidity

  dib542

  committed
  8caa79b

• feat: make conenction areas less distracting

  dib542

  committed
  9f34089

• fix: prevent text-wrapping in Orderbook depth current price cell

  dib542

  committed
  f34dbee

• perf: don't require sharp points for fill area drawings

  dib542

  committed
  ec20c0d

• perf: abstract out connection curve point math

  dib542

  committed
  d0c0ebb

• feat: add dynamic decimal places for Orderbook depth amount

  dib542

  committed
  b2cf4e4

• feat: add directional color to Orderbook depth

  dib542

  committed
  eae4662

• refactor: move token valuation higher for better efficiency

  dib542

  committed
  cea6f98

• feat: add Orderbook depth colored cell backgrounds

  dib542

  committed
  9259aed

• feat: limit area connectors to only visible Orderbook depth rows

  dib542

  committed
  43f367a

• feat: refine bucket connection opacities

  dib542

  committed
  e3fe527

• perf: reduce number of chart liquidity buckets drawn

  dib542

  committed
  e434538

• feat: add bucket resolution control

  dib542

  committed
  33d3415

• feat: set a reasonable first bucket resolution on first pair price

  dib542

  committed
  3c0c0aa

• fix: format price values correctly

  dib542

  committed
  bbb204f

• fix: allow undefined bucketResolution when liquidity is not yet loaded

  dib542

  committed
  ccfaa59

• feat: control connection areas to display only with Depth table tab

  dib542

  committed
  58f7f6b

Commits on May 22, 2024

• feat: add more room for depth chart

  dib542

  committed
  284b62b

• feat: allow Trades list to display enough rows to scroll

  dib542

  committed
  2ac05f5

• feat: balance red/green brightnesses better, align to text colors

  dib542

  committed
  da2d688

• fix: flip red/green colors

  dib542

  committed
  f330e3c

• feat: add brightness corrected colors to connection areas

  dib542

  committed
  1b799a0

• feat: ensure depth numbers are drawn over background colors

  dib542

  committed
  2b93686

• fix: draw depth price indication connection line with existing offsets

  dib542

  committed
  d52a5ee

• refactor: abstract out depth price indication line creation

  dib542

  committed
  5e381c0

• refactor: name ConnectionLine better to represent what it looks like:

  Show description for fa99780
  dib542

  committed
  fa99780

• feat: add active row styling for when current price row is hovered

  dib542

  committed
  d92926c

• feat: remove price indication for current price on chart

  Show description for 2215521
  dib542

  committed
  2215521

• feat: re-enable chart scrolling

  dib542

  committed
  bd3fe8e

• feat: allow chart axis updates to run faster when chart is focused

  dib542

  committed
  c0e22e9

• feat: enable click to select limit price

  dib542

  committed
  019eeb0

• fix: track "hovered" style using current price indication:

  Show description for ea70adc
  dib542

  committed
  ea70adc

• feat: allow setting price indication from LimitOrder form

  dib542

  committed
  4480f94

• fix: RadioButtonGroupInput can send strings when numbers were expected

  Show description for 2676f3e
  dib542

  committed
  2676f3e

• feat: highlight top of current price bucket when trading in it

  dib542

  committed
  c9047ee

• fix: ensure active buckets are consistently calculated

  dib542

  committed
  5ee2474

Commits on May 23, 2024

• feat: allow toggling the display of the connector depth chart

  dib542

  committed
  14d9875

• feat: add space for connector visualization only when control is active

  dib542

  committed
  e2f1d49

• feat: add more options to connector width

  dib542

  committed
  eb16eae

• feat: refine colors and bucket widths to be less intrusive

  dib542

  committed
  ebba395

• fix: draw connection lines over chart bucket areas

  Show description for 71b98d1
  dib542

  committed
  71b98d1

• feat: make chart connector default width even smaller

  dib542

  committed
  26c0e41

• feat: make chart connector inidividual buckets width smaller

  dib542

  committed
  02ed15e

• feat: make cumulative depth indicating more subtle

  dib542

  committed
  0339d8f

• fix: alignment of connector side was off by border-width

  dib542

  committed
  dc3ddcf

• perf: only use sharp points for price chart axis connection, dimension

  dib542

  committed
  00d41ba

Commits on May 24, 2024

• feat: hide left toolbar of chart by default

  dib542

  committed
  31d5cdf

• fix: remove price indication line when nothing to connect to

  dib542

  committed
  c97eda3

• feat: move connection button controls into the Depth table toolbar

  dib542

  committed
  ab72d77

• refactor: simplify filteredBuckets usage in depth table

  dib542

  committed
  0f05a9b

• feat: add show Buy/Sell only buttons to Depth toolbar

  dib542

  committed
  72b52f8

• feat: balance red and greens more

  dib542

  committed
  eb6608e

• fix: prevent thrown exception when changing between chart timescales

  dib542

  committed
  00a4e84

• feat: fix possible large width of average price description

  dib542

  committed
  132061b

• fix: fix value-suffix spacing layout by combining to one inline-block

  dib542

  committed
  1653376

• feat: make Trade card even smaller: sized to header buttons

  dib542

  committed
  f2ee8e6

• fix: ensure that warnings and errors don't resize the card width

  dib542

  committed
  5fdf6fc

• feat: add depth reserves % bar indication

  dib542

  committed
  1648ee8

• fix: fix accidental mutation of stateful arrays

  dib542

  committed
  a36b8c1

• fix: check chart state before doing some chart functions

  dib542

  committed
  ff6105c

• feat: add Depth table transition effects

  dib542

  committed
  b3230b8

• feat: add price-slippage indication to Orderbook chart

  dib542

  committed
  b9bc50f

Commits on May 25, 2024

• fix: opacity admjustments should be applied just before drawing:

  Show description for 2e1d969
  dib542

  committed
  2e1d969

Commits on Jun 2, 2024

• feat: reduce component logic by asking chart to create own empty bars

  dib542

  committed
  d948121

• fix: reduce initial chart renderings on component start

  dib542

  committed
  307f79f

• feat: make order line color white to match orderbook depth table

  dib542

  committed
  a35b095

• feat: refine price connection area opacity

  dib542

  committed
  0ad999a

• feat: allow priceIndication to be 0 but disallow price to be 0

  dib542

  committed
  7a78f9e

• Revert "feat: hide the pools tab (but keep the page available)"

  Show description for a89b6cb
  dib542

  committed
  a89b6cb

• fix: fix inconsistent calculation leading to max update depth error

  dib542

  committed
  3fe8cc6

Commits on Jun 3, 2024

• fix: all txs were showing in "My Orders" with unconnected wallets

  dib542

  committed
  9792f6c

• feat: add better empty My Orders table description

  dib542

  committed
  6a9c9d6

• feat: add empty My Orders table description for unconnected state

  dib542

  committed
  b17415f

• fix: buy/sell percentage must take into account reserve prices

  dib542

  committed
  a77346c

• Merge branch 'main' into 555-improve-orderbook-order-card

  dib542

  authored
  d9eb10a

• fix: ensure undefined bucketOffsets are handled correctly

  dib542

  committed
  b63c6b3

• refactor: make default undefined bucketOffset more visibly consistent

  dib542

  committed
  6feafcf

• fix: incorrect end price could sometimes be calculated

  dib542

  committed
  f46ec16

• refactor: combine two effects for setting price indiciation into one

  dib542

  committed
  daf1de6

• fix: limit market order should set limit at current market price

  dib542

  committed
  da2067a

• fix: prevent slippage tolerance result from looking negative

  dib542

  committed
  b8ac614

• fix: remove connection lines/areas when chart is being removed

  dib542

  committed
  408a2b4

• feat: add empty data states for recent orders list

  dib542

  committed
  076a82b

• feat: make trades list refresh occasionally

  dib542

  committed
  4c37a03

• feat: abstract useOnDexMsg to add general subscriptions to dex actions in tables

  dib542

  committed
  d9f99ed

• feat: add click chart to set limit price

  dib542

  committed
  46aae64

• fix: avoid chart re-rendering with cached chart pairs

  dib542

  committed
  a9876a5

• feat: remove tokenPairs dependency from Orderbook chart

  dib542

  committed
  b612bc8

Commits on Jun 4, 2024

• feat: flip or reset order trade state when changing tokens

  dib542

  committed
  20d8198

• fix: change all usages of BigNumber .toPrecision method to .precision

  Show description for b5e7868
  dib542

  committed
  b5e7868

• fix: account=null and account=undefined react-queries were colliding

  dib542

  committed
  b8a8f36

• fix: make zero-result hook behavior more obvious: allow null parameter

  Show description for 639d5c3
  dib542

  committed
  639d5c3

• feat: ensure Expiry shortcuts are open for all limit orders:

  Show description for 8e4deac
  dib542

  committed
  8e4deac

• refactor: allow useTransactionTableData page state to be set by parent

  dib542

  committed
  7693a6a

• fix: use consistent end display price of txs calculations

  dib542

  committed
  1d19005

Commits on Jun 5, 2024

• fix: use consistent end display price of txs calculations, part 2

  dib542

  committed
  4305d0a

• refactor: rename form slippage to include percentage indication

  dib542

  committed
  3aea800

• fix: replace some tickIndex->basePrice with tickIndex->displayPrice

  Show description for 85919ac
  dib542

  committed
  85919ac