Page MenuHomePhabricator

[cashtab] Show agora cumulative available quantity in an orderbook tooltip
DraftPublic

Authored by Fabien on Wed, Jan 1, 21:20.
This is a draft revision that has not yet been submitted for review.

Details

Reviewers
None
Group Reviewers
Restricted Project
Summary

PoC, styling TBD

Hover an orderbook depth bar to show the cumulative available quantity.

Test Plan
npm run start

Diff Detail

Repository
rABC Bitcoin ABC
Branch
cashtab_tooltip
Lint
Lint Passed
Unit
No Test Coverage
Build Status
Buildable 31873
Build 63238: Build Diffcashtab-tests
Build 63237: arc lint + arc unit

Event Timeline

Remove debug logs

cashtab/src/components/Agora/OrderBook/index.tsx
948 ↗(On Diff #51897)

Blame the linter

Failed tests logs:

====== CashTab Unit Tests: <OrderBook /> We can see multiple offers, some we made, others we did not, and we can cancel an offer ======
ReferenceError: ResizeObserver is not defined
    at Object.autoUpdate (/work/cashtab/node_modules/@floating-ui/dom/dist/floating-ui.dom.umd.js:757:7)
    at /work/cashtab/node_modules/react-tooltip/dist/react-tooltip.min.cjs:7:8725
    at commitHookEffectListMount (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:23189:26)
    at commitPassiveMountOnFiber (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24970:11)
    at commitPassiveMountEffects_complete (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24930:9)
    at commitPassiveMountEffects_begin (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24917:7)
    at commitPassiveMountEffects (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24905:3)
    at flushPassiveEffectsImpl (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:27078:3)
    at flushPassiveEffects (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:27023:14)
    at /work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:26808:9
    at flushActQueue (/work/cashtab/node_modules/react/cjs/react.development.js:2667:24)
    at act (/work/cashtab/node_modules/react/cjs/react.development.js:2582:11)
    at /work/cashtab/node_modules/@testing-library/react/dist/act-compat.js:47:25
    at Object.eventWrapper (/work/cashtab/node_modules/@testing-library/react/dist/pure.js:107:28)
    at Object.wrapEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/wrapEvent.js:6:28)
    at Object.dispatchEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/dispatchEvent.js:45:22)
    at Object.dispatchUIEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/dispatchEvent.js:22:26)
    at Object.enter (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/system/pointer/mouse.js:60:30)
    at PointerHost.move (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/system/pointer/index.js:51:73)
    at pointerAction (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/pointer/index.js:64:39)
    at Object.pointer (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/pointer/index.js:32:15)
    at Object.asyncWrapper (/work/cashtab/node_modules/@testing-library/react/dist/pure.js:88:22)
    at Object.<anonymous> (/work/cashtab/src/components/Agora/OrderBook/__tests__/index.test.js:410:9)
====== CashTab Unit Tests: <OrderBook /> We can buy an offer ======
ReferenceError: ResizeObserver is not defined
    at Object.autoUpdate (/work/cashtab/node_modules/@floating-ui/dom/dist/floating-ui.dom.umd.js:757:7)
    at /work/cashtab/node_modules/react-tooltip/dist/react-tooltip.min.cjs:7:8725
    at commitHookEffectListMount (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:23189:26)
    at commitPassiveMountOnFiber (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24970:11)
    at commitPassiveMountEffects_complete (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24930:9)
    at commitPassiveMountEffects_begin (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24917:7)
    at commitPassiveMountEffects (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24905:3)
    at flushPassiveEffectsImpl (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:27078:3)
    at flushPassiveEffects (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:27023:14)
    at /work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:26808:9
    at flushActQueue (/work/cashtab/node_modules/react/cjs/react.development.js:2667:24)
    at act (/work/cashtab/node_modules/react/cjs/react.development.js:2582:11)
    at /work/cashtab/node_modules/@testing-library/react/dist/act-compat.js:47:25
    at Object.eventWrapper (/work/cashtab/node_modules/@testing-library/react/dist/pure.js:107:28)
    at Object.wrapEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/wrapEvent.js:6:28)
    at Object.dispatchEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/dispatchEvent.js:45:22)
    at Object.dispatchUIEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/dispatchEvent.js:22:26)
    at Object.enter (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/system/pointer/mouse.js:60:30)
    at PointerHost.move (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/system/pointer/index.js:51:73)
    at pointerAction (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/pointer/index.js:64:39)
    at Object.pointer (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/pointer/index.js:32:15)
    at Object.asyncWrapper (/work/cashtab/node_modules/@testing-library/react/dist/pure.js:88:22)
    at Object.<anonymous> (/work/cashtab/src/components/Agora/OrderBook/__tests__/index.test.js:547:9)
