From f26f1bca7fb34caeb12aa1eac274156ee7bfeb72 Mon Sep 17 00:00:00 2001
From: Matthew Russell <mattrussell36@gmail.com>
Date: Wed, 30 Aug 2023 19:39:04 -0700
Subject: [PATCH] test: resolution formatting

---
 .../src/lib/orderbook-controls.tsx            | 19 ++++++++++--------
 libs/market-depth/src/lib/orderbook.spec.tsx  | 20 ++++++++++++++++++-
 2 files changed, 30 insertions(+), 9 deletions(-)

diff --git a/libs/market-depth/src/lib/orderbook-controls.tsx b/libs/market-depth/src/lib/orderbook-controls.tsx
index 7fd44374e..f0ec081cb 100644
--- a/libs/market-depth/src/lib/orderbook-controls.tsx
+++ b/libs/market-depth/src/lib/orderbook-controls.tsx
@@ -7,7 +7,7 @@ import {
   TradingDropdownContent,
   TradingDropdownItem,
 } from '@vegaprotocol/ui-toolkit';
-import { addDecimal, getNumberFormat } from '@vegaprotocol/utils';
+import { addDecimalsFormatNumber } from '@vegaprotocol/utils';
 
 export const OrderbookControls = ({
   lastTradedPrice,
@@ -102,17 +102,20 @@ export const OrderbookControls = ({
 };
 
 export const formatResolution = (r: number, decimalPlaces: number) => {
-  const num = addDecimal(r, decimalPlaces);
-  // Wrap with Number to trim trailing 0s
-  const x = Number(num);
+  let num = addDecimalsFormatNumber(r, decimalPlaces);
 
-  if (x >= 1) {
-    return getNumberFormat(0).format(x);
-  }
+  // Remove trailing zeroes
+  num = num.replace(/(\.\d*?)0+$/, '$1');
+  num = num.replace(/\.$/, '');
 
-  return x.toString();
+  return num;
 };
 
+/**
+ * Create a list of resolutions based on the largest and smallest
+ * possible values using the last traded price and the market
+ * decimal places
+ */
 export const createResolutions = (
   lastTradedPrice: string,
   decimalPlaces: number
diff --git a/libs/market-depth/src/lib/orderbook.spec.tsx b/libs/market-depth/src/lib/orderbook.spec.tsx
index a0cfc4936..cdc71003a 100644
--- a/libs/market-depth/src/lib/orderbook.spec.tsx
+++ b/libs/market-depth/src/lib/orderbook.spec.tsx
@@ -3,7 +3,7 @@ import userEvent from '@testing-library/user-event';
 import { generateMockData, VolumeType } from './orderbook-data';
 import { Orderbook, OrderbookMid } from './orderbook';
 import * as orderbookData from './orderbook-data';
-import { createResolutions } from './orderbook-controls';
+import { createResolutions, formatResolution } from './orderbook-controls';
 
 function mockOffsetSize(width: number, height: number) {
   Object.defineProperty(HTMLElement.prototype, 'getBoundingClientRect', {
@@ -268,3 +268,21 @@ describe('createResolutions', () => {
     ).toEqual([1, 2, 5, 10, 20, 50, 100]);
   });
 });
+
+describe('formatResolution', () => {
+  it('formats less than 1', () => {
+    expect(formatResolution(1, 2)).toEqual('0.01');
+    expect(formatResolution(1, 3)).toEqual('0.001');
+    expect(formatResolution(2, 4)).toEqual('0.0002');
+    expect(formatResolution(5, 8)).toEqual('0.00000005');
+    expect(formatResolution(10000, 5)).toEqual('0.1');
+  });
+
+  it('formats greater than 1', () => {
+    expect(formatResolution(1000, 2)).toEqual('10');
+    expect(formatResolution(100000, 4)).toEqual('10');
+    expect(formatResolution(10000000, 2)).toEqual('100,000');
+    expect(formatResolution(500, 2)).toEqual('5');
+    expect(formatResolution(500, 1)).toEqual('50');
+  });
+});