Merge branch 'main' into collect-message-async

extension/package.json

@@ -1728,18 +1728,18 @@
     "@types/vega": "3.2.0",
     "@types/vscode": "1.64.0",
     "@vscode/test-electron": "2.3.3",
-    "@vscode/vsce": "2.19.0",
-    "@wdio/cli": "8.13.12",
-    "@wdio/local-runner": "8.13.12",
-    "@wdio/mocha-framework": "8.12.1",
+    "@vscode/vsce": "2.20.0",
+    "@wdio/cli": "8.13.13",
+    "@wdio/local-runner": "8.13.13",
+    "@wdio/mocha-framework": "8.13.13",
     "@wdio/spec-reporter": "8.12.2",
     "chai": "4.3.7",
     "chai-as-promised": "7.1.1",
     "clean-webpack-plugin": "4.0.0",
     "copy-webpack-plugin": "11.0.0",
     "fork-ts-checker-webpack-plugin": "8.0.0",
-    "jest": "29.6.1",
-    "jest-environment-node": "29.6.1",
+    "jest": "29.6.2",
+    "jest-environment-node": "29.6.2",
     "lint-staged": "13.2.3",
     "mocha": "10.2.0",
     "mock-require": "3.0.3",
@@ -1749,7 +1749,7 @@
     "ts-loader": "9.4.4",
     "vscode-uri": "3.0.7",
     "wdio-vscode-service": "5.2.1",
-    "webdriverio": "8.13.12",
+    "webdriverio": "8.13.13",
     "webpack": "5.88.2",
     "webpack-cli": "5.1.4"
   },

extension/src/plots/paths/collect.ts

@@ -51,19 +51,10 @@ const collectType = (plots: Plot[]) => {
       ? type.add(PathType.TEMPLATE_MULTI)
       : type.add(PathType.TEMPLATE_SINGLE)
   }
-
   return type
 }
 