====== CashTab Unit Tests: <Agora /> We can see multiple offers, some we made, others we did not, and we can cancel an offer ======
ReferenceError: ResizeObserver is not defined
    at Object.autoUpdate (/work/cashtab/node_modules/@floating-ui/dom/dist/floating-ui.dom.umd.js:757:7)
    at /work/cashtab/node_modules/react-tooltip/dist/react-tooltip.min.cjs:7:8725
    at commitHookEffectListMount (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:23189:26)
    at commitPassiveMountOnFiber (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24970:11)
    at commitPassiveMountEffects_complete (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24930:9)
    at commitPassiveMountEffects_begin (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24917:7)
    at commitPassiveMountEffects (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24905:3)
    at flushPassiveEffectsImpl (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:27078:3)
    at flushPassiveEffects (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:27023:14)
    at /work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:26808:9
    at flushActQueue (/work/cashtab/node_modules/react/cjs/react.development.js:2667:24)
    at act (/work/cashtab/node_modules/react/cjs/react.development.js:2582:11)
    at /work/cashtab/node_modules/@testing-library/react/dist/act-compat.js:47:25
    at Object.eventWrapper (/work/cashtab/node_modules/@testing-library/react/dist/pure.js:107:28)
    at Object.wrapEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/wrapEvent.js:6:28)
    at Object.dispatchEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/dispatchEvent.js:45:22)
    at Object.dispatchUIEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/dispatchEvent.js:22:26)
    at Object.enter (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/system/pointer/mouse.js:60:30)
    at PointerHost.move (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/system/pointer/index.js:51:73)
    at pointerAction (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/pointer/index.js:64:39)
    at Object.pointer (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/pointer/index.js:32:15)
    at Object.asyncWrapper (/work/cashtab/node_modules/@testing-library/react/dist/pure.js:88:22)
    at Object.<anonymous> (/work/cashtab/src/components/Agora/__tests__/index.test.js:606:9)
====== CashTab Unit Tests: <Agora /> We can buy an offer ======
ReferenceError: ResizeObserver is not defined
    at Object.autoUpdate (/work/cashtab/node_modules/@floating-ui/dom/dist/floating-ui.dom.umd.js:757:7)
    at /work/cashtab/node_modules/react-tooltip/dist/react-tooltip.min.cjs:7:8725
    at commitHookEffectListMount (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:23189:26)
    at commitPassiveMountOnFiber (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24970:11)
    at commitPassiveMountEffects_complete (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24930:9)
    at commitPassiveMountEffects_begin (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24917:7)
    at commitPassiveMountEffects (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24905:3)
    at flushPassiveEffectsImpl (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:27078:3)
    at flushPassiveEffects (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:27023:14)
    at /work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:26808:9
    at flushActQueue (/work/cashtab/node_modules/react/cjs/react.development.js:2667:24)
    at act (/work/cashtab/node_modules/react/cjs/react.development.js:2582:11)
    at /work/cashtab/node_modules/@testing-library/react/dist/act-compat.js:47:25
    at Object.eventWrapper (/work/cashtab/node_modules/@testing-library/react/dist/pure.js:107:28)
    at Object.wrapEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/wrapEvent.js:6:28)
    at Object.dispatchEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/dispatchEvent.js:45:22)
    at Object.dispatchUIEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/dispatchEvent.js:22:26)
    at Object.enter (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/system/pointer/mouse.js:60:30)
    at PointerHost.move (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/system/pointer/index.js:51:73)
    at pointerAction (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/pointer/index.js:64:39)
    at Object.pointer (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/pointer/index.js:32:15)
    at runNextTicks (node:internal/process/task_queues:60:5)
    at listOnTimeout (node:internal/timers:545:9)
    at processTimers (node:internal/timers:519:7)
    at Object.asyncWrapper (/work/cashtab/node_modules/@testing-library/react/dist/pure.js:88:22)
    at Object.<anonymous> (/work/cashtab/src/components/Agora/__tests__/index.test.js:823:9)
