From 644f7e14afbff6bbd1da7027042f394d76dee56b Mon Sep 17 00:00:00 2001
From: moonbreeze <moonbreeze@yandex-team.ru>
Date: Mon, 4 Dec 2023 16:20:43 +0300
Subject: [PATCH 1/2] fix(query tracker): row count and truncated flag are now
 displayed above results table [#210]

---
 .../query-tracker/QueryResultsView/index.scss  |  4 ++++
 .../query-tracker/QueryResultsView/index.tsx   | 18 +++++++++++++++++-
 .../src/ui/pages/query-tracker/module/api.ts   |  1 +
 3 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/packages/ui/src/ui/pages/query-tracker/QueryResultsView/index.scss b/packages/ui/src/ui/pages/query-tracker/QueryResultsView/index.scss
index c1010b4a3..eaa465257 100644
--- a/packages/ui/src/ui/pages/query-tracker/QueryResultsView/index.scss
+++ b/packages/ui/src/ui/pages/query-tracker/QueryResultsView/index.scss
@@ -3,6 +3,10 @@
     position: relative;
     overflow: auto;
 
+    &__result-info {
+        margin-bottom: 10px;
+    }
+
     &__loading {
         display: flex;
         align-items: center;
diff --git a/packages/ui/src/ui/pages/query-tracker/QueryResultsView/index.tsx b/packages/ui/src/ui/pages/query-tracker/QueryResultsView/index.tsx
index 530ad4aff..341601e17 100644
--- a/packages/ui/src/ui/pages/query-tracker/QueryResultsView/index.tsx
+++ b/packages/ui/src/ui/pages/query-tracker/QueryResultsView/index.tsx
@@ -1,4 +1,4 @@
-import {Loader} from '@gravity-ui/uikit';
+import {Loader, Text} from '@gravity-ui/uikit';
 import React from 'react';
 import {useSelector} from 'react-redux';
 import block from 'bem-cn-lite';
@@ -20,14 +20,30 @@ import './index.scss';
 
 const b = block('query-result-table');
 
+const getResultRowsInfo = (result: QueryResultReadyState) => {
+    const {row_count: total} = result.meta.data_statistics;
+    const {is_truncated: truncated} = result.meta;
+    const {pageSize} = result.settings;
+    const start = pageSize * result.page + 1;
+    const end = Math.min(pageSize * result.page + pageSize, total);
+    return {start, end, total, truncated};
+};
+
 function QueryReadyResultView({result}: {result: QueryResultReadyState}) {
     const mode = result?.settings?.viewMode;
+    const {start, end, total, truncated} = getResultRowsInfo(result);
     return (
         <>
             <NotRenderUntilFirstVisible hide={mode !== QueryResultsViewMode.Scheme}>
                 <YQLSchemeTable result={result} />
             </NotRenderUntilFirstVisible>
             <NotRenderUntilFirstVisible hide={mode !== QueryResultsViewMode.Table}>
+                <div className={b('result-info')}>
+                    <Text>
+                        Rows {start}-{end} of {total}
+                        {`${truncated ? ' (truncated)' : ''}`}
+                    </Text>
+                </div>
                 <ResultsTable result={result} />
             </NotRenderUntilFirstVisible>
         </>
diff --git a/packages/ui/src/ui/pages/query-tracker/module/api.ts b/packages/ui/src/ui/pages/query-tracker/module/api.ts
index 961935ba3..b0f4e1291 100644
--- a/packages/ui/src/ui/pages/query-tracker/module/api.ts
+++ b/packages/ui/src/ui/pages/query-tracker/module/api.ts
@@ -397,6 +397,7 @@ export type QueryResultMeta = {
         };
         $value: QueryResultMetaScheme[];
     };
+    is_truncated: boolean;
     data_statistics: {
         chunk_count: number;
         row_count: number;

From 5d00482b9d39114f93701ff52ee6c3319efe704f Mon Sep 17 00:00:00 2001
From: moonbreeze <moonbreeze@yandex-team.ru>
Date: Tue, 5 Dec 2023 17:19:01 +0300
Subject: [PATCH 2/2] fix: pagination callback not rerendering when switching
 queries

---
 .../QueryResultsView/ResultPaginator/index.tsx           | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/packages/ui/src/ui/pages/query-tracker/QueryResultsView/ResultPaginator/index.tsx b/packages/ui/src/ui/pages/query-tracker/QueryResultsView/ResultPaginator/index.tsx
index 65ecff13a..1580d878c 100644
--- a/packages/ui/src/ui/pages/query-tracker/QueryResultsView/ResultPaginator/index.tsx
+++ b/packages/ui/src/ui/pages/query-tracker/QueryResultsView/ResultPaginator/index.tsx
@@ -81,9 +81,12 @@ export function ResultPaginator({queryId, resultIndex, className}: Props) {
         [dispatch],
     );
 
-    const goToPage = useCallback((page: number) => {
-        dispatch(updateQueryResult(queryId, resultIndex, page));
-    }, []);
+    const goToPage = useCallback(
+        (page: number) => {
+            dispatch(updateQueryResult(queryId, resultIndex, page));
+        },
+        [queryId],
+    );
 
     return (
         <div className={b(null, className)}>