fix: column indices

Author: astandrik

src/components/QueryResultTable/utils/getColumnWidth.ts

@@ -1,11 +1,17 @@
+import {INDEX_COLUMN} from '../../../store/reducers/query/query';
 import type {KeyValueRow} from '../../../types/api/query';
 
 export const MAX_COLUMN_WIDTH = 600;
 export const HEADER_PADDING = 20;
+export const INDEX_COLUMN_WIDTH = 80;
 
 export const getColumnWidth = ({data, name}: {data?: KeyValueRow[]; name: string}) => {
     let maxColumnContentLength = name.length;
 
+    if (INDEX_COLUMN.name === name) {
+        return INDEX_COLUMN_WIDTH;
+    }
+
     if (data) {
         for (const row of data) {
             const cellLength = row[name] ? String(row[name]).length : 0;

src/components/ResizeableDataTable/ResizeableDataTable.tsx

@@ -1,6 +1,7 @@
 import type {DataTableProps, Settings} from '@gravity-ui/react-data-table';
 import DataTable, {updateColumnsWidth} from '@gravity-ui/react-data-table';
 
+import {INDEX_COLUMN} from '../../store/reducers/query/query';
 import {cn} from '../../utils/cn';
 import {useTableResize} from '../../utils/hooks/useTableResize';
 
@@ -27,6 +28,7 @@ export function ResizeableDataTable<T>({
     const newSettings: Settings = {
         ...settings,
         defaultResizeable: true,
+        displayIndices: columns.filter(({name}) => INDEX_COLUMN.name === name).length === 0,
     };
 
     return (

src/services/api/viewer.ts

@@ -451,7 +451,7 @@ export class ViewerAPI extends BaseYdbAPI {
                             const resultIndex = chunk.meta.result_index;
                             const mergedChunk = mergedChunks.get(resultIndex);
 
-                            if (mergedChunk) {
+                            if (mergedChunk && mergedChunk.result.rows && chunk.result.rows) {
                                 mergedChunk.result.rows.push(...chunk.result.rows);
                             } else {
                                 mergedChunks.set(resultIndex, chunk);

src/store/reducers/query/query.ts

@@ -3,6 +3,7 @@ import {createSlice} from '@reduxjs/toolkit';
 import type {PayloadAction} from '@reduxjs/toolkit';
 
 import {settingsManager} from '../../../services/settings';
+import type {ColumnType} from '../../../types/api/query';
 import {TracingLevelNumber} from '../../../types/api/query';
 import type {QueryAction, QueryRequestParams, QuerySettings} from '../../../types/store/query';
 import type {StreamingChunk} from '../../../types/store/streaming';
@@ -23,6 +24,7 @@ import {
 } from './utils';
 
 const MAXIMUM_QUERIES_IN_HISTORY = 20;
+export const INDEX_COLUMN: ColumnType = {name: '#', type: 'Uint64'};
 
 const queriesHistoryInitial = settingsManager.readUserSettingsValue(
     QUERIES_HISTORY_KEY,
@@ -152,20 +154,33 @@ const slice = createSlice({
                 } = chunk;
 
                 if (columns && !state.result.data.resultSets?.[resultIndex]?.columns?.length) {
+                    const columnsWithIndex = [INDEX_COLUMN, ...columns];
                     if (!state.result.data.resultSets) {
                         state.result.data.resultSets = [];
                     }
 
                     if (state.result.data.resultSets[resultIndex]) {
-                        state.result.data.resultSets[resultIndex].columns = columns;
+                        state.result.data.resultSets[resultIndex].columns = columnsWithIndex;
                     } else {
-                        state.result.data.resultSets[resultIndex] = {columns, result: []};
+                        state.result.data.resultSets[resultIndex] = {
+                            columns: columnsWithIndex,
+                            result: [],
+                        };
                     }
                 }
                 // Convert and append new rows
-                if (rows.length > 0 && state.result.data.resultSets?.[resultIndex]?.columns) {
+                if (
+                    rows &&
+                    rows.length > 0 &&
+                    state.result.data.resultSets?.[resultIndex]?.columns
+                ) {
+                    const currentRows = state.result.data.resultSets[resultIndex].result;
+                    let currentIndex = currentRows?.length || 1;
+
+                    const indexedRows = rows.map((row) => [currentIndex++, ...row]);
+
                     const formattedRows = parseResult(
-                        rows,
+                        indexedRows,
                         state.result.data.resultSets[resultIndex].columns,
                     );
 

src/types/store/streaming.ts

@@ -20,7 +20,7 @@ export interface StreamDataChunk {
     };
     result: {
         columns?: ColumnType[];
-        rows: ArrayRow[];
+        rows: ArrayRow[] | null;
     };
 }