====== CashTab Unit Tests: <Agora /> We get expected error if we try to buy an offer we cannot afford ======
ReferenceError: ResizeObserver is not defined
    at Object.autoUpdate (/work/cashtab/node_modules/@floating-ui/dom/dist/floating-ui.dom.umd.js:757:7)
    at /work/cashtab/node_modules/react-tooltip/dist/react-tooltip.min.cjs:7:8725
    at commitHookEffectListMount (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:23189:26)
    at commitPassiveMountOnFiber (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24970:11)
    at commitPassiveMountEffects_complete (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24930:9)
    at commitPassiveMountEffects_begin (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24917:7)
    at commitPassiveMountEffects (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24905:3)
    at flushPassiveEffectsImpl (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:27078:3)
    at flushPassiveEffects (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:27023:14)
    at /work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:26808:9
    at flushActQueue (/work/cashtab/node_modules/react/cjs/react.development.js:2667:24)
    at act (/work/cashtab/node_modules/react/cjs/react.development.js:2582:11)
    at /work/cashtab/node_modules/@testing-library/react/dist/act-compat.js:47:25
    at Object.eventWrapper (/work/cashtab/node_modules/@testing-library/react/dist/pure.js:107:28)
    at Object.wrapEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/wrapEvent.js:6:28)
    at Object.dispatchEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/dispatchEvent.js:45:22)
    at Object.dispatchUIEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/dispatchEvent.js:22:26)
    at Object.enter (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/system/pointer/mouse.js:60:30)
    at PointerHost.move (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/system/pointer/index.js:51:73)
    at pointerAction (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/pointer/index.js:64:39)
    at Object.pointer (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/pointer/index.js:32:15)
    at runNextTicks (node:internal/process/task_queues:60:5)
    at listOnTimeout (node:internal/timers:545:9)
    at processTimers (node:internal/timers:519:7)
    at Object.asyncWrapper (/work/cashtab/node_modules/@testing-library/react/dist/pure.js:88:22)
    at Object.<anonymous> (/work/cashtab/src/components/Agora/__tests__/index.test.js:983:9)

Each failure log is accessible here:
CashTab Unit Tests: <OrderBook /> We can see multiple offers, some we made, others we did not, and we can cancel an offer
CashTab Unit Tests: <OrderBook /> We can buy an offer
CashTab Unit Tests: <Agora /> We can see multiple offers, some we made, others we did not, and we can cancel an offer
CashTab Unit Tests: <Agora /> We can buy an offer
CashTab Unit Tests: <Agora /> We get expected error if we try to buy an offer we cannot afford

Failed tests logs:

====== CashTab Unit Tests: <OrderBook /> We can see multiple offers, some we made, others we did not, and we can cancel an offer ======
ReferenceError: ResizeObserver is not defined
    at Object.autoUpdate (/work/cashtab/node_modules/@floating-ui/dom/dist/floating-ui.dom.umd.js:757:7)
    at /work/cashtab/node_modules/react-tooltip/dist/react-tooltip.min.cjs:7:8725
    at commitHookEffectListMount (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:23189:26)
    at commitPassiveMountOnFiber (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24970:11)
    at commitPassiveMountEffects_complete (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24930:9)
    at commitPassiveMountEffects_begin (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24917:7)
    at commitPassiveMountEffects (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24905:3)
    at flushPassiveEffectsImpl (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:27078:3)
    at flushPassiveEffects (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:27023:14)
    at /work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:26808:9
    at flushActQueue (/work/cashtab/node_modules/react/cjs/react.development.js:2667:24)
    at act (/work/cashtab/node_modules/react/cjs/react.development.js:2582:11)
    at /work/cashtab/node_modules/@testing-library/react/dist/act-compat.js:47:25
    at Object.eventWrapper (/work/cashtab/node_modules/@testing-library/react/dist/pure.js:107:28)
    at Object.wrapEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/wrapEvent.js:6:28)
    at Object.dispatchEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/dispatchEvent.js:45:22)
    at Object.dispatchUIEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/dispatchEvent.js:22:26)
    at Object.enter (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/system/pointer/mouse.js:60:30)
    at PointerHost.move (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/system/pointer/index.js:51:73)
    at pointerAction (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/pointer/index.js:64:39)
    at Object.pointer (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/pointer/index.js:32:15)
    at Object.asyncWrapper (/work/cashtab/node_modules/@testing-library/react/dist/pure.js:88:22)
    at Object.<anonymous> (/work/cashtab/src/components/Agora/OrderBook/__tests__/index.test.js:410:9)
