diff --git a/src/vs/workbench/browser/positronDataGrid/components/dataGridColumnHeader.tsx b/src/vs/workbench/browser/positronDataGrid/components/dataGridColumnHeader.tsx index efa5e69de73..d74e6aad8e3 100644 --- a/src/vs/workbench/browser/positronDataGrid/components/dataGridColumnHeader.tsx +++ b/src/vs/workbench/browser/positronDataGrid/components/dataGridColumnHeader.tsx @@ -17,6 +17,7 @@ import { selectionType } from '../utilities/mouseUtilities.js'; import { VerticalSplitter } from '../../../../base/browser/ui/positronComponents/splitters/verticalSplitter.js'; import { ColumnSelectionState } from '../classes/dataGridInstance.js'; import { usePositronDataGridContext } from '../positronDataGridContext.js'; +import { getDisplayedColumnName } from '../../../services/positronDataExplorer/common/utils.js'; /** * Constants. @@ -103,6 +104,8 @@ export const DataGridColumnHeader = (props: DataGridColumnHeaderProps) => { // Determine whether the column is selected. const selected = (columnSelectionState & ColumnSelectionState.Selected) !== 0; + const displayedColumnName = getDisplayedColumnName(props.column?.name); + // Render. return (
{ }} >
-
{props.column?.name}
+
{displayedColumnName}
{props.column?.description &&
{props.column.description}
} diff --git a/src/vs/workbench/services/positronDataExplorer/browser/components/columnSummaryCell.tsx b/src/vs/workbench/services/positronDataExplorer/browser/components/columnSummaryCell.tsx index e66a4a741cb..0a4103f8b10 100644 --- a/src/vs/workbench/services/positronDataExplorer/browser/components/columnSummaryCell.tsx +++ b/src/vs/workbench/services/positronDataExplorer/browser/components/columnSummaryCell.tsx @@ -24,6 +24,7 @@ import { ColumnProfileDatetime } from './columnProfileDatetime.js'; import { TableSummaryDataGridInstance } from '../tableSummaryDataGridInstance.js'; import { ColumnDisplayType, ColumnProfileType, ColumnSchema } from '../../../languageRuntime/common/positronDataExplorerComm.js'; import { dataExplorerExperimentalFeatureEnabled } from '../../common/positronDataExplorerExperimentalConfig.js'; +import { getDisplayedColumnName } from '../../common/utils.js'; /** * Constants. @@ -413,7 +414,7 @@ export const ColumnSummaryCell = (props: ColumnSummaryCellProps) => { onMouseLeave={() => props.hoverService.hideHover()} />
- {props.columnSchema.column_name} + {getDisplayedColumnName(props.columnSchema.column_name)}
{!expanded && } diff --git a/src/vs/workbench/services/positronDataExplorer/common/utils.ts b/src/vs/workbench/services/positronDataExplorer/common/utils.ts index 27b31f0db04..1f35b5d9844 100644 --- a/src/vs/workbench/services/positronDataExplorer/common/utils.ts +++ b/src/vs/workbench/services/positronDataExplorer/common/utils.ts @@ -29,3 +29,21 @@ export const arrayFromIndexRange = (startIndex: number, endIndex: number) => */ export const linearConversion = (value: number, from: Range, to: Range) => ((value - from.min) / (from.max - from.min)) * (to.max - to.min) + to.min; + + +/** + * Add quoting to column name in case it is an empty string or contains leading whitespace. + * @param name The column name from the backend + * @returns A modified column name that helps distinguish whitespace + */ +export function getDisplayedColumnName(name: string | undefined) { + let result = name ?? ''; + + const EMPTY_SPACE_SYMBOL = '\u2423'; + // If a column name is an empty string (allowed by pandas, at least) or contains + // leading whitespace, then we surround the column name with quotations. + if (result === '' || result.match(/^\s/)) { + result = `"${result}"`.replace(/ /g, EMPTY_SPACE_SYMBOL); + } + return result; +}