Fix typo (#3426)

extension/src/plots/model/index.test.ts

@@ -1,6 +1,6 @@
 import { PlotsModel } from '.'
 import {
-  DEFAULT_NB_ITEMS_PER_REOW,
+  DEFAULT_NB_ITEMS_PER_ROW,
   DEFAULT_SECTION_COLLAPSED,
   DEFAULT_SECTION_NB_ITEMS_PER_ROW,
   Section
@@ -69,7 +69,7 @@ describe('plotsModel', () => {
 
   it('should change the plotSize when calling setPlotSize', () => {
     expect(model.getNbItemsPerRow(Section.CHECKPOINT_PLOTS)).toStrictEqual(
-      DEFAULT_NB_ITEMS_PER_REOW
+      DEFAULT_NB_ITEMS_PER_ROW
     )
 
     model.setNbItemsPerRow(Section.CHECKPOINT_PLOTS, 1)

extension/src/plots/model/index.ts

@@ -28,7 +28,7 @@ import {
   SectionCollapsed,
   CustomPlotData,
   DEFAULT_HEIGHT,
-  DEFAULT_NB_ITEMS_PER_REOW
+  DEFAULT_NB_ITEMS_PER_ROW
 } from '../webview/contract'
 import {
   ExperimentsOutput,
@@ -411,7 +411,7 @@ export class PlotsModel extends ModelWithPersistence {
     if (this.nbItemsPerRow[section]) {
       return this.nbItemsPerRow[section]
     }
-    return DEFAULT_NB_ITEMS_PER_REOW
+    return DEFAULT_NB_ITEMS_PER_ROW
   }
 
   public setHeight(section: Section, height: number | undefined) {

extension/src/plots/vega/util.test.ts

@@ -19,7 +19,7 @@ import smoothTemplate from '../../test/fixtures/plotsDiff/templates/smooth'
 import multiSourceTemplate from '../../test/fixtures/plotsDiff/templates/multiSource'
 import { copyOriginalColors } from '../../experiments/model/status/colors'
 import { EXPERIMENT_WORKSPACE_ID } from '../../cli/dvc/contract'
-import { DEFAULT_NB_ITEMS_PER_REOW } from '../webview/contract'
+import { DEFAULT_NB_ITEMS_PER_ROW } from '../webview/contract'
 
 describe('isMultiViewPlot', () => {
   it('should recognize the confusion matrix template as a multi view plot', () => {
@@ -86,7 +86,7 @@ describe('extendVegaSpec', () => {
   it('should not add encoding if no color scale is provided', () => {
     const extendedSpec = extendVegaSpec(
       linearTemplate,
-      DEFAULT_NB_ITEMS_PER_REOW
+      DEFAULT_NB_ITEMS_PER_ROW
     )
     expect(extendedSpec.encoding).toBeUndefined()
   })
@@ -98,7 +98,7 @@ describe('extendVegaSpec', () => {
     }
     const extendedSpec = extendVegaSpec(
       linearTemplate,
-      DEFAULT_NB_ITEMS_PER_REOW,
+      DEFAULT_NB_ITEMS_PER_ROW,
       {
         color: colorScale
       }
@@ -169,7 +169,7 @@ describe('extendVegaSpec', () => {
 
   it('should truncate all titles from the left to 50 characters for regular plots', () => {
     const spec = withLongTemplatePlotTitle()
-    const updatedSpec = extendVegaSpec(spec, DEFAULT_NB_ITEMS_PER_REOW)
+    const updatedSpec = extendVegaSpec(spec, DEFAULT_NB_ITEMS_PER_ROW)
 
     const truncatedTitle = '…-many-many-characters-at-least-seventy-characters'
     const truncatedHorizontalTitle =

extension/src/plots/vega/util.ts

@@ -26,7 +26,7 @@ import {
 } from 'vega-lite/build/src/spec/repeat'
 import { TopLevelUnitSpec } from 'vega-lite/build/src/spec/unit'
 import isEqual from 'lodash.isequal'
-import { ColorScale, DEFAULT_NB_ITEMS_PER_REOW } from '../webview/contract'
+import { ColorScale, DEFAULT_NB_ITEMS_PER_ROW } from '../webview/contract'
 import { ShapeEncoding, StrokeDashEncoding } from '../multiSource/constants'
 import { Color } from '../../experiments/model/status/colors'
 
@@ -282,7 +282,7 @@ export const truncateTitles = (
         const title = value as unknown as Title
         specCopy[key] = vertical
           ? truncateVerticalTitle(title, size)
-          : truncateTitle(title, size > DEFAULT_NB_ITEMS_PER_REOW ? 30 : 50)
+          : truncateTitle(title, size > DEFAULT_NB_ITEMS_PER_ROW ? 30 : 50)
       } else if (isEndValue(valueType)) {
         specCopy[key] = value
       } else if (Array.isArray(value)) {

extension/src/plots/webview/contract.ts

@@ -1,7 +1,7 @@
 import { VisualizationSpec } from 'react-vega'
 import { Color } from '../../experiments/model/status/colors'
 
-export const DEFAULT_NB_ITEMS_PER_REOW = 2
+export const DEFAULT_NB_ITEMS_PER_ROW = 2
 
 export enum Section {
   CHECKPOINT_PLOTS = 'checkpoint-plots',
@@ -11,10 +11,10 @@ export enum Section {
 }
 
 export const DEFAULT_SECTION_NB_ITEMS_PER_ROW = {
-  [Section.CHECKPOINT_PLOTS]: DEFAULT_NB_ITEMS_PER_REOW,
-  [Section.TEMPLATE_PLOTS]: DEFAULT_NB_ITEMS_PER_REOW,
-  [Section.COMPARISON_TABLE]: DEFAULT_NB_ITEMS_PER_REOW,
-  [Section.CUSTOM_PLOTS]: DEFAULT_NB_ITEMS_PER_REOW
+  [Section.CHECKPOINT_PLOTS]: DEFAULT_NB_ITEMS_PER_ROW,
+  [Section.TEMPLATE_PLOTS]: DEFAULT_NB_ITEMS_PER_ROW,
+  [Section.COMPARISON_TABLE]: DEFAULT_NB_ITEMS_PER_ROW,
+  [Section.CUSTOM_PLOTS]: DEFAULT_NB_ITEMS_PER_ROW
 }
 
 // Height is undefined by default because it is calculated by ratio of the width it'll fill (calculated by the webview)

extension/src/test/fixtures/expShow/base/checkpointPlots.ts

@@ -1,7 +1,7 @@
 import { copyOriginalColors } from '../../../../experiments/model/status/colors'
 import {
   CheckpointPlotsData,
-  DEFAULT_NB_ITEMS_PER_REOW
+  DEFAULT_NB_ITEMS_PER_ROW
 } from '../../../../plots/webview/contract'
 
 const colors = copyOriginalColors()
@@ -91,7 +91,7 @@ const data: CheckpointPlotsData = {
     'summary.json:val_loss',
     'summary.json:val_accuracy'
   ],
-  nbItemsPerRow: DEFAULT_NB_ITEMS_PER_REOW,
+  nbItemsPerRow: DEFAULT_NB_ITEMS_PER_ROW,
   height: undefined
 }
 

extension/src/test/fixtures/expShow/base/customPlots.ts

@@ -1,6 +1,6 @@
 import {
   CustomPlotsData,
-  DEFAULT_NB_ITEMS_PER_REOW
+  DEFAULT_NB_ITEMS_PER_ROW
 } from '../../../../plots/webview/contract'
 
 const data: CustomPlotsData = {
@@ -50,7 +50,7 @@ const data: CustomPlotsData = {
       ]
     }
   ],
-  nbItemsPerRow: DEFAULT_NB_ITEMS_PER_REOW,
+  nbItemsPerRow: DEFAULT_NB_ITEMS_PER_ROW,
   height: undefined
 }
 

extension/src/test/fixtures/plotsDiff/index.ts

@@ -13,7 +13,7 @@ import {
   TemplatePlots,
   Revision,
   PlotsComparisonData,
-  DEFAULT_NB_ITEMS_PER_REOW
+  DEFAULT_NB_ITEMS_PER_ROW
 } from '../../../plots/webview/contract'
 import { join } from '../../util/path'
 import { copyOriginalColors } from '../../../experiments/model/status/colors'
@@ -499,7 +499,7 @@ const extendedSpecs = (plotsOutput: TemplatePlots): TemplatePlotSection[] => {
                 ) || []
             }
           } as TopLevelSpec,
-          DEFAULT_NB_ITEMS_PER_REOW,
+          DEFAULT_NB_ITEMS_PER_ROW,
           {
             color: {
               domain: expectedRevisions,
@@ -659,14 +659,14 @@ export const getRevisions = (): Revision[] => {
 
 export const getMinimalWebviewMessage = () => ({
   plots: extendedSpecs(basicVega),
-  nbItemsPerRow: DEFAULT_NB_ITEMS_PER_REOW,
+  nbItemsPerRow: DEFAULT_NB_ITEMS_PER_ROW,
   height: undefined,
   revisions: getRevisions()
 })
 
 export const getTemplateWebviewMessage = (): TemplatePlotsData => ({
   plots: extendedSpecs({ ...basicVega, ...require('./vega').default }),
-  nbItemsPerRow: DEFAULT_NB_ITEMS_PER_REOW,
+  nbItemsPerRow: DEFAULT_NB_ITEMS_PER_ROW,
   height: undefined
 })
 
@@ -676,7 +676,7 @@ export const getManyTemplatePlotsWebviewMessage = (
   plots: extendedSpecs({
     ...multipleVega(length)
   }),
-  nbItemsPerRow: DEFAULT_NB_ITEMS_PER_REOW,
+  nbItemsPerRow: DEFAULT_NB_ITEMS_PER_ROW,
   height: undefined
 })
 
@@ -703,7 +703,7 @@ export const getComparisonWebviewMessage = (
   return {
     revisions: getRevisions(),
     plots: plotAcc,
-    nbItemsPerRow: DEFAULT_NB_ITEMS_PER_REOW,
+    nbItemsPerRow: DEFAULT_NB_ITEMS_PER_ROW,
     height: undefined
   }
 }

extension/src/test/suite/experiments/index.test.ts

@@ -81,7 +81,7 @@ import * as ProcessExecution from '../../../process/execution'
 import { DvcReader } from '../../../cli/dvc/reader'
 import { Connect } from '../../../connect'
 import { DvcViewer } from '../../../cli/dvc/viewer'
-import { DEFAULT_NB_ITEMS_PER_REOW } from '../../../plots/webview/contract'
+import { DEFAULT_NB_ITEMS_PER_ROW } from '../../../plots/webview/contract'
 
 const { openFileInEditor } = FileSystem
 
@@ -339,7 +339,7 @@ suite('Experiments Test Suite', () => {
       ).returns(undefined)
 
       const mockColumnId = 'params:params.yaml:lr'
-      const mockWidth = DEFAULT_NB_ITEMS_PER_REOW
+      const mockWidth = DEFAULT_NB_ITEMS_PER_ROW
 
       mockMessageReceived.fire({
         payload: { id: mockColumnId, width: mockWidth },

webview/src/plots/components/App.test.tsx

@@ -28,7 +28,7 @@ import {
   Section,
   TemplatePlotGroup,
   TemplatePlotsData,
-  DEFAULT_NB_ITEMS_PER_REOW
+  DEFAULT_NB_ITEMS_PER_ROW
 } from 'dvc/src/plots/webview/contract'
 import {
   MessageFromWebviewType,
@@ -263,7 +263,7 @@ describe('App', () => {
       checkpoint: null,
       comparison: {
         height: undefined,
-        nbItemsPerRow: DEFAULT_NB_ITEMS_PER_REOW,
+        nbItemsPerRow: DEFAULT_NB_ITEMS_PER_ROW,
         plots: [
           {
             path: 'training/plots/images/misclassified.jpg',
@@ -1673,7 +1673,7 @@ describe('App', () => {
       it('should  wrap the checkpoint plots in a big grid (virtualize them) when there are more than fourteen regular plots', async () => {
         await renderAppAndChangeSize(
           { checkpoint: createCheckpointPlots(15) },
-          DEFAULT_NB_ITEMS_PER_REOW,
+          DEFAULT_NB_ITEMS_PER_ROW,
           Section.CHECKPOINT_PLOTS
         )
 
@@ -1683,7 +1683,7 @@ describe('App', () => {
       it('should not wrap the checkpoint plots in a big grid (virtualize them) when there are fourteen regular plots', async () => {
         await renderAppAndChangeSize(
           { checkpoint: createCheckpointPlots(14) },
-          DEFAULT_NB_ITEMS_PER_REOW,
+          DEFAULT_NB_ITEMS_PER_ROW,
           Section.CHECKPOINT_PLOTS
         )
 
@@ -1693,7 +1693,7 @@ describe('App', () => {
       it('should  wrap the template plots in a big grid (virtualize them) when there are more than fourteen regular plots', async () => {
         await renderAppAndChangeSize(
           { template: manyTemplatePlots(15) },
-          DEFAULT_NB_ITEMS_PER_REOW,
+          DEFAULT_NB_ITEMS_PER_ROW,
           Section.TEMPLATE_PLOTS
         )
 
@@ -1703,7 +1703,7 @@ describe('App', () => {
       it('should not wrap the template plots in a big grid (virtualize them) when there are fourteen or fewer regular plots', async () => {
         await renderAppAndChangeSize(
           { template: manyTemplatePlots(14) },
-          DEFAULT_NB_ITEMS_PER_REOW,
+          DEFAULT_NB_ITEMS_PER_ROW,
           Section.TEMPLATE_PLOTS
         )
 
@@ -1717,7 +1717,7 @@ describe('App', () => {
         beforeEach(async () => {
           store = await renderAppAndChangeSize(
             { checkpoint },
-            DEFAULT_NB_ITEMS_PER_REOW,
+            DEFAULT_NB_ITEMS_PER_ROW,
             Section.CHECKPOINT_PLOTS
           )
         })

webview/src/shared/components/virtualizedGrid/VirtualizedGrid.tsx

@@ -1,4 +1,4 @@
-import { DEFAULT_NB_ITEMS_PER_REOW } from 'dvc/src/plots/webview/contract'
+import { DEFAULT_NB_ITEMS_PER_ROW } from 'dvc/src/plots/webview/contract'
 import React, { useRef } from 'react'
 import {
   AutoSizer,
@@ -18,7 +18,7 @@ export const OVERSCAN_ROW_COUNT = 15
 
 export const VirtualizedGrid: React.FC<VirtualizedGridProps> = ({
   items,
-  nbItemsPerRow = DEFAULT_NB_ITEMS_PER_REOW
+  nbItemsPerRow = DEFAULT_NB_ITEMS_PER_ROW
 }) => {
   const cache = useRef(
     new CellMeasurerCache({

webview/src/stories/ComparisonTable.stories.tsx

@@ -6,7 +6,7 @@ import React from 'react'
 import { Provider, useDispatch } from 'react-redux'
 import {
   ComparisonRevisionData,
-  DEFAULT_NB_ITEMS_PER_REOW,
+  DEFAULT_NB_ITEMS_PER_ROW,
   PlotsComparisonData
 } from 'dvc/src/plots/webview/contract'
 import comparisonTableFixture from 'dvc/src/test/fixtures/plotsDiff/comparison'
@@ -44,7 +44,7 @@ const Template: Story = ({ plots, revisions }) => {
       <MockedState
         data={{
           height: undefined,
-          nbItemsPerRow: DEFAULT_NB_ITEMS_PER_REOW,
+          nbItemsPerRow: DEFAULT_NB_ITEMS_PER_ROW,
           plots,
           revisions
         }}

webview/src/stories/Plots.stories.tsx

@@ -8,7 +8,7 @@ import {
   DEFAULT_SECTION_COLLAPSED,
   TemplatePlotGroup,
   TemplatePlotSection,
-  DEFAULT_NB_ITEMS_PER_REOW
+  DEFAULT_NB_ITEMS_PER_ROW
 } from 'dvc/src/plots/webview/contract'
 import { MessageToWebviewType } from 'dvc/src/webview/contract'
 import checkpointPlotsFixture from 'dvc/src/test/fixtures/expShow/base/checkpointPlots'
@@ -40,10 +40,7 @@ const smallCheckpointPlotsFixture = {
   }))
 }
 
-const manyCheckpointPlots = (
-  length: number,
-  size = DEFAULT_NB_ITEMS_PER_REOW
-) =>
+const manyCheckpointPlots = (length: number, size = DEFAULT_NB_ITEMS_PER_ROW) =>
   Array.from({ length }, () => checkpointPlotsFixture.plots[0]).map(
     (plot, i) => {
       const id = plot.id + i.toString()
@@ -140,7 +137,7 @@ WithTemplateOnly.args = {
     selectedRevisions: plotsRevisionsFixture,
     template: {
       ...templatePlotsFixture,
-      nbItemsPerRow: DEFAULT_NB_ITEMS_PER_REOW
+      nbItemsPerRow: DEFAULT_NB_ITEMS_PER_ROW
     }
   }
 }