====== CashTab Unit Tests: <OrderBook /> We can buy an offer ======
ReferenceError: ResizeObserver is not defined
    at Object.autoUpdate (/work/cashtab/node_modules/@floating-ui/dom/dist/floating-ui.dom.umd.js:757:7)
    at /work/cashtab/node_modules/react-tooltip/dist/react-tooltip.min.cjs:7:8725
    at commitHookEffectListMount (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:23189:26)
    at commitPassiveMountOnFiber (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24970:11)
    at commitPassiveMountEffects_complete (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24930:9)
    at commitPassiveMountEffects_begin (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24917:7)
    at commitPassiveMountEffects (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24905:3)
    at flushPassiveEffectsImpl (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:27078:3)
    at flushPassiveEffects (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:27023:14)
    at /work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:26808:9
    at flushActQueue (/work/cashtab/node_modules/react/cjs/react.development.js:2667:24)
    at act (/work/cashtab/node_modules/react/cjs/react.development.js:2582:11)
    at /work/cashtab/node_modules/@testing-library/react/dist/act-compat.js:47:25
    at Object.eventWrapper (/work/cashtab/node_modules/@testing-library/react/dist/pure.js:107:28)
    at Object.wrapEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/wrapEvent.js:6:28)
    at Object.dispatchEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/dispatchEvent.js:45:22)
    at Object.dispatchUIEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/dispatchEvent.js:22:26)
    at Object.enter (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/system/pointer/mouse.js:60:30)
    at PointerHost.move (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/system/pointer/index.js:51:73)
    at pointerAction (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/pointer/index.js:64:39)
    at Object.pointer (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/pointer/index.js:32:15)
    at Object.asyncWrapper (/work/cashtab/node_modules/@testing-library/react/dist/pure.js:88:22)
    at Object.<anonymous> (/work/cashtab/src/components/Agora/OrderBook/__tests__/index.test.js:547:9)
====== CashTab Unit Tests: <Agora /> We can see multiple offers, some we made, others we did not, and we can cancel an offer ======
ReferenceError: ResizeObserver is not defined
    at Object.autoUpdate (/work/cashtab/node_modules/@floating-ui/dom/dist/floating-ui.dom.umd.js:757:7)
    at /work/cashtab/node_modules/react-tooltip/dist/react-tooltip.min.cjs:7:8725
    at commitHookEffectListMount (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:23189:26)
    at commitPassiveMountOnFiber (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24970:11)
    at commitPassiveMountEffects_complete (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24930:9)
    at commitPassiveMountEffects_begin (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24917:7)
    at commitPassiveMountEffects (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24905:3)
    at flushPassiveEffectsImpl (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:27078:3)
    at flushPassiveEffects (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:27023:14)
    at performConcurrentWorkOnRoot (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:25748:32)
    at flushActQueue (/work/cashtab/node_modules/react/cjs/react.development.js:2667:24)
    at act (/work/cashtab/node_modules/react/cjs/react.development.js:2582:11)
    at /work/cashtab/node_modules/@testing-library/react/dist/act-compat.js:47:25
    at Object.eventWrapper (/work/cashtab/node_modules/@testing-library/react/dist/pure.js:107:28)
    at Object.wrapEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/wrapEvent.js:6:28)
    at Object.dispatchEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/dispatchEvent.js:45:22)
    at Object.dispatchUIEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/dispatchEvent.js:22:26)
    at Object.enter (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/system/pointer/mouse.js:60:30)
    at PointerHost.move (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/system/pointer/index.js:51:73)
    at pointerAction (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/pointer/index.js:64:39)
    at Object.pointer (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/pointer/index.js:32:15)
    at Object.asyncWrapper (/work/cashtab/node_modules/@testing-library/react/dist/pure.js:88:22)
    at Object.<anonymous> (/work/cashtab/src/components/Agora/__tests__/index.test.js:606:9)
