typo

Author: mykalmax

web/common/src/components/Lineage/LineageContext.ts

@@ -9,7 +9,7 @@ import {
   type LineageNodesMap,
   type NodeId,
   type PortId,
-  ZOOM_TRESHOLD,
+  ZOOM_THRESHOLD,
 } from './utils'
 
 export interface LineageContextValue<
@@ -52,22 +52,22 @@ export function getInitial<
 >() {
   return {
     showOnlySelectedNodes: false,
-    setShowOnlySelectedNodes: () => {},
+    setShowOnlySelectedNodes: () => { },
     selectedNodes: new Set<TNodeID>(),
-    setSelectedNodes: () => {},
+    setSelectedNodes: () => { },
     selectedEdges: new Set<TEdgeID>(),
-    setSelectedEdges: () => {},
+    setSelectedEdges: () => { },
     selectedNodeId: null,
-    setSelectedNodeId: () => {},
-    zoom: ZOOM_TRESHOLD,
-    setZoom: () => {},
+    setSelectedNodeId: () => { },
+    zoom: ZOOM_THRESHOLD,
+    setZoom: () => { },
     edges: [],
-    setEdges: () => {},
+    setEdges: () => { },
     nodes: [],
     nodesMap: {},
-    setNodesMap: () => {},
+    setNodesMap: () => { },
     isBuildingLayout: false,
-    setIsBuildingLayout: () => {},
+    setIsBuildingLayout: () => { },
     currentNode: null,
   }
 }

web/common/src/components/Lineage/LineageLayout.tsx

@@ -36,7 +36,7 @@ import {
   NODES_TRESHOLD_ZOOM,
   type NodeId,
   type EdgeId,
-  ZOOM_TRESHOLD,
+  ZOOM_THRESHOLD,
   type PortId,
 } from './utils'
 import { VerticalContainer } from '../VerticalContainer/VerticalContainer'
@@ -69,8 +69,8 @@ export function LineageLayout<
   edgeTypes?: EdgeTypes
   className?: string
   controls?:
