feat(Queries): change query result tabs order [YTFRONT-4381]

ytsaurus · Nov 21, 2024 · d851ddf · d851ddf
1 parent b47d3fb
commit d851ddf
Showing 1 changed file with 35 additions and 26 deletions.
diff --git a/packages/ui/src/ui/pages/query-tracker/QueryResults/hooks/useQueryResultTabs.tsx b/packages/ui/src/ui/pages/query-tracker/QueryResults/hooks/useQueryResultTabs.tsx
@@ -77,53 +77,62 @@ export const useQueryResultTabs = (
         if (!query) {
             return [];
         }
-        const items: TabsItemProps[] = [{id: QueryResultTab.META, title: 'Meta'}];
+        const items: TabsItemProps[] = [];
+
+        if (query.state === QueryStatus.FAILED) {
+            items.push({id: QueryResultTab.ERROR, title: 'Error'});
+        }
+
+        if (query.state === QueryStatus.COMPLETED) {
+            items.push(
+                ...times_(query.result_count, (num) => {
+                    let icon;
+                    if (resultsMeta && resultsMeta[num] && has_(resultsMeta[num], 'error')) {
+                        icon = (
+                            <QueryStatusIcon
+                                status={QueryStatus.FAILED}
+                                className={'query-status_tabs'}
+                            />
+                        );
+                    }
+                    return {
+                        id: createResultTabId(num),
+                        title: query.result_count === 1 ? 'Result' : `Result #${num + 1}`,
+                        icon,
+                    };
+                }),
+            );
+        }
+
         const emptyProgress =
             !query.progress?.yql_plan?.Basic.nodes.length &&
             !query.progress?.yql_plan?.Basic.links?.length;
         if (query.progress && !emptyProgress) {
-            items.unshift({
+            items.push({
                 id: QueryResultTab.PROGRESS,
                 title: 'Progress',
             });
         }
-        if (query.state === QueryStatus.FAILED) {
-            items.unshift({id: QueryResultTab.ERROR, title: 'Error'});
-        } else if (query.state === QueryStatus.COMPLETED) {
-            const queryResultChartTab = UIFactory.getQueryResultChartTab();
 
+        if (query.state === QueryStatus.COMPLETED) {
+            const queryResultChartTab = UIFactory.getQueryResultChartTab();
             if (queryResultChartTab && query.result_count) {
-                items.unshift({
+                items.push({
                     id: QueryResultTab.CHART_TAB,
                     title: queryResultChartTab.title,
                 });
             }
 
             if (query.progress?.yql_statistics) {
-                items.unshift({
+                items.push({
                     id: QueryResultTab.STATISTIC,
                     title: 'Statistics',
                 });
             }
-            items.unshift(
-                ...times_(query.result_count, (num) => {
-                    let icon;
-                    if (resultsMeta && resultsMeta[num] && has_(resultsMeta[num], 'error')) {
-                        icon = (
-                            <QueryStatusIcon
-                                status={QueryStatus.FAILED}
-                                className={'query-status_tabs'}
-                            />
-                        );
-                    }
-                    return {
-                        id: createResultTabId(num),
-                        title: query.result_count === 1 ? 'Result' : `Result #${num + 1}`,
-                        icon,
-                    };
-                }),
-            );
         }
+
+        items.push({id: QueryResultTab.META, title: 'Meta'});
+
         return items;
     }, [query, resultsMeta]);