Web console: fix compaction status when no compaction config, and small cleanup (#10483)
* move timed button to icons
* cleanup redundant logic
* fix compaction status text
* remove extra style
diff --git a/web-console/src/components/refresh-button/refresh-button.tsx b/web-console/src/components/refresh-button/refresh-button.tsx
index 681bd42..04fe160 100644
--- a/web-console/src/components/refresh-button/refresh-button.tsx
+++ b/web-console/src/components/refresh-button/refresh-button.tsx
@@ -42,7 +42,7 @@
return (
<TimedButton
defaultDelay={30000}
- label="Auto refresh every:"
+ label="Auto refresh every"
delays={DELAYS}
icon={IconNames.REFRESH}
text="Refresh"
diff --git a/web-console/src/components/timed-button/__snapshots__/timed-button.spec.tsx.snap b/web-console/src/components/timed-button/__snapshots__/timed-button.spec.tsx.snap
index 97e0b8c..7e9e420 100644
--- a/web-console/src/components/timed-button/__snapshots__/timed-button.spec.tsx.snap
+++ b/web-console/src/components/timed-button/__snapshots__/timed-button.spec.tsx.snap
@@ -1,44 +1,51 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`Timed button matches snapshot 1`] = `
-<div
- class="bp3-button-group"
+exports[`TimedButton matches snapshot 1`] = `
+<Blueprint3.ButtonGroup
+ className="timed-button"
>
- <button
- class="bp3-button"
- type="button"
+ <Blueprint3.Button
+ onClick={[Function]}
/>
- <span
- class="bp3-popover-wrapper"
+ <Blueprint3.Popover
+ boundary="scrollParent"
+ captureDismiss={false}
+ content={
+ <Blueprint3.Menu>
+ <Blueprint3.MenuDivider
+ title="Select delay"
+ />
+ <Blueprint3.MenuItem
+ disabled={false}
+ icon="selection"
+ multiline={false}
+ onClick={[Function]}
+ popoverProps={Object {}}
+ shouldDismissPopover={true}
+ text="timeValue"
+ />
+ </Blueprint3.Menu>
+ }
+ defaultIsOpen={false}
+ disabled={false}
+ fill={false}
+ hasBackdrop={false}
+ hoverCloseDelay={300}
+ hoverOpenDelay={150}
+ inheritDarkTheme={true}
+ interactionKind="click"
+ minimal={false}
+ modifiers={Object {}}
+ openOnTargetFocus={true}
+ position="auto"
+ targetTagName="span"
+ transitionDuration={300}
+ usePortal={true}
+ wrapperTagName="span"
>
- <span
- class="bp3-popover-target"
- >
- <button
- class="bp3-button"
- type="button"
- >
- <span
- class="bp3-icon bp3-icon-caret-down"
- icon="caret-down"
- >
- <svg
- data-icon="caret-down"
- height="16"
- viewBox="0 0 16 16"
- width="16"
- >
- <desc>
- caret-down
- </desc>
- <path
- d="M12 6.5c0-.28-.22-.5-.5-.5h-7a.495.495 0 00-.37.83l3.5 4c.09.1.22.17.37.17s.28-.07.37-.17l3.5-4c.08-.09.13-.2.13-.33z"
- fill-rule="evenodd"
- />
- </svg>
- </span>
- </button>
- </span>
- </span>
-</div>
+ <Blueprint3.Button
+ rightIcon="caret-down"
+ />
+ </Blueprint3.Popover>
+</Blueprint3.ButtonGroup>
`;
diff --git a/web-console/src/components/timed-button/timed-button.scss b/web-console/src/components/timed-button/timed-button.scss
deleted file mode 100644
index f4d7700..0000000
--- a/web-console/src/components/timed-button/timed-button.scss
+++ /dev/null
@@ -1,21 +0,0 @@
-/*
- * 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.
- */
-
-.timed-button {
- padding: 10px 10px 5px 10px;
-}
diff --git a/web-console/src/components/timed-button/timed-button.spec.tsx b/web-console/src/components/timed-button/timed-button.spec.tsx
index e5025fb..61c0ca5 100644
--- a/web-console/src/components/timed-button/timed-button.spec.tsx
+++ b/web-console/src/components/timed-button/timed-button.spec.tsx
@@ -16,22 +16,22 @@
* limitations under the License.
*/
-import { render } from '@testing-library/react';
+import { shallow } from 'enzyme';
import React from 'react';
import { TimedButton } from './timed-button';
-describe('Timed button', () => {
+describe('TimedButton', () => {
it('matches snapshot', () => {
- const timedButton = (
+ const timedButton = shallow(
<TimedButton
delays={[{ label: 'timeValue', delay: 1000 }]}
onRefresh={() => null}
- label={'label'}
+ label={'Select delay'}
defaultDelay={1000}
- />
+ />,
);
- const { container } = render(timedButton);
- expect(container.firstChild).toMatchSnapshot();
+
+ expect(timedButton).toMatchSnapshot();
});
});
diff --git a/web-console/src/components/timed-button/timed-button.tsx b/web-console/src/components/timed-button/timed-button.tsx
index 78a0765..fe7a990 100644
--- a/web-console/src/components/timed-button/timed-button.tsx
+++ b/web-console/src/components/timed-button/timed-button.tsx
@@ -16,15 +16,21 @@
* limitations under the License.
*/
-import { Button, ButtonGroup, IButtonProps, Popover, Radio, RadioGroup } from '@blueprintjs/core';
+import {
+ Button,
+ ButtonGroup,
+ IButtonProps,
+ Menu,
+ MenuDivider,
+ MenuItem,
+ Popover,
+} from '@blueprintjs/core';
import { IconNames } from '@blueprintjs/icons';
import React, { useState } from 'react';
import { useInterval } from '../../hooks';
import { localStorageGet, LocalStorageKeys, localStorageSet } from '../../utils';
-import './timed-button.scss';
-
export interface DelayLabel {
label: string;
delay: number;
@@ -51,7 +57,7 @@
...other
} = props;
- const [delay, setDelay] = useState(
+ const [selectedDelay, setSelectedDelay] = useState(
localStorageKey && localStorageGet(localStorageKey)
? Number(localStorageGet(localStorageKey))
: defaultDelay,
@@ -59,31 +65,31 @@
useInterval(() => {
onRefresh(true);
- }, delay);
+ }, selectedDelay);
- function handleSelection(e: any) {
- const selectedDelay = Number(e.currentTarget.value);
- setDelay(selectedDelay);
+ function handleSelection(delay: number) {
+ setSelectedDelay(delay);
if (localStorageKey) {
- localStorageSet(localStorageKey, String(selectedDelay));
+ localStorageSet(localStorageKey, String(delay));
}
}
return (
- <ButtonGroup>
+ <ButtonGroup className="timed-button">
<Button {...other} text={text} icon={icon} onClick={() => onRefresh(false)} />
<Popover
content={
- <RadioGroup
- label={label}
- className="timed-button"
- onChange={handleSelection}
- selectedValue={delay}
- >
- {delays.map(({ label, delay }) => (
- <Radio label={label} value={delay} key={label} />
+ <Menu>
+ <MenuDivider title={label} />
+ {delays.map(({ label, delay }, i) => (
+ <MenuItem
+ key={i}
+ icon={selectedDelay === delay ? IconNames.SELECTION : IconNames.CIRCLE}
+ text={label}
+ onClick={() => handleSelection(delay)}
+ />
))}
- </RadioGroup>
+ </Menu>
}
>
<Button {...other} rightIcon={IconNames.CARET_DOWN} />
diff --git a/web-console/src/dialogs/lookup-edit-dialog/lookup-edit-dialog.tsx b/web-console/src/dialogs/lookup-edit-dialog/lookup-edit-dialog.tsx
index 24eb832..6c7061e 100644
--- a/web-console/src/dialogs/lookup-edit-dialog/lookup-edit-dialog.tsx
+++ b/web-console/src/dialogs/lookup-edit-dialog/lookup-edit-dialog.tsx
@@ -100,14 +100,9 @@
!lookupVersion ||
!lookupTier ||
!lookupSpec ||
- !lookupName ||
- lookupName === '' ||
- lookupVersion === '' ||
- lookupTier === '' ||
- lookupSpec.type === '' ||
- lookupSpec.type === undefined ||
- (lookupSpec.type === 'map' && lookupSpec.map === undefined) ||
- (lookupSpec.type === 'cachedNamespace' && lookupSpec.extractionNamespace === undefined);
+ !lookupSpec.type ||
+ (lookupSpec.type === 'map' && !lookupSpec.map) ||
+ (lookupSpec.type === 'cachedNamespace' && !lookupSpec.extractionNamespace);
if (
!disableSubmit &&
diff --git a/web-console/src/utils/compaction.spec.ts b/web-console/src/utils/compaction.spec.ts
index 452cfbe..dfb1420 100644
--- a/web-console/src/utils/compaction.spec.ts
+++ b/web-console/src/utils/compaction.spec.ts
@@ -64,7 +64,7 @@
expect(formatCompactionConfigAndStatus(BASIC_CONFIG, undefined)).toEqual('Awaiting first run');
- expect(formatCompactionConfigAndStatus(undefined, ZERO_STATUS)).toEqual('Running');
+ expect(formatCompactionConfigAndStatus(undefined, ZERO_STATUS)).toEqual('Not enabled');
expect(formatCompactionConfigAndStatus(BASIC_CONFIG, ZERO_STATUS)).toEqual('Running');
diff --git a/web-console/src/utils/compaction.ts b/web-console/src/utils/compaction.ts
index 34634a1..287b8ec 100644
--- a/web-console/src/utils/compaction.ts
+++ b/web-console/src/utils/compaction.ts
@@ -54,14 +54,19 @@
compactionConfig: CompactionConfig | undefined,
compactionStatus: CompactionStatus | undefined,
) {
- if (compactionStatus) {
- if (compactionStatus.bytesAwaitingCompaction === 0 && !zeroCompactionStatus(compactionStatus)) {
- return 'Fully compacted';
+ if (compactionConfig) {
+ if (compactionStatus) {
+ if (
+ compactionStatus.bytesAwaitingCompaction === 0 &&
+ !zeroCompactionStatus(compactionStatus)
+ ) {
+ return 'Fully compacted';
+ } else {
+ return capitalizeFirst(compactionStatus.scheduleStatus);
+ }
} else {
- return capitalizeFirst(compactionStatus.scheduleStatus);
+ return 'Awaiting first run';
}
- } else if (compactionConfig) {
- return 'Awaiting first run';
} else {
return 'Not enabled';
}
