Web console: better sql data loader reset

docs/ingestion/supervisor.md

@@ -42,6 +42,7 @@ The following table outlines the high-level configuration options for a supervis
 |`spec.dataSchema`|Object|The schema for the indexing task to use during ingestion. See [`dataSchema`](../ingestion/ingestion-spec.md#dataschema) for more information.|Yes|
 |`spec.ioConfig`|Object|The I/O configuration object to define the connection and I/O-related settings for the supervisor and indexing tasks.|Yes|
 |`spec.tuningConfig`|Object|The tuning configuration object to define performance-related settings for the supervisor and indexing tasks.|No|
+|`suspended`|Boolean|Puts the supervisor in a suspended state|No|
 
 ### I/O configuration
 

web-console/src/components/header-bar/__snapshots__/header-bar.spec.tsx.snap

@@ -205,8 +205,8 @@ exports[`HeaderBar matches snapshot 1`] = `
     <Memo(RestrictedMode)
       capabilities={
         Capabilities {
-          "clusterCapacity": undefined,
           "coordinator": true,
+          "maxTaskSlots": undefined,
           "multiStageQuery": true,
           "overlord": true,
           "queryType": "nativeAndSql",

web-console/src/components/header-bar/restricted-mode/__snapshots__/restricted-mode.spec.tsx.snap

@@ -17,7 +17,7 @@ exports[`RestrictedMode matches snapshot when in auto capability detection mode
         For more info refer to the
 
         <Memo(ExternalLink)
-          href="https://druid.apache.org/docs/latest/operations/web-console.html"
+          href="https://druid.apache.org/docs/latest/operations/web-console"
         >
           web console documentation
         </Memo(ExternalLink)>
@@ -88,7 +88,7 @@ exports[`RestrictedMode matches snapshot when in manual capability detection mod
         For more info refer to the
 
         <Memo(ExternalLink)
-          href="https://druid.apache.org/docs/latest/operations/web-console.html"
+          href="https://druid.apache.org/docs/latest/operations/web-console"
         >
           web console documentation
         </Memo(ExternalLink)>

web-console/src/components/header-bar/restricted-mode/restricted-mode.tsx

@@ -128,7 +128,7 @@ export const RestrictedMode = React.memo(function RestrictedMode(props: Restrict
           {message}
           <p>
             For more info refer to the{' '}
-            <ExternalLink href={`${getLink('DOCS')}/operations/web-console.html`}>
+            <ExternalLink href={`${getLink('DOCS')}/operations/web-console`}>
               web console documentation
             </ExternalLink>
             .

web-console/src/components/supervisor-history-panel/supervisor-history-panel.tsx

@@ -52,9 +52,7 @@ export const SupervisorHistoryPanel = React.memo(function SupervisorHistoryPanel
       const resp = await Api.instance.get(
         `/druid/indexer/v1/supervisor/${Api.encodePath(supervisorId)}/history`,
       );
-      return resp.data.map((vs: SupervisorHistoryEntry) =>
-        deepSet(vs, 'spec', cleanSpec(vs.spec, true)),
-      );
+      return resp.data.map((vs: SupervisorHistoryEntry) => deepSet(vs, 'spec', cleanSpec(vs.spec)));
     },
   });
 
@@ -87,8 +85,8 @@ export const SupervisorHistoryPanel = React.memo(function SupervisorHistoryPanel
         <DiffDialog
           title="Supervisor spec diff"
           versions={historyData.map(s => ({ label: s.version, value: s.spec }))}
-          initLeftIndex={diffIndex + 1}
-          initRightIndex={diffIndex}
+          initOldIndex={diffIndex + 1}
+          initNewIndex={diffIndex}
           onClose={() => setDiffIndex(-1)}
         />
       )}

web-console/src/console-application.tsx

@@ -29,7 +29,7 @@ import type { Filter } from 'react-table';
 import type { HeaderActiveTab } from './components';
 import { HeaderBar, Loader } from './components';
 import type { DruidEngine, QueryWithContext } from './druid-models';
-import { Capabilities } from './helpers';
+import { Capabilities, maybeGetClusterCapacity } from './helpers';
 import { stringToTableFilters, tableFiltersToString } from './react-table';
 import { AppToaster } from './singletons';
 import { compact, localStorageGetJson, LocalStorageKeys, QueryManager } from './utils';
@@ -318,6 +318,7 @@ export class ConsoleApplication extends React.PureComponent<
         queryEngines={queryEngines}
         allowExplain
         goToTask={this.goToTasksWithTaskId}
+        getClusterCapacity={maybeGetClusterCapacity}
       />,
       'thin',
     );
@@ -331,6 +332,8 @@ export class ConsoleApplication extends React.PureComponent<
         capabilities={capabilities}
         goToQuery={this.goToQuery}
         goToTask={this.goToTasksWithTaskId}
+        goToTaskGroup={this.goToTasksWithTaskGroupId}
+        getClusterCapacity={maybeGetClusterCapacity}
       />,
     );
   };

web-console/src/dialogs/about-dialog/__snapshots__/about-dialog.spec.tsx.snap

@@ -109,7 +109,7 @@ exports[`AboutDialog matches snapshot 1`] = `
             Druid is made with ❤️ by a community of passionate developers. To contribute, join in the discussion on the
 
             <a
-              href="https://lists.apache.org/list.html?dev@druid.apache.org"
+              href="https://lists.apache.org/list?dev@druid.apache.org"
               rel="noopener noreferrer"
               target="_blank"
             >

web-console/src/dialogs/compaction-config-dialog/__snapshots__/compaction-config-dialog.spec.tsx.snap

@@ -360,7 +360,7 @@ exports[`CompactionConfigDialog matches snapshot with compactionConfig (dynamic
               For more information refer to the
 
               <Memo(ExternalLink)
-                href="https://druid.apache.org/docs/latest/ingestion/concurrent-append-replace.html"
+                href="https://druid.apache.org/docs/latest/ingestion/concurrent-append-replace"
               >
                 documentation
               </Memo(ExternalLink)>
@@ -770,7 +770,7 @@ exports[`CompactionConfigDialog matches snapshot with compactionConfig (hashed p
               For more information refer to the
 
               <Memo(ExternalLink)
-                href="https://druid.apache.org/docs/latest/ingestion/concurrent-append-replace.html"
+                href="https://druid.apache.org/docs/latest/ingestion/concurrent-append-replace"
               >
                 documentation
               </Memo(ExternalLink)>
@@ -1180,7 +1180,7 @@ exports[`CompactionConfigDialog matches snapshot with compactionConfig (range pa
               For more information refer to the
 
               <Memo(ExternalLink)
-                href="https://druid.apache.org/docs/latest/ingestion/concurrent-append-replace.html"
+                href="https://druid.apache.org/docs/latest/ingestion/concurrent-append-replace"
               >
                 documentation
               </Memo(ExternalLink)>
@@ -1590,7 +1590,7 @@ exports[`CompactionConfigDialog matches snapshot without compactionConfig 1`] =
               For more information refer to the
 
               <Memo(ExternalLink)
-                href="https://druid.apache.org/docs/latest/ingestion/concurrent-append-replace.html"
+                href="https://druid.apache.org/docs/latest/ingestion/concurrent-append-replace"
               >
                 documentation
               </Memo(ExternalLink)>

web-console/src/dialogs/compaction-config-dialog/compaction-config-dialog.tsx

@@ -122,9 +122,7 @@ export const CompactionConfigDialog = React.memo(function CompactionConfigDialog
                   </p>
                   <p>
                     For more information refer to the{' '}
-                    <ExternalLink
-                      href={`${getLink('DOCS')}/ingestion/concurrent-append-replace.html`}
-                    >
+                    <ExternalLink href={`${getLink('DOCS')}/ingestion/concurrent-append-replace`}>
                       documentation
                     </ExternalLink>
                     .

web-console/src/dialogs/compaction-dynamic-config-dialog/compaction-dynamic-config-dialog.tsx

@@ -86,7 +86,7 @@ export const CompactionDynamicConfigDialog = React.memo(function CompactionDynam
   async function saveConfig() {
     if (!dynamicConfig) return;
     try {
-      // This API is terrible. https://druid.apache.org/docs/latest/operations/api-reference.html#automatic-compaction-configuration
+      // This API is terrible. https://druid.apache.org/docs/latest/operations/api-reference#automatic-compaction-configuration
       await Api.instance.post(
         `/druid/coordinator/v1/config/compaction/taskslots?ratio=${
           dynamicConfig.compactionTaskSlotRatio ?? DEFAULT_RATIO
@@ -124,7 +124,7 @@ export const CompactionDynamicConfigDialog = React.memo(function CompactionDynam
               <ExternalLink
                 href={`${getLink(
                   'DOCS',
-                )}/operations/api-reference.html#automatic-compaction-configuration`}
+                )}/operations/api-reference#automatic-compaction-configuration`}
               >
                 documentation
               </ExternalLink>

web-console/src/dialogs/compaction-history-dialog/compaction-history-dialog.tsx

@@ -135,8 +135,8 @@ export const CompactionHistoryDialog = React.memo(function CompactionHistoryDial
         <DiffDialog
           title="Compaction config diff"
           versions={historyData.map(s => ({ label: s.auditTime, value: s.compactionConfig }))}
-          initLeftIndex={diffIndex + 1}
-          initRightIndex={diffIndex}
+          initOldIndex={diffIndex + 1}
+          initNewIndex={diffIndex}
           onClose={() => setDiffIndex(-1)}
         />
       )}

web-console/src/dialogs/coordinator-dynamic-config-dialog/coordinator-dynamic-config-dialog.tsx

@@ -107,9 +107,7 @@ export const CoordinatorDynamicConfigDialog = React.memo(function CoordinatorDyn
           <p>
             Edit the coordinator dynamic configuration on the fly. For more information please refer
             to the{' '}
-            <ExternalLink
-              href={`${getLink('DOCS')}/configuration/index.html#dynamic-configuration`}
-            >
+            <ExternalLink href={`${getLink('DOCS')}/configuration/#dynamic-configuration`}>
               documentation
             </ExternalLink>
             .

web-console/src/dialogs/diff-dialog/diff-dialog.tsx

@@ -44,43 +44,47 @@ export interface DiffVersion {
 
 export interface DiffDialogProps {
   title?: string;
-  left?: unknown;
-  right?: unknown;
+  onClose(): void;
+
+  // Single value
+  oldValue?: unknown;
+  newValue?: unknown;
+
+  // Versions
   versions?: DiffVersion[];
-  initLeftIndex?: number;
-  initRightIndex?: number;
-  onClose: () => void;
+  initOldIndex?: number;
+  initNewIndex?: number;
 }
 
 export const DiffDialog = React.memo(function DiffDialog(props: DiffDialogProps) {
-  const { title, left, right, versions, initLeftIndex, initRightIndex, onClose } = props;
+  const { title, oldValue, newValue, versions, initOldIndex, initNewIndex, onClose } = props;
 
-  const [leftIndex, setLeftIndex] = useState(initLeftIndex || 0);
-  const [rightIndex, setRightIndex] = useState(initRightIndex || 0);
+  const [leftIndex, setLeftIndex] = useState(initOldIndex || 0);
+  const [rightIndex, setRightIndex] = useState(initNewIndex || 0);
 
-  let leftValue: string;
-  let rightValue: string;
+  let oldValueString: string;
+  let newValueString: string;
   if (Array.isArray(versions)) {
     if (versions.length) {
-      const leftVersion = versions[leftIndex].value;
-      const rightVersion = versions[rightIndex].value;
-      if (typeof leftVersion === 'string' && typeof rightVersion === 'string') {
-        leftValue = leftVersion;
-        rightValue = rightVersion;
+      const oldVersionValue = versions[leftIndex].value;
+      const newVersionValue = versions[rightIndex].value;
+      if (typeof oldVersionValue === 'string' && typeof newVersionValue === 'string') {
+        oldValueString = oldVersionValue;
+        newValueString = newVersionValue;
       } else {
-        leftValue = JSONBig.stringify(leftVersion, undefined, 2);
-        rightValue = JSONBig.stringify(rightVersion, undefined, 2);
+        oldValueString = JSONBig.stringify(oldVersionValue, undefined, 2);
+        newValueString = JSONBig.stringify(newVersionValue, undefined, 2);
       }
     } else {
-      leftValue = rightValue = 'Nothing to diff';
+      oldValueString = newValueString = 'Nothing to diff';
     }
   } else {
-    if (typeof left === 'string' && typeof right === 'string') {
-      leftValue = left;
-      rightValue = right;
+    if (typeof oldValue === 'string' && typeof newValue === 'string') {
+      oldValueString = oldValue;
+      newValueString = newValue;
     } else {
-      leftValue = JSONBig.stringify(left, undefined, 2);
-      rightValue = JSONBig.stringify(right, undefined, 2);
+      oldValueString = JSONBig.stringify(oldValue, undefined, 2);
+      newValueString = JSONBig.stringify(newValue, undefined, 2);
     }
   }
 
@@ -121,8 +125,8 @@ export const DiffDialog = React.memo(function DiffDialog(props: DiffDialogProps)
         )}
         <div className="diff-container">
           <ReactDiffViewer
-            oldValue={leftValue}
-            newValue={rightValue}
+            oldValue={oldValueString}
+            newValue={newValueString}
             splitView
             useDarkTheme
             styles={REACT_DIFF_STYLES}

web-console/src/dialogs/history-dialog/history-dialog.tsx

@@ -96,8 +96,8 @@ export const HistoryDialog = React.memo(function HistoryDialog(props: HistoryDia
           label: auditInfo.comment || auditTime,
           value: normalizePayload(payload),
         }))}
-        initLeftIndex={diffIndex + 1}
-        initRightIndex={diffIndex}
+        initOldIndex={diffIndex + 1}
+        initNewIndex={diffIndex}
         onClose={() => setDiffIndex(-1)}
       />
     );

web-console/src/dialogs/overlord-dynamic-config-dialog/overlord-dynamic-config-dialog.tsx

@@ -107,9 +107,7 @@ export const OverlordDynamicConfigDialog = React.memo(function OverlordDynamicCo
           <p>
             Edit the overlord dynamic configuration at runtime. For more information please refer to
             the{' '}
-            <ExternalLink
-              href={`${getLink('DOCS')}/configuration/index.html#overlord-dynamic-configuration`}
-            >
+            <ExternalLink href={`${getLink('DOCS')}/configuration/#overlord-dynamic-configuration`}>
               documentation
             </ExternalLink>
             .

web-console/src/dialogs/retention-dialog/__snapshots__/retention-dialog.spec.tsx.snap

@@ -64,7 +64,7 @@ exports[`RetentionDialog matches snapshot 1`] = `
             Druid uses rules to determine what data should be retained in the cluster. The rules are evaluated in order from top to bottom. For more information please refer to the
 
             <a
-              href="https://druid.apache.org/docs/latest/operations/rule-configuration.html"
+              href="https://druid.apache.org/docs/latest/operations/rule-configuration"
               rel="noopener noreferrer"
               target="_blank"
             >

web-console/src/dialogs/retention-dialog/retention-dialog.tsx

@@ -129,7 +129,7 @@ ORDER BY 1`,
       <p>
         Druid uses rules to determine what data should be retained in the cluster. The rules are
         evaluated in order from top to bottom. For more information please refer to the{' '}
-        <ExternalLink href={`${getLink('DOCS')}/operations/rule-configuration.html`}>
+        <ExternalLink href={`${getLink('DOCS')}/operations/rule-configuration`}>
           documentation
         </ExternalLink>
         .

web-console/src/dialogs/supervisor-table-action-dialog/supervisor-table-action-dialog.tsx

@@ -93,7 +93,7 @@ export const SupervisorTableActionDialog = React.memo(function SupervisorTableAc
       {activeTab === 'spec' && (
         <ShowJson
           endpoint={supervisorEndpointBase}
-          transform={x => cleanSpec(x, true)}
+          transform={cleanSpec}
           downloadFilename={`supervisor-payload-${supervisorId}.json`}
         />
       )}

web-console/src/druid-models/execution/execution.ts

@@ -18,6 +18,7 @@
 
 import { Column, QueryResult, SqlExpression, SqlQuery, SqlWithQuery } from '@druid-toolkit/query';
 
+import { maybeGetClusterCapacity } from '../../helpers';
 import {
   deepGet,
   deleteKeys,
@@ -192,8 +193,13 @@ export interface ExecutionValue {
 }
 
 export class Execution {
+  static USE_TASK_PAYLOAD = true;
+  static USE_TASK_REPORTS = true;
   static INLINE_DATASOURCE_MARKER = '__query_select';
 
+  static getClusterCapacity: (() => Promise<CapacityInfo | undefined>) | undefined =
+    maybeGetClusterCapacity;
+
   static validAsyncState(status: string | undefined): status is AsyncState {
     return oneOf(status, 'ACCEPTED', 'RUNNING', 'FINISHED', 'FAILED');
   }

web-console/src/druid-models/filter/filter.tsx

@@ -170,7 +170,7 @@ export const FILTERS_FIELDS: Field<IngestionSpec>[] = [
       <>
         <p>
           A Druid{' '}
-          <ExternalLink href={`${getLink('DOCS')}/querying/filters.html`}>
+          <ExternalLink href={`${getLink('DOCS')}/querying/filters`}>
             JSON filter expression
           </ExternalLink>{' '}
           to apply to the data.