====== CashTab Unit Tests: <Agora /> We can buy an offer ======
ReferenceError: ResizeObserver is not defined
    at Object.autoUpdate (/work/cashtab/node_modules/@floating-ui/dom/dist/floating-ui.dom.umd.js:757:7)
    at /work/cashtab/node_modules/react-tooltip/dist/react-tooltip.min.cjs:7:8725
    at commitHookEffectListMount (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:23189:26)
    at commitPassiveMountOnFiber (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24970:11)
    at commitPassiveMountEffects_complete (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24930:9)
    at commitPassiveMountEffects_begin (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24917:7)
    at commitPassiveMountEffects (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24905:3)
    at flushPassiveEffectsImpl (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:27078:3)
    at flushPassiveEffects (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:27023:14)
    at /work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:26808:9
    at flushActQueue (/work/cashtab/node_modules/react/cjs/react.development.js:2667:24)
    at act (/work/cashtab/node_modules/react/cjs/react.development.js:2582:11)
    at /work/cashtab/node_modules/@testing-library/react/dist/act-compat.js:47:25
    at Object.eventWrapper (/work/cashtab/node_modules/@testing-library/react/dist/pure.js:107:28)
    at Object.wrapEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/wrapEvent.js:6:28)
    at Object.dispatchEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/dispatchEvent.js:45:22)
    at Object.dispatchUIEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/dispatchEvent.js:22:26)
    at Object.enter (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/system/pointer/mouse.js:60:30)
    at PointerHost.move (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/system/pointer/index.js:51:73)
    at pointerAction (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/pointer/index.js:64:39)
    at Object.pointer (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/pointer/index.js:32:15)
    at runNextTicks (node:internal/process/task_queues:60:5)
    at listOnTimeout (node:internal/timers:545:9)
    at processTimers (node:internal/timers:519:7)
    at Object.asyncWrapper (/work/cashtab/node_modules/@testing-library/react/dist/pure.js:88:22)
    at Object.<anonymous> (/work/cashtab/src/components/Agora/__tests__/index.test.js:823:9)
====== CashTab Unit Tests: <Agora /> We get expected error if we try to buy an offer we cannot afford ======
ReferenceError: ResizeObserver is not defined
    at Object.autoUpdate (/work/cashtab/node_modules/@floating-ui/dom/dist/floating-ui.dom.umd.js:757:7)
    at /work/cashtab/node_modules/react-tooltip/dist/react-tooltip.min.cjs:7:8725
    at commitHookEffectListMount (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:23189:26)
    at commitPassiveMountOnFiber (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24970:11)
    at commitPassiveMountEffects_complete (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24930:9)
    at commitPassiveMountEffects_begin (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24917:7)
    at commitPassiveMountEffects (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:24905:3)
    at flushPassiveEffectsImpl (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:27078:3)
    at flushPassiveEffects (/work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:27023:14)
    at /work/cashtab/node_modules/react-dom/cjs/react-dom.development.js:26808:9
    at flushActQueue (/work/cashtab/node_modules/react/cjs/react.development.js:2667:24)
    at act (/work/cashtab/node_modules/react/cjs/react.development.js:2582:11)
    at /work/cashtab/node_modules/@testing-library/react/dist/act-compat.js:47:25
    at Object.eventWrapper (/work/cashtab/node_modules/@testing-library/react/dist/pure.js:107:28)
    at Object.wrapEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/wrapEvent.js:6:28)
    at Object.dispatchEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/dispatchEvent.js:45:22)
    at Object.dispatchUIEvent (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/event/dispatchEvent.js:22:26)
    at Object.enter (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/system/pointer/mouse.js:60:30)
    at PointerHost.move (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/system/pointer/index.js:51:73)
    at pointerAction (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/pointer/index.js:64:39)
    at Object.pointer (/work/cashtab/node_modules/@testing-library/user-event/dist/cjs/pointer/index.js:32:15)
    at runNextTicks (node:internal/process/task_queues:60:5)
    at listOnTimeout (node:internal/timers:545:9)
    at processTimers (node:internal/timers:519:7)
    at Object.asyncWrapper (/work/cashtab/node_modules/@testing-library/react/dist/pure.js:88:22)
    at Object.<anonymous> (/work/cashtab/src/components/Agora/__tests__/index.test.js:983:9)

Each failure log is accessible here:
CashTab Unit Tests: <OrderBook /> We can see multiple offers, some we made, others we did not, and we can cancel an offer
CashTab Unit Tests: <OrderBook /> We can buy an offer
CashTab Unit Tests: <Agora /> We can see multiple offers, some we made, others we did not, and we can cancel an offer
CashTab Unit Tests: <Agora /> We can buy an offer
CashTab Unit Tests: <Agora /> We get expected error if we try to buy an offer we cannot afford

Cool stuff, see my inline comment for some easy style tweaks

I know its still in draft but fyi I was seeing undefined for the number. Also the on the /agora page it was really bogging the down the performance and crashed the page

cashtab/src/components/Agora/OrderBook/index.tsx
1019

This light variant looks pretty good I reckon, and then can use the id to set the z-index in styled.js

Inside the OrderBookRow styled component

#depth-bar-tooltip {
z-index: 999;
}