-const getType = (
-  data: PlotsData,
-  hasChildren: boolean,
-  path: string
-): Set<PathType> | undefined => {
-  if (hasChildren) {
-    return
-  }
-
+const getType = (data: PlotsData, path: string): Set<PathType> | undefined => {
   const plots = data[path]
   if (!definedAndNonEmpty(plots)) {
     return
@@ -118,6 +109,46 @@ const collectPathRevisions = (data: PlotsData, path: string): Set<string> => {
   return revisions
 }
 
+const collectPlotPathType = (
+  plotPath: PlotPath,
+  data: PlotsData,
+  hasChildren: boolean,
+  path: string
+) => {
+  if (hasChildren) {
+    return
+  }
+
+  const type = getType(data, path)
+
+  if (type) {
+    plotPath.type = type
+  }
+}
+
+const updateExistingPlotPath = (
+  acc: PlotPath[],
+  data: PlotsData,
+  hasChildren: boolean,
+  revisions: Set<string>,
+  path: string
+) =>
+  acc.map(existing => {
+    const plotPath = { ...existing }
+
+    if (existing.path !== path) {
+      return plotPath
+    }
+
+    plotPath.revisions = new Set([...existing.revisions, ...revisions])
+
+    if (!plotPath.type) {
+      collectPlotPathType(plotPath, data, hasChildren, path)
+    }
+
+    return plotPath
+  })
+
 const collectOrderedPath = (
   acc: PlotPath[],
   data: PlotsData,
@@ -126,31 +157,20 @@ const collectOrderedPath = (
   idx: number
 ): PlotPath[] => {
   const path = getPath(pathArray, idx)
+  const hasChildren = idx !== pathArray.length
 
   if (acc.some(({ path: existingPath }) => existingPath === path)) {
-    return acc.map(existing =>
-      existing.path === path
-        ? {
-            ...existing,
-            revisions: new Set([...existing.revisions, ...revisions])
-          }
-        : existing
-    )
+    return updateExistingPlotPath(acc, data, hasChildren, revisions, path)
   }
 
-  const hasChildren = idx !== pathArray.length
-
   const plotPath: PlotPath = {
     hasChildren,
     parentPath: getParent(pathArray, idx),
     path,
     revisions
   }
 
-  const type = getType(data, hasChildren, path)
-  if (type) {
-    plotPath.type = type
-  }
+  collectPlotPathType(plotPath, data, hasChildren, path)
 
   acc.push(plotPath)
   return acc
@@ -228,7 +248,6 @@ export const collectPaths = (
   if (errors?.length) {
     acc = collectErrorPaths(acc, data, errors)
   }
-
   return acc
 }
 

languageServer/package.json

@@ -33,9 +33,9 @@
     "fork-ts-checker-webpack-plugin": "8.0.0",
     "ts-loader": "9.4.4",
     "lint-staged": "13.2.3",
-    "jest": "29.6.1",
+    "jest": "29.6.2",
     "webpack": "5.88.2",
     "webpack-cli": "5.1.4",
-    "jest-environment-node": "29.6.1"
+    "jest-environment-node": "29.6.2"
   }
 }

package.json

@@ -38,7 +38,7 @@
     "@typescript-eslint/parser": "6.2.0",
     "@vscode/codicons": "0.0.33",
     "eslint": "8.45.0",
-    "eslint-config-prettier": "8.8.0",
+    "eslint-config-prettier": "8.9.0",
     "eslint-config-prettier-standard": "4.0.1",
     "eslint-config-standard": "17.1.0",
     "eslint-plugin-check-file": "2.5.0",
@@ -57,7 +57,7 @@
     "eslint-plugin-testing-library": "5.11.0",
     "eslint-plugin-unicorn": "48.0.1",
     "husky": "8.0.3",
-    "jest": "29.6.1",
+    "jest": "29.6.2",
     "lint-staged": "13.2.3",
     "npm-run-all": "4.1.5",
     "nyc": "15.1.0",

webview/package.json

@@ -69,9 +69,9 @@
     "file-loader": "6.2.0",
     "fork-ts-checker-webpack-plugin": "8.0.0",
     "identity-obj-proxy": "3.0.0",
-    "jest": "29.6.1",
+    "jest": "29.6.2",
     "jest-canvas-mock": "2.5.2",
-    "jest-environment-jsdom": "29.6.1",
+    "jest-environment-jsdom": "29.6.2",
     "lint-staged": "13.2.3",
     "raw-loader": "4.0.2",
     "sass": "1.64.1",

webview/src/experiments/components/table/Table.test.tsx

@@ -15,7 +15,7 @@ import React from 'react'
 import tableDataFixture from 'dvc/src/test/fixtures/expShow/base/tableData'
 import { EXPERIMENT_WORKSPACE_ID } from 'dvc/src/cli/dvc/contract'
 import styles from './styles.module.scss'
-import { SortOrder } from './header/ContextMenuContent'
+import { SortOrder } from './header/util'
 import { ExperimentsTable } from '../Experiments'
 import { vsCodeApi } from '../../../shared/api'
 import {

webview/src/experiments/components/table/header/ContextMenuContent.tsx

@@ -1,35 +1,21 @@
 import { ColumnType, Experiment } from 'dvc/src/experiments/webview/contract'
 import { MessageFromWebviewType } from 'dvc/src/webview/contract'
-import { VSCodeDivider } from '@vscode/webview-ui-toolkit/react'
 import React, { useMemo } from 'react'
 import { Header } from '@tanstack/react-table'
 import { useSelector } from 'react-redux'
 import { SortDefinition } from 'dvc/src/experiments/model/sortBy'
+import { SortOrder, getSortDetails, isFromExperimentColumn } from './util'
 import { MessagesMenu } from '../../../../shared/components/messagesMenu/MessagesMenu'
 import { MessagesMenuOptionProps } from '../../../../shared/components/messagesMenu/MessagesMenuOption'
 import { ExperimentsState } from '../../../store'
 import { ColumnWithGroup } from '../../../util/buildColumns'
 
-export enum SortOrder {
-  ASCENDING = 'Sort Ascending',
-  DESCENDING = 'Sort Descending',
-  NONE = 'Remove Sort'
-}
-
-const possibleOrders = {
-  false: SortOrder.ASCENDING,
-  true: SortOrder.DESCENDING,
-  undefined: SortOrder.NONE
-} as const
-
-const isFromExperimentColumn = (header: Header<Experiment, unknown>) =>
-  header.column.id === 'id' || header.column.id.startsWith('id_placeholder')
-
 const sortOption = (
   label: SortOrder,
   currentSort: SortOrder,
   columnId: string,
-  isSortable: boolean
+  isSortable: boolean,
+  divider?: boolean
 ) => {
   const sortOrder = currentSort
   const disabled = !isSortable || sortOrder === label
@@ -53,6 +39,7 @@ const sortOption = (
 
   return {
     disabled,
+    divider,
     id: label,
     label,
     message
@@ -63,36 +50,14 @@ interface HeaderMenuProps {
   header: Header<Experiment, unknown>
 }
 
-const getSortOptions = (
-  header: Header<Experiment, unknown>,
-  sorts: SortDefinition[]
-) => {
-  const isNotExperiments = !isFromExperimentColumn(header)
-  const isSortable = isNotExperiments && header.column.columns.length <= 1
-  const baseColumn =
-    header.headerGroup.headers.find(
-      h => h.column.id === header.placeholderId
-    ) || header.column
-  const sort = sorts.find(sort => sort.path === baseColumn.id)
-
-  // eslint-disable-next-line @typescript-eslint/restrict-template-expressions
-  const sortOrder: SortOrder = possibleOrders[`${sort?.descending}`]
-
-  const sortOptions = [
-    sortOption(SortOrder.ASCENDING, sortOrder, baseColumn.id, isSortable),
-    sortOption(SortOrder.DESCENDING, sortOrder, baseColumn.id, isSortable),
-    sortOption(SortOrder.NONE, sortOrder, baseColumn.id, isSortable)
-  ]
-
-  return { isSortable, sortOptions, sortOrder }
-}
-
-export const getMenuOptions = (
+const getMenuOptions = (
   header: Header<Experiment, unknown>,
   sorts: SortDefinition[]
-) => {
+): MessagesMenuOptionProps[] => {
   const leafColumn = header.column
-  const menuOptions: MessagesMenuOptionProps[] = [
+  const { id, isSortable, sortOrder } = getSortDetails(header, sorts)
+
+  return [
     {
       disabled: isFromExperimentColumn(header),
       id: 'hide',
@@ -143,30 +108,19 @@ export const getMenuOptions = (
       message: {
         type: MessageFromWebviewType.SELECT_FIRST_COLUMNS
       }
-    }
+    },
+    sortOption(SortOrder.ASCENDING, sortOrder, id, isSortable, true),
+    sortOption(SortOrder.DESCENDING, sortOrder, id, isSortable),
+    sortOption(SortOrder.NONE, sortOrder, id, isSortable)
   ]
-
-  const { isSortable, sortOptions, sortOrder } = getSortOptions(header, sorts)
-
-  return { isSortable, menuOptions, sortOptions, sortOrder }
 }
 
 export const ContextMenuContent: React.FC<HeaderMenuProps> = ({ header }) => {
   const { sorts } = useSelector((state: ExperimentsState) => state.tableData)
 
-  const { menuOptions, sortOptions } = useMemo(() => {
+  const menuOptions = useMemo(() => {
     return getMenuOptions(header, sorts)
   }, [header, sorts])
 
-  return (
-    <div>
-      <MessagesMenu options={menuOptions} />
-      {sortOptions.length > 0 && (
-        <>
-          <VSCodeDivider />
-          <MessagesMenu options={sortOptions} />
-        </>
-      )}
-    </div>
-  )
+  return <MessagesMenu options={menuOptions} />
 }

webview/src/experiments/components/table/header/MergeHeaderGroups.tsx

@@ -2,7 +2,7 @@ import React from 'react'
 import cx from 'classnames'
 import { Experiment } from 'dvc/src/experiments/webview/contract'
 import { HeaderGroup, Header } from '@tanstack/react-table'
-import { TableHeader } from './TableHeader'
+import { TableHeaderCell } from './TableHeaderCell'
 import styles from '../styles.module.scss'
 import { DragFunction } from '../../../../shared/components/dragDrop/Draggable'
 
@@ -30,7 +30,7 @@ export const MergedHeaderGroups: React.FC<{
   return (
     <tr className={cx(styles.experimentsTr, styles.headRow)}>
       {headerGroup.headers.map((header: Header<Experiment, unknown>) => (
-        <TableHeader
+        <TableHeaderCell
           setExpColumnNeedsShadow={setExpColumnNeedsShadow}
           key={header.id}
           header={header}