Web console: Display compaction status

web-console/src/components/json-input/json-input.tsx

@@ -80,12 +80,11 @@ export const JsonInput = React.memo(function JsonInput(props: JsonInputProps) {
   const aceEditor = useRef<Editor | undefined>();
 
   useEffect(() => {
-    if (!deepEqual(value, internalValue.value)) {
-      setInternalValue({
-        value,
-        stringified: stringifyJson(value),
-      });
-    }
+    if (deepEqual(value, internalValue.value)) return;
+    setInternalValue({
+      value,
+      stringified: stringifyJson(value),
+    });
   }, [value]);
 
   const internalValueError = internalValue.error;
@@ -149,8 +148,8 @@ export const JsonInput = React.memo(function JsonInput(props: JsonInputProps) {
             const rc = extractRowColumnFromHjsonError(internalValueError);
             if (!rc) return;
 
+            aceEditor.current.focus(); // Grab the focus
             aceEditor.current.getSelection().moveCursorTo(rc.row, rc.column);
-            aceEditor.current.focus(); // Grab the focus also
           }}
         >
           {internalValueError.message}

web-console/src/components/more-button/more-button.tsx

@@ -18,14 +18,19 @@
 
 import { Button, Menu, Popover, Position } from '@blueprintjs/core';
 import { IconNames } from '@blueprintjs/icons';
-import React from 'react';
+import React, { useState } from 'react';
+
+type OpenState = 'open' | 'alt-open';
 
 export interface MoreButtonProps {
-  children: React.ReactNode;
+  children: React.ReactNode | React.ReactNode[];
+  altExtra?: React.ReactNode;
 }
 
 export const MoreButton = React.memo(function MoreButton(props: MoreButtonProps) {
-  const { children } = props;
+  const { children, altExtra } = props;
+
+  const [openState, setOpenState] = useState<OpenState | undefined>();
 
   let childCount = 0;
   // Sadly React.Children.count does not ignore nulls correctly
@@ -36,8 +41,18 @@ export const MoreButton = React.memo(function MoreButton(props: MoreButtonProps)
   return (
     <Popover
       className="more-button"
-      content={<Menu>{children}</Menu>}
+      isOpen={Boolean(openState)}
+      content={
+        <Menu>
+          {children}
+          {openState === 'alt-open' && altExtra}
+        </Menu>
+      }
       position={Position.BOTTOM_LEFT}
+      onInteraction={(nextOpenState, e: any) => {
+        if (!e) return; // For some reason this function is always called twice once with e and once without
+        setOpenState(nextOpenState ? (e.altKey ? 'alt-open' : 'open') : undefined);
+      }}
     >
       <Button icon={IconNames.MORE} disabled={!childCount} />
     </Popover>

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

@@ -38,6 +38,12 @@ exports[`CompactionDialog matches snapshot with compactionConfig (dynamic partit
               The offset for searching segments to be compacted. Strongly recommended to set for realtime dataSources.
             </p>,
             "name": "skipOffsetFromLatest",
+            "suggestions": Array [
+              "PT0H",
+              "PT1H",
+              "P1D",
+              "P3D",
+            ],
             "type": "string",
           },
           Object {
@@ -265,6 +271,12 @@ exports[`CompactionDialog matches snapshot with compactionConfig (hashed partiti
               The offset for searching segments to be compacted. Strongly recommended to set for realtime dataSources.
             </p>,
             "name": "skipOffsetFromLatest",
+            "suggestions": Array [
+              "PT0H",
+              "PT1H",
+              "P1D",
+              "P3D",
+            ],
             "type": "string",
           },
           Object {
@@ -492,6 +504,12 @@ exports[`CompactionDialog matches snapshot with compactionConfig (single_dim par
               The offset for searching segments to be compacted. Strongly recommended to set for realtime dataSources.
             </p>,
             "name": "skipOffsetFromLatest",
+            "suggestions": Array [
+              "PT0H",
+              "PT1H",
+              "P1D",
+              "P3D",
+            ],
             "type": "string",
           },
           Object {
@@ -719,6 +737,12 @@ exports[`CompactionDialog matches snapshot without compactionConfig 1`] = `
               The offset for searching segments to be compacted. Strongly recommended to set for realtime dataSources.
             </p>,
             "name": "skipOffsetFromLatest",
+            "suggestions": Array [
+              "PT0H",
+              "PT1H",
+              "P1D",
+              "P3D",
+            ],
             "type": "string",
           },
           Object {

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

@@ -24,8 +24,6 @@ import { deepGet, deepSet } from '../../utils/object-change';
 
 import './compaction-dialog.scss';
 
-export const DEFAULT_MAX_ROWS_PER_SEGMENT = 5000000;
-
 type Tabs = 'form' | 'json';
 
 type CompactionConfig = Record<string, any>;
@@ -35,6 +33,7 @@ const COMPACTION_CONFIG_FIELDS: Field<CompactionConfig>[] = [
     name: 'skipOffsetFromLatest',
     type: 'string',
     defaultValue: 'P1D',
+    suggestions: ['PT0H', 'PT1H', 'P1D', 'P3D'],
     info: (
       <p>
         The offset for searching segments to be compacted. Strongly recommended to set for realtime

web-console/src/utils/compaction.spec.ts

@@ -0,0 +1,87 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {
+  CompactionConfig,
+  CompactionStatus,
+  formatCompactionConfigAndStatus,
+  zeroCompactionStatus,
+} from './compaction';
+
+describe('compaction', () => {
+  const BASIC_CONFIG: CompactionConfig = {};
+  const ZERO_STATUS: CompactionStatus = {
+    dataSource: 'tbl',
+    scheduleStatus: 'RUNNING',
+    bytesAwaitingCompaction: 0,
+    bytesCompacted: 0,
+    bytesSkipped: 0,
+    segmentCountAwaitingCompaction: 0,
+    segmentCountCompacted: 0,
+    segmentCountSkipped: 0,
+    intervalCountAwaitingCompaction: 0,
+    intervalCountCompacted: 0,
+    intervalCountSkipped: 0,
+  };
+
+  it('zeroCompactionStatus', () => {
+    expect(zeroCompactionStatus(ZERO_STATUS)).toEqual(true);
+
+    expect(
+      zeroCompactionStatus({
+        dataSource: 'tbl',
+        scheduleStatus: 'RUNNING',
+        bytesAwaitingCompaction: 1,
+        bytesCompacted: 0,
+        bytesSkipped: 0,
+        segmentCountAwaitingCompaction: 0,
+        segmentCountCompacted: 0,
+        segmentCountSkipped: 0,
+        intervalCountAwaitingCompaction: 0,
+        intervalCountCompacted: 0,
+        intervalCountSkipped: 0,
+      }),
+    ).toEqual(false);
+  });
+
+  it('formatCompactionConfigAndStatus', () => {
+    expect(formatCompactionConfigAndStatus(undefined, undefined)).toEqual('Not enabled');
+
+    expect(formatCompactionConfigAndStatus(BASIC_CONFIG, undefined)).toEqual('Awaiting first run');
+
+    expect(formatCompactionConfigAndStatus(undefined, ZERO_STATUS)).toEqual('Running');
+
+    expect(formatCompactionConfigAndStatus(BASIC_CONFIG, ZERO_STATUS)).toEqual('Running');
+
+    expect(
+      formatCompactionConfigAndStatus(BASIC_CONFIG, {
+        dataSource: 'tbl',
+        scheduleStatus: 'RUNNING',
+        bytesAwaitingCompaction: 0,
+        bytesCompacted: 100,
+        bytesSkipped: 0,
+        segmentCountAwaitingCompaction: 0,
+        segmentCountCompacted: 10,
+        segmentCountSkipped: 0,
+        intervalCountAwaitingCompaction: 0,
+        intervalCountCompacted: 10,
+        intervalCountSkipped: 0,
+      }),
+    ).toEqual('Fully compacted');
+  });
+});

web-console/src/utils/compaction.ts

@@ -0,0 +1,68 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+function capitalizeFirst(str: string): string {
+  return str.slice(0, 1).toUpperCase() + str.slice(1).toLowerCase();
+}
+
+export interface CompactionStatus {
+  dataSource: string;
+  scheduleStatus: string;
+  bytesAwaitingCompaction: number;
+  bytesCompacted: number;
+  bytesSkipped: number;
+  segmentCountAwaitingCompaction: number;
+  segmentCountCompacted: number;
+  segmentCountSkipped: number;
+  intervalCountAwaitingCompaction: number;
+  intervalCountCompacted: number;
+  intervalCountSkipped: number;
+}
+
+export type CompactionConfig = Record<string, any>;
+
+export function zeroCompactionStatus(compactionStatus: CompactionStatus): boolean {
+  return (
+    !compactionStatus.bytesAwaitingCompaction &&
+    !compactionStatus.bytesCompacted &&
+    !compactionStatus.bytesSkipped &&
+    !compactionStatus.segmentCountAwaitingCompaction &&
+    !compactionStatus.segmentCountCompacted &&
+    !compactionStatus.segmentCountSkipped &&
+    !compactionStatus.intervalCountAwaitingCompaction &&
+    !compactionStatus.intervalCountCompacted &&
+    !compactionStatus.intervalCountSkipped
+  );
+}
+
+export function formatCompactionConfigAndStatus(
+  compactionConfig: CompactionConfig | undefined,
+  compactionStatus: CompactionStatus | undefined,
+) {
+  if (compactionStatus) {
+    if (compactionStatus.bytesAwaitingCompaction === 0 && !zeroCompactionStatus(compactionStatus)) {
+      return 'Fully compacted';
+    } else {
+      return capitalizeFirst(compactionStatus.scheduleStatus);
+    }
+  } else if (compactionConfig) {
+    return 'Awaiting first run';
+  } else {
+    return 'Not enabled';
+  }
+}

web-console/src/utils/general.spec.ts

@@ -18,6 +18,11 @@
 
 import {
   alphanumericCompare,
+  formatBytes,
+  formatBytesCompact,
+  formatInteger,
+  formatMegabytes,
+  formatPercent,
   sortWithPrefixSuffix,
   sqlQueryCustomTableFilter,
   swapElements,
@@ -83,4 +88,34 @@ describe('general', () => {
       expect(swapElements(array, 2, 4)).toEqual(['a', 'b', 'e', 'd', 'c']);
     });
   });
+
+  describe('formatInteger', () => {
+    it('works', () => {
+      expect(formatInteger(10000)).toEqual('10,000');
+    });
+  });
+
+  describe('formatBytes', () => {
+    it('works', () => {
+      expect(formatBytes(10000)).toEqual('10.00 KB');
+    });
+  });
+
+  describe('formatBytesCompact', () => {
+    it('works', () => {
+      expect(formatBytesCompact(10000)).toEqual('10.00KB');
+    });
+  });
+
+  describe('formatMegabytes', () => {
+    it('works', () => {
+      expect(formatMegabytes(30000000)).toEqual('28.6');
+    });
+  });
+
+  describe('formatPercent', () => {
+    it('works', () => {
+      expect(formatPercent(2 / 3)).toEqual('66.67%');
+    });
+  });
 });

web-console/src/utils/general.tsx

@@ -231,6 +231,10 @@ export function formatMegabytes(n: number): string {
   return numeral(n / 1048576).format('0,0.0');
 }
 
+export function formatPercent(n: number): string {
+  return (n * 100).toFixed(2) + '%';
+}
+
 function pad2(str: string | number): string {
   return ('00' + str).substr(-2);
 }

web-console/src/utils/index.tsx

@@ -24,3 +24,4 @@ export * from './query-manager';
 export * from './query-cursor';
 export * from './local-storage-keys';
 export * from './column-metadata';
+export * from './compaction';