-    | React.ReactNode
-    | (({ setCenter }: { setCenter: SetCenter }) => React.ReactNode)
+  | React.ReactNode
+  | (({ setCenter }: { setCenter: SetCenter }) => React.ReactNode)
   onNodeClick?: (
     event: React.MouseEvent<Element, MouseEvent>,
     node: LineageNode<TNodeData, TNodeID>,
@@ -292,7 +292,7 @@ export function LineageLayout<
         onNodeClick={onNodeClick}
         onNodeDoubleClick={onNodeDoubleClick}
       >
-        {zoom > ZOOM_TRESHOLD && (
+        {zoom > ZOOM_THRESHOLD && (
           <Background
             id="1"
             gap={10}

web/common/src/components/Lineage/stories/ModelLineage.tsx

@@ -38,7 +38,7 @@ import {
   cleanupLayoutWorker,
   getLayoutedGraph as getDagreLayoutedGraph,
 } from '../layout/dagreLayout'
-import { type LineageEdge, type LineageNodesMap, ZOOM_TRESHOLD } from '../utils'
+import { type LineageEdge, type LineageNodesMap, ZOOM_THRESHOLD } from '../utils'
 import {
   type EdgeData,
   ModelLineageContext,
@@ -75,7 +75,7 @@ export const ModelLineage = ({
   selectedModelName?: ModelName
   className?: string
 }) => {
-  const [zoom, setZoom] = React.useState(ZOOM_TRESHOLD)
+  const [zoom, setZoom] = React.useState(ZOOM_THRESHOLD)
   const [isBuildingLayout, setIsBuildingLayout] = React.useState(false)
   const [edges, setEdges] = React.useState<
     LineageEdge<EdgeData, ModelNodeId, ModelEdgeId, ModelColumnID>[]
@@ -252,12 +252,12 @@ export const ModelLineage = ({
     return edgesColumnLevel.length > 0
       ? edgesColumnLevel
       : getTransformedModelEdges<
-          ModelName,
-          EdgeData,
-          ModelNodeId,
-          ModelEdgeId,
-          ModelColumnID
-        >(adjacencyListKeys, adjacencyList, transformEdge)
+        ModelName,
+        EdgeData,
+        ModelNodeId,
+        ModelEdgeId,
+        ModelColumnID
+      >(adjacencyListKeys, adjacencyList, transformEdge)
   }, [adjacencyListKeys, adjacencyList, transformEdge, edgesColumnLevel])
 
   const calculateLayout = React.useMemo(() => {

web/common/src/components/Lineage/stories/ModelNode.tsx

@@ -23,7 +23,7 @@ import { NodeHandles } from '../node/NodeHandles'
 import { NodeHeader } from '../node/NodeHeader'
 import { NodePorts } from '../node/NodePorts'
 import { useNodeMetadata } from '../node/useNodeMetadata'
-import { ZOOM_TRESHOLD } from '../utils'
+import { ZOOM_THRESHOLD } from '../utils'
 import {
   type ModelName as ModelNameType,
   type ColumnName,
@@ -107,25 +107,25 @@ export const ModelNode = React.memo(function ModelNode({
     includeFloorHeight: false,
   })
   const nodeDetailsHeight =
-    zoom > ZOOM_TRESHOLD
+    zoom > ZOOM_THRESHOLD
       ? calculateNodeDetailsHeight({
-          nodeDetailsCount: 0,
-        })
+        nodeDetailsCount: 0,
+      })
       : 0
   const selectedColumnsHeight = calculateSelectedColumnsHeight(
     modelSelectedColumns.length,
   )
   const columnsHeight =
-    zoom > ZOOM_TRESHOLD && shouldShowColumns
+    zoom > ZOOM_THRESHOLD && shouldShowColumns
       ? calculateColumnsHeight({
-          columnsCount: calculateNodeColumnsCount(columns.length),
-          hasColumnsFilter,
-        })
+        columnsCount: calculateNodeColumnsCount(columns.length),
+        hasColumnsFilter,
+      })
       : 0
 
-  // If zoom is less than ZOOM_TRESHOLD, we are making node looks bigger
+  // If zoom is less than ZOOM_THRESHOLD, we are making node looks bigger
   const nodeHeight =
-    (zoom > ZOOM_TRESHOLD ? nodeBaseHeight : nodeBaseHeight * 2) +
+    (zoom > ZOOM_THRESHOLD ? nodeBaseHeight : nodeBaseHeight * 2) +
     nodeDetailsHeight +
     selectedColumnsHeight +
     columnsHeight
@@ -149,7 +149,7 @@ export const ModelNode = React.memo(function ModelNode({
         className="bg-lineage-node-appendix-background"
       >
         <HorizontalContainer className="gap-1 items-center overflow-visible h-5">
-          {zoom > ZOOM_TRESHOLD && (
+          {zoom > ZOOM_THRESHOLD && (
             <>
               <NodeBadge>{data.kind.toUpperCase()}</NodeBadge>
               <Tooltip
@@ -189,7 +189,7 @@ export const ModelNode = React.memo(function ModelNode({
         )}
       >
         <NodeHeader
-          className={cn(zoom > ZOOM_TRESHOLD ? 'shrink-0 h-7' : 'h-full')}
+          className={cn(zoom > ZOOM_THRESHOLD ? 'shrink-0 h-7' : 'h-full')}
           onClick={toggleSelectedNode}
         >
           <NodeHandles
@@ -224,14 +224,14 @@ export const ModelNode = React.memo(function ModelNode({
               <ModelName
                 showTooltip
                 hideCatalog
-                hideSchema={zoom <= ZOOM_TRESHOLD}
+                hideSchema={zoom <= ZOOM_THRESHOLD}
                 hideIcon
                 showCopy
                 name={data.displayName}
                 grayscale
                 className={cn(
                   'w-full overflow-hidden cursor-default truncate',
-                  zoom > ZOOM_TRESHOLD ? ' text-xs' : 'text-2xl justify-center',
+                  zoom > ZOOM_THRESHOLD ? ' text-xs' : 'text-2xl justify-center',
                 )}
               />
             </HorizontalContainer>
@@ -265,7 +265,7 @@ export const ModelNode = React.memo(function ModelNode({
                 ))}
               </VerticalContainer>
             )}
-            {columns.length > 0 && zoom > ZOOM_TRESHOLD && (
+            {columns.length > 0 && zoom > ZOOM_THRESHOLD && (
               <NodePorts<ModelColumn>
                 ports={columns}
                 estimatedListItemHeight={24}
@@ -309,11 +309,11 @@ export const ModelNode = React.memo(function ModelNode({
         <HorizontalContainer
           className={cn(
             'gap-1 items-center overflow-visible',
-            zoom > ZOOM_TRESHOLD ? 'h-5' : 'h-8',
+            zoom > ZOOM_THRESHOLD ? 'h-5' : 'h-8',
           )}
         >
           <Badge
-            size={zoom > ZOOM_TRESHOLD ? '2xs' : 'm'}
+            size={zoom > ZOOM_THRESHOLD ? '2xs' : 'm'}
             className={cn(
               'text-[white] font-black',
               getNodeTypeColor(modelType),

web/common/src/components/Lineage/utils.ts

@@ -58,7 +58,7 @@ export const DEFAULT_NODE_WIDTH = 300
 export const DEFAULT_ZOOM = 0.85
 export const MIN_ZOOM = 0.01
 export const MAX_ZOOM = 1.75
-export const ZOOM_TRESHOLD = 0.75
+export const ZOOM_THRESHOLD = 0.75
 export const NODES_TRESHOLD = 200
 export const NODES_TRESHOLD_ZOOM = 0.1