fix: use Giraffe's unit prefix formatters correctly (#4193)

Author: TCL735

package.json

@@ -161,7 +161,7 @@
     "@docsearch/react": "^3.0.0-alpha.37",
     "@influxdata/clockface": "^3.5.2",
     "@influxdata/flux-lsp-browser": "0.8.8",
-    "@influxdata/giraffe": "^2.24.3",
+    "@influxdata/giraffe": "^2.25.0",
     "@influxdata/influxdb-templates": "0.9.0",
     "@influxdata/react-custom-scrollbars": "4.3.8",
     "abortcontroller-polyfill": "^1.3.0",

src/visualization/utils/getFormatter.test.ts

@@ -11,7 +11,6 @@ describe('getFormatter', () => {
       prefix: 'prefix ',
       suffix: ' suffix',
       base: '10' as Base,
-      format: true,
     }
 
     const formatter = getFormatter('number', formatterOptions)
@@ -32,22 +31,21 @@ describe('getFormatter', () => {
 
     const formattedValue = formatter(100000)
 
-    expect(formattedValue).toBe('prefix 100k suffix')
+    expect(formattedValue).toBe('prefix 100000 suffix')
   })
 
   it("should format correctly for base 2 'number' columntype", function() {
     const formatterOptions = {
       prefix: 'prefix ',
       suffix: ' suffix',
       base: '2' as Base,
-      format: false,
     }
 
     const formatter = getFormatter('number', formatterOptions)
 
     const formattedValue = formatter(100000)
 
-    expect(formattedValue).toBe('prefix 100000 suffix')
+    expect(formattedValue).toBe('prefix 97.6563 K suffix')
   })
 
   // time column type

src/visualization/utils/getFormatter.ts

@@ -28,15 +28,14 @@ export const getFormatter = (
     timeZone,
     trimZeros = true,
     timeFormat = DEFAULT_TIME_FORMAT,
-    format,
   }: GetFormatterOptions = {}
 ): null | ((x: any) => string) => {
   if (columnType === 'number' && base === '2') {
     return binaryPrefixFormatter({
       prefix,
       suffix,
       significantDigits: VIS_SIG_DIGITS,
-      format,
+      format: true,
     })
   }
 
@@ -46,7 +45,7 @@ export const getFormatter = (
       suffix,
       significantDigits: VIS_SIG_DIGITS,
       trimZeros,
-      format,
+      format: true,
     })
   }
 
@@ -56,7 +55,7 @@ export const getFormatter = (
       suffix,
       significantDigits: VIS_SIG_DIGITS,
       trimZeros,
-      format: true,
+      format: false,
     })
   }
 

yarn.lock

@@ -1197,10 +1197,10 @@
   resolved "https://registry.yarnpkg.com/@influxdata/flux-lsp-browser/-/flux-lsp-browser-0.8.8.tgz#6a8476fc7bab8ea4a7cf08a7ef27438e20934d6f"
   integrity sha512-SiDmq0Ygghqp3qj/M9r6TA8Gn3yYmiskmhXNWemzJbjs4uLDmkiyTCWCC+I1a+dQPWJqnNK57EW4UkXcY+mPIA==
 
-"@influxdata/giraffe@^2.24.3":
-  version "2.24.3"
-  resolved "https://registry.yarnpkg.com/@influxdata/giraffe/-/giraffe-2.24.3.tgz#47e3979085c2ee5bdd8a9745d232284004ca501d"
-  integrity sha512-Vtf9PxvGgsCkzI/w83vTNvylDECw1/0nYrH57tpiAB07zyfjPWQsctyadGBSt4WO0CoK+wu/xk1XVCJDN2kxXw==
+"@influxdata/giraffe@^2.25.0":
+  version "2.25.0"
+  resolved "https://registry.yarnpkg.com/@influxdata/giraffe/-/giraffe-2.25.0.tgz#b042462c33ac112e144c6a0f6144b230629c124e"
+  integrity sha512-cLlR8xTSCCaZJGPlg6ZRZDLyb+PW3aCYHZeFG16I03Zp8kcREuRriepRyVf5c0uHj0InlXh122tYlKwF01RXpg==
   dependencies:
     merge-images "^2.0.0"