remove numbers format that does not work

briefercloud · Jan 22, 2025 · 98b2478 · 98b2478
1 parent 0e7fc59
commit 98b2478
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 91 deletions.
diff --git a/apps/api/src/yjs/v2/executor/visualization.ts b/apps/api/src/yjs/v2/executor/visualization.ts
@@ -252,13 +252,15 @@ export class VisualizationExecutor implements IVisualizationExecutor {
 
       const attrs = getVisualizationV2Attributes(block)
       if (!attrs.input.dataframeName) {
+        block.setAttribute('output', null)
         block.setAttribute('error', 'dataframe-not-set')
         executionItem.setCompleted('error')
         return
       }
 
       const dataframe = this.dataframes.get(attrs.input.dataframeName)
       if (!dataframe) {
+        block.setAttribute('output', null)
         block.setAttribute('error', 'dataframe-not-found')
         executionItem.setCompleted('error')
         return
@@ -312,6 +314,7 @@ export class VisualizationExecutor implements IVisualizationExecutor {
         if (result.reason === 'aborted') {
           executionItem.setCompleted('aborted')
         } else {
+          block.setAttribute('output', null)
           block.setAttribute('error', result.reason)
           executionItem.setCompleted('error')
         }
@@ -328,6 +331,7 @@ export class VisualizationExecutor implements IVisualizationExecutor {
         'Failed to run visualization v2 block'
       )
 
+      block.setAttribute('output', null)
       block.setAttribute('error', 'unknown')
       executionItem.setCompleted('error')
     }

diff --git a/apps/web/src/components/v2Editor/customBlocks/visualizationV2/VisualizationControls.tsx b/apps/web/src/components/v2Editor/customBlocks/visualizationV2/VisualizationControls.tsx
@@ -1,5 +1,4 @@
 import { v4 as uuidv4 } from 'uuid'
-import { format as d3Format } from 'd3-format'
 import { QuestionMarkCircleIcon } from '@heroicons/react/24/solid'
 import clsx from 'clsx'
 import {
@@ -65,15 +64,6 @@ interface Props {
   result: VisualizationV2BlockOutputResult | null
 }
 
-function isValidD3Format(format: string): boolean {
-  try {
-    d3Format(format)
-    return true
-  } catch {
-    return false
-  }
-}
-
 function VisualizationControlsV2(props: Props) {
   const onChangeXAxisGroupFunction = useCallback(
     (groupFunction: string | null) => {
@@ -224,17 +214,6 @@ function VisualizationControlsV2(props: Props) {
     [props.yAxes, props.onChangeYAxes]
   )
 
-  const onChangeNumberValuesFormat = useCallback(
-    (e: React.ChangeEvent<HTMLInputElement>) => {
-      if (e.target.value === '') {
-        props.onChangeNumberValuesFormat(null)
-        return
-      }
-      props.onChangeNumberValuesFormat(e.target.value)
-    },
-    [props.onChangeNumberValuesFormat]
-  )
-
   const [tab, setTab] = useState<Tab>('general')
 
   const onChangeYAxis = useCallback(
@@ -670,62 +649,6 @@ function VisualizationControlsV2(props: Props) {
                   />
                 )}
               </div>
-              <div>
-                <div className="flex justify-between items-center pb-1">
-                  <label
-                    htmlFor="numberValuesFormat"
-                    className="block text-xs font-medium leading-6 text-gray-900"
-                  >
-                    Number values format
-                  </label>
-                  <div className="flex items-center group relative">
-                    <PortalTooltip
-                      content={
-                        <div className="font-sans text-white text-xs rounded-md w-72 -translate-x-1/2">
-                          <div className="bg-hunter-950 p-2 rounded-md">
-                            <span className="text-gray-400 text-center">
-                              This fields accepts{' '}
-                              <a
-                                href="https://d3js.org/d3-format#locale_format"
-                                target="_blank"
-                                className="underline"
-                                rel="noreferrer"
-                              >
-                                D3 format strings
-                              </a>
-                              . For example, use{' '}
-                              <span className="font-mono">%</span> to format the
-                              numbers as percentage or{' '}
-                              <span className="font-mono">$.2f</span> to format
-                              the numbers as currency with two decimal places.
-                            </span>
-                          </div>
-                        </div>
-                      }
-                    >
-                      <QuestionMarkCircleIcon
-                        className="h-4 w-4 text-gray-300"
-                        aria-hidden="true"
-                      />
-                    </PortalTooltip>
-                  </div>
-                </div>
-                <input
-                  name="numberValuesFormat"
-                  type="text"
-                  className="w-full border-0 rounded-md ring-1 ring-inset ring-gray-200 focus:ring-1 focus:ring-inset focus:ring-gray-300 bg-white group px-2.5 text-gray-800 text-xs placeholder:text-gray-400"
-                  value={props.numberValuesFormat ?? ''}
-                  onChange={onChangeNumberValuesFormat}
-                  placeholder="$.2f"
-                  disabled={!props.dataframe || !props.isEditable}
-                />
-                {props.numberValuesFormat &&
-                  !isValidD3Format(props.numberValuesFormat ?? '') && (
-                    <div className="text-red-600 text-xs pt-1">
-                      <span>Invalid format string</span>
-                    </div>
-                  )}
-              </div>
             </div>
           )}
         </div>

diff --git a/apps/web/src/components/v2Editor/customBlocks/visualizationV2/VisualizationView.tsx b/apps/web/src/components/v2Editor/customBlocks/visualizationV2/VisualizationView.tsx
@@ -1,6 +1,5 @@
 import * as echarts from 'echarts'
 import { fontFamily as twFontFamiliy } from 'tailwindcss/defaultTheme'
-import { timeFormat } from 'd3-time-format'
 import { format as d3Format } from 'd3-format'
 import {
   ChevronDoubleRightIcon,

diff --git a/apps/web/src/components/v2Editor/customBlocks/visualizationV2/display/DisplayControls.tsx b/apps/web/src/components/v2Editor/customBlocks/visualizationV2/display/DisplayControls.tsx
@@ -52,19 +52,15 @@ function DisplayControls(props: Props) {
               {prefix} Y-Axis
             </div>
             {yAxis.series.map((s, i) => (
-              <>
-                <DisplayYAxisSeries
-                  series={s}
-                  dataframe={props.dataframe}
-                  isEditable={props.isEditable}
-                  yIndex={yI}
-                  result={props.result}
-                  onChangeSeries={props.onChangeSeries}
-                />
-                {i < yAxis.series.length - 1 && (
-                  <div className="w-full bg-gray-400 my-4 border-1 border-b border-dashed" />
-                )}
-              </>
+              <DisplayYAxisSeries
+                index={i}
+                series={s}
+                dataframe={props.dataframe}
+                isEditable={props.isEditable}
+                yIndex={yI}
+                result={props.result}
+                onChangeSeries={props.onChangeSeries}
+              />
             ))}
           </div>
         )