Web console: workbench query should remain attached (#18776)

* workbench query should remain attached

* protective coding around future dates

* Filter segment timeline to for digit years only

* update deps to fix bugs

Author: vogievetsky

licenses.yaml

@@ -5550,7 +5550,7 @@ license_category: binary
 module: web-console
 license_name: Apache License version 2.0
 copyright: Vadim Ogievetsky
-version: 1.2.1
+version: 1.2.3
 
 ---
 
@@ -5848,7 +5848,7 @@ license_category: binary
 module: web-console
 license_name: Apache License version 2.0
 copyright: Imply Data
-version: 1.2.1
+version: 1.2.2
 
 ---
 

web-console/package-lock.json

@@ -61,7 +61,7 @@
     "@internationalized/date": "^3.5.6",
     "ace-builds": "~1.5.3",
     "axios": "^1.12.0",
-    "chronoshift": "^1.2.1",
+    "chronoshift": "^1.2.3",
     "classnames": "^2.2.6",
     "copy-to-clipboard": "^3.3.3",
     "d3-array": "^3.2.4",
@@ -73,7 +73,7 @@
     "d3-time-format": "^4.1.0",
     "date-fns": "^2.28.0",
     "dayjs": "^1.11.15",
-    "druid-query-toolkit": "^1.2.1",
+    "druid-query-toolkit": "^1.2.2",
     "echarts": "^5.5.1",
     "file-saver": "^2.0.5",
     "hjson": "^3.2.2",

web-console/package.json

@@ -34,7 +34,6 @@ import { day, Duration, Timezone } from 'chronoshift';
 import { C, L, N, SqlExpression, SqlQuery } from 'druid-query-toolkit';
 import { useEffect, useMemo, useState } from 'react';
 
-import { END_OF_TIME_DATE, START_OF_TIME_DATE } from '../../druid-models';
 import type { Capabilities } from '../../helpers';
 import { useQueryManager } from '../../hooks';
 import {
@@ -56,6 +55,7 @@ import { SegmentBarChart } from './segment-bar-chart';
 
 import './segment-timeline.scss';
 
+const FOUR_DIGIT_YEAR_LIKE = '____-%';
 const DEFAULT_SHOWN_DURATION = new Duration('P1Y');
 const SHOWN_DURATION_OPTIONS: Duration[] = ['P1D', 'P1W', 'P1M', 'P3M', 'P1Y', 'P5Y', 'P10Y'].map(
   d => new Duration(d),
@@ -122,8 +122,8 @@ export const SegmentTimeline = function SegmentTimeline(props: SegmentTimelinePr
         const baseQuery = SqlQuery.from(N('sys').table('segments'))
           .changeWhereExpression(
             SqlExpression.and(
-              C('start').unequal(START_OF_TIME_DATE),
-              C('end').unequal(END_OF_TIME_DATE),
+              C('start').like(FOUR_DIGIT_YEAR_LIKE),
+              C('end').like(FOUR_DIGIT_YEAR_LIKE),
               C('is_overshadowed').equal(0),
               datasource ? C('datasource').equal(L(datasource)) : undefined,
             ),
@@ -141,7 +141,12 @@ export const SegmentTimeline = function SegmentTimeline(props: SegmentTimelinePr
           return getDateRange(DEFAULT_SHOWN_DURATION);
         }
 
-        queriedEnd = day.ceil(new Date(endRes[0].end), Timezone.UTC);
+        const endResDate = new Date(endRes[0].end); // Need to be protective against a date in the far future
+        if (isNaN(endResDate.valueOf())) {
+          return getDateRange(DEFAULT_SHOWN_DURATION);
+        }
+
+        queriedEnd = day.ceil(endResDate, Timezone.UTC);
 
         const startQuery = baseQuery
           .addSelect(C('start'), { addToOrderBy: 'end', direction: 'ASC' })

web-console/src/components/segment-timeline/segment-timeline.tsx

@@ -230,7 +230,7 @@ export class WorkbenchQuery {
   public readonly unlimited?: boolean;
   public readonly prefixLines?: number;
 
-  public readonly parsedQuery?: SqlQuery;
+  public readonly parsedQuery?: SqlQuery; // Derived from query string
 
   constructor(value: WorkbenchQueryValue) {
     let queryString = value.queryString;
@@ -267,7 +267,9 @@ export class WorkbenchQuery {
       queryContext: this.queryContext,
       queryParameters: this.queryParameters,
       engine: this.engine,
+      lastExecution: this.lastExecution,
       unlimited: this.unlimited,
+      prefixLines: this.prefixLines,
     };
   }
 
@@ -281,6 +283,12 @@ export class WorkbenchQuery {
     ].join('\n\n');
   }
 
+  public formatLastExecution(): string | undefined {
+    const { lastExecution } = this;
+    if (!lastExecution) return;
+    return `Attached to: ${lastExecution.id} (${lastExecution.engine})`;
+  }
+
   public changeQueryString(queryString: string): WorkbenchQuery {
     return new WorkbenchQuery({ ...this.valueOf(), queryString });
   }

web-console/src/druid-models/workbench-query/workbench-query.ts

@@ -57,6 +57,7 @@ import { ExecutionStateCache } from '../../singletons/execution-state-cache';
 import { WorkbenchRunningPromises } from '../../singletons/workbench-running-promises';
 import type { ColumnMetadata } from '../../utils';
 import {
+  assemble,
   deepSet,
   generate8HexId,
   localStorageGet,
@@ -552,7 +553,9 @@ export class WorkbenchView extends React.PureComponent<WorkbenchViewProps, Workb
             <div
               key={i}
               className={classNames('tab-button', { active })}
-              data-tooltip={tabEntry.tabName}
+              data-tooltip={assemble(tabEntry.tabName, tabEntry.query.formatLastExecution()).join(
+                '\n',
+              )}
             >
               {active ? (
                